Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | 6x 6x 6x 6x 5x 5x 5x 5x 5x 5x 5x 2x 2x 5x 5x 1x 1x 24x 8x 7x 21x 15x 45x 45x 45x | import { AudioOutputs } from "../audio-output.js";
/**
* The sound output, speaker amount and display mode controls on the top bar:
* a view of those three settings, and a way to set them.
*/
export class QuickSettings {
constructor(settings) {
this.output = document.getElementById("audio-output");
this.amount = document.getElementById("speaker-amount");
this.display = document.getElementById("display-mode");
if (!this.output || !this.amount || !this.display) return;
this.showAudioOutput(settings.audioOutput);
this.showSpeakerAmount(settings.speakerAmount);
this.showDisplayMode(settings.displayMode);
settings.on("audioOutput", (audioOutput) => this.showAudioOutput(audioOutput));
settings.on("speakerAmount", (speakerAmount) => this.showSpeakerAmount(speakerAmount));
settings.on("displayMode", (displayMode) => this.showDisplayMode(displayMode));
this.output.addEventListener("click", (e) => {
const audioOutput = e.target.closest("[data-output]")?.dataset.output;
Eif (audioOutput) settings.set({ audioOutput });
});
this.amount.addEventListener("input", () => settings.set({ speakerAmount: parseFloat(this.amount.value) }));
this.display.addEventListener("click", (e) => {
const displayMode = e.target.closest("[data-mode]")?.dataset.mode;
Eif (displayMode) settings.set({ displayMode });
});
}
showAudioOutput(audioOutput) {
select(this.output.querySelectorAll("[data-output]"), (b) => b.dataset.output === audioOutput);
this.amount.disabled = audioOutput !== AudioOutputs.speaker;
}
showSpeakerAmount(speakerAmount) {
this.amount.value = speakerAmount;
}
showDisplayMode(mode) {
select(this.display.querySelectorAll("[data-mode]"), (b) => b.dataset.mode === mode);
}
}
function select(buttons, isChosen) {
for (const button of buttons) {
const chosen = isChosen(button);
button.classList.toggle("active", chosen);
button.setAttribute("aria-pressed", chosen);
}
}
|