chore: format player progress quality keyboard
This commit is contained in:
@@ -1,13 +1,13 @@
|
||||
import { state } from './state';
|
||||
import { displayTimeFromAbsolute } from './timeline';
|
||||
import { safeLocalStorage } from './storage';
|
||||
import { state } from "./state";
|
||||
import { displayTimeFromAbsolute } from "./timeline";
|
||||
import { safeLocalStorage } from "./storage";
|
||||
|
||||
// same as mode.ts - could be extracted to shared util
|
||||
const streamUrlForMode = (mode: string, quality?: string): string => {
|
||||
const src = state.modeSources[mode];
|
||||
if (!src?.token) return '';
|
||||
if (!src?.token) return "";
|
||||
let url = `${state.streamURL}?mode=${encodeURIComponent(mode)}&token=${encodeURIComponent(src.token)}`;
|
||||
if (quality && quality !== 'best') url += `&quality=${encodeURIComponent(quality)}`;
|
||||
if (quality && quality !== "best") url += `&quality=${encodeURIComponent(quality)}`;
|
||||
return url;
|
||||
};
|
||||
|
||||
@@ -30,7 +30,7 @@ const loadVideo = (url: string): void => {
|
||||
export const switchQuality = (quality: string): void => {
|
||||
const url = streamUrlForMode(state.currentMode, quality);
|
||||
if (!url) return;
|
||||
safeLocalStorage.setItem('mal:preferred-quality', quality);
|
||||
safeLocalStorage.setItem("mal:preferred-quality", quality);
|
||||
loadVideo(url);
|
||||
};
|
||||
|
||||
@@ -39,38 +39,38 @@ export const switchQuality = (quality: string): void => {
|
||||
* Shows/hides dropdown based on availability.
|
||||
*/
|
||||
export const updateQualityOptions = (): void => {
|
||||
const select = state.container.querySelector('[data-quality-select]') as HTMLSelectElement | null;
|
||||
const select = state.container.querySelector("[data-quality-select]") as HTMLSelectElement | null;
|
||||
if (!select) return;
|
||||
const qualities = state.modeSources[state.currentMode]?.qualities ?? [];
|
||||
select.innerHTML = '';
|
||||
select.innerHTML = "";
|
||||
|
||||
const best = document.createElement('option');
|
||||
best.value = 'best';
|
||||
best.textContent = 'Auto / Best';
|
||||
const best = document.createElement("option");
|
||||
best.value = "best";
|
||||
best.textContent = "Auto / Best";
|
||||
select.appendChild(best);
|
||||
|
||||
qualities.forEach(q => {
|
||||
const opt = document.createElement('option');
|
||||
qualities.forEach((q) => {
|
||||
const opt = document.createElement("option");
|
||||
opt.value = q;
|
||||
opt.textContent = q;
|
||||
select.appendChild(opt);
|
||||
});
|
||||
|
||||
// restore saved preference
|
||||
const preferred = safeLocalStorage.getItem('mal:preferred-quality') || 'best';
|
||||
select.value = qualities.includes(preferred) ? preferred : 'best';
|
||||
const preferred = safeLocalStorage.getItem("mal:preferred-quality") || "best";
|
||||
select.value = qualities.includes(preferred) ? preferred : "best";
|
||||
|
||||
// hide if no quality options
|
||||
const wrapper = select.parentElement;
|
||||
wrapper?.classList.toggle('hidden', qualities.length === 0);
|
||||
wrapper?.classList.toggle("hidden", qualities.length === 0);
|
||||
};
|
||||
|
||||
/**
|
||||
* Binds quality select change handler.
|
||||
*/
|
||||
export const setupQuality = (): void => {
|
||||
const select = state.container.querySelector('[data-quality-select]') as HTMLSelectElement | null;
|
||||
select?.addEventListener('change', e => {
|
||||
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