mindboost-rnbo-test-project/components/AudioFileSelector.vue

37 lines
844 B
Vue

<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>