melosh/mal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: format player mode and state

Browse Source
This commit is contained in:
mkelvers
2026-05-28 11:28:56 +02:00
committed by Milas Holsting
parent 4c2c54229b
commit 1c4ade5e6c
2 changed files with 89 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
static/player/mode.ts
View File

@@ -1,16 +1,16 @@
import { state } from './state';
import { displayTimeFromAbsolute } from './timeline';
import { showControls } from './controls';
import { updateSubtitleOptions } from './subtitles';
import { updateQualityOptions } from './quality';
import { safeLocalStorage } from './storage';
import { state } from "./state";
import { displayTimeFromAbsolute } from "./timeline";
import { showControls } from "./controls";
import { updateSubtitleOptions } from "./subtitles";
import { updateQualityOptions } from "./quality";
import { safeLocalStorage } from "./storage";
// builds stream URL with mode, token, and optional quality param
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;
};
@@ -34,9 +34,9 @@ const loadVideo = (url: string): void => {
export const switchMode = (mode: string): void => {
if (!state.availableModes.includes(mode) || mode === state.currentMode) return;
state.currentMode = mode;
safeLocalStorage.setItem('player-audio-mode', mode);
safeLocalStorage.setItem("player-audio-mode", mode);
const qualitySelect = state.container.querySelector(
'[data-quality-select]'
"[data-quality-select]",
) as HTMLSelectElement | null;
loadVideo(streamUrlForMode(mode, qualitySelect?.value));
updateSubtitleOptions();
@@ -49,24 +49,24 @@ export const switchMode = (mode: string): void => {
* Disables unavailable modes.
*/
export const updateModeButtons = (): void => {
const dub = state.container.querySelector('[data-mode-dub]') as HTMLButtonElement | null;
const sub = state.container.querySelector('[data-mode-sub]') as HTMLButtonElement | null;
const dub = state.container.querySelector("[data-mode-dub]") as HTMLButtonElement | null;
const sub = state.container.querySelector("[data-mode-sub]") as HTMLButtonElement | null;
const m = state.currentMode;
dub?.classList.toggle('text-accent', m === 'dub');
dub?.classList.toggle('text-foreground', m !== 'dub');
dub?.classList.toggle('opacity-50', !state.availableModes.includes('dub'));
dub?.classList.toggle('cursor-not-allowed', !state.availableModes.includes('dub'));
dub?.classList.toggle("text-accent", m === "dub");
dub?.classList.toggle("text-foreground", m !== "dub");
dub?.classList.toggle("opacity-50", !state.availableModes.includes("dub"));
dub?.classList.toggle("cursor-not-allowed", !state.availableModes.includes("dub"));
if (dub) {
dub.disabled = !state.availableModes.includes('dub');
dub.disabled = !state.availableModes.includes("dub");
}
sub?.classList.toggle('text-accent', m === 'sub');
sub?.classList.toggle('text-foreground', m !== 'sub');
sub?.classList.toggle('opacity-50', !state.availableModes.includes('sub'));
sub?.classList.toggle('cursor-not-allowed', !state.availableModes.includes('sub'));
sub?.classList.toggle("text-accent", m === "sub");
sub?.classList.toggle("text-foreground", m !== "sub");
sub?.classList.toggle("opacity-50", !state.availableModes.includes("sub"));
sub?.classList.toggle("cursor-not-allowed", !state.availableModes.includes("sub"));
if (sub) {
sub.disabled = !state.availableModes.includes('sub');
sub.disabled = !state.availableModes.includes("sub");
}
};
@@ -74,27 +74,27 @@ export const updateModeButtons = (): void => {
* Binds click handlers for mode buttons and autoplay toggle.
*/
export const setupMode = (): void => {
const dub = state.container.querySelector('[data-mode-dub]') as HTMLButtonElement | null;
const sub = state.container.querySelector('[data-mode-sub]') as HTMLButtonElement | null;
const dub = state.container.querySelector("[data-mode-dub]") as HTMLButtonElement | null;
const sub = state.container.querySelector("[data-mode-sub]") as HTMLButtonElement | null;
dub?.addEventListener('click', () => {
if (state.availableModes.includes('dub')) {
switchMode('dub');
dub?.addEventListener("click", () => {
if (state.availableModes.includes("dub")) {
switchMode("dub");
showControls();
}
});
sub?.addEventListener('click', () => {
if (state.availableModes.includes('sub')) {
switchMode('sub');
sub?.addEventListener("click", () => {
if (state.availableModes.includes("sub")) {
switchMode("sub");
showControls();
}
});
const autoplayBtn = document.querySelector('[data-autoplay]') as HTMLInputElement | null;
autoplayBtn?.addEventListener('change', e => {
const autoplayBtn = document.querySelector("[data-autoplay]") as HTMLInputElement | null;
autoplayBtn?.addEventListener("change", (e) => {
safeLocalStorage.setItem(
'mal:autoplay-enabled',
(e.target as HTMLInputElement).checked ? 'true' : 'false'
"mal:autoplay-enabled",
(e.target as HTMLInputElement).checked ? "true" : "false",
);
showControls();
});