diff --git a/client/public/index.html b/client/public/index.html
index fa95e77f4090b01ac7fc74e47fbeeeddc76a309f..abdd4086a1042b1e1130750682a72ec82ba029a1 100644
--- a/client/public/index.html
+++ b/client/public/index.html
@@ -21,7 +21,7 @@
<div class="divMain">
<h1>ça geek</h1>
<button class="buttonStart">Play</button>
- <button class="ScoreBoard">ScoreBoard</button>
+ <button class="scoreBoard">ScoreBoard</button>
<button class="credits">Credits</button>
</section>
</div>
diff --git a/client/src/main.js b/client/src/main.js
index 590aa6da6241bf43890fe6ac42f82788d14a4da2..5c360d9e4f3c4f8795eeff1f465e18729373b59e 100644
--- a/client/src/main.js
+++ b/client/src/main.js
@@ -47,6 +47,37 @@ setInterval(function () {
document.querySelector('.buttonStart').addEventListener('click', startGame);
document.querySelector('.credits').addEventListener('click', afficherCredits);
+/*document
+ .querySelector('.scoreBoard')
+ .addEventListener('click', afficherScoreboard);
+
+let scoreBoard = '';
+fetch('./scoreboard.json')
+ .then(response => {
+ if (!response.ok) {
+ throw new Error('Erreur lors de la récupération du fichier JSON');
+ }
+ return response.json();
+ })
+ .then(data => {
+ const score = data.results;
+ score.forEach(element => {
+ scoreBoard += 'Nom: ' + element.nom;
+ scoreBoard += ' Score: ' + element.score;
+ scoreBoard += '</br></br>';
+ });
+ })
+ .catch(error => {
+ scoreBoard += error.message;
+ });
+
+function afficherScoreboard(event) {
+ event.preventDefault();
+ document.querySelector('.divMain').innerHTML = scoreBoard;
+ const retour = document.querySelector('.retourMenu');
+ retour.addEventListener('click', afficherMenu);
+}*/
+
function afficherCredits(event) {
event.preventDefault();
document.querySelector('.divMain').innerHTML = setHtml.credits();
@@ -116,40 +147,33 @@ let newBonus = [];
function render() {
context.clearRect(0, 0, canvas.width, canvas.height);
context.drawImage(background, 0, 0, canvas.width, canvas.height);
- context.font = '40pt New Super Mario Font U';
- for (let i = 1; i < avatars.length; i++) {
- if (avatars[i] != undefined) {
- context.fillStyle = colors[i - 1];
- const x = 10 + i * 100;
- if (avatars[i].score != undefined) {
- context.fillText(avatars[i].score, x, 50);
- }
- imageCoeur.src = `/images/heart${i}.webp`;
- console.log(imageCoeur.src);
- for (let j = 0; j < avatars[i].vies; j++) {
- context.drawImage(
- imageCoeur,
- avatars[i].x + (avatars[i].vies - j) * 20 - 15,
- avatars[i].y + imageMortier.height,
- 20,
- 20
- );
+ if (gameStarted) {
+ context.font = '40pt New Super Mario Font U';
+ for (let i = 1; i < avatars.length; i++) {
+ if (avatars[i] != undefined) {
+ context.fillStyle = colors[i - 1];
+ const x = 10 + i * 100;
+ if (avatars[i].score != undefined) {
+ context.fillText(avatars[i].score, x, 50);
+ }
+ imageCoeur.src = `/images/heart${i}.webp`;
+ console.log(imageCoeur.src);
+ for (let j = 0; j < avatars[i].vies; j++) {
+ context.drawImage(
+ imageCoeur,
+ avatars[i].x + (avatars[i].vies - j) * 20 - 15,
+ avatars[i].y + imageMortier.height,
+ 20,
+ 20
+ );
+ }
}
}
- }
- context.fillStyle = 'blue';
+ context.fillStyle = 'blue';
- context.fillText(0 + ':' + min + ':' + sec, canvas.width / 2, 50);
+ context.fillText(0 + ':' + min + ':' + sec, canvas.width / 2, 50);
- for (let avatarId in avatars) {
- Render.renderProjectile(
- context,
- avatar,
- avatars,
- avatarId,
- imageProjectile
- );
for (let avatarId in avatars) {
Render.renderProjectile(
context,
@@ -158,43 +182,52 @@ function render() {
avatarId,
imageProjectile
);
+ for (let avatarId in avatars) {
+ Render.renderProjectile(
+ context,
+ avatar,
+ avatars,
+ avatarId,
+ imageProjectile
+ );
+ }
+ socket.on('bonusArray', data => {
+ newBonus = data;
+ });
+ newBonus.forEach(bonus => {
+ let img = new Image();
+ img.src = bonusImages[bonus.choix];
+ img.width = 75;
+ img.height = 75;
+ draw(canvas, context, img, bonus.x, bonus.y);
+ });
+ socket.on('enemis', data => {
+ newEnemis = data;
+ });
+ newEnemis.forEach(enemi => {
+ Render.renderEnnemi(
+ canvas,
+ context,
+ imageEnemi,
+ imageEnemi2,
+ enemi.x,
+ enemi.y,
+ enemi
+ );
+ });
+ socket.on('bonusArray', data => {
+ newBonus = data;
+ });
+ newBonus.forEach(bonus => {
+ Render.renderBonus(
+ canvas,
+ context,
+ bonusImages[bonus.choix],
+ bonus.x,
+ bonus.y
+ );
+ });
}
- socket.on('bonusArray', data => {
- newBonus = data;
- });
- newBonus.forEach(bonus => {
- let img = new Image();
- img.src = bonusImages[bonus.choix];
- img.width = 75;
- img.height = 75;
- draw(canvas, context, img, bonus.x, bonus.y);
- });
- socket.on('enemis', data => {
- newEnemis = data;
- });
- newEnemis.forEach(enemi => {
- Render.renderEnnemi(
- canvas,
- context,
- imageEnemi,
- imageEnemi2,
- enemi.x,
- enemi.y,
- enemi
- );
- });
- socket.on('bonusArray', data => {
- newBonus = data;
- });
- newBonus.forEach(bonus => {
- Render.renderBonus(
- canvas,
- context,
- bonusImages[bonus.choix],
- bonus.x,
- bonus.y
- );
- });
}
requestAnimationFrame(render);
diff --git a/client/src/scoreboard.json b/client/src/scoreboard.json
new file mode 100644
index 0000000000000000000000000000000000000000..b0486a39b78a0aeef67674469994b2b16643b751
--- /dev/null
+++ b/client/src/scoreboard.json
@@ -0,0 +1,17 @@
+{
+ "results": [
+ {
+ "nom": "Joueur 1",
+ "score": 100
+ },
+ {
+ "nom": "Joueur 2",
+ "score": 200
+ },
+ {
+ "nom": "Joueur 3",
+ "score": 150
+ }
+ ]
+ }
+
\ No newline at end of file
diff --git a/server/index.js b/server/index.js
index c3f5e1e139a77bdcb4d86dc19e852abec89f90c5..1a6da4abdc1b194c68d1a076edc4fee0abcd8043 100644
--- a/server/index.js
+++ b/server/index.js
@@ -15,6 +15,7 @@ let canvasSize = new Coordinate(1920, 1261);
let canLostLifeAvatar = true;
let canLostLifeEnemi = true;
+let gameStarted = false;
let t = new timer();
@@ -32,8 +33,12 @@ httpServer.listen(port, () => {
});
setInterval(function () {
- t.addTime();
- io.emit('timer', t.getMin(), t.getSec());
+ if (gameStarted) {
+ t.addTime();
+ io.emit('timer', t.getMin(), t.getSec());
+ } else {
+ t = new timer();
+ }
}, 1000);
const avatars = [];
@@ -63,6 +68,14 @@ io.on('connection', socket => {
console.log(`Déconnexion du client ${socket.id}`);
});
+ socket.on('start', s => {
+ if (s == true && cpt != 0) {
+ gameStarted = s;
+ } else if (cpt == 0) {
+ gameStarted = false;
+ }
+ });
+
socket.on('clickEvent', clickEvent => {
const playerAvatar = avatars.find(avatar => avatar.nom === clickEvent.id);
if (playerAvatar) {
@@ -96,43 +109,45 @@ io.on('connection', socket => {
});
let spawnIntervalLV1 = setInterval(() => {
- if (t.getSec() >= 10) {
- LVL2start = true;
- }
+ if (gameStarted) {
+ if (t.getMin() >= 1) {
+ LVL2start = true;
+ }
- let randomY = Math.random() * (canvasSize.height - 0) + 0;
- do {
- randomY = Math.random() * (canvasSize.height - 0) + 0;
- } while (randomY > canvasSize.height - 57);
- const newEnemy = new enemi(canvasSize.width, randomY, 0, 1);
- enemis.push(newEnemy);
+ let randomY = Math.random() * (canvasSize.height - 0) + 0;
+ do {
+ randomY = Math.random() * (canvasSize.height - 0) + 0;
+ } while (randomY > canvasSize.height - 57);
+ const newEnemy = new enemi(canvasSize.width, randomY, 0, 1);
+ enemis.push(newEnemy);
+ }
}, 1000);
let spawnIntervalLV2 = setInterval(() => {
- if (LVL2start) {
+ if (LVL2start && gameStarted) {
let randomY = Math.random() * (canvasSize.height - 0) + 0;
do {
randomY = Math.random() * (canvasSize.height - 0) + 0;
} while (randomY > canvasSize.height - 100);
const newEnemy = new enemi(canvasSize.width - 100, randomY, 1, 2);
- newEnemy.setVx(10);
- newEnemy.setVy(4);
enemis.push(newEnemy);
}
}, 800);
let spawnBonusInterval = setInterval(() => {
- let randomX;
- let randomY;
- const choix = Math.floor(Math.random() * bonusNoms.length);
- do {
- randomY = Math.random() * (canvasSize.height - 0) + 0;
- } while (randomY > canvasSize.height - 75);
- do {
- randomX = Math.random() * (canvasSize.width - 0) + 0;
- } while (randomX > canvasSize.width - 75);
- const bonus = new Bonus(choix, 1, randomX, randomY, t.getTotalTime());
- bonusArray.push(bonus);
+ if (gameStarted) {
+ let randomX;
+ let randomY;
+ const choix = Math.floor(Math.random() * bonusNoms.length);
+ do {
+ randomY = Math.random() * (canvasSize.height - 0) + 0;
+ } while (randomY > canvasSize.height - 75);
+ do {
+ randomX = Math.random() * (canvasSize.width - 0) + 0;
+ } while (randomX > canvasSize.width - 75);
+ const bonus = new Bonus(choix, 1, randomX, randomY, t.getTotalTime());
+ bonusArray.push(bonus);
+ }
}, 15000);
setInterval(() => {