feat: ensure next track is always preloaded
Part-of: <https://dev.funkwhale.audio/funkwhale/funkwhale/-/merge_requests/2346>
This commit is contained in:
parent
e87811c554
commit
026196d698
|
@ -20,10 +20,10 @@
|
|||
"@sentry/tracing": "7.27.0",
|
||||
"@sentry/vue": "7.27.0",
|
||||
"@vue/runtime-core": "3.2.45",
|
||||
"@vueuse/core": "9.6.0",
|
||||
"@vueuse/integrations": "9.6.0",
|
||||
"@vueuse/math": "9.6.0",
|
||||
"@vueuse/router": "9.6.0",
|
||||
"@vueuse/core": "9.11.1",
|
||||
"@vueuse/integrations": "9.11.1",
|
||||
"@vueuse/math": "9.11.1",
|
||||
"@vueuse/router": "9.11.1",
|
||||
"axios": "1.2.3",
|
||||
"axios-auth-refresh": "3.3.6",
|
||||
"butterchurn": "3.0.0-beta.4",
|
||||
|
|
|
@ -3,7 +3,7 @@ import type { Track, Upload } from '~/types'
|
|||
import type { Sound } from '~/api/player'
|
||||
|
||||
import { createGlobalState, syncRef, useTimeoutFn, whenever } from '@vueuse/core'
|
||||
import { computed, ref } from 'vue'
|
||||
import { computed, ref, watchEffect } from 'vue'
|
||||
|
||||
import { connectAudioSource } from '~/composables/audio/audio-api'
|
||||
import { usePlayer } from '~/composables/audio/player'
|
||||
|
@ -110,7 +110,8 @@ export const useTracks = createGlobalState(() => {
|
|||
}
|
||||
|
||||
// Preload next track
|
||||
const { start: startPreloadTimeout, stop: stopPreloadTimeout } = useTimeoutFn(async (index) => {
|
||||
const { start: startPreloadTimeout } = useTimeoutFn(async (index) => {
|
||||
console.log('@@@@', index)
|
||||
const { queue } = useQueue()
|
||||
const sound = await createSound(queue.value[index as number])
|
||||
await sound.preload()
|
||||
|
@ -118,8 +119,6 @@ export const useTracks = createGlobalState(() => {
|
|||
|
||||
// Create track from queue
|
||||
const createTrack = async (index: number) => {
|
||||
stopPreloadTimeout()
|
||||
|
||||
const { queue, currentIndex, playNext, hasNext } = useQueue()
|
||||
if (queue.value.length <= index || index === -1) return
|
||||
console.log('LOADING TRACK', index)
|
||||
|
@ -148,24 +147,33 @@ export const useTracks = createGlobalState(() => {
|
|||
if (isPlaying.value && index === currentIndex.value) {
|
||||
await sound.play()
|
||||
}
|
||||
|
||||
// NOTE: Preload next track
|
||||
if (index === currentIndex.value && index + 1 < queue.value.length) {
|
||||
// @ts-expect-error vueuse is wrongly typed?
|
||||
startPreloadTimeout(index + 1)
|
||||
}
|
||||
}
|
||||
|
||||
const currentTrack = ref<QueueTrack>()
|
||||
|
||||
// NOTE: We want to have it called only once, hence we're using createGlobalState
|
||||
const initialize = createGlobalState(() => {
|
||||
const { currentIndex, currentTrack: track } = useQueue()
|
||||
const { currentIndex, currentTrack: track, queue, hasNext } = useQueue()
|
||||
|
||||
whenever(track, () => {
|
||||
createTrack(currentIndex.value)
|
||||
}, { immediate: true })
|
||||
|
||||
let lastTrack: QueueTrack
|
||||
watchEffect(async () => {
|
||||
if (!hasNext.value) return
|
||||
|
||||
const nextTrack = queue.value[currentIndex.value + 1]
|
||||
if (lastTrack === nextTrack) return
|
||||
lastTrack = nextTrack
|
||||
|
||||
// NOTE: Preload next track
|
||||
// Calling this function clears previous timeout and starts a new one.
|
||||
// Since this watchEffect fires whenever currentIndex / nextTrack changes, it will automatically cleanup previous preload.
|
||||
// @ts-expect-error vueuse is wrongly typed?
|
||||
startPreloadTimeout(currentIndex.value + 1)
|
||||
})
|
||||
|
||||
syncRef(track, currentTrack, {
|
||||
direction: 'ltr'
|
||||
})
|
||||
|
|
|
@ -2181,50 +2181,50 @@
|
|||
resolved "https://registry.yarnpkg.com/@vue/tsconfig/-/tsconfig-0.1.3.tgz#4a61dbd29783d01ddab504276dcf0c2b6988654f"
|
||||
integrity sha512-kQVsh8yyWPvHpb8gIc9l/HIDiiVUy1amynLNpCy8p+FoCiZXCo6fQos5/097MmnNZc9AtseDsCrfkhqCrJ8Olg==
|
||||
|
||||
"@vueuse/core@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-9.6.0.tgz#de1d4730849cdbe28a9ebcf6cad167a700919603"
|
||||
integrity sha512-qGUcjKQXHgN+jqXEgpeZGoxdCbIDCdVPz3QiF1uyecVGbMuM63o96I1GjYx5zskKgRI0FKSNsVWM7rwrRMTf6A==
|
||||
"@vueuse/core@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-9.11.1.tgz#1552aef67144220da7e6b797372a194a9c7ff52e"
|
||||
integrity sha512-E/cizD1w9ILkq4axYjZrXLkKaBfzloaby2n3NMjUfd6yI/jkfTVgc6iwy/Cw2e++Ld4LphGbO+3MhzizvwUslQ==
|
||||
dependencies:
|
||||
"@types/web-bluetooth" "^0.0.16"
|
||||
"@vueuse/metadata" "9.6.0"
|
||||
"@vueuse/shared" "9.6.0"
|
||||
"@vueuse/metadata" "9.11.1"
|
||||
"@vueuse/shared" "9.11.1"
|
||||
vue-demi "*"
|
||||
|
||||
"@vueuse/integrations@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/integrations/-/integrations-9.6.0.tgz#e2c6a5e1770b189a643d9c5ed65592c486db6254"
|
||||
integrity sha512-+rs2OWY/3spxoAGQMnlHQpxf8ErAYf4D1bT0aXaPnxphmtYgexm6KIjTFpBbcQnHwVi1g2ET1SJoQL16yDrgWA==
|
||||
"@vueuse/integrations@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/integrations/-/integrations-9.11.1.tgz#ddcb69210d406992c74f32936443e16575a290e6"
|
||||
integrity sha512-1VBT1U0ScI0GmJn+i7RvyCX5P+Dh04yxHurN3RniYPCFOJ8mCKSqJlzSA5aQ94UIK0ZKI2RyEGS8FY0WAteixw==
|
||||
dependencies:
|
||||
"@vueuse/core" "9.6.0"
|
||||
"@vueuse/shared" "9.6.0"
|
||||
"@vueuse/core" "9.11.1"
|
||||
"@vueuse/shared" "9.11.1"
|
||||
vue-demi "*"
|
||||
|
||||
"@vueuse/math@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/math/-/math-9.6.0.tgz#7baa1e92bd7be362a749673078b918e702ca2dea"
|
||||
integrity sha512-bYTFZjTcJwgqPdY7SaxS/J5mrWy1QaESxD5HK5UhXY49DUYf4jjZxXjMVBObM/A46jQgRolqSEQDOXrrpEfEww==
|
||||
"@vueuse/math@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/math/-/math-9.11.1.tgz#b574099f9c36729803b95d76191d6196133fcc82"
|
||||
integrity sha512-EE0QCHexD91lleJuNFtcYAuJw08j9Hl/DytBFZSx+Piug86qhbHfcr6eHzawvZb+Yc2pHLPkUVSErsvf0d+Vkw==
|
||||
dependencies:
|
||||
"@vueuse/shared" "9.6.0"
|
||||
"@vueuse/shared" "9.11.1"
|
||||
vue-demi "*"
|
||||
|
||||
"@vueuse/metadata@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-9.6.0.tgz#b0a73277538cebef5d477983f74fdd2aa21ce5f9"
|
||||
integrity sha512-sIC8R+kWkIdpi5X2z2Gk8TRYzmczDwHRhEFfCu2P+XW2JdPoXrziqsGpDDsN7ykBx4ilwieS7JUIweVGhvZ93w==
|
||||
"@vueuse/metadata@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-9.11.1.tgz#f4e5fd9cb421c5a02373d034a0ce53538b370518"
|
||||
integrity sha512-ABjkrG+VXggNhjfGyw5e/sekxTZfXTwjrYXkkWQmQ7Biyv+Gq9UD6IDNfeGvQZEINI0Qzw6nfuO2UFCd3hlrxQ==
|
||||
|
||||
"@vueuse/router@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/router/-/router-9.6.0.tgz#2827ea2238e7937ee6ff3acb32dc8feddafe6200"
|
||||
integrity sha512-3TIZPX5smlimSNlTm+K3ESRTkA2VBHnwMintNrw4Z+WK5bh1UAh7lcBQluiGg3LJjkrMXYfuO7IPdU+a8NRnFA==
|
||||
"@vueuse/router@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/router/-/router-9.11.1.tgz#cdf32998a8646b0fda47e52cb9b89301d392766c"
|
||||
integrity sha512-nGmPnBZCcErEDpN2FXLcbdsHKSyRr10y+u2HzzJeDj3IutZjlCEysEOdDzlfjgUssNWao6CeSIb3sRMFZpWRsA==
|
||||
dependencies:
|
||||
"@vueuse/shared" "9.6.0"
|
||||
"@vueuse/shared" "9.11.1"
|
||||
vue-demi "*"
|
||||
|
||||
"@vueuse/shared@9.6.0":
|
||||
version "9.6.0"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-9.6.0.tgz#ce2e0e8124c6bdb1e270fc213e334ccc71dcb951"
|
||||
integrity sha512-/eDchxYYhkHnFyrb00t90UfjCx94kRHxc7J1GtBCqCG4HyPMX+krV9XJgVtWIsAMaxKVU4fC8NSUviG1JkwhUQ==
|
||||
"@vueuse/shared@9.11.1":
|
||||
version "9.11.1"
|
||||
resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-9.11.1.tgz#c76805c9d86da109b132529b4745d7d706106e7f"
|
||||
integrity sha512-UTZYGAjT96hWn4buf4wstZbeheBVNcKPQuej6qpoSkjF1atdaeCD6kqm9uGL2waHfisSgH9mq0qCRiBOk5C/2w==
|
||||
dependencies:
|
||||
vue-demi "*"
|
||||
|
||||
|
|
Loading…
Reference in New Issue