From 8eab55fd16b602f888567584e19757af9779ae9a Mon Sep 17 00:00:00 2001
From: Kirk McDonald <kirklin.mcdonald@gmail.com>
Date: Wed, 9 Oct 2024 23:14:37 -0700
Subject: [PATCH] Add value format setting.

---
 align.js    |  1 +
 calc.html   | 11 ++++++++++-
 events.js   |  5 +++++
 fragment.js |  5 ++++-
 settings.js | 19 ++++++++++++++++++-
 5 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/align.js b/align.js
index e9299370..4925d982 100644
--- a/align.js
+++ b/align.js
@@ -16,6 +16,7 @@ import { Rational, one } from "./rational.js"
 export const DEFAULT_RATE = "m"
 export const DEFAULT_RATE_PRECISION = 3
 export const DEFAULT_COUNT_PRECISION = 1
+export const DEFAULT_FORMAT = "decimal"
 
 let seconds = one
 let minutes = Rational.from_float(60)
diff --git a/calc.html b/calc.html
index 196c2eec..62eaa778 100644
--- a/calc.html
+++ b/calc.html
@@ -24,12 +24,13 @@
         var handlers = {}
     </script>
     <script type="module">
-        import { plusHandler, clickTab, changeRatePrecision, changeCountPrecision, changeVisType, changeVisRender } from "./events.js"
+        import { plusHandler, clickTab, changeRatePrecision, changeCountPrecision, changeFormat, changeVisType, changeVisRender } from "./events.js"
         import { init } from "./init.js"
         handlers.plusHandler = plusHandler
         handlers.clickTab = clickTab
         handlers.changeRatePrecision = changeRatePrecision
         handlers.changeCountPrecision = changeCountPrecision
+        handlers.changeFormat = changeFormat
         handlers.changeVisType = changeVisType
         handlers.changeVisRender = changeVisRender
         handlers.init = init
@@ -142,6 +143,14 @@
             <td><input id="cprec" class="prec" type="number" value="1" min="0" onchange="handlers.changeCountPrecision(event)"></td>
             </tr>
 
+            <tr class="setting-row">
+            <td class="setting-label top">Format values as:</td>
+            <td><form id="value_format">
+                <input id="decimal_format" type="radio" name="format" value="decimal" checked onchange="handlers.changeFormat(event)"><label for="decimal_format">Decimals</label><br />
+                <input id="rational_format" type="radio" name="format" value="rational" onchange="handlers.changeFormat(event)"><label for="rational_format">Rationals</label><br />
+            </form></td>
+            </tr>
+
         <tr class="setting-section">
         <td colspan="2"><span>Factory</span><hr></td>
         </tr>
diff --git a/events.js b/events.js
index bcfee224..7af7e7ee 100644
--- a/events.js
+++ b/events.js
@@ -59,6 +59,11 @@ export function changeCountPrecision(event) {
     spec.display()
 }
 
+export function changeFormat(event) {
+    spec.format.displayFormat = event.target.value
+    spec.display()
+}
+
 // visualizer events
 
 export const DEFAULT_VISUALIZER = "sankey"
diff --git a/fragment.js b/fragment.js
index a988fef4..df7bb171 100644
--- a/fragment.js
+++ b/fragment.js
@@ -11,7 +11,7 @@ distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.*/
-import { DEFAULT_RATE, DEFAULT_RATE_PRECISION, DEFAULT_COUNT_PRECISION } from "./align.js"
+import { DEFAULT_RATE, DEFAULT_RATE_PRECISION, DEFAULT_COUNT_PRECISION, DEFAULT_FORMAT } from "./align.js"
 import { DEFAULT_TAB, currentTab, DEFAULT_VISUALIZER, visualizerType, DEFAULT_RENDER, visualizerRender } from "./events.js"
 import { spec, DEFAULT_PURITY, DEFAULT_BELT, DEFAULT_PIPE } from "./factory.js"
 import { Rational } from "./rational.js"
@@ -34,6 +34,9 @@ export function formatSettings(overrideTab, targets) {
     if (spec.format.countPrecision !== DEFAULT_COUNT_PRECISION) {
         settings += "cp=" + spec.format.countPrecision + "&"
     }
+    if (spec.format.displayFormat !== DEFAULT_FORMAT) {
+        settings += "vf=" + spec.format.displayFormat[0] + "&"
+    }
     if (spec.belt.key !== DEFAULT_BELT) {
         settings += "belt=" + spec.belt.key + "&"
     }
diff --git a/settings.js b/settings.js
index 09ca51e8..22635bfd 100644
--- a/settings.js
+++ b/settings.js
@@ -11,7 +11,7 @@ distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.*/
-import { DEFAULT_RATE, DEFAULT_RATE_PRECISION, DEFAULT_COUNT_PRECISION, longRateNames } from "./align.js"
+import { DEFAULT_RATE, DEFAULT_RATE_PRECISION, DEFAULT_COUNT_PRECISION, DEFAULT_FORMAT, longRateNames } from "./align.js"
 import { dropdown } from "./dropdown.js"
 import { DEFAULT_TAB, clickTab, DEFAULT_VISUALIZER, visualizerType, setVisualizerType, DEFAULT_RENDER, visualizerRender, setVisualizerRender } from "./events.js"
 import { spec, resourcePurities, DEFAULT_BELT, DEFAULT_PIPE } from "./factory.js"
@@ -169,6 +169,22 @@ function renderPrecisions(settings) {
     d3.select("#cprec").attr("value", spec.format.countPrecision)
 }
 
+// value format
+
+let displayFormats = new Map([
+    ["d", "decimal"],
+    ["r", "rational"],
+])
+
+function renderValueFormat(settings) {
+    spec.format.displayFormat = DEFAULT_FORMAT
+    if (settings.has("vf")) {
+        spec.format.displayFormat = displayFormats.get(settings.get("vf"))
+    }
+    let input = document.getElementById(spec.format.displayFormat + "_format")
+    input.checked = true
+}
+
 // belt
 
 function beltHandler(event, belt) {
@@ -419,6 +435,7 @@ export function renderSettings(settings) {
     renderSomersloop(settings)
     renderRateOptions(settings)
     renderPrecisions(settings)
+    renderValueFormat(settings)
     renderBelts(settings)
     renderVisualizer(settings)
     renderResources(settings)