diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..bc8a670 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.idea/* \ No newline at end of file diff --git a/animations/click.js b/animations/click.js index 9b7a030..ab85805 100644 --- a/animations/click.js +++ b/animations/click.js @@ -7,9 +7,9 @@ window.requestAnimFrame = (function (callback) { const overlayCanvas = document.getElementById('minesweeper-overlay'); const overlayCtx = overlayCanvas.getContext('2d'); -const particlesPerExplosion = 20; +const particlesPerExplosion = 10; const particlesMinSpeed = 3; -const particlesMaxSpeed = 6; +const particlesMaxSpeed = 5; const particlesMinSize = 3; const particlesMaxSize = 6; const explosions = []; @@ -28,10 +28,13 @@ if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(naviga let play = true; // Draw -function draw() { +function drawClickAnimation() { // Loop if(play) - requestAnimationFrame(draw); + requestAnimationFrame(drawClickAnimation); + + if(explosions.length === 0) + return; // Set NOW and DELTA now = Date.now(); @@ -47,14 +50,11 @@ function draw() { // Our animation drawExplosion(); - } - } // Draw explosion(s) function drawExplosion() { - if (explosions.length === 0) { return; } @@ -138,9 +138,9 @@ function particle(x, y) { this.xv = randInt(particlesMinSpeed, particlesMaxSpeed, false); this.yv = randInt(particlesMinSpeed, particlesMaxSpeed, false); this.size = randInt(particlesMinSize, particlesMaxSize, true); - this.r = randInt(113, 222); - this.g = '00'; - this.b = randInt(105, 255); + this.r = randInt(2, 36); + this.g = randInt(135, 150); + this.b = randInt(190, 255); } // Returns an random integer, positive or negative @@ -159,4 +159,4 @@ function randInt(min, max, positive) { } -draw(); \ No newline at end of file +drawClickAnimation(); \ No newline at end of file diff --git a/animations/victory.js b/animations/victory.js index 23252a1..b3545d3 100644 --- a/animations/victory.js +++ b/animations/victory.js @@ -59,7 +59,7 @@ function drawVictory() { } } -function animate() { - requestAnimFrame(animate); +function animateVictory() { + requestAnimFrame(animateVictory); drawVictory(); } diff --git a/minesweeper.js b/minesweeper.js index 304d7ed..61e3b37 100644 --- a/minesweeper.js +++ b/minesweeper.js @@ -80,8 +80,6 @@ function animateTile(x, y, curWidth, curHeight, finalWidth, finalHeight, curRadi else curRadius = finalRadius; - // drawRoundedRect(ctx, x + 1, y + 1, finalWidth - 2, finalHeight - 2, finalRadius, getColor(x, y)); - drawRoundedRect(ctx, x + (finalWidth - curWidth) / 2, y + (finalHeight - curHeight) / 2, curWidth, curHeight, curRadius, color); requestAnimFrame(() => { @@ -258,10 +256,9 @@ function easeInOutCubic(t, b, c, d) { } function gameOverEvent() { - console.log("Game Over"); play = false; animateBackground(0, 0, canvas.width, canvas.height, 0, .75, new Date().getTime(), 200, {r: 0, g: 0, b: 0, a: 0}); - animateText("Game Over", fieldSize.x / 2, fieldSize.y / 2, 0, tileSize.y * 1.33, new Date().getTime(), 200, "orange", "Roboto", overlay2Ctx); + animateText("Game Over", fieldSize.x / 2 - .5, fieldSize.y / 2 - .5, 0, tileSize.y * 1.33, new Date().getTime(), 200, "orange", "Roboto", overlay2Ctx); } function getPosition(e) { @@ -367,7 +364,7 @@ function scaleCanvas() { } function tileClickEvent(x, y) { - if (gameOver) + if (gameOver || victory) return; console.log(x, y); uncoverTile(x, y); @@ -436,12 +433,13 @@ function victoryCheck() { } function victoryEvent() { - console.log("Win!"); - animate(); - play = false; - const fontSize = tileSize.y * 1.33; - animateBackground(0, 0, canvas.width, canvas.height, 0, .01, new Date().getTime(), 200, {r: 0, g: 0, b: 0, a: 0}); - animateText("Victory!", W / 2, H / 2 - fontSize / 2, 0, fontSize, new Date().getTime(), 200, "green", "Roboto", overlay2Ctx); + if(victory) { + animateVictory(); + play = false; + const fontSize = tileSize.y * 1.33; + animateBackground(0, 0, canvas.width, canvas.height, 0, .01, new Date().getTime(), 200, {r: 0, g: 0, b: 0, a: 0}); + animateText("Victory!", fieldSize.x / 2 - .5, fieldSize.y / 2 - .5, 0, fontSize, new Date().getTime(), 300, "green", "Roboto", overlay2Ctx); + } } Object.prototype.count = function (val) {