2023-11-15 09:09:13 +01:00
|
|
|
class Input {
|
2023-12-07 18:53:44 +01:00
|
|
|
constructor(id, net,renderer, sound) {
|
2023-11-29 16:21:20 +01:00
|
|
|
this.keysDown = new Set()
|
|
|
|
this.dir = 0;
|
2023-11-29 17:50:21 +01:00
|
|
|
this.player=null;
|
2023-12-06 09:50:34 +01:00
|
|
|
this.bullets=null;
|
2023-11-15 09:09:13 +01:00
|
|
|
this.canvas = document.getElementById(id);
|
2023-12-06 09:50:34 +01:00
|
|
|
this.renderer=renderer;
|
2023-11-15 09:09:13 +01:00
|
|
|
|
|
|
|
this.mouseX = 0
|
|
|
|
this.mouseY = 0
|
|
|
|
|
2023-11-29 18:11:58 +01:00
|
|
|
this.network = net
|
|
|
|
|
2023-11-15 09:09:13 +01:00
|
|
|
// Event listener pour la position de la souris
|
2023-12-06 09:50:34 +01:00
|
|
|
|
|
|
|
this.canvas.addEventListener("mousemove", this.handleMouseMove.bind(this));
|
2023-11-15 09:09:13 +01:00
|
|
|
|
2023-12-06 09:50:34 +01:00
|
|
|
this.canvas.addEventListener("click", (e) => {
|
2023-12-06 19:49:59 +01:00
|
|
|
if(this.player==null || this.bullets==null){
|
2023-12-06 09:50:34 +01:00
|
|
|
return;
|
2023-12-06 19:49:59 +01:00
|
|
|
}
|
2023-12-07 22:31:50 +01:00
|
|
|
if(this.player.x>=2000 && this.player.y>=2000 && this.mouseX<2000 && this.mouseY<2000) {
|
|
|
|
this.mouseX=this.mouseX+2000;
|
|
|
|
this.mouseY=this.mouseY+2000;
|
|
|
|
}
|
|
|
|
|
2023-12-06 09:50:34 +01:00
|
|
|
let dx = this.mouseX-this.player.x;
|
|
|
|
let dy = this.mouseY-this.player.y;
|
2023-12-07 22:31:50 +01:00
|
|
|
|
2023-12-06 09:50:34 +01:00
|
|
|
let norm = Math.sqrt(dx*dx+dy*dy);
|
2023-12-07 18:53:44 +01:00
|
|
|
let b = new Bullet(this.player.x,this.player.y,dx/norm,dy/norm,this.player.id, sound);
|
2023-12-06 19:49:59 +01:00
|
|
|
|
2023-12-06 09:50:34 +01:00
|
|
|
this.bullets.push(b);
|
|
|
|
this.renderer.addBullet(b);
|
2023-12-06 10:40:08 +01:00
|
|
|
this.network.newBullet(b.x,b.y,b.dx,b.dy,b.parentId);
|
2023-11-15 09:09:13 +01:00
|
|
|
});
|
|
|
|
|
2023-11-29 16:21:20 +01:00
|
|
|
window.addEventListener("keydown", (e)=>{
|
|
|
|
this.keysDown.add(e.key.toLowerCase())
|
|
|
|
this.updateDir();
|
|
|
|
})
|
|
|
|
|
|
|
|
window.addEventListener("keyup", (e)=>{
|
|
|
|
this.keysDown.delete(e.key.toLowerCase())
|
|
|
|
this.updateDir();
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
updateDir(){
|
2023-11-29 17:50:21 +01:00
|
|
|
if(this.player==null)
|
|
|
|
return;
|
2023-11-29 18:01:11 +01:00
|
|
|
let oldDir=this.dir;
|
|
|
|
this.dir=0;
|
2023-12-06 08:58:18 +01:00
|
|
|
if(this.keysDown.has('z') || this.keysDown.has('arrowup')){
|
|
|
|
if(this.keysDown.has('d') || this.keysDown.has('arrowright')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 2;
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('s') || this.keysDown.has('arrowdown')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 0;
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('q') || this.keysDown.has('arrowleft')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 8;
|
|
|
|
}else{
|
|
|
|
this.dir = 1;
|
|
|
|
}
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('d') || this.keysDown.has('arrowright')){
|
|
|
|
if(this.keysDown.has('s') || this.keysDown.has('arrowdown')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 4;
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('q') || this.keysDown.has('arrowleft')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 0;
|
|
|
|
}else{
|
|
|
|
this.dir = 3;
|
|
|
|
}
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('s') || this.keysDown.has('arrowdown')){
|
|
|
|
if(this.keysDown.has('q') || this.keysDown.has('arrowLeft')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 6;
|
|
|
|
}else{
|
|
|
|
this.dir = 5;
|
|
|
|
}
|
2023-12-06 08:58:18 +01:00
|
|
|
}else if(this.keysDown.has('q') || this.keysDown.has('arrowleft')){
|
2023-11-29 16:21:20 +01:00
|
|
|
this.dir = 7;
|
|
|
|
}
|
2023-11-29 18:01:11 +01:00
|
|
|
if(oldDir!=this.dir)
|
|
|
|
{
|
2023-11-29 18:36:28 +01:00
|
|
|
this.player.changeDirection(this.dir);
|
|
|
|
this.network.update(this.player);
|
2023-11-29 18:01:11 +01:00
|
|
|
}
|
2023-11-29 16:21:20 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
get getDirection() {
|
|
|
|
return this.dir;
|
2023-11-15 09:09:13 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
handleMouseMove(event) {
|
|
|
|
let mX = event.clientX - this.canvas.getBoundingClientRect().left;
|
|
|
|
let mY = event.clientY - this.canvas.getBoundingClientRect().top;
|
2023-12-06 19:49:59 +01:00
|
|
|
this.mouseX = mX;
|
|
|
|
this.mouseY = mY;
|
2023-11-15 09:09:13 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
calculateAngle(playerX, playerY) {
|
2023-12-06 19:49:59 +01:00
|
|
|
return Math.atan2(this.mouseY - playerY, this.mouseX - playerX);
|
2023-11-15 09:09:13 +01:00
|
|
|
}
|
|
|
|
}
|