From b5292689534c00918675223d1f36174bbf44406f Mon Sep 17 00:00:00 2001
From: Joris
Date: Wed, 3 Jan 2024 00:01:38 +0100
Subject: Provide tonality and selector to change

---
 public/main.js | 65 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 65 insertions(+)
 create mode 100644 public/main.js

(limited to 'public/main.js')

diff --git a/public/main.js b/public/main.js
new file mode 100644
index 0000000..a5ede52
--- /dev/null
+++ b/public/main.js
@@ -0,0 +1,65 @@
+// Helpers
+
+function appendElement(parentElement, tag) {
+  element = document.createElement(tag)
+  parentElement.appendChild(element)
+  return element
+}
+  
+function appendText(parentElement, text) {
+  element = document.createTextNode(text)
+  parentElement.appendChild(element)
+  return element
+}
+
+// Only suggest sharps for the moment
+tonalities = ['C', 'C♯', 'D', 'D♯', 'E', 'F', 'F♯', 'G', 'G♯', 'A', 'A♯', 'B']
+
+function getRoot(c) {
+  if (c.indexOf('♯') > -1 || c.indexOf('♭') > -1) {
+    return c.substring(0, 2)
+  } else {
+    return c[0]
+  }
+}
+
+function getShift(t1, t2) {
+  return tonalities.indexOf(getRoot(t2)) - tonalities.indexOf(getRoot(t1))
+}
+
+function applyShift(t1, s) {
+  let root = getRoot(t1)
+  let mode = t1.substring(root.length)
+  root = tonalities[(tonalities.indexOf(root) + s + tonalities.length) % tonalities.length]
+  return `${root}${mode}`
+}
+
+
+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
+  document.querySelectorAll('.g-Chords__Chord').forEach(chord => {
+    if (chord.innerText !== '%') {
+      chord.innerText = applyShift(chord.innerText, shift)
+    }
+  })
+}
+
+appendText(label, 'Tonalité :')
+
+select = appendElement(label, 'select')
+select['name'] = 'tonality'
+tonalities.forEach(t => {
+  option = appendElement(select, 'option')
+  option['value'] = t
+  if (tonality == `${t}${mode}`) {
+    option['selected'] = true
+  }
+  appendText(option, `${t}${mode}`)
+})
-- 
cgit v1.2.3