From 2c72b58fc2e9a1ca50065f94bf913aef3bd9c8b7 Mon Sep 17 00:00:00 2001
From: Brikwerk <reece@brikwerk.com>
Date: Wed, 22 Sep 2021 23:35:48 -0700
Subject: [PATCH] Added configurable input sampling frequency

---
 nxbt/web/static/js/main.js    | 51 ++++++++++++++++++++++++-----------
 nxbt/web/templates/index.html | 15 ++++++++++-
 2 files changed, 49 insertions(+), 17 deletions(-)

diff --git a/nxbt/web/static/js/main.js b/nxbt/web/static/js/main.js
index b944492..c38af91 100644
--- a/nxbt/web/static/js/main.js
+++ b/nxbt/web/static/js/main.js
@@ -463,6 +463,22 @@ function changeInput(evt) {
     }
 }
 
+function changeFrequency(evt) {
+    let newFrequency = evt.target.value;
+    
+    if (newFrequency === "RAF") {
+        useRAF = true;
+    } else {
+        newFrequency = Number(newFrequency);
+        if (!isNaN(newFrequency)) {
+            useRAF = false;
+            frequency = (1/newFrequency) * 1000;
+        } else {
+            console.log("New frequency is not a number");
+        }
+    }
+}
+
 const LOADER_ANIMATION_FRAMES = [0,1,2,3,3,2,1,0];
 let loaderFrame = 1;
 let highlightedBlock = false;
@@ -547,7 +563,8 @@ function updateGamepadDisplay() {
 }
 
 let timeOld = false;
-let frequency = (1/120) * 1000;
+let frequency = (1/240) * 1000;
+let useRAF = false;
 function eventLoop() {
     // Update x/y ratio for the sticks based on
     // pressed buttons if we're using a keyboard
@@ -601,21 +618,23 @@ function eventLoop() {
 
     updateGamepadDisplay()
 
-    // if (!timeOld) {
-    //     timeOld = performance.now();
-    // }
-    // timeNew = performance.now();
-    // delta = timeNew - timeOld;
-    // diff = delta - frequency;
-
-    // if (diff > 0) {
-    //     setTimeout(eventLoop, frequency - diff);
-    // } else {
-    //     setTimeout(eventLoop, frequency);
-    // }
-    // timeOld = timeNew;
-
-    requestAnimationFrame(eventLoop);
+    if (useRAF) {
+        requestAnimationFrame(eventLoop);
+    } else {
+        if (!timeOld) {
+            timeOld = performance.now();
+        }
+        timeNew = performance.now();
+        delta = timeNew - timeOld;
+        diff = delta - frequency;
+    
+        if (diff > 0) {
+            setTimeout(eventLoop, frequency - diff);
+        } else {
+            setTimeout(eventLoop, frequency);
+        }
+        timeOld = timeNew;
+    }
 }
 
 function sendMacro() {
diff --git a/nxbt/web/templates/index.html b/nxbt/web/templates/index.html
index 947929d..295156f 100644
--- a/nxbt/web/templates/index.html
+++ b/nxbt/web/templates/index.html
@@ -70,7 +70,7 @@
                 </div>
             </section>
 
-            <section id="controller-config" class="hidden surface">
+            <section id="controller-config" class="surface hidden">
                 <div id="controller-underlay-container">
                     <div class="controller-display hidden">
                         <div class="control-indicator" id="jl_"></div>
@@ -120,6 +120,19 @@
                         a button on the gamepad before it shows up on the
                         input device list.
                     </p>
+                    <h2 class="surface-lighter">Input Sampling Frequency</h2>
+                    <select id="input-frequency" name="Select an Input Sampling Frequency" onchange="changeFrequency(event)">
+                        <option value="240">240Hz</option>
+                        <option value="120">120Hz</option>
+                        <option value="60">60Hz</option>
+                        <option value="RAF">Monitor Refresh Rate</option>
+                    </select>
+                    <p>
+                        Note: "Monitor Refresh Rate" is a more stable but 
+                        (potentially) slower frequency. This loop uses the
+                        "requestAnimationFrame()" function, rather than 
+                        "setTimeout()".
+                    </p>
                     <h2 class="surface-lighter">Control Mapping</h2>
                     <div id="keyboard-map" class="surface-lighter">
                         <table>