mirror of
https://framagit.org/JonathanMM/sutom.git
synced 2024-05-04 06:53:28 +02:00
86 lines
2.7 KiB
TypeScript
86 lines
2.7 KiB
TypeScript
import Configuration from "./entites/configuration";
|
|
import PanelManager from "./panelManager";
|
|
import Sauvegardeur from "./sauvegardeur";
|
|
import { VolumeSon } from "./entites/volumeSon";
|
|
import AudioPanel from "./audioPanel";
|
|
|
|
export default class ConfigurationPanel {
|
|
private readonly _panelManager: PanelManager;
|
|
private readonly _audioPanel: AudioPanel;
|
|
|
|
private readonly _configBouton: HTMLElement;
|
|
|
|
public constructor(panelManager: PanelManager, audioPanel: AudioPanel) {
|
|
this._panelManager = panelManager;
|
|
this._audioPanel = audioPanel;
|
|
|
|
this._configBouton = document.getElementById("configuration-config-bouton") as HTMLElement;
|
|
|
|
this._configBouton.addEventListener(
|
|
"click",
|
|
(() => {
|
|
this.afficher();
|
|
}).bind(this)
|
|
);
|
|
}
|
|
|
|
public afficher(): void {
|
|
let titre = "Configuration";
|
|
let contenu = document.createElement("div");
|
|
let config = Sauvegardeur.chargerConfig() ?? Configuration.Default;
|
|
contenu.appendChild(
|
|
this.genererConfigItem(
|
|
"Volume du son (si activé)",
|
|
[
|
|
{ value: VolumeSon.Faible.toString(), label: "Faible" },
|
|
{ value: VolumeSon.Normal.toString(), label: "Normal" },
|
|
{ value: VolumeSon.Fort.toString(), label: "Fort" },
|
|
],
|
|
(config.volumeSon ?? Configuration.Default.volumeSon).toString(),
|
|
(event: Event) => {
|
|
event.stopPropagation();
|
|
let volumeSon: VolumeSon = parseInt((event.target as HTMLSelectElement).value);
|
|
|
|
this._audioPanel.setVolumeSonore(volumeSon);
|
|
|
|
Sauvegardeur.sauvegarderConfig({
|
|
...(Sauvegardeur.chargerConfig() ?? Configuration.Default),
|
|
volumeSon,
|
|
});
|
|
}
|
|
)
|
|
);
|
|
|
|
this._panelManager.setContenuHtmlElement(titre, contenu);
|
|
this._panelManager.setClasses(["config-panel"]);
|
|
this._panelManager.afficherPanel();
|
|
}
|
|
|
|
private genererConfigItem(
|
|
nomConfig: string,
|
|
options: Array<{ value: string; label: string }>,
|
|
valeurChoisie: string,
|
|
onChange?: (event: Event) => void
|
|
): HTMLElement {
|
|
let div = document.createElement("div");
|
|
div.className = "config-item";
|
|
|
|
let label = document.createElement("label");
|
|
label.innerText = nomConfig;
|
|
div.appendChild(label);
|
|
|
|
let select = document.createElement("select");
|
|
for (let optionItem of options) {
|
|
let optionElement = document.createElement("option");
|
|
optionElement.value = optionItem.value;
|
|
optionElement.innerText = optionItem.label;
|
|
if (optionItem.value === valeurChoisie) optionElement.selected = true;
|
|
select.appendChild(optionElement);
|
|
}
|
|
if (onChange !== undefined) select.addEventListener("change", onChange);
|
|
div.appendChild(select);
|
|
|
|
return div;
|
|
}
|
|
}
|