Generate index automatically

1 files changed, 25 insertions, 26 deletions

diff --git a/public/main.js b/public/main.js
index 97f11f4..3b9e6fc 100644
--- a/public/main.js
+++ b/public/main.js
@@ -12,6 +12,8 @@ function appendText(parentElement, text) {
   return element
 }
 
+// Select tonality
+
 tonalities_b = ['C', 'D♭', 'D', 'E♭', 'E', 'F', 'G♭', 'G', 'A♭', 'A', 'B♭', 'B']
 tonalities_s = ['C', 'C♯', 'D', 'D♯', 'E', 'F', 'F♯', 'G', 'G♯', 'A', 'A♯', 'B']
 
@@ -35,33 +37,30 @@ function applyShift(tonalities, t1, s) {
   return `${root}${mode}`
 }
 
+const node = document.getElementById('g-Tonality')
+if (node !== null) {
+  let tonality = node.innerText
+  mode = tonality[tonality.length - 1] == 'm' ? 'm' : ''
 
-const node = document.querySelector('[data-tonality]')
-let tonality = node.dataset.tonality
-mode = tonality[tonality.length - 1] == 'm' ? 'm' : ''
-
-label = appendElement(node, 'label')
-label['className'] = 'g-Chords__Tonality'
-label.onchange = (e) => {
-  const shift = getShift(tonality, e.target.value)
-  tonality = e.target.value
-  tonalities = tonality === 'F' || tonality.indexOf('♭') > -1 ? tonalities_b : tonalities_s
-  document.querySelectorAll('.g-Chords__Chord').forEach(chord => {
-    if (chord.innerText !== '%') {
-      chord.innerText = applyShift(tonalities, chord.innerText, shift)
+  select = document.createElement('select')
+  select['name'] = 'tonality'
+  tonalities_b.forEach(t => {
+    option = appendElement(select, 'option')
+    option['value'] = t
+    if (tonality == `${t}${mode}`) {
+      option['selected'] = true
     }
+    appendText(option, `${t}${mode}`)
   })
-}
-
-appendText(label, 'Tonalité :')
-
-select = appendElement(label, 'select')
-select['name'] = 'tonality'
-tonalities_b.forEach(t => {
-  option = appendElement(select, 'option')
-  option['value'] = t
-  if (tonality == `${t}${mode}`) {
-    option['selected'] = true
+  select.onchange = (e) => {
+    const shift = getShift(tonality, e.target.value)
+    tonality = e.target.value
+    tonalities = tonality === 'F' || tonality.indexOf('♭') > -1 ? tonalities_b : tonalities_s
+    document.querySelectorAll('.g-Chords__Chord').forEach(chord => {
+      if (chord.innerText !== '%') {
+        chord.innerText = applyShift(tonalities, chord.innerText, shift)
+      }
+    })
   }
-  appendText(option, `${t}${mode}`)
-})
+  node.parentNode.replaceChild(select, node)
+}