Add scroll up/down to change value

wave/plot.js

@@ -18,7 +18,22 @@ const chart = new Chart("chart", {
 })
 
 function update(x, y) {
-    chart.data.labels = x
+    chart.data.labels = x;
-    chart.data.datasets[0].data = y
+    chart.data.datasets[0].data = y;
-    chart.update()
+    chart.update();
+}
+
+function checkScrollDirection(event) {
+    if (checkScrollDirectionIsUp(event)) {
+        document.querySelector("#freq").value = parseFloat(document.querySelector("#freq").value) + parseFloat(0.1);
+    } else {
+        document.querySelector("#freq").value -= parseFloat(0.1);
+    }
+}
+
+function checkScrollDirectionIsUp(event) {
+    if (event.wheelDelta) {
+        return event.wheelDelta > 0;
+    }
+    return event.deltaY < 0;
 }

wave/script.py

@@ -12,11 +12,16 @@ def beat(freq1, freq2, time):
     return deflection(freq1, time) + deflection(freq2, time)
 
 
-def freq_update(event):
+def inp_update(event):
     document.querySelector("#freqlabel").innerText = freq2.value
     plot()
 
 
+def scroll_update(event):
+    js.checkScrollDirection(event)
+    inp_update(event)
+
+
 def plot():
     beat_deflection = beat(freq1, float(freq2.value), time)
     js.update(to_js(time), to_js(beat_deflection))
@@ -25,8 +30,8 @@ def plot():
 freq1 = 440
 freq2 = document.querySelector("#freq")
 
-proxy = create_proxy(freq_update)
+freq2.addEventListener("input", create_proxy(inp_update))
-freq2.addEventListener("input", proxy)
+document.body.addEventListener("wheel", create_proxy(scroll_update))
 
 sampling_frequency = 1920 / 10 * 4
 seconds = 2