AI game creator

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

No:23883

←

Prev Next

→

Snake Game
Developer User11179｜Date and time 23/11/4 3:40:33
Build time 104.056 sec｜Game capacity 4.175KB｜

Script

Sure! Here's an example of a simple Snake game implemented in a single HTML file using JavaScript and enclosed in script tags. This game can be played on a smartphone using pictograms for visuals:

This code sets up a canvas where the game is played. The snake and food are represented as colored rectangles, and the game runs in a loop, updating the snake's movement, checking for collisions, and handling swipe events on smartphones for controlling the snake's direction. The gameLoop() function acts as the main game loop, handling all the game logic.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's an example of a simple Snake game implemented in a single HTML file using JavaScript and enclosed in script tags. This game can be played on a smartphone using pictograms for visuals:

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

snake[0] = { x: 10, y: 10 };

let direction;
      let food = {
         x: Math.floor(Math.random() * 20) * box,
         y: Math.floor(Math.random() * 20) * box,
      };

// Game loop
      function gameLoop() {
         requestAnimationFrame(gameLoop);

// Clear the canvas
         context.clearRect(0, 0, canvas.width, canvas.height);

// Draw the snake
         for (let i = 0; i < snake.length; i++) {
            context.fillStyle = "#000";
            context.fillRect(snake[i].x, snake[i].y, box, box);
         }

// Draw the food
         context.fillStyle = "#f00";
         context.fillRect(food.x, food.y, box, box);

// Movement logic
         let snakeX = snake[0].x;
         let snakeY = snake[0].y;

if (direction === "LEFT") snakeX -= box;
         if (direction === "UP") snakeY -= box;
         if (direction === "RIGHT") snakeX += box;
         if (direction === "DOWN") snakeY += box;

// Detect collision with food
         if (snakeX === food.x && snakeY === food.y) {
            food = {
               x: Math.floor(Math.random() * 20) * box,
               y: Math.floor(Math.random() * 20) * box,
            };
         } else {
            snake.pop();
         }

// Create a new head for the snake
         const newHead = { x: snakeX, y: snakeY };
         snake.unshift(newHead);

// Game over conditions
         if (
            snakeX < 0 ||
            snakeY < 0 ||
            snakeX >= canvas.width ||
            snakeY >= canvas.height ||
            collisionCheck()
         ) {
            // Game over logic
            snake.length = 1;
            direction = undefined;
            alert("Game Over!");
         }
      }

// Function to check collision with snake body
      function collisionCheck() {
         for (let i = 1; i < snake.length; i++) {
            if (snake[i].x === snake[0].x && snake[i].y === snake[0].y) {
               return true;
            }
         }
         return false;
      }

// Listen for swipe events
      let xDown = null;
      let yDown = null;

function handleTouchStart(evt) {
         xDown = evt.touches[0].clientX;
         yDown = evt.touches[0].clientY;
      }

function handleTouchMove(evt) {
         if (!xDown || !yDown) {
            return;
         }

const xUp = evt.touches[0].clientX;
         const yUp = evt.touches[0].clientY;

const xDiff = xDown - xUp;
         const yDiff = yDown - yUp;

if (Math.abs(xDiff) > Math.abs(yDiff)) {
            if (xDiff > 0) {
               direction = "LEFT";
            } else {
               direction = "RIGHT";
            }
         } else {
            if (yDiff > 0) {
               direction = "UP";
            } else {
               direction = "DOWN";
            }
         }

xDown = null;
         yDown = null;
      }

// Attach touch event listeners
      document.addEventListener("touchstart", handleTouchStart, false);
      document.addEventListener("touchmove", handleTouchMove, false);

// Start the game loop
      gameLoop();
   </script>
</body>
</html>
```