X-Git-Url: https://git.r.bdr.sh/rbdr/lissajous/blobdiff_plain/6a87c2530865b5e18f70b71b456f43e72702c1c6..HEAD:/lib/factories/ui.js

diff --git a/lib/factories/ui.js b/lib/factories/ui.js
index c220f67..167c618 100644
--- a/lib/factories/ui.js
+++ b/lib/factories/ui.js
@@ -1,3 +1,10 @@
+/**
+  * This file is a factory for DOM UI elements.
+  */
+
+/**
+  * Returns a settings container that includes a section and a heading.
+  */
 export function settingsContainer({id, label, level=2}) {
 
   const container = document.createElement('section');
@@ -6,6 +13,11 @@ export function settingsContainer({id, label, level=2}) {
   return container;
 };
 
+/**
+  * Returns a slider that includes a label, and can optionally be set to
+  * "shift" to a different step. (eg. we use this for π mode, where frequency
+  * and amplitude are mapped to π/8 increments.
+  */
 export function slider({
   id,
   min,
@@ -46,6 +58,18 @@ export function slider({
         slider.step = step;
       }
     });
+
+    document.addEventListener('touchstart', function(event) {
+      if (event.touches.length == 3) {
+        if (slider.classList.contains('shifted')) {
+          slider.classList.remove('shifted');
+          slider.step = step;
+        } else {
+          slider.classList.add('shifted');
+          slider.step = shiftStep;
+        }
+      }
+    });
   }
 
   slider.addEventListener('input', () => set(slider.value));