mindboost-rnbo-test-project/archive/demo/index.vue

69 lines
1.7 KiB
Vue

<!-- eslint-disable vue/multi-word-component-names -->
<template>
<div>
Do not load multiple test without unloading others.
<div>
NoisePatchMusic
<NoisePatchMusic v-if="tests['noisepatch'].active" />
<button
@click="toggleState('noisepatch')"
>
Load
</button>
<button
v-if="!tests['noisepatch'].active"
@click="toggleState('noisepatch')"
>
Unload
</button>
</div>
<div>
AudioElementManager (all patches connected)
<audioElementManager v-if="tests['complete'].active" />
<button
@click="toggleState('complete')"
>
Load
</button>
<button
v-if="!tests['complete'].active"
@click="toggleState('complete')"
>
Unload
</button>
</div>
<div>
RNBOplayer
<RNBOPlayer v-if="tests['loadrnbo'].active" />
<button
@click="toggleState('loadrnbo')"
>
Load
</button>
<button
v-if="!tests['loadrnbo'].active"
@click="toggleState('loadrnbo')"
>
Unload
</button>
</div>
</div>
</template>
<script setup>
// import Player from '~/components/Player.vue'
import NoisePatchMusic from '~/archive/components/tests/NoisePatchMusic_glitchOnLoad.vue'
import audioElementManager from '~/archive/pages/experiments/audioElementManager.vue'
import RNBOPlayer from '~/archive/components/tests/RNBOPlayer.vue'
const tests = ref({
noisepatch: { active: false },
loadrnbo: { active: false },
complete: { active: false }
})
const toggleState = (stateName) => {
const test = tests.value
test[stateName].active = !test[stateName].active
}
</script>