game over stats

This commit is contained in:
2023-04-25 04:16:26 +02:00
parent 649fdbc064
commit cc44b69b3b
2 changed files with 103 additions and 19 deletions

View File

@ -1,4 +1,5 @@
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>QUATRIS</title>
@ -16,7 +17,9 @@
<link rel="icon" type="image/png" sizes="16x16" href="favicons/favicon-16x16.png">
<link rel="manifest" href="manifest.json">
</head>
<body data-bs-theme="dark">
<div class="modal fade" id="settingsModal" data-bs-backdrop="static" data-bs-keyboard="false">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
@ -108,7 +111,9 @@
</div>
</div>
</div>
<div class="container-fluid d-flex h-100 justify-content-center d-flex align-items-center">
<div class="row row-cols-auto align-items-start gap-2">
<div class="col d-flex flex-column align-items-end">
<div class="card mb-4">
@ -124,17 +129,18 @@
</div>
</div>
<div class="card">
<table id="statsTable" class="table mb-0 align-middle">
<tr><td>Score</td><th id="scoreCell" class="text-end">0</th></tr>
<tr><td>Meilleur</td><th id="highScoreCell" class="text-end">
<table id="statsTable" class="table mb-0">
<tr><th>Score</th> <td id="scoreCell">0</td> </tr>
<tr><th>Meilleur</th> <td id="highScoreCell">
<script>document.write(Number(localStorage["highScore"]) || 0)</script>
</th></tr>
<tr><td>Niveau</td><th id="levelCell" class="text-end">0</th></tr>
<tr><td>But</td><th id="goalCell" class="text-end">0</th></tr>
<tr><td>Temps</td><th id="timeCell" class="text-end">00:00</th></tr>
</td></tr>
<tr><th>Niveau</th> <td id="levelCell">0</td> </tr>
<tr><th>But</th> <td id="goalCell">0</td> </tr>
<tr><th>Temps</th> <td id="timeCell">00:00</td> </tr>
</table>
</div>
</div>
<div class="col position-relative">
<div class="card">
<table id="matrixTable" class="minoes-table" style="--buffer-zone-rows: 5">
@ -167,6 +173,7 @@
</div>
<span id="messagesSpan"></span>
</div>
<div class="col">
<div class="card">
<div class="card-header text-center"><strong>NEXT</strong></div>
@ -190,9 +197,37 @@
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="GameOverModal" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title w-100 text-center">Fin</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body p-0">
<table class="table mb-0">
<tr><th>Score</th> <td id="goScoreCell"></td> <th>Niveau</th> <td id="goLevelCell"></td> </tr>
<tr><th>Meilleur score</th> <td id="goHighScoreCell"></td> <th>Temps</th> <td id="goTimeCell"></td> </tr>
<tr><th>Lignes</th> <td id="gototalClearedLines"></td> <th>Lignes par minutes</th> <td id="gototalClearedLinesPM"></td> </tr>
<tr><th>Quatris</th> <td id="goNbQuatris"></td> <th>Pirouettes</th> <td id="goNbTSpin"></td> </tr>
<tr><th>Plus grand enchaînement</th> <td id="goMaxCombo"></td> <th>Plus grand bout à bout</th> <td id="goMaxB2B"></td> </tr>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="restart()">Rejouer ?</button>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
<script src="app.js"></script>