console.log("Skibidi");

let canvas = document.getElementById('scene');
let ctx = canvas.getContext("2d");


let resizeCanvas = () => {
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;  
}
resizeCanvas()


let onResize = (event) => {
  resizeCanvas()
}

window.addEventListener('resize', onResize);

class P1 {
  constructor(x, y, s) {
    this.pos = {
      x: x,
      y: y
    }
    this.size = s
    this.vx = 10
    this.vy = 10
    this.img = new Image();
    this.img.onload = () => {
      this.draw();
    };
    this.img.src = "/images/P2test.png";
    console.log("img", this.img.src);  
  }

  draw() {
    ctx.drawImage(this.img, this.pos.x, this.pos.y, this.size, this.size);
  }


}

let p1 = [];
let monP1;
function createP1() {
  monP1 = new P1(
    canvas.width/5,
    canvas.height-300,
    300
  );
  monP1.draw() ; 
  p1.push(monP1);
}

createP1();
console.log("localisation P1", monP1);
/* console.log('est tu la ?', createP1); */

class P2 {
  constructor(x, y, s) {
    this.pos = {
      x: x,
      y: y
    }
    this.size = s
    this.img = new Image();
    this.img.onload = () => {
      this.draw();
    };
    this.img.src = "/images/P2test.png";
    console.log("img", this.img.src);  
  }

  draw() {
    ctx.drawImage(this.img, this.pos.x, this.pos.y, this.size, this.size);
  }
}

let p2 = [];
let monP2;
function createP2() {
  monP2 = new P2(
    canvas.width/5*4,
    canvas.height-300,
    300
  );
  monP2.draw() ; 
  p2.push(monP2);
}

createP2();


/* let touche = () => {
  let dist = Math.sqrt(
    Math.pow(P2.pos.x - P1.pos.x, 2)
  );
  if(dist < P1.size+P2.size){
    console.log("ça touche hehheheheheh");
  }
} */

window.addEventListener("keydown", (event) => {
  if (event.key === "ArrowLeft") {
    monP1.pos.x -= monP1.vx
    console.log("gauche");
  }

  if (event.key === "ArrowRight") {
    monP1.pos.x += monP1.vx
    console.log("droite");
  }
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  monP1.draw();
  monP2.draw();
  /* touche(); */
  let dist = Math.sqrt(
    Math.pow(monP2.pos.x - monP1.pos.x, 2),
    Math.pow(monP2.pos.y - monP1.pos.y, 2)
  );
  if(dist < monP1.size-250+monP2.size-200){
    console.log("ça touche hehheheheheh");
    location.href = "/home/diag";
  }
});