From 2d186e5b4ae087c3013154a6f7e14ffc714a5ef9 Mon Sep 17 00:00:00 2001
From: DeionSi <DeionSi@users.noreply.github.com>
Date: Mon, 25 Mar 2024 03:30:03 +0100
Subject: [PATCH] Enable and disable RPM reading when showing or hiding the
 live panel via events. Also fix an error when trying to switch to a panel
 whic hasn't had the href attribute added yet. (#40)

---
 UI/assets/js/main.js |  2 ++
 UI/index.html        |  6 +++---
 UI/renderer.js       | 22 +++++++++++++++++++++-
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/UI/assets/js/main.js b/UI/assets/js/main.js
index 9cb0991..24b726f 100644
--- a/UI/assets/js/main.js
+++ b/UI/assets/js/main.js
@@ -36,6 +36,8 @@
 				var href = $(this).attr('href');
 
 				// Not a panel link? Bail.
+					if (typeof href === 'undefined')
+						return;
 					if (href.charAt(0) != '#'
 					||	$panels.filter(href).length == 0)
 						return;
diff --git a/UI/index.html b/UI/index.html
index 1ec11dc..e8e48cb 100644
--- a/UI/index.html
+++ b/UI/index.html
@@ -20,9 +20,9 @@
 
 				<!-- Nav -->
 					<nav id="nav">
-						<a href="#connect" class="icon fa-plug" onClick="disableRPM()"><span>Connect</span></a>
-						<a id="link_live" class="icon fa-tachometer" onClick="enableRPM()"><span>Dashboard</span></a>
-						<a id="link_config" class="icon fa-sliders-h" onClick="disableRPM()"><span>Config</span></a>
+						<a href="#connect" class="icon fa-plug"><span>Connect</span></a>
+						<a id="link_live" class="icon fa-tachometer"><span>Dashboard</span></a>
+						<a id="link_config" class="icon fa-sliders-h"><span>Config</span></a>
 					</nav>
 
 				<!-- Main -->
diff --git a/UI/renderer.js b/UI/renderer.js
index cd0ecc4..8ee6623 100644
--- a/UI/renderer.js
+++ b/UI/renderer.js
@@ -313,7 +313,6 @@ function refreshPattern(data)
       modalLoading.remove();
       //Move to the Live tab
       window.location.hash = '#live';
-      enableRPM();
       initComplete = true;
     }
 
@@ -463,6 +462,7 @@ function animateGauges() {
 var RPMInterval = 0;
 function enableRPM()
 {
+  console.log("Enabling RPM reads");
   if(RPMInterval == 0)
   {
     RPMInterval = setInterval(updateRPM, 100);
@@ -529,6 +529,19 @@ async function checkForUpdates()
 
 }
 
+function liveShowHide(mutationsList, observer) {
+  mutationsList.forEach(mutation => {
+    if (mutation.attributeName === 'style') {
+      if (mutation.target.style.display === 'none') {
+        disableRPM();
+      }
+      else {
+        enableRPM();
+      }
+    }
+  })
+}
+
 window.onload = function () 
 {
     refreshSerialPorts();
@@ -537,6 +550,13 @@ window.onload = function ()
     checkForUpdates();
     //animateGauges();
 
+    //Enable and disabled retrieval of RPM when viewing live panel
+    const liveShowHideObserver = new MutationObserver(liveShowHide);
+    liveShowHideObserver.observe(
+      document.getElementById('live'),
+      { attributes: true }
+    );
+
     usb.on('attach', refreshSerialPorts);
     usb.on('detach', refreshSerialPorts);
 };