Make the key index number viewable (#628)

xenharmonic-devs · Mar 29, 2024 · f7cd28b · f7cd28b
1 parent 7cb1e15
commit f7cd28b
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 0 deletions.
diff --git a/src/components/VirtualKeyboard.vue b/src/components/VirtualKeyboard.vue
@@ -57,6 +57,7 @@ const isMousePressed = ref(false)
           'hidden-sm': key.x > 8,
           held: (heldNotes.get(key.index) || 0) > 0
         }"
+        :index="key.index"
         :color="key.color"
         :isMousePressed="isMousePressed"
         :noteOn="() => noteOn(key.index)"

diff --git a/src/components/VirtualKeyboardKey.vue b/src/components/VirtualKeyboardKey.vue
@@ -6,6 +6,7 @@ type NoteOff = () => void
 type NoteOnCallback = () => NoteOff
 
 const props = defineProps<{
+  index: number
   color: string
   isMousePressed: boolean
   noteOn: NoteOnCallback
@@ -97,6 +98,7 @@ onUnmounted(() => {
 
 <template>
   <td
+    :data-key-number="index"
     :style="'background-color:' + color"
     :class="{ active }"
     @touchstart="onTouchStart"