From ae98e6bc56a7a95afa6e7ba5f4026c0c426acb1c Mon Sep 17 00:00:00 2001
From: Jakob Ketterl <jakob.ketterl@gmx.de>
Date: Sat, 18 Jan 2020 21:33:10 +0100
Subject: [PATCH] refactor frequency display

---
 htdocs/index.html              |  1 +
 htdocs/lib/FrequencyDisplay.js |  7 +++++++
 htdocs/openwebrx.js            | 17 +++++++++++------
 3 files changed, 19 insertions(+), 6 deletions(-)
 create mode 100644 htdocs/lib/FrequencyDisplay.js

diff --git a/htdocs/index.html b/htdocs/index.html
index f18f659..d9296c9 100644
--- a/htdocs/index.html
+++ b/htdocs/index.html
@@ -31,6 +31,7 @@
         <script src="static/lib/AudioEngine.js"></script>
         <script src="static/lib/ProgressBar.js"></script>
         <script src="static/lib/Measurement.js"></script>
+        <script src="static/lib/FrequencyDisplay.js"></script>
         <link rel="stylesheet" type="text/css" href="static/lib/nanoscroller.css" />
         <link rel="stylesheet" type="text/css" href="static/css/openwebrx.css" />
         <meta charset="utf-8">
diff --git a/htdocs/lib/FrequencyDisplay.js b/htdocs/lib/FrequencyDisplay.js
new file mode 100644
index 0000000..8943f81
--- /dev/null
+++ b/htdocs/lib/FrequencyDisplay.js
@@ -0,0 +1,7 @@
+function FrequencyDisplay(element) {
+    this.element = $(element);
+}
+
+FrequencyDisplay.prototype.setFrequency = function(freq) {
+    this.element.html((freq / 1e6).toLocaleString(undefined, {maximumFractionDigits: 4, minimumFractionDigits: 3}) + " MHz");
+}
\ No newline at end of file
diff --git a/htdocs/openwebrx.js b/htdocs/openwebrx.js
index e81c4c1..f437a04 100644
--- a/htdocs/openwebrx.js
+++ b/htdocs/openwebrx.js
@@ -512,7 +512,7 @@ function Demodulator_default_analog(offset_frequency, subtype) {
         mkenvelopes(this.visible_range);
         this.parent.set();
         //will have to change this when changing to multi-demodulator mode:
-        e("webrx-actual-freq").innerHTML = format_frequency("{x} MHz", center_freq + this.parent.offset_frequency, 1e6, 4);
+        tunedFrequencyDisplay.setFrequency(center_freq + this.parent.offset_frequency);
         return true;
     };
 
@@ -570,7 +570,7 @@ function demodulator_set_offset_frequency(which, to_what) {
     demodulators[0].offset_frequency = Math.round(to_what);
     demodulators[0].set();
     mkenvelopes(get_visible_freq_range());
-    $("#webrx-actual-freq").html(format_frequency("{x} MHz", center_freq + to_what, 1e6, 4));
+    tunedFrequencyDisplay.setFrequency(center_freq + to_what);
 }
 
 function waterfallWidth() {
@@ -584,9 +584,13 @@ function waterfallWidth() {
 
 var scale_ctx;
 var scale_canvas;
+var tunedFrequencyDisplay;
+var mouseFrequencyDisplay;
 
 function scale_setup() {
-    e("webrx-actual-freq").innerHTML = format_frequency("{x} MHz", canvas_get_frequency(window.innerWidth / 2), 1e6, 4);
+    tunedFrequencyDisplay = new FrequencyDisplay($('#webrx-actual-freq'));
+    tunedFrequencyDisplay.setFrequency(canvas_get_frequency(window.innerWidth / 2));
+    mouseFrequencyDisplay = new FrequencyDisplay($('#webrx-mouse-freq'));
     scale_canvas = e("openwebrx-scale-canvas");
     scale_ctx = scale_canvas.getContext("2d");
     scale_canvas.addEventListener("mousedown", scale_canvas_mousedown, false);
@@ -640,7 +644,7 @@ function scale_canvas_mousemove(evt) {
 
 function frequency_container_mousemove(evt) {
     var frequency = center_freq + scale_offset_freq_from_px(evt.pageX);
-    e("webrx-mouse-freq").innerHTML = format_frequency("{x} MHz", frequency, 1e6, 4);
+    mouseFrequencyDisplay.setFrequency(frequency);
 }
 
 function scale_canvas_end_drag(x) {
@@ -916,8 +920,9 @@ function canvas_mousemove(evt) {
             mkscale();
             bookmarks.position();
         }
+    } else {
+        mouseFrequencyDisplay.setFrequency(canvas_get_frequency(relativeX));
     }
-    else e("webrx-mouse-freq").innerHTML = format_frequency("{x} MHz", canvas_get_frequency(relativeX), 1e6, 4);
 }
 
 function canvas_container_mouseleave() {
@@ -1534,7 +1539,7 @@ function initialize_demodulator() {
     demodulator_analog_replace(starting_mod);
     if (starting_offset_frequency) {
         demodulators[0].offset_frequency = starting_offset_frequency;
-        e("webrx-actual-freq").innerHTML = format_frequency("{x} MHz", center_freq + starting_offset_frequency, 1e6, 4);
+        tunedFrequencyDisplay.setFrequency(center_freq + starting_offset_frequency);
         demodulators[0].set();
         mkscale();
     }