1
0
Fork 0

Game Over modal

This commit is contained in:
Ethanell 2021-03-25 09:26:04 +01:00
parent a5954b084b
commit efe36a7189
2 changed files with 10 additions and 3 deletions

View file

@ -18,7 +18,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="game" style="display:none;"> <div id="game">
<canvas id="canvas" class="invisible"></canvas> <canvas id="canvas" class="invisible"></canvas>
</div> </div>
<p id="score"></p> <p id="score"></p>
@ -29,6 +29,7 @@
<h1 class="linear-wipe">GAME OVER</h1> <h1 class="linear-wipe">GAME OVER</h1>
<p>Your score : <span id="gameoverscore">4</span></p> <p>Your score : <span id="gameoverscore">4</span></p>
</div> </div>
</div>
<script type="module" src="sources/js/index.js"></script> <script type="module" src="sources/js/index.js"></script>
</body> </body>
</html> </html>

View file

@ -6,6 +6,7 @@ const menuLevel = document.querySelector(".menu-level");
const gameZone = document.getElementById("game"); const gameZone = document.getElementById("game");
const score = document.getElementById("score"); const score = document.getElementById("score");
const lives = document.getElementById("lives"); const lives = document.getElementById("lives");
const gameOver = document.getElementById("gameovermodal");
const audio = new Audio("sources/sound/main.mp3"); const audio = new Audio("sources/sound/main.mp3");
const startSound = new Audio("sources/sound/onStart.mp3"); const startSound = new Audio("sources/sound/onStart.mp3");
const eatSound = new Audio("sources/sound/onEat.mp3"); const eatSound = new Audio("sources/sound/onEat.mp3");
@ -13,7 +14,10 @@ const dieSound = new Audio("sources/sound/onDie.mp3");
const gameOverSound = new Audio("sources/sound/onGameOver.mp3"); const gameOverSound = new Audio("sources/sound/onGameOver.mp3");
const game = new Game(canvas); const game = new Game(canvas);
let gameOverModal;
audio.loop = true;
startSound.volume = "0.2"; startSound.volume = "0.2";
req.open("GET", "sources/levels.json"); req.open("GET", "sources/levels.json");
@ -54,7 +58,8 @@ game.onDie = lives => {
game.onGameOver = (score) => { game.onGameOver = (score) => {
gameOverSound.play(); gameOverSound.play();
alert(`Game over !\nYour score is: ${score}`); gameOver.querySelector("span").innerText = score;
gameOverModal.open();
}; };
function loadLevels(levels) { function loadLevels(levels) {
@ -76,7 +81,7 @@ function loadGame(data) {
game.load(data); game.load(data);
game.start(); game.start();
startSound.play(); startSound.play();
}; }
function updateScore(s) { function updateScore(s) {
score.innerText = s; score.innerText = s;
@ -89,6 +94,7 @@ function updateLives(l) {
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
M.AutoInit(); M.AutoInit();
gameOverModal = M.Modal.getInstance(gameOver);
canvas.width = gameZone.clientWidth; canvas.width = gameZone.clientWidth;
canvas.height = gameZone.clientHeight; canvas.height = gameZone.clientHeight;
}); });