From cd16583ae449366f376e32c5825ec3cafea4c1b3 Mon Sep 17 00:00:00 2001 From: Brian Cully Date: Mon, 10 Mar 2025 13:13:30 -0400 Subject: add hover class to note list --- key-picker.mjs | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/key-picker.mjs b/key-picker.mjs index c4fe7ce..fe344ae 100644 --- a/key-picker.mjs +++ b/key-picker.mjs @@ -12,17 +12,21 @@ function scaleFrom(tonic, scale) { } function handleNoteEnter(e) { - const n = Note.fromString(e.target.innerText).toString(); + const elt = e.target; + const n = Note.fromString(elt.innerText).toString(); // todo: this should be delegated. the key selector shouldn't know // about the fretboard at all. + elt.classList.add('hover'); document.querySelectorAll(`#fretboard [x-data-note="${n}"]`).forEach(elt => { elt.classList.add('hover'); }) } function handleNoteLeave(e) { - const n = Note.fromString(e.target.innerText).toString(); + const elt = e.target; + const n = Note.fromString(elt.innerText).toString(); // ibid. + elt.classList.remove('hover'); document.querySelectorAll(`#fretboard [x-data-note="${n}"]`).forEach(elt => { elt.classList.remove('hover'); }) -- cgit v1.2.3