Crea un gioco in cui tu sei un serpente che deve mangiare la carne. Se tocchi il muro o la tua coda perdi. Se mangi cento pezzi di carne vinci's game

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

No:23665

←

Prev Next

→

Crea un gioco in cui tu sei un serpente che deve m..ALL
Developer User11059｜Date and time 23/11/2 19:57:27
Build time 94.525 sec｜Game capacity 5.652KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

<!DOCTYPE html>
<html>
  <head>
    <style>
      canvas {
        border: 1px solid #000;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Initialize the game
      function init() {
        canvas = document.getElementById("gameCanvas");
        context = canvas.getContext("2d");
        snake = new Snake();
        food = new Food();
        score = 0;

// Add event listeners for arrow keys
        document.addEventListener("keydown", handleArrowKeys);

// Start the game loop
        gameLoop();
      }

// Game loop
      function gameLoop() {
        context.clearRect(0, 0, canvas.width, canvas.height);

// Update the snake position
        snake.update();

// Check for collision with walls or tail
        if (snake.collidesWithWall() || snake.collidesWithTail()) {
          endGame();
          return;
        }

// Check if the snake eats the food
        if (snake.eats(food)) {
          score++;
          food.spawn();
        }

// Draw the snake and food
        snake.draw();
        food.draw();

// Update the score
        context.fillStyle = "#000";
        context.font = "20px Arial";
        context.fillText("Score: " + score, 10, 30);

// Schedule the next game loop iteration
        requestAnimationFrame(gameLoop);
      }

// Handle arrow key input
      function handleArrowKeys(event) {
        var key = event.keyCode;

switch (key) {
          case 37: // Left arrow key
            snake.changeDirection("left");
            break;
          case 38: // Up arrow key
            snake.changeDirection("up");
            break;
          case 39: // Right arrow key
            snake.changeDirection("right");
            break;
          case 40: // Down arrow key
            snake.changeDirection("down");
            break;
        }
      }

// Snake class
      function Snake() {
        this.x = 0;
        this.y = 0;
        this.xSpeed = 1;
        this.ySpeed = 0;
        this.tail = [];

// Update the snake position
        this.update = function() {
          // Move the tail
          for (var i = 0; i < this.tail.length - 1; i++) {
            this.tail[i] = this.tail[i + 1];
          }

// Update the head position
          this.tail[this.tail.length - 1] = { x: this.x, y: this.y };

this.x += this.xSpeed * 20;
          this.y += this.ySpeed * 20;

// Wrap around the canvas
          if (this.x >= canvas.width) {
            this.x = 0;
          } else if (this.x < 0) {
            this.x = canvas.width - 20;
          }

if (this.y >= canvas.height) {
            this.y = 0;
          } else if (this.y < 0) {
            this.y = canvas.height - 20;
          }
        };

// Draw the snake
        this.draw = function() {
          context.fillStyle = "#000";
          context.fillRect(this.x, this.y, 20, 20);

// Draw the tail
          for (var i = 0; i < this.tail.length; i++) {
            context.fillRect(this.tail[i].x, this.tail[i].y, 20, 20);
          }
        };

// Change the snake's direction
        this.changeDirection = function(direction) {
          switch (direction) {
            case "up":
              if (this.ySpeed !== 1) {
                this.xSpeed = 0;
                this.ySpeed = -1;
              }
              break;
            case "down":
              if (this.ySpeed !== -1) {
                this.xSpeed = 0;
                this.ySpeed = 1;
              }
              break;
            case "left":
              if (this.xSpeed !== 1) {
                this.xSpeed = -1;
                this.ySpeed = 0;
              }
              break;
            case "right":
              if (this.xSpeed !== -1) {
                this.xSpeed = 1;
                this.ySpeed = 0;
              }
              break;
          }
        };

// Check if the snake collides with the walls
        this.collidesWithWall = function() {
          return (
            this.x >= canvas.width ||
            this.x < 0 ||
            this.y >= canvas.height ||
            this.y < 0
          );
        };

// Check if the snake collides with its tail
        this.collidesWithTail = function() {
          for (var i = 0; i < this.tail.length; i++) {
            if (this.tail[i].x === this.x && this.tail[i].y === this.y) {
              return true;
            }
          }
          return false;
        };

// Check if the snake eats the food
        this.eats = function(food) {
          return this.x === food.x && this.y === food.y;
        };
      }

// Food class
      function Food() {
        this.x = 0;
        this.y = 0;

// Spawn the food at a random position
        this.spawn = function() {
          this.x = Math.floor(Math.random() * (canvas.width / 20)) * 20;
          this.y = Math.floor(Math.random() * (canvas.height / 20)) * 20;
        };

// Draw the food
        this.draw = function() {
          context.fillStyle = "#f00";
          context.fillRect(this.x, this.y, 20, 20);
        };

// Spawn the initial food
        this.spawn();
      }

// End the game
      function endGame() {
        alert("Hai perso! Il tuo punteggio è: " + score);

// Restart the game
        init();
      }

// Start the game
      init();
    </script>
  </body>
</html>