AI game creator

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

No:37165

←

Prev Next

→

Zombie Apocalypse
Developer User13970｜Date and time 24/1/20 14:41:24
Build time 16.595 sec｜Game capacity 5.056KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Zombie Apocalypse Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    
    #game-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    
    .pictogram {
      font-size: 50px;
      margin: 10px;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div id="game"></div>
  </div>
  
  <script>
    // Basic game setup
    const gameContainer = document.getElementById('game');
    const pictograms = {
      player: '🧟‍♀️',
      zombie: '🧟',
      bullet: '🔫',
      empty: '❌'
    };
    const game = {
      grid: [],
      playerPos: { x: 0, y: 0 },
      score: 0,
      bullets: 3,
      zombies: 5
    };
  
    function initializeGame() {
      // Create initial game grid
      for (let i = 0; i < 5; i++) {
        game.grid.push([]);
        for (let j = 0; j < 5; j++) {
          game.grid[i].push(pictograms.empty);
        }
      }
      
      // Randomly place the player, zombies, and bullets on the grid
      game.playerPos.x = getRandomNumber(0, 4);
      game.playerPos.y = getRandomNumber(0, 4);
      
      for (let i = 0; i < game.zombies; i++) {
        let x, y;
        do {
          x = getRandomNumber(0, 4);
          y = getRandomNumber(0, 4);
        } while (game.grid[y][x] !== pictograms.empty);
        
        game.grid[y][x] = pictograms.zombie;
      }
      
      for (let i = 0; i < game.bullets; i++) {
        let x, y;
        do {
          x = getRandomNumber(0, 4);
          y = getRandomNumber(0, 4);
        } while (game.grid[y][x] !== pictograms.empty);
        
        game.grid[y][x] = pictograms.bullet;
      }
      
      // Render the initial game state
      renderGame();
    }
    
    function renderGame() {
      // Clear game container
      gameContainer.innerHTML = '';
      
      // Render the game grid
      game.grid.forEach(row => {
        row.forEach(cell => {
          const pictogram = document.createElement('span');
          pictogram.classList.add('pictogram');
          pictogram.innerText = cell;
          gameContainer.appendChild(pictogram);
        });
        
        const lineBreak = document.createElement('br');
        gameContainer.appendChild(lineBreak);
      });
      
      // Render game information
      const playerInfo = document.createElement('div');
      playerInfo.innerText = 'Player: ' + pictograms.player;
      
      const bulletsInfo = document.createElement('div');
      bulletsInfo.innerText = 'Bullets: ' + game.bullets;
      
      const scoreInfo = document.createElement('div');
      scoreInfo.innerText = 'Score: ' + game.score;
      
      gameContainer.appendChild(playerInfo);
      gameContainer.appendChild(bulletsInfo);
      gameContainer.appendChild(scoreInfo);
    }
    
    function handleKeyPress(event) {
      const key = event.key;
      
      // Move player based on arrow key inputs
      if (key === 'ArrowUp' && game.playerPos.y > 0) {
        game.playerPos.y--;
      } else if (key === 'ArrowDown' && game.playerPos.y < 4) {
        game.playerPos.y++;
      } else if (key === 'ArrowLeft' && game.playerPos.x > 0) {
        game.playerPos.x--;
      } else if (key === 'ArrowRight' && game.playerPos.x < 4) {
        game.playerPos.x++;
      }
      
      // Check the current cell the player is in
      const currentCell = game.grid[game.playerPos.y][game.playerPos.x];
      
      if (currentCell === pictograms.zombie) {
        handleEncounterZombie();
      } else if (currentCell === pictograms.bullet) {
        handleCollectBullet();
      }
      
      // Reduce bullets count when moving
      if (game.bullets > 0) {
        game.bullets--;
      }
      
      // Render updated game state
      renderGame();
    }
    
    function handleEncounterZombie() {
      game.score++;
      game.zombies--;
      
      if (game.zombies <= 0) {
        endGame("Congratulations! You've survived the Zombie Apocalypse!");
        return;
      }
      
      // Remove the encountered zombie from the grid
      game.grid[game.playerPos.y][game.playerPos.x] = pictograms.empty;
      
      // Check if player has remaining bullets
      if (game.bullets <= 0) {
        endGame("Game Over! You ran out of bullets and got overwhelmed by zombies!");
      }
    }
    
    function handleCollectBullet() {
      game.bullets++;
      game.score++;
      
      // Remove the collected bullet from the grid
      game.grid[game.playerPos.y][game.playerPos.x] = pictograms.empty;
    }
    
    function endGame(message) {
      alert(message);
      initializeGame();
    }
    
    function getRandomNumber(min, max) {
      return Math.floor(Math.random() * (max - min + 1)) + min;
    }
    
    // Start the game
    window.addEventListener('DOMContentLoaded', function() {
      initializeGame();
      window.addEventListener('keydown', handleKeyPress);
    });
  </script>
</body>
</html>