Code the game snake but instead you are the food running away from the snake in a maze compromised of rock emojis there is a door and the food moves slower than the snake there are closets you can hide in and when you hide the snake changes directions because he doesn't know where you are your goal is to touch the door also add mobile controls's game

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

No:48001

←

Prev Next

→

Code the game snake but instead you are the food r..ALL
Developer User20679｜Date and time 24/3/1 7:07:02
Build time 16.626 sec｜Game capacity 2.872KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Run Away!</title>
<style>
  #game-board {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
  }
</style>
</head>
<body>
<div id="game-board"></div>
<script>
  const board = document.getElementById('game-board');
  const snake = [{x: 0, y: 0}];
  let food = {x: 9, y: 9};
  let direction = 'right';
  let hidingSpot = {x: 0, y: 0};
  let hidden = false;
  
  function drawSnake() {
    board.innerHTML = '';
    const snakeHead = document.createElement('div');
    snakeHead.style.gridColumn = snake[0].x + 1;
    snakeHead.style.gridRow = snake[0].y + 1;
    snakeHead.textContent = '🐍';
    board.appendChild(snakeHead);
  }
  
  function drawFood() {
    const foodDiv = document.createElement('div');
    foodDiv.style.gridColumn = food.x + 1;
    foodDiv.style.gridRow = food.y + 1;
    foodDiv.textContent = '🍔';
    board.appendChild(foodDiv);
  }
  
  function checkCollision() {
    return snake.some(segment => segment.x === food.x && segment.y === food.y);
  }
  
  function moveSnake() {
    const newSnakeHead = { x: snake[0].x + (direction === 'left' ? -1 : direction === 'right' ? 1 : 0), y: snake[0].y + (direction === 'up' ? -1 : direction === 'down' ? 1 : 0) };
    snake.unshift(newSnakeHead);
    if (checkCollision()) {
      food = { x: Math.floor(Math.random() * 10), y: Math.floor(Math.random() * 10) };
    } else {
      snake.pop();
    }
    if (hidden && snake.some(segment => segment.x === hidingSpot.x && segment.y === hidingSpot.y)) {
      direction = ['left', 'right', 'up', 'down'][Math.floor(Math.random() * 4)];
      hidden = false;
    }
  }
  
  function handleSwipe(direction) {
    if ((direction === 'up' && direction !== 'down') || (direction === 'down' && direction !== 'up') ||
       (direction === 'left' && direction !== 'right') || (direction === 'right' && direction !== 'left')) {
      this.direction = direction;
    }
  }
  
  function handleTouchEnd(event) {
    const x = event.changedTouches[0].screenX;
    const y = event.changedTouches[0].screenY;
    const startX = event.targetTouches[0].screenX;
    const startY = event.targetTouches[0].screenY;
    const dx = Math.abs(x - startX);
    const dy = Math.abs(y - startY);
    
    if (dx > dy && dx > 0) {
      if (x > startX) {
        handleSwipe('right');
      } else {
        handleSwipe('left');
      }
    } else if (dy > 0) {
      if (y > startY) {
        handleSwipe('down');
      } else {
        handleSwipe('up');
      }
    }
  }
  
  document.addEventListener('touchend', handleTouchEnd);
  
  function gameLoop() {
    moveSnake();
    drawSnake();
    drawFood();
    setTimeout(() => {
      gameLoop();
    }, 1000);
  }
  
  gameLoop();
</script>
</body>
</html>
```