Game Over modal
This commit is contained in:
parent
a5954b084b
commit
efe36a7189
2 changed files with 10 additions and 3 deletions
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="game" style="display:none;">
|
||||
<div id="game">
|
||||
<canvas id="canvas" class="invisible"></canvas>
|
||||
</div>
|
||||
<p id="score"></p>
|
||||
|
@ -29,6 +29,7 @@
|
|||
<h1 class="linear-wipe">GAME OVER</h1>
|
||||
<p>Your score : <span id="gameoverscore">4</span></p>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="sources/js/index.js"></script>
|
||||
</body>
|
||||
</html>
|
|
@ -6,6 +6,7 @@ const menuLevel = document.querySelector(".menu-level");
|
|||
const gameZone = document.getElementById("game");
|
||||
const score = document.getElementById("score");
|
||||
const lives = document.getElementById("lives");
|
||||
const gameOver = document.getElementById("gameovermodal");
|
||||
const audio = new Audio("sources/sound/main.mp3");
|
||||
const startSound = new Audio("sources/sound/onStart.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 game = new Game(canvas);
|
||||
|
||||
let gameOverModal;
|
||||
|
||||
|
||||
audio.loop = true;
|
||||
startSound.volume = "0.2";
|
||||
|
||||
req.open("GET", "sources/levels.json");
|
||||
|
@ -54,7 +58,8 @@ game.onDie = lives => {
|
|||
|
||||
game.onGameOver = (score) => {
|
||||
gameOverSound.play();
|
||||
alert(`Game over !\nYour score is: ${score}`);
|
||||
gameOver.querySelector("span").innerText = score;
|
||||
gameOverModal.open();
|
||||
};
|
||||
|
||||
function loadLevels(levels) {
|
||||
|
@ -76,7 +81,7 @@ function loadGame(data) {
|
|||
game.load(data);
|
||||
game.start();
|
||||
startSound.play();
|
||||
};
|
||||
}
|
||||
|
||||
function updateScore(s) {
|
||||
score.innerText = s;
|
||||
|
@ -89,6 +94,7 @@ function updateLives(l) {
|
|||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
M.AutoInit();
|
||||
gameOverModal = M.Modal.getInstance(gameOver);
|
||||
canvas.width = gameZone.clientWidth;
|
||||
canvas.height = gameZone.clientHeight;
|
||||
});
|
||||
|
|
Reference in a new issue