diff --git a/client/src/main.js b/client/src/main.js index 21b464cdfa3b7abe151af3f1e7a51c82bddcd48a..1ea271e5773867a53dd5aee1febbcb577e050a2e 100644 --- a/client/src/main.js +++ b/client/src/main.js @@ -78,6 +78,7 @@ function afficherFinDePartie() { function startGame(event) { gameStarted = true; + socket.emit('start', gameStarted); event.preventDefault(); canvas.style.display = ''; document.querySelector('.divMain').innerHTML = setHtml.vide(); @@ -86,6 +87,10 @@ function startGame(event) { socket.emit('canvasSize', canvasSize); } +setInterval(() => { + socket.emit('start', gameStarted); +}, 1000 / 16); + const canvasResizeObserver = new ResizeObserver(() => resampleCanvas()); canvasResizeObserver.observe(canvas); @@ -144,27 +149,46 @@ function render() { context.drawImage(imageProjectile, projectile.x, projectile.y); }); } - } - socket.on('enemis', data => { - newEnemis = data; - }); - newEnemis.forEach(enemi => { - if (enemi.difficulté == 1) { - draw(canvas, context, imageEnemi, enemi.x, enemi.y); - } else if (enemi.difficulté == 2) { - draw(canvas, context, imageEnemi2, enemi.x, enemi.y); + for (let avatarId in avatars) { + context.drawImage(avatar.image, avatars[avatarId].x, avatars[avatarId].y); + if (avatars[avatarId].projectiles != undefined) { + avatars[avatarId].projectiles.forEach(projectile => { + context.drawImage(imageProjectile, projectile.x, projectile.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('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 => { + if (enemi.difficulté == 1) { + draw(canvas, context, imageEnemi, enemi.x, enemi.y); + } else if (enemi.difficulté == 2) { + draw(canvas, context, imageEnemi2, enemi.x, enemi.y); + } + }); + socket.on('bonusArray', data => { + newBonus = data; + }); + newBonus.forEach(bonus => { + console.log(bonus); + let img = new Image(); + img.src = bonusImages[bonus.choix]; + img.width = 75; + img.height = 75; + draw(canvas, context, img, bonus.x, bonus.y); + }); + } requestAnimationFrame(render); }