<<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>BouBoul Adventure</title>
<style>* { padding: 0; margin: 0; } canvas { background: #eee; display: block; margin: 0 auto; }</style>
</head>
<body>
<canvas id="myCanvas" width="960" height="640"></canvas>
<script>
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min +1)) + min;
}
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var droiteP = false;
var gaucheP = false;
var hautP = false;
var basP = false;
var balleR = 20;
var balleX = (canvas.width - balleR)/2;
var balleY = (canvas.height - balleR)/2;
var mX = getRandomIntInclusive(0, canvas.width);
var mY = 0;
var mR = 10;
var m = [1,2,3,4,5];
var nbM = 5;
document.addEventListener("keydown", keyDownHandler, false);
document.addEventListener("keyup", keyUpHandler, false);
function keyDownHandler(e) {
if(e.keyCode == 39) {
droiteP = true;
}
else if(e.keyCode == 37) {
gaucheP = true;
}
else if(e.keyCode == 40) {
basP = true;
}
else if(e.keyCode == 38) {
hautP = true;
}
}
function keyUpHandler(e) {
if(e.keyCode == 39) {
droiteP = false;
}
else if(e.keyCode == 37) {
gaucheP = false;
}
else if(e.keyCode == 40) {
basP = false;
}
else if(e.keyCode == 38) {
hautP = false;
}
}
function dessinMieux() {
for(var i=0;i<nbM;i++) {
// if (m.status == 1) {
var mieuxX = getRandomIntInclusive(1,canvas.width);
var mieuxY = 0;
m.x = mieuxX;
m.y = mieuxY;
ctx.beginPath();
ctx.arc(mieuxX, mieuxY, mR, 0, Math.PI*2);
// ctx.arc(0, 0, 10, 0, Math.PI*2);
ctx.fillStyle = "red";
ctx.fill();
ctx.closePath();
// }
}
}
function avancer(a) {
a++;
}
function trajectoireM() {
for (var i = 0;i<nbM;i++){
while (m.y < canvas.height) {
setInterval(avancer(m.y), 5);
}
}
}
function letest() {
var i = 1;
alert(m);
}
function dessinM() {
ctx.beginPath();
ctx.arc(mX, mY, mR, 0, Math.PI*2);
ctx.fillStyle = "#1123CC";
ctx.fill();
ctx.closePath();
}
function balleOPif() {
mX += getRandomIntInclusive(-20,20);
mY += getRandomIntInclusive(0,20);
}
function dessinR() {
ctx.beginPath();
ctx.arc(balleX, balleY, balleR, 0, Math.PI*2, false);
ctx.fillStyle = "#9745EE";
ctx.fill();
ctx.closePath();
}
// setInterval(balleOPif, 10);
function dessin() {
// letest();
ctx.clearRect(0, 0, canvas.width, canvas.height);
dessinR();
if(balleX > canvas.width-balleR || balleX < 0+balleR) {
document.location.reload();
alert("Perdu lol");
}
if(balleY > canvas.height-balleR || balleY < 0+balleR) {
document.location.reload();
alert("Perdu lol");
}
if (droiteP && balleX < canvas.width-balleR) {
balleX += 3;
}
else if (gaucheP && balleX > 0) {
balleX -= 3;
}
if (hautP && balleY < canvas.height-balleR) {
balleY -= 3;
}
else if (basP && balleY > 0) {
balleY += 3;
}
// dessinM();
dessinMieux();
trajectoireM();
/* if(mX > canvas.width || balleX < 0) {
mX = getRandomIntInclusive(1,canvas.width);
mY = -mY;
}
if(mY > canvas.height) {
mY = -mY;
}*/
}
setInterval(dessin, 20);
</script>
</body>
</html>
PS : faites pas gaffe, j'ai laissé plein de fonctions test qui ne sont pas appelées dans le main, elles ne servent à rien.
Merci d'avance
