|
|
@@ -0,0 +1,140 @@
|
|
|
+// Variables
|
|
|
+ var posY, pos1, pos2, posX;
|
|
|
+ var wSize, hSize;
|
|
|
+ var dim;
|
|
|
+ var bulletX, bulletY, bulletAcc = 0;
|
|
|
+ var text = "Esquive !!!";
|
|
|
+ var nbVague = 0;
|
|
|
+ var division = 1;
|
|
|
+
|
|
|
+//Fonctions de redimensionnement
|
|
|
+function dimensionner() {
|
|
|
+
|
|
|
+ if( typeof( window.innerHeight ) == 'number' )
|
|
|
+ hSize = window.innerHeight;
|
|
|
+ else if( document.documentElement && document.documentElement.clientHeight )
|
|
|
+ hSize = document.documentElement.clientHeight;
|
|
|
+
|
|
|
+ if( typeof( window.innerWidth ) == 'number' )
|
|
|
+ wSize = window.innerWidth;
|
|
|
+ else if( document.documentElement && document.documentElement.clientWidth )
|
|
|
+ wSize = document.documentElement.clientHeight;
|
|
|
+
|
|
|
+ document.getElementById("canvas").height = hSize;
|
|
|
+ document.getElementById("canvas").width = wSize;
|
|
|
+
|
|
|
+ // Etalonnage
|
|
|
+ pos1 = hSize/4;
|
|
|
+ pos2 = 3*hSize/4;
|
|
|
+ dim = hSize / 8;
|
|
|
+ posX = wSize / 4;
|
|
|
+ division = wSize / 2000;
|
|
|
+
|
|
|
+ // Réinitialisation
|
|
|
+ posY = pos2;
|
|
|
+ bulletX = wSize-dim/2;
|
|
|
+ bulletY = pos1;
|
|
|
+}
|
|
|
+
|
|
|
+// Fonctions
|
|
|
+function clear() {
|
|
|
+ context.fillStyle = "black";
|
|
|
+ context.clearRect(0, 0, wSize, hSize);
|
|
|
+ context.fillRect(0, 0, wSize-dim/2, hSize-dim/2);
|
|
|
+}
|
|
|
+
|
|
|
+function drawPic(x, y) {
|
|
|
+ context.fillStyle = "rgb(23, 167, 67)";
|
|
|
+ context.beginPath();
|
|
|
+ context.moveTo(x, y);// 1er point
|
|
|
+ context.lineTo(x-dim, y+dim);// 2e point
|
|
|
+ context.lineTo(x-2*dim, y+dim);// 3e
|
|
|
+ context.lineTo(x-2*dim, y-dim);// 4e
|
|
|
+ context.lineTo(x-dim, y-dim);// 5e
|
|
|
+ context.closePath();
|
|
|
+ context.fill();
|
|
|
+}
|
|
|
+
|
|
|
+function drawBullet(x, y) {
|
|
|
+ if (bulletY == pos1) context.fillStyle = "rgb(223, 0, 182)";
|
|
|
+ else context.fillStyle = "rgb(223, 182, 0)";
|
|
|
+
|
|
|
+ context.beginPath();
|
|
|
+ context.moveTo(x, y-dim);// 1er point
|
|
|
+ context.lineTo(x+dim, y);// 2e point
|
|
|
+ context.lineTo(x, y+dim);// 3e
|
|
|
+ context.lineTo(x-dim, y);// 4e
|
|
|
+ context.closePath();
|
|
|
+ context.fill();
|
|
|
+}
|
|
|
+
|
|
|
+function drawText(x, y, text) {
|
|
|
+ context.font = "bold 32pt Calibri, Geneva, Arial";
|
|
|
+ context.fillStyle = "#fff";
|
|
|
+ context.fillText(text, x, y);
|
|
|
+}
|
|
|
+
|
|
|
+// Gestion des évènements
|
|
|
+ // Variation de tailles
|
|
|
+ window.onload = function(){ dimensionner() };
|
|
|
+ window.onresize = function(){ dimensionner() };
|
|
|
+
|
|
|
+ // Actions
|
|
|
+ function jump() {
|
|
|
+ posY = pos1;
|
|
|
+ }
|
|
|
+ function down() {
|
|
|
+ posY = pos2;
|
|
|
+ }
|
|
|
+
|
|
|
+ // Ordi
|
|
|
+ document.addEventListener('mousedown', function(e) {
|
|
|
+ jump();
|
|
|
+ }, false);
|
|
|
+ document.addEventListener('mouseup', function(e) {
|
|
|
+ down();
|
|
|
+ }, false);
|
|
|
+
|
|
|
+ // Smartphone
|
|
|
+ document.addEventListener('touchstart', function(e) {
|
|
|
+ jump();
|
|
|
+ }, false);
|
|
|
+ document.addEventListener('touchend', function(e) {
|
|
|
+ down();
|
|
|
+ }, false);
|
|
|
+
|
|
|
+// Propriétés
|
|
|
+var canvas = document.querySelector('#canvas');
|
|
|
+var context = canvas.getContext('2d');
|
|
|
+
|
|
|
+// Main
|
|
|
+function mainLoop() {
|
|
|
+ //Nettoyage
|
|
|
+ clear();
|
|
|
+
|
|
|
+ //Ennemi
|
|
|
+ bulletX -= bulletAcc;
|
|
|
+ bulletAcc *= 0.99;
|
|
|
+ if (bulletX < posX) {
|
|
|
+ if (bulletY == posY) { //Touché !
|
|
|
+ text = "Game Over";
|
|
|
+ }
|
|
|
+ else if (text != "Game Over") { //Retire
|
|
|
+ nbVague++;
|
|
|
+ bulletX = wSize-dim/2;
|
|
|
+ if (Math.floor(Math.random()*2) == 1) bulletY = pos1;
|
|
|
+ else bulletY = pos2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ bulletAcc += division;
|
|
|
+ }
|
|
|
+
|
|
|
+ //Affichage
|
|
|
+ drawPic(posX, posY);
|
|
|
+ drawBullet(Math.ceil(bulletX), bulletY);
|
|
|
+ drawText(2, 34, text + " Vague n°" + nbVague);
|
|
|
+}
|
|
|
+
|
|
|
+//Loop
|
|
|
+setInterval(mainLoop, 20);
|
