diff --git a/client/src/avatar.js b/client/src/avatar.js index bfb2d49d3acab84df5cfa1473a57d37ebb66da4c..3ed74c8b995df3fa3e3ebf4ce7987c0696d4c983 100644 --- a/client/src/avatar.js +++ b/client/src/avatar.js @@ -38,6 +38,10 @@ export class Avatar extends Entite { this.score -= nb; } + getScore() { + return this.score; + } + tirer() { let projectile = new Projectile(this.x, this.y); this.projectiles.push(projectile); diff --git a/client/src/main.js b/client/src/main.js index 46c4e3e47d6392d07a1dfb5fbba31f16d6b53192..21b464cdfa3b7abe151af3f1e7a51c82bddcd48a 100644 --- a/client/src/main.js +++ b/client/src/main.js @@ -5,7 +5,7 @@ import timer from '../../server/timer.js'; import setHtml from './setHtml.js'; import draw from './draw.js'; import { Coordinate } from './Coordinate.js'; -import { bonusImages } from './choixBonus.js'; +import { bonusImages, colors } from './utils.js'; import Bonus from '../../server/bonus.js'; const socket = io(); @@ -116,16 +116,24 @@ let newEnemis = []; let newBonus = []; function render() { - console.log(sec); 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'; + let vies = 0; + for (let i = 1; i < avatars.length; i++) { + if (avatars[i] != undefined) { + context.fillStyle = colors[i - 1]; + const x = 10 + i * 60; + context.fillText(avatars[i].score, x, 50); + vies += avatars[i].vies; + } + } + context.fillStyle = 'blue'; - context.fillText(avatar.getScore(), 10, 50); + context.fillText(0 + ':' + min + ':' + sec, canvas.width / 2, 50); - for (let i = 0; i < avatar.getVies(); i++) { + for (let i = 0; i < vies; i++) { context.drawImage(imageCoeur, canvas.width - (3 - i) * 50, 0, 50, 50); } @@ -151,7 +159,6 @@ function render() { newBonus = data; }); newBonus.forEach(bonus => { - console.log(bonus); let img = new Image(); img.src = bonusImages[bonus.choix]; img.width = 75; @@ -174,11 +181,15 @@ socket.on('avatarsData', avatarData => { avatars[data.id].x = data.x; avatars[data.id].y = data.y; avatars[data.id].projectiles = data.projectiles; + avatars[data.id].vies = data.vies; + avatars[data.id].score = data.score; } else { avatars[data.id] = { x: data.x, y: data.y, projectiles: data.projectiles, + vies: data.vies, + score: data.score, }; } }); @@ -212,4 +223,3 @@ document.addEventListener('keyup', event => { event.preventDefault(); }); -console.log(canvas.width); diff --git a/client/src/choixBonus.js b/client/src/utils.js similarity index 69% rename from client/src/choixBonus.js rename to client/src/utils.js index 78c45294c0ea4bbd222c748b4ed8f5df63eb6ff4..9927cec545b116e0e5444fb5babdd02015a5f703 100644 --- a/client/src/choixBonus.js +++ b/client/src/utils.js @@ -1,3 +1,4 @@ export const bonusNoms = ['vie', 'invincibilite']; export const bonusImages = ['/images/vie.webp', '/images/vie.png']; export const bonusTaille = [1, 5]; +export const colors = ['#be0027', '#371777', '#2c9f45', '#cf8d2e']; diff --git a/server/index.js b/server/index.js index 23577dda72b0fab6aa16462aab0122189027770c..b075ad7dba1f507fea0d4cf56533121fcc1b6499 100644 --- a/server/index.js +++ b/server/index.js @@ -7,11 +7,7 @@ import enemi from './enemis.js'; import { Coordinate } from '../client/src/Coordinate.js'; import timer from './timer.js'; import Bonus from './bonus.js'; -import { - bonusImages, - bonusNoms, - bonusTaille, -} from '../client/src/choixBonus.js'; +import { bonusImages, bonusNoms, bonusTaille } from '../client/src/utils.js'; const app = express(); @@ -196,6 +192,8 @@ setInterval(() => { x: avatar.getX(), y: avatar.getY(), projectiles: avatar.projectiles, + vies: avatar.getVies(), + score: avatar.getScore(), }); bonusArray.forEach(bonus => { if (bonus.hitbox.colision(avatar.hitbox)) {