AI game creator

Click here for free DL of the app version that can save data.

No:13592

112

←

Prev Next

→

Snake game with the money and upgrades. Ressources..ALL
Developer User5869｜Date and time 23/8/29 3:41:47
Build time 20.289 sec｜Game capacity 3.361KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

Click here for free DL of the app version that can save data.

<HTML>
<HEAD>
  <TITLE>Snake Game</TITLE>
  <STYLE>
    * {
      margin: 0;
      padding: 0;
    }
    canvas {
      background-color: #000;
      display: block;
      margin: 40px auto;
    }
  </STYLE>
</HEAD>
<BODY>
  <script>
    const canvas = document.querySelector("canvas");
    const context = canvas.getContext("2d");
    const scale = 10;
    const width = canvas.width / scale;
    const height = canvas.height / scale;

let snake = [];
    snake[0] = {
      x: Math.floor(width / 2),
      y: Math.floor(height / 2),
    };

let food = {
      x: Math.floor(Math.random() * width),
      y: Math.floor(Math.random() * height),
    };

let tailLength = 0;
    let score = 0;
    let direction;
    let gameLoop;

function draw() {
      context.clearRect(0, 0, canvas.width, canvas.height);
      
      // Draw snake
      for (let i = 0; i < snake.length; i++) {
        context.fillStyle = i === 0 ? "green" : "white";
        context.fillRect(
          snake[i].x * scale,
          snake[i].y * scale,
          scale,
          scale
        );
      }

// Draw food
      context.fillStyle = "red";
      context.fillRect(food.x * scale, food.y * scale, scale, scale);

// Store snake head position
      const snakeX = snake[0].x;
      const snakeY = snake[0].y;

// Move snake
      if (direction === "RIGHT") snakeX++;
      if (direction === "LEFT") snakeX--;
      if (direction === "UP") snakeY--;
      if (direction === "DOWN") snakeY++;

// Check for collision
      if (
        snakeX < 0 ||
        snakeY < 0 ||
        snakeX >= width ||
        snakeY >= height ||
        checkCollision(snakeX, snakeY)
      ) {
        clearInterval(gameLoop);
        alert("Game Over! Your score: " + score);
        location.reload();
      }

// Check if food is eaten
      if (snakeX === food.x && snakeY === food.y) {
        score++;
        tailLength++;
        food = {
          x: Math.floor(Math.random() * width),
          y: Math.floor(Math.random() * height),
        };
      } else {
        // Remove tail if food not eaten
        snake.pop();
      }

// Add new head to snake
      const newHead = {
        x: snakeX,
        y: snakeY,
      };
      snake.unshift(newHead);

// Draw score
      context.fillStyle = "white";
      context.font = "12px Arial";
      context.fillText("Score: " + score, scale, scale);

// Increase snake length
      while (snake.length > tailLength) {
        snake.pop();
      }
    }

function checkCollision(x, y) {
      for (let i = 1; i < snake.length; i++) {
        if (snake[i].x === x && snake[i].y === y) {
          return true;
        }
      }
      return false;
    }

document.addEventListener("keydown", keyDownHandler);

function startGame() {
      direction = "RIGHT";
      gameLoop = setInterval(draw, 100);
    }

startGame();
  </script>
</BODY>
</HTML>