57 lines
1.8 KiB
Vue
57 lines
1.8 KiB
Vue
<template>
|
|
<h1>hell yeah</h1>
|
|
<div @click="newDummyAudio"> NEW AUDIO</div>
|
|
<div @click="showArtWork">SHOW ARTWORK</div>
|
|
<div @click="play">PLAY</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { watch, onMounted } from 'vue'
|
|
import { useAudioStore, ensureAudio } from '~/stores/audio'
|
|
|
|
const createAudioTag = () => {
|
|
const newDummyAudio = new Audio('data:audio/mp3;base64,SUQzBAAAAAAAI1RTU0UAAAAPAAADTGF2ZjU2LjM2LjEwMAAAAAAAAAAAAAAA//OEAAAAAAAAAAAAAAAAAAAAAAAASW5mbwAAAA8AAAAEAAABIADAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV6urq6urq6urq6urq6urq6urq6urq6urq6v////////////////////////////////8AAAAATGF2YzU2LjQxAAAAAAAAAAAAAAAAJAAAAAAAAAAAASDs90hvAAAAAAAAAAAAAAAAAAAA//MUZAAAAAGkAAAAAAAAA0gAAAAATEFN//MUZAMAAAGkAAAAAAAAA0gAAAAARTMu//MUZAYAAAGkAAAAAAAAA0gAAAAAOTku//MUZAkAAAGkAAAAAAAAA0gAAAAANVVV')
|
|
newDummyAudio.loop = true
|
|
newDummyAudio.controls = true
|
|
newDummyAudio.muted = true
|
|
newDummyAudio.play()
|
|
}
|
|
|
|
const play = (state) => {
|
|
const audio = newDummyAudio()
|
|
if (state) {
|
|
audio.play().catch(() => {})
|
|
}
|
|
}
|
|
|
|
const showArtWork = () => {
|
|
const pathKlein = window.location.origin + '/images/scenery/noise_artwork_1024.jpg'
|
|
const pathGross = window.location.origin + '/images/scenery/noise_artwork_512.jpg'
|
|
navigator.mediaSession.metadata = null
|
|
navigator.mediaSession.metadata = new MediaMetadata({
|
|
title: 'Calm Speech Blocker',
|
|
artist: 'mindboost',
|
|
album: 'get your focus',
|
|
artwork: [
|
|
{ src: pathKlein, sizes: '1024x1024', type: 'image/jpeg' },
|
|
{ src: pathGross, sizes: '512x512', type: 'image/jpeg' }
|
|
]
|
|
})
|
|
}
|
|
|
|
watch(
|
|
() => useAudioStore().getPlaying,
|
|
(newVal) => {
|
|
},
|
|
{ immediate: true }
|
|
)
|
|
|
|
// Media Session Setup separat
|
|
onMounted(async () => {
|
|
const playState = useAudioStore().getPlaying
|
|
await ensureAudio
|
|
createAudioTag()
|
|
showArtWork()
|
|
})
|
|
</script>
|