From 623b687a52ecb419f944c523929c5a437bde5afd Mon Sep 17 00:00:00 2001 From: Atsuyo-INSA Date: Wed, 6 Dec 2023 09:50:34 +0100 Subject: [PATCH] bullets --- js/class.js | 19 +++++++++---------- js/game.js | 46 +++++++++++++++++++++++++++++++++++++++------- js/input.js | 19 +++++++++++++++---- js/network.js | 17 ++++++++++++++++- js/render.js | 35 ++++++++++++++++++++++++++++++----- 5 files changed, 109 insertions(+), 27 deletions(-) diff --git a/js/class.js b/js/class.js index cfd02a3..fac577c 100644 --- a/js/class.js +++ b/js/class.js @@ -2,6 +2,7 @@ let mapWidth = 210.; let mapHeith = 100.; const playerSize = 50.; const playerSpeed=.2; +const bulletSpeed=playerSpeed*2; const halfSqrtTwo=0.70710678118; class Player { @@ -118,12 +119,12 @@ class Bullet this.deleted=false; } - update() + update(dt) { if(!this.deleted) { - this.x+=this.dx; - this.y+=this.dy; + this.x+=this.dx*dt*bulletSpeed; + this.y+=this.dy*dt*bulletSpeed; } } @@ -131,30 +132,28 @@ class Bullet { if(!this.deleted) { - if(dist(player,this) { if(square.collide(this)) { this.deleted=true; return; } - } + }); - for(let circle in circles) - { + circles.forEach((circle) => { if(circle.collide(this)) { this.deleted=true; return; } - } + }); } } diff --git a/js/game.js b/js/game.js index 67bd770..1a452a3 100644 --- a/js/game.js +++ b/js/game.js @@ -16,9 +16,11 @@ let Net = new Network("ws://129.151.227.50:8080?name="+CookiePseudo(), Renderer) let playerId = null; //id of client player let players = []; +let bullets = []; +let selfBullets = []; let player = null; -Inp = new Input("canvas", Net); +Inp = new Input("canvas", Net,Renderer); playerId=Net.playerId; player=Net.clientPlayer; @@ -52,10 +54,10 @@ function addPlayers() let playersToAdd = Net.getPlayersToAdd(); if (playersToAdd.length==0) return; - + console.log(playersToAdd); playersToAdd.forEach((p) => { - console.log("New player: ",playersToAdd[0].id); - players.push(playersToAdd[0]); + console.log("New player: ",p.id); + players.push(p); Renderer.AddPlayer(p); }); } @@ -81,6 +83,32 @@ function remPlayers() } } +function addBullets() +{ + let bulletsToAdd = Net.getBulletsToAdd(); + if (bulletsToAdd.length==0) + return; + bulletsToAdd.forEach((b) => { + console.log("new bullet"); + bullets.push(p); + Renderer.addBullet(p); + }); +} + +function updateBullets(list,target,dt) +{ + for(let i = list.length-1;i>=0;i--) + { + list[i].update(dt); + list[i].checkCollisions(target,squares,circles); + if(list[i].deleted) + { + list.splice(i,1); + Renderer.remBullet(list[i]); + } + } +} + let currentTime = new Date(); function game() { if(playerId==null) @@ -93,6 +121,7 @@ function game() { //Inp.player=player; //pour connecter les input au joueur client console.log("Connected as id ",playerId); Inp.player=player; + Inp.bullets=selfBullets; Renderer.AddPlayer(player) players.forEach((p) => { Renderer.AddPlayer(p) @@ -104,19 +133,22 @@ function game() { update(); addPlayers(); remPlayers(); + addBullets(); player.update(squares, circles, dt); for (var i = players.length - 1; i >= 0; i--) { - players[i].update(squares, circles, dt);//squares, circles + players[i].update(squares, circles, dt); } Renderer.ReloadAff(); + updateBullets(selfBullets,null,dt); + updateBullets(bullets,player,dt); } let newTime = new Date(); dt=newTime - currentTime; - currentTime=newTime + currentTime=newTime; } Net.connect(); //connect to server, create a player, and retrieve all players info -setInterval(game) \ No newline at end of file +setInterval(game); \ No newline at end of file diff --git a/js/input.js b/js/input.js index 5745a7c..35adc66 100644 --- a/js/input.js +++ b/js/input.js @@ -1,9 +1,11 @@ class Input { - constructor(id, net) { + constructor(id, net,renderer) { this.keysDown = new Set() this.dir = 0; this.player=null; + this.bullets=null; this.canvas = document.getElementById(id); + this.renderer=renderer; this.mouseX = 0 this.mouseY = 0 @@ -11,10 +13,19 @@ class Input { this.network = net // Event listener pour la position de la souris - this.canvas.addEventListener("mousemove", this.handleMouseMove.bind(this)) + + this.canvas.addEventListener("mousemove", this.handleMouseMove.bind(this)); - this.canvas.addEventListener("click", function(event) { - console.log("Clic de la souris"); + this.canvas.addEventListener("click", (e) => { + if(this.player==null || this.bullets==null) + return; + let dx = this.mouseX-this.player.x; + let dy = this.mouseY-this.player.y; + let norm = Math.sqrt(dx*dx+dy*dy); + let b = new Bullet(this.player.x,this.player.x,dx/norm,dy/norm); + this.bullets.push(b); + this.renderer.addBullet(b); + this.network.newBullet(this.player.x,this.player.y,dx/norm,dy/norm); }); /*window.addEventListener("keydown", function(event) { diff --git a/js/network.js b/js/network.js index 153395d..6904ab0 100644 --- a/js/network.js +++ b/js/network.js @@ -8,6 +8,7 @@ class Network{ this.playersToAdd = []; this.playersToRemove = []; this.playersToUpdate = []; + this.bulletsToAdd = []; } message(data){ @@ -33,6 +34,9 @@ class Network{ case "removePlayer": this.playersToRemove.push(data.data.id); break; + case "newBullet": + this.bulletsToAdd.push(new Bullet(data.x,data.y,data.dx,data.dy)); + break; default: break; } @@ -52,7 +56,12 @@ class Network{ this.socket.send(JSON.stringify({ type: "update", data: obj - })) + })); + } + + newBullet(x_,y_,dx_,dy_) + { + this.socket.send(JSON.stringify({type:"newBullet",x: x_,y: y_,dx: dx_,dy: dy_})); } getPlayersToAdd(){ //returns the list of new players @@ -61,6 +70,12 @@ class Network{ return tmp; } + getBulletsToAdd(){ //returns the list of new players + let tmp = this.bulletsToAdd; + this.bulletsToAdd = []; + return tmp; + } + getPlayersToRemove(){ //returns the list of player who have left the game let tmp = this.playersToRemove; this.playersToRemove = []; diff --git a/js/render.js b/js/render.js index 5f77680..d61d411 100644 --- a/js/render.js +++ b/js/render.js @@ -1,13 +1,15 @@ -const img = new Image(); -img.src = "./assets/body.png"; - +const imgPlayer = new Image(); +const imgBullet = new Image(); +imgPlayer.src = "./assets/body.png"; +imgBullet.src = "./assets/body.png"; class Render { constructor(id, mapsrc) { this.canvas = document.getElementById(id); this.ctx = canvas.getContext("2d"); this.players = []; - this.mapsrc=mapsrc + this.bullets = []; + this.mapsrc=mapsrc; this.ReloadAff(); } @@ -15,6 +17,16 @@ class Render { this.players.push(player); } + addBullet(bullet) { + this.bullets.push(bullet); + } + + remBullet(bullet) { + for(let i=0;i { this.RenderPlayer(player); }) + this.bullets.forEach((bullet) => { + this.RenderBullet(bullet); + }); } } \ No newline at end of file