Initial commit

components/AudioFileSelector.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="audio-file-selector">
+    <select v-model="selectedFile" @change="onFileSelect">
+      <option value="">Select an audio file</option>
+      <option v-for="(src, title) in audioFiles" :key="title" :value="src">
+        {{ title }}
+      </option>
+    </select>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from 'vue'
+
+export default defineComponent({
+  name: 'AudioFileSelector',
+  emits: ['file-selected'],
+  setup (_, { emit }) {
+    const config = useRuntimeConfig()
+    const audioFiles = ref(config.public.tracks)
+
+    const selectedFile = ref('')
+
+    const onFileSelect = () => {
+      const fullPath = window.location.origin + selectedFile.value
+      emit('file-selected', fullPath)
+    }
+
+    return {
+      audioFiles,
+      selectedFile,
+      onFileSelect
+    }
+  }
+})
+</script>