fix preset selectsv2

1 files changed, 17 insertions, 12 deletions

diff --git a/layout.js b/layout.js
index e4eab79..297d7bc 100644
--- a/layout.js
+++ b/layout.js
@@ -3,7 +3,7 @@ const panel = document.querySelector('aside.layout');
 const svg = document.getElementById('diagram');
 const arrows = Array.from(svg.querySelectorAll('.arrow'));
 
-const preset = panel.querySelector('.control--preset');
+const preset = panel.querySelector('.control--preset select');
 const controls = Array.from(panel.querySelectorAll('.control--axis'));
 const steps = Array.from(panel.querySelectorAll('.control--axis > input'));
 const dirs = Array.from(panel.querySelectorAll('.control--axis .dir input'));
@@ -28,6 +28,13 @@ const completeState = ([a, b, c]) => {
   return [a, b, c, -a, -b, -c];
 };
 
+const PRESETS = {
+  'wicki-hayden': [ 7, 2, null ],
+  'janko': [ 1, 2, null ],
+  'harmonic': [ 7, 4, null ],
+  'gerhard': [ 4, 3, null ],
+};
+
 const updateValues = () => {
   const full = completeState(state);
 
@@ -40,6 +47,10 @@ const updateValues = () => {
       dirs[i].disabled = val == 0;
     }
   });
+
+  const presetName = Object.keys(PRESETS).find(k => completeState(PRESETS[k]).join(',') === full.join(','));
+  preset.value = presetName ?? 'custom';
+
   updateFocus();
 };
 
@@ -95,7 +106,6 @@ steps.forEach((input, i) => {
     select(i);
     state[i] = +input.value;
     if (dirs[i].checked) state[i] = -state[i];
-    preset.value = 'custom';
     updateValues();
   };
 });
@@ -104,22 +114,17 @@ dirs.forEach((input, i) => {
   input.onchange = () => {
     select(i);
     state[i] = state[i] * -1;
-    preset.value = 'custom';
     updateValues();
   };
 });
 
 preset.onchange = () => {
-  switch (preset.value) {
-    case 'custom': return;
-    case 'wicki-hayden': state = [ 7, 2, null ]; break;
-    case 'janko': state = [ 1, 2, null ]; break;
-    case 'harmonic': state = [ 7, 4, null ]; break;
-    case 'gerhard': state = [ 4, 3, null ]; break;
+  const nextState = PRESETS[preset.value];
+  if (nextState) {
+    state = nextState.slice();
+    last = state.findIndex(s => s != null);
+    updateValues();
   }
-
-  last = state.findIndex(s => s != null);
-  updateValues();
 };
 preset.value = 'wicki-hayden';
 preset.onchange();