126 lines
2.2 KiB
JavaScript
126 lines
2.2 KiB
JavaScript
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";
|
|
}
|
|
}); |