feat: extract quality switching and mode selection
This commit is contained in:
59
static/player/quality.ts
Normal file
59
static/player/quality.ts
Normal file
@@ -0,0 +1,59 @@
|
||||
import { state } from './state'
|
||||
import { displayTimeFromAbsolute, absoluteTimeFromDisplay } from './timeline'
|
||||
|
||||
const streamUrlForMode = (mode: string, quality?: string): string => {
|
||||
const src = state.modeSources[mode]
|
||||
if (!src?.token) return ''
|
||||
let url = `${state.streamURL}?mode=${encodeURIComponent(mode)}&token=${encodeURIComponent(src.token)}`
|
||||
if (quality && quality !== 'best') url += `&quality=${encodeURIComponent(quality)}`
|
||||
return url
|
||||
}
|
||||
|
||||
const loadVideo = (url: string): void => {
|
||||
if (!url) return
|
||||
const wasPlaying = !state.video.paused
|
||||
const prevTime = displayTimeFromAbsolute(state.video.currentTime)
|
||||
state.video.src = url
|
||||
state.video.load()
|
||||
state.pendingSeekTime = prevTime
|
||||
if (wasPlaying) state.video.play().catch(() => {})
|
||||
}
|
||||
|
||||
export const switchQuality = (quality: string): void => {
|
||||
const url = streamUrlForMode(state.currentMode, quality)
|
||||
if (!url) return
|
||||
localStorage.setItem('mal:preferred-quality', quality)
|
||||
loadVideo(url)
|
||||
}
|
||||
|
||||
export const updateQualityOptions = (): void => {
|
||||
const select = state.container.querySelector('[data-quality-select]') as HTMLSelectElement | null
|
||||
if (!select) return
|
||||
const qualities = state.modeSources[state.currentMode]?.qualities ?? []
|
||||
select.innerHTML = ''
|
||||
|
||||
const best = document.createElement('option')
|
||||
best.value = 'best'
|
||||
best.textContent = 'Auto / Best'
|
||||
select.appendChild(best)
|
||||
|
||||
qualities.forEach(q => {
|
||||
const opt = document.createElement('option')
|
||||
opt.value = q
|
||||
opt.textContent = q
|
||||
select.appendChild(opt)
|
||||
})
|
||||
|
||||
const preferred = localStorage.getItem('mal:preferred-quality') || 'best'
|
||||
select.value = qualities.includes(preferred) ? preferred : 'best'
|
||||
|
||||
const wrapper = select.parentElement
|
||||
wrapper?.classList.toggle('hidden', qualities.length === 0)
|
||||
}
|
||||
|
||||
export const setupQuality = (): void => {
|
||||
const select = state.container.querySelector('[data-quality-select]') as HTMLSelectElement | null
|
||||
select?.addEventListener('change', (e) => {
|
||||
switchQuality((e.target as HTMLSelectElement).value)
|
||||
})
|
||||
}
|
||||
Reference in New Issue
Block a user