mirror of
https://framagit.org/JonathanMM/sutom.git
synced 2024-05-04 15:03:30 +02:00
Possibilité de régler le volume du jeu
This commit is contained in:
parent
fb726f61c3
commit
37edf6ed08
|
@ -1,4 +1,4 @@
|
|||
import Configuration from "./configuration";
|
||||
import Configuration from "./entites/configuration";
|
||||
import Sauvegardeur from "./sauvegardeur";
|
||||
|
||||
export default class AudioPanel {
|
||||
|
@ -20,6 +20,7 @@ export default class AudioPanel {
|
|||
this._audioLettreMalPlace = document.getElementById("son-lettre-mal-place") as HTMLAudioElement;
|
||||
this._audioLettreNonTrouve = document.getElementById("son-lettre-non-trouve") as HTMLAudioElement;
|
||||
|
||||
this.setVolumeSonore(configuration.volumeSon ?? Configuration.Default.volumeSon);
|
||||
this.toggleSon(configuration.hasAudio, true);
|
||||
|
||||
this._configAudioBouton.addEventListener(
|
||||
|
@ -49,6 +50,13 @@ export default class AudioPanel {
|
|||
}
|
||||
}
|
||||
|
||||
public setVolumeSonore(volume: number): void {
|
||||
let volumeTag = volume / 100;
|
||||
this._audioLettreBienPlace.volume = volumeTag;
|
||||
this._audioLettreMalPlace.volume = volumeTag;
|
||||
this._audioLettreNonTrouve.volume = volumeTag;
|
||||
}
|
||||
|
||||
public jouerSonLettreBienPlace(callback?: () => void): void {
|
||||
this.jouerSon(this._audioLettreBienPlace, callback);
|
||||
}
|
||||
|
|
|
@ -1,13 +1,19 @@
|
|||
import Configuration from "./configuration";
|
||||
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) {
|
||||
public constructor(panelManager: PanelManager, audioPanel: AudioPanel) {
|
||||
this._panelManager = panelManager;
|
||||
this._audioPanel = audioPanel;
|
||||
|
||||
this._configBouton = document.getElementById("configuration-config-bouton") as HTMLElement;
|
||||
|
||||
this._configBouton.addEventListener(
|
||||
|
@ -21,20 +27,41 @@ export default class ConfigurationPanel {
|
|||
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é)", {
|
||||
1: "Faible",
|
||||
2: "Normal",
|
||||
3: "Fort",
|
||||
})
|
||||
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.setContenu(titre, contenu.innerHTML);
|
||||
this._panelManager.setContenuHtmlElement(titre, contenu);
|
||||
this._panelManager.setClasses(["config-panel"]);
|
||||
this._panelManager.afficherPanel();
|
||||
}
|
||||
|
||||
private genererConfigItem(nomConfig: string, options: { [value: number]: string }): HTMLElement {
|
||||
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";
|
||||
|
||||
|
@ -43,13 +70,14 @@ export default class ConfigurationPanel {
|
|||
div.appendChild(label);
|
||||
|
||||
let select = document.createElement("select");
|
||||
for (let optionKey in options) {
|
||||
let optionLabel = options[optionKey];
|
||||
for (let optionItem of options) {
|
||||
let optionElement = document.createElement("option");
|
||||
optionElement.value = optionKey;
|
||||
optionElement.innerText = optionLabel;
|
||||
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;
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
import { VolumeSon } from "./volumeSon";
|
||||
|
||||
export default class Configuration {
|
||||
public static Default: Configuration = { hasAudio: false, afficherRegles: true };
|
||||
public static Default: Configuration = { hasAudio: false, afficherRegles: true, volumeSon: VolumeSon.Normal };
|
||||
|
||||
hasAudio: boolean = false;
|
||||
afficherRegles: boolean = true;
|
||||
volumeSon: VolumeSon = VolumeSon.Normal;
|
||||
}
|
5
ts/entites/volumeSon.ts
Normal file
5
ts/entites/volumeSon.ts
Normal file
|
@ -0,0 +1,5 @@
|
|||
export enum VolumeSon {
|
||||
Faible = 30,
|
||||
Normal = 70,
|
||||
Fort = 100,
|
||||
}
|
|
@ -1,5 +1,5 @@
|
|||
import LettreResultat from "./lettreResultat";
|
||||
import { LettreStatut } from "./lettreStatut";
|
||||
import LettreResultat from "./entites/lettreResultat";
|
||||
import { LettreStatut } from "./entites/lettreStatut";
|
||||
import NotificationMessage from "./notificationMessage";
|
||||
import PanelManager from "./panelManager";
|
||||
|
||||
|
|
|
@ -1,17 +1,18 @@
|
|||
import Dictionnaire from "./dictionnaire";
|
||||
import Grille from "./grille";
|
||||
import Input from "./input";
|
||||
import LettreResultat from "./lettreResultat";
|
||||
import { LettreStatut } from "./lettreStatut";
|
||||
import LettreResultat from "./entites/lettreResultat";
|
||||
import { LettreStatut } from "./entites/lettreStatut";
|
||||
import FinDePartiePanel from "./finDePartiePanel";
|
||||
import NotificationMessage from "./notificationMessage";
|
||||
import SauvegardeStats from "./sauvegardeStats";
|
||||
import SauvegardeStats from "./entites/sauvegardeStats";
|
||||
import Sauvegardeur from "./sauvegardeur";
|
||||
import Configuration from "./configuration";
|
||||
import PartieEnCours from "./partieEnCours";
|
||||
import Configuration from "./entites/configuration";
|
||||
import PartieEnCours from "./entites/partieEnCours";
|
||||
import PanelManager from "./panelManager";
|
||||
import ReglesPanel from "./reglesPanel";
|
||||
import ConfigurationPanel from "./configurationPanel";
|
||||
import AudioPanel from "./audioPanel";
|
||||
|
||||
export default class Gestionnaire {
|
||||
private readonly _dictionnaire: Dictionnaire;
|
||||
|
@ -23,6 +24,7 @@ export default class Gestionnaire {
|
|||
private readonly _propositions: Array<string>;
|
||||
private readonly _resultats: Array<Array<LettreResultat>>;
|
||||
private readonly _panelManager: PanelManager;
|
||||
private readonly _audioPanel: AudioPanel;
|
||||
|
||||
private _motATrouver: string = "";
|
||||
private _compositionMotATrouver: { [lettre: string]: number } = {};
|
||||
|
@ -45,14 +47,15 @@ export default class Gestionnaire {
|
|||
this._dictionnaire = new Dictionnaire();
|
||||
this._propositions = new Array<string>();
|
||||
this._resultats = new Array<Array<LettreResultat>>();
|
||||
this._audioPanel = new AudioPanel(this._config);
|
||||
this._panelManager = new PanelManager();
|
||||
this._reglesPanel = new ReglesPanel(this._panelManager);
|
||||
this._finDePartiePanel = new FinDePartiePanel(this._datePartieEnCours, this._panelManager);
|
||||
this._configurationPanel = new ConfigurationPanel(this._panelManager);
|
||||
this._configurationPanel = new ConfigurationPanel(this._panelManager, this._audioPanel);
|
||||
|
||||
this.choisirMot(this._datePartieEnCours).then((mot) => {
|
||||
this._motATrouver = mot;
|
||||
this._grille = new Grille(this._motATrouver.length, this._maxNbPropositions, this._motATrouver[0], this._config);
|
||||
this._grille = new Grille(this._motATrouver.length, this._maxNbPropositions, this._motATrouver[0], this._audioPanel);
|
||||
this._input = new Input(this, this._motATrouver.length, this._motATrouver[0]);
|
||||
this._compositionMotATrouver = this.decompose(this._motATrouver);
|
||||
this.chargerPropositions(partieEnCours.propositions);
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
import AudioPanel from "./audioPanel";
|
||||
import Configuration from "./configuration";
|
||||
import LettreResultat from "./lettreResultat";
|
||||
import { LettreStatut } from "./lettreStatut";
|
||||
import LettreResultat from "./entites/lettreResultat";
|
||||
import { LettreStatut } from "./entites/lettreStatut";
|
||||
|
||||
export default class Grille {
|
||||
private readonly _grille: HTMLElement;
|
||||
|
@ -14,9 +13,9 @@ export default class Grille {
|
|||
private _indice: Array<string | undefined>;
|
||||
private _motActuel: number;
|
||||
|
||||
public constructor(longueurMot: number, maxPropositions: number, indice: string, configuration: Configuration) {
|
||||
public constructor(longueurMot: number, maxPropositions: number, indice: string, audioPanel: AudioPanel) {
|
||||
this._grille = document.getElementById("grille") as HTMLElement;
|
||||
this._audioPanel = new AudioPanel(configuration);
|
||||
this._audioPanel = audioPanel;
|
||||
|
||||
this._longueurMot = longueurMot;
|
||||
this._maxPropositions = maxPropositions;
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import Gestionnaire from "./gestionnaire";
|
||||
import LettreResultat from "./lettreResultat";
|
||||
import { LettreStatut } from "./lettreStatut";
|
||||
import LettreResultat from "./entites/lettreResultat";
|
||||
import { LettreStatut } from "./entites/lettreStatut";
|
||||
|
||||
export default class Input {
|
||||
private readonly _grille: HTMLElement;
|
||||
|
|
|
@ -49,6 +49,12 @@ export default class PanelManager {
|
|||
this._panelContenu.innerHTML = contenu;
|
||||
}
|
||||
|
||||
public setContenuHtmlElement(titre: string, contenu: HTMLElement): void {
|
||||
this._panelTitre.innerText = titre;
|
||||
this._panelContenu.innerHTML = "";
|
||||
this._panelContenu.appendChild(contenu);
|
||||
}
|
||||
|
||||
public setClasses(classes: Array<string>): void {
|
||||
this._panelArea.className = "";
|
||||
classes.forEach((nomClasse) => this._panelArea.classList.add(nomClasse));
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import Configuration from "./configuration";
|
||||
import Configuration from "./entites/configuration";
|
||||
import PanelManager from "./panelManager";
|
||||
import Sauvegardeur from "./sauvegardeur";
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import Configuration from "./configuration";
|
||||
import PartieEnCours from "./partieEnCours";
|
||||
import SauvegardePartie from "./sauvegardePartie";
|
||||
import SauvegardeStats from "./sauvegardeStats";
|
||||
import Configuration from "./entites/configuration";
|
||||
import PartieEnCours from "./entites/partieEnCours";
|
||||
import SauvegardePartie from "./entites/sauvegardePartie";
|
||||
import SauvegardeStats from "./entites/sauvegardeStats";
|
||||
|
||||
export default class Sauvegardeur {
|
||||
private static readonly _cleStats = "stats";
|
||||
|
|
Loading…
Reference in a new issue