Partie 1: Premier Code : DinoCube

Variables Globales

let canvas;
let ctx;
let dino;
let obstacles = [];
let birds = [];
let intervalId;
let score = 0;
let gravity = 0.6;
            

Fonctions de Jeu

function startGame() {
  canvas = document.getElementById("canvas");
  ctx = canvas.getContext("2d");
  dino = new Dino();
  intervalId = setInterval(updateGameArea, 20);
  document.addEventListener("keydown", jump);
}

function updateGameArea() {
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  dino.update();
  updateObstacles();
  updateBirds();
  checkGameOver();
  updateScore();
}
            

Classes et Méthodes

function Dino() {
  this.x = 50;
  this.y = 0;
  this.width = 50;
  this.height = 50;
  this.velocityY = 0;
  this.jumping = false;

  this.update = function() {
    this.velocityY += gravity;
    this.y += this.velocityY;

    if (this.y > canvas.height - this.height) {
      this.y = canvas.height - this.height;
      this.jumping = false;
    }

    this.draw();
  };

  this.jump = function() {
    if (!this.jumping) {
      this.velocityY = -12;
      this.jumping = true;
    }
  };

  this.draw = function() {
    ctx.fillStyle = "black";
    ctx.fillRect(this.x, this.y, this.width, this.height);
  };
}

function Obstacle() {
  this.width = 20;
  this.height = Math.random() * 60 + 20;
  this.x = canvas.width;
  this.y = canvas.height - this.height;
  this.speedX = -15;

  this.update = function() {
    this.x += this.speedX;
    this.draw();
  };

  this.draw = function() {
    ctx.fillStyle = "red";
    ctx.fillRect(this.x, this.y, this.width, this.height);
  };
}

function Bird() {
  this.width = 30;
  this.height = 20;
  this.x = canvas.width;
  this.y = Math.random() * (canvas.height - this.height * 2); // aleatoire dans le ciel 
  this.speedX = -15;

  this.update = function() {
    this.x += this.speedX;
    this.draw();
  };

  this.draw = function() {
    ctx.fillStyle = "blue";
    ctx.fillRect(this.x, this.y, this.width, this.height);
  };
}
            

Fonctions Utilitaires

function jump(event) {
  if (event.keyCode === 32) {
    dino.jump();
  }
}

function updateObstacles() {
  if (Math.random() < 0.01) {
    obstacles.push(new Obstacle());
  }

  for (let i = 0; i < obstacles.length; i++) {
    obstacles[i].update(); 
  }

  if (obstacles.length > 0 && obstacles[0].x + obstacles[0].width < 0) {
    obstacles.shift();
    score++;
  }
}

function updateBirds() {
  if (Math.random() < 0.005) {
    birds.push(new Bird());
  }

  for (let i = 0; i < birds.length; i++) {
    birds[i].update();
  }

  if (birds.length > 0 && birds[0].x + birds[0].width < 0) {
    birds.shift();
  }
}

function checkGameOver() {
  for (let i = 0; i < obstacles.length; i++) {
    if (
      dino.x < obstacles[i].x + obstacles[i].width &&
      dino.x + dino.width > obstacles[i].x &&
      dino.y < obstacles[i].y + obstacles[i].height &&
      dino.y + dino.height > obstacles[i].y
    ) {
      clearInterval(intervalId);
      alert("LOL T'AS PERDU MDR HAHAHA LOL, ton score: " + score);
      location.reload();
    }
  }

  for (let i = 0; i < birds.length; i++) {
    if (
      dino.x < birds[i].x + birds[i].width &&
      dino.x + dino.width > birds[i].x &&
      dino.y < birds[i].y + birds[i].height &&
      dino.y + dino.height > birds[i].y
    ) {
      clearInterval(intervalId);
      alert("LOL T'AS PERDU MDR HAHAHA LOL, ton score: " + score);
      location.reload();
    }
  }
}

function updateScore() {
  ctx.fillStyle = "black";
  ctx.font = "20px Arial";
  ctx.fillText("Score: " + score, 10, 30);
}
            

Partie 2: Deuxième Code : Floppy Fly

Variables Globales

const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
const img = new Image();
img.src = "all3.png";

// general settings
let gamePlaying = false;
const gravity = 0.8;
const speed = 11;
const size = [40, 30];
const jump = -10;
const cTenth = (canvas.width / 10);

let index = 0,
    bestScore = 0, 
    flight, 
    flyHeight, 
    currentScore, 
    pipe;
            

Fonctions de Configuration

const pipeWidth = 65;
const pipeGap = 350;
const pipeLoc = () => (Math.random() * ((canvas.height - (pipeGap + pipeWidth)) - pipeWidth)) + pipeWidth;

const setup = () => {
  currentScore = 0;
  flight = jump;

  // set initial flyHeight (middle of screen - size of the bird)
  flyHeight = (canvas.height / 2) - (size[1] / 2);

  // setup first 3 pipes
  pipes = Array(3).fill().map((a, i) => [canvas.width + (i * (pipeGap + pipeWidth)),
tu dois trier sur le meme principe le code que je t'ai donné et le mettre dans la 3e partit ; jeu des portes.height - (pipeGap + pipeWidth)) - pipeWidth)) + pipeWidth;

const setup = () => {
  currentScore = 0;
  flight = jump;

  // set initial flyHeight (middle of screen - size of the bird)
  flyHeight = (canvas.height / 2) - (size[1] / 2);

  // setup first 3 pipes
  pipes = Array(3).fill().map((a, i) => [canvas.width + (i * (pipeGap + pipeWidth)),
];
};
            

Partie 3: Troisième Code : Jeu des Portes

Variables Globales

const questions = [
    {
        question: "Quel est le nom de la plus grosse bouteille de champagne (15L) ?",
        answers: [
            { text: "Platramagadar", correct: false },
            { text: "Nabuchodonosor", correct: true },
            { text: "Dostilisther", correct: false }
        ],
        messageId: "message1"
    },
    {
        question: "Combien de temps a duré le match le plus long du tennis de l'histoire opposant John Isner et Nicolas Mahut en 2010 à Winbledon ?",
        answers: [
            { text: "7h55", correct: false },
            { text: "9h23", correct: false },
            { text: "11h05", correct: true }
        ],
        messageId: "message2"
    }
];
            

Fonctions de Jeu

function checkAnswer(isCorrect, messageId) {
    if (isCorrect) {
        document.getElementById(messageId).className = 'visible';
    } else {
        window.location.href = 'nul4.html';
    }
}