2023-05-18 11:14:32 +02:00
|
|
|
|
import CopieHelper from "./copieHelper";
|
2022-02-19 19:21:53 +01:00
|
|
|
|
import Configuration from "./entites/configuration";
|
2022-01-30 11:17:10 +01:00
|
|
|
|
import LettreResultat from "./entites/lettreResultat";
|
|
|
|
|
import { LettreStatut } from "./entites/lettreStatut";
|
2022-02-14 20:50:43 +01:00
|
|
|
|
import InstanceConfiguration from "./instanceConfiguration";
|
2022-01-29 14:58:08 +01:00
|
|
|
|
import PanelManager from "./panelManager";
|
2022-01-30 20:14:26 +01:00
|
|
|
|
import Sauvegardeur from "./sauvegardeur";
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
|
|
|
|
export default class FinDePartiePanel {
|
2022-01-23 10:43:57 +01:00
|
|
|
|
private readonly _datePartie: Date;
|
2022-01-29 14:58:08 +01:00
|
|
|
|
private readonly _panelManager: PanelManager;
|
|
|
|
|
private readonly _statsButton: HTMLElement;
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
|
|
|
|
private _resumeTexte: string = "";
|
2022-02-19 18:24:57 +01:00
|
|
|
|
private _resumeTexteLegacy: string = "";
|
2022-01-29 14:58:08 +01:00
|
|
|
|
private _motATrouver: string = "";
|
|
|
|
|
private _estVictoire: boolean = false;
|
|
|
|
|
private _partieEstFinie: boolean = false;
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
public constructor(datePartie: Date, panelManager: PanelManager) {
|
2022-03-27 23:56:43 +02:00
|
|
|
|
this._datePartie = new Date(datePartie);
|
|
|
|
|
this._datePartie.setHours(0, 0, 0);
|
2022-01-29 14:58:08 +01:00
|
|
|
|
this._panelManager = panelManager;
|
|
|
|
|
this._statsButton = document.getElementById("configuration-stats-bouton") as HTMLElement;
|
2022-01-23 10:43:57 +01:00
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
this._statsButton.addEventListener(
|
|
|
|
|
"click",
|
|
|
|
|
(() => {
|
|
|
|
|
this.afficher();
|
|
|
|
|
}).bind(this)
|
|
|
|
|
);
|
2022-01-10 19:34:58 +01:00
|
|
|
|
}
|
|
|
|
|
|
2022-02-19 19:21:53 +01:00
|
|
|
|
public genererResume(estBonneReponse: boolean, motATrouver: string, resultats: Array<Array<LettreResultat>>, dureeMs: number): void {
|
2022-01-10 19:34:58 +01:00
|
|
|
|
let resultatsEmojis = resultats.map((mot) =>
|
|
|
|
|
mot
|
|
|
|
|
.map((resultat) => resultat.statut)
|
|
|
|
|
.reduce((ligne, statut) => {
|
|
|
|
|
switch (statut) {
|
|
|
|
|
case LettreStatut.BienPlace:
|
|
|
|
|
return ligne + "🟥";
|
|
|
|
|
case LettreStatut.MalPlace:
|
|
|
|
|
return ligne + "🟡";
|
|
|
|
|
default:
|
|
|
|
|
return ligne + "🟦";
|
|
|
|
|
}
|
|
|
|
|
}, "")
|
|
|
|
|
);
|
2022-02-19 18:24:57 +01:00
|
|
|
|
|
|
|
|
|
let resultatsEmojisLegacy = resultats.map((mot) =>
|
|
|
|
|
mot
|
|
|
|
|
.map((resultat) => resultat.statut)
|
|
|
|
|
.reduce((ligne, statut) => {
|
|
|
|
|
switch (statut) {
|
|
|
|
|
case LettreStatut.BienPlace:
|
|
|
|
|
return ligne + '<span class="emoji-carre-rouge">🟥</span>';
|
|
|
|
|
case LettreStatut.MalPlace:
|
|
|
|
|
return ligne + '<span class="emoji-cercle-jaune">🟡</span>';
|
|
|
|
|
default:
|
|
|
|
|
return ligne + '<span class="emoji-carre-bleu">🟦</span>';
|
|
|
|
|
}
|
|
|
|
|
}, "")
|
|
|
|
|
);
|
2022-01-23 10:43:57 +01:00
|
|
|
|
let dateGrille = this._datePartie.getTime();
|
2022-02-14 20:50:43 +01:00
|
|
|
|
let origine = InstanceConfiguration.dateOrigine.getTime();
|
2022-01-29 14:58:08 +01:00
|
|
|
|
this._motATrouver = motATrouver;
|
|
|
|
|
this._estVictoire = estBonneReponse;
|
|
|
|
|
this._partieEstFinie = true;
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
2022-03-27 23:56:43 +02:00
|
|
|
|
let numeroGrille = Math.round((dateGrille - origine) / (24 * 3600 * 1000)) + 1;
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
2022-02-19 19:21:53 +01:00
|
|
|
|
let afficherChrono = (Sauvegardeur.chargerConfig() ?? Configuration.Default).afficherChrono;
|
|
|
|
|
|
|
|
|
|
const entete =
|
2022-11-18 21:17:27 +01:00
|
|
|
|
"#SUTOM #" +
|
2022-02-19 19:21:53 +01:00
|
|
|
|
numeroGrille +
|
|
|
|
|
" " +
|
|
|
|
|
(estBonneReponse ? resultats.length : "-") +
|
|
|
|
|
"/6" +
|
|
|
|
|
(afficherChrono ? " " + this.genererTempsHumain(dureeMs) : "") +
|
|
|
|
|
"\n\n";
|
|
|
|
|
this._resumeTexte = entete + resultatsEmojis.join("\n");
|
|
|
|
|
this._resumeTexteLegacy = entete + resultatsEmojisLegacy.join("\n");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private genererTempsHumain(dureeMs: number): string {
|
|
|
|
|
// Note : Durée est en millisecondes.
|
|
|
|
|
let duree = Math.floor(dureeMs / 1000);
|
|
|
|
|
let retour = "";
|
|
|
|
|
|
|
|
|
|
if (duree >= 3600) {
|
|
|
|
|
retour += Math.floor(duree / 3600) + "h";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
retour +=
|
|
|
|
|
Math.floor((duree / 60) % 60)
|
|
|
|
|
.toString()
|
|
|
|
|
.padStart(2, "0") + ":";
|
2022-03-04 09:23:02 +01:00
|
|
|
|
retour += Math.floor(duree % 60)
|
2022-02-19 19:21:53 +01:00
|
|
|
|
.toString()
|
|
|
|
|
.padStart(2, "0");
|
|
|
|
|
|
|
|
|
|
return retour;
|
2022-01-10 19:34:58 +01:00
|
|
|
|
}
|
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
private attacherPartage(): void {
|
2023-05-18 11:14:32 +02:00
|
|
|
|
const resumeBouton = document.getElementById("fin-de-partie-panel-resume-bouton") as HTMLElement;
|
|
|
|
|
CopieHelper.attacheBoutonCopieLien(resumeBouton, this._resumeTexte + "\n\nhttps://sutom.nocle.fr", "Résumé copié dans le presse papier.");
|
2022-01-29 14:58:08 +01:00
|
|
|
|
}
|
2022-01-10 19:34:58 +01:00
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
public afficher(): void {
|
|
|
|
|
let titre: string;
|
2022-01-30 20:14:26 +01:00
|
|
|
|
let contenu: string = "";
|
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
if (!this._partieEstFinie) {
|
|
|
|
|
titre = "Statistiques";
|
2022-01-30 20:14:26 +01:00
|
|
|
|
contenu += '<p class="fin-de-partie-panel-phrase">Vous n\'avez pas encore fini votre partie du jour.</p>';
|
2022-01-29 14:58:08 +01:00
|
|
|
|
} else {
|
|
|
|
|
if (this._estVictoire) {
|
|
|
|
|
titre = "Félicitations";
|
2022-03-26 09:24:20 +01:00
|
|
|
|
contenu += '<p class="fin-de-partie-panel-phrase">Bravo, tu as gagné. Reviens demain pour une nouvelle grille.</p>';
|
2022-01-29 14:58:08 +01:00
|
|
|
|
} else {
|
|
|
|
|
titre = "Perdu";
|
2022-01-30 20:14:26 +01:00
|
|
|
|
contenu +=
|
|
|
|
|
'<p class="fin-de-partie-panel-phrase"> \
|
2022-03-01 20:21:06 +01:00
|
|
|
|
Le mot à trouver était : ' +
|
2022-01-30 20:14:26 +01:00
|
|
|
|
this._motATrouver +
|
|
|
|
|
"<br /> \
|
2022-03-26 09:24:20 +01:00
|
|
|
|
Peut-être feras-tu mieux demain ? \
|
2022-01-29 14:58:08 +01:00
|
|
|
|
</p>";
|
|
|
|
|
}
|
2023-05-18 11:14:32 +02:00
|
|
|
|
contenu += "<p>Résumé de ta partie − ";
|
|
|
|
|
contenu += CopieHelper.creerBoutonPartage("fin-de-partie-panel-resume-bouton", "Partager").outerHTML;
|
2022-01-29 14:58:08 +01:00
|
|
|
|
contenu +=
|
2023-05-18 11:14:32 +02:00
|
|
|
|
'</p> \
|
2022-01-29 14:58:08 +01:00
|
|
|
|
<pre id="fin-de-partie-panel-resume">' +
|
2022-02-19 18:24:57 +01:00
|
|
|
|
this._resumeTexteLegacy +
|
2022-01-29 14:58:08 +01:00
|
|
|
|
"</pre>";
|
2022-01-10 19:34:58 +01:00
|
|
|
|
}
|
2022-01-30 20:14:26 +01:00
|
|
|
|
|
|
|
|
|
let stats = Sauvegardeur.chargerSauvegardeStats();
|
|
|
|
|
if (stats) {
|
|
|
|
|
contenu +=
|
2022-01-31 19:29:33 +01:00
|
|
|
|
'<p>Statistiques</p><div class="stats-area"><div class="stats-ligne"><div class="stats-cellule">Parties :</div>' +
|
2022-01-30 20:14:26 +01:00
|
|
|
|
`<div class="stats-cellule">${stats.partiesGagnees}/${stats.partiesJouees}</div>` +
|
|
|
|
|
"</div>" +
|
2022-01-31 19:20:29 +01:00
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">1/6 :</div><div class="stats-cellule">${stats.repartition[1]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">2/6 :</div><div class="stats-cellule">${stats.repartition[2]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">3/6 :</div><div class="stats-cellule">${stats.repartition[3]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">4/6 :</div><div class="stats-cellule">${stats.repartition[4]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">5/6 :</div><div class="stats-cellule">${stats.repartition[5]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">6/6 :</div><div class="stats-cellule">${stats.repartition[6]}</div></div>` +
|
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">-/6 :</div><div class="stats-cellule">${stats.repartition["-"]}</div></div>` +
|
2022-01-30 20:14:26 +01:00
|
|
|
|
`<div class="stats-ligne"><div class="stats-cellule">Moyenne :</div><div class="stats-cellule">${this.getMoyenne(stats.repartition)}</div></div>` +
|
|
|
|
|
'<div class="stats-ligne"><div class="stats-cellule">Lettres :</div>' +
|
|
|
|
|
'<div class="stats-cellule">' +
|
2022-01-31 19:20:29 +01:00
|
|
|
|
`${stats.lettresRepartitions.bienPlace} 🟥 ` +
|
|
|
|
|
`${stats.lettresRepartitions.malPlace} 🟡 ` +
|
|
|
|
|
`${stats.lettresRepartitions.nonTrouve} 🟦` +
|
2022-01-30 20:14:26 +01:00
|
|
|
|
"</div>" +
|
|
|
|
|
"</div>" +
|
|
|
|
|
"</div>";
|
|
|
|
|
}
|
|
|
|
|
|
2022-01-29 14:58:08 +01:00
|
|
|
|
this._panelManager.setContenu(titre, contenu);
|
|
|
|
|
this._panelManager.setClasses(["fin-de-partie-panel"]);
|
|
|
|
|
if (this._partieEstFinie) this.attacherPartage();
|
|
|
|
|
this._panelManager.afficherPanel();
|
2022-01-10 19:34:58 +01:00
|
|
|
|
}
|
2022-01-30 20:14:26 +01:00
|
|
|
|
|
|
|
|
|
private getMoyenne(repartition: { 1: number; 2: number; 3: number; 4: number; 5: number; 6: number; "-": number }): string {
|
|
|
|
|
return (
|
|
|
|
|
(repartition[1] * 1 + repartition[2] * 2 + repartition[3] * 3 + repartition[4] * 4 + repartition[5] * 5 + repartition[6] * 6 + repartition["-"] * 6) /
|
|
|
|
|
(repartition[1] + repartition[2] + repartition[3] + repartition[4] + repartition[5] + repartition[6] + repartition["-"])
|
|
|
|
|
).toLocaleString("fr-FR", { maximumFractionDigits: 2 });
|
|
|
|
|
}
|
2022-01-10 19:34:58 +01:00
|
|
|
|
}
|