aboutsummaryrefslogtreecommitdiff
path: root/public
diff options
context:
space:
mode:
Diffstat (limited to 'public')
-rw-r--r--public/index.html17
-rw-r--r--public/main.js51
2 files changed, 25 insertions, 43 deletions
diff --git a/public/index.html b/public/index.html
deleted file mode 100644
index df494a8..0000000
--- a/public/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
-<!doctype html>
-<html lang="fr">
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width">
-<title>Music</title>
-<link rel="stylesheet" href="/main.css">
-<link rel="icon" href="/icon.png">
-
-<h1 class="g-Title">Music</h1>
-
-<ul class="g-Songs">
- <li>
- <a href="songs/ben-e-king/stand-by-me.html">Ben E. King – Stand by Me</a>
- <li>
- <a href="songs/graeme-allwright/petit-garcon.html">Graeme Allwright – Petit Garçon</a>
- <li>
- <a href="songs/tri-yann/pelot-d-hennebont.html">Tri Yann – Pelot d’Hennebont</a>
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)
+}