AI game creator

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

No:8774

←

Prev Next

→

Merge Game
Developer User3887｜Date and time 23/7/18 7:15:25
Build time 21.83 sec｜Game capacity 2.518KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Merge Game</title>
  </head>
  <body>
    <script>
      // Pictograms for the game
      const pictograms = [
        "🍎", "🍌", "🍊", "🍇", "🍓", "🥕", "🍆", "🌽", "🍅", "🍒"
      ];
      
      // Function to shuffle the pictograms
      function shufflePictograms() {
        for (let i = pictograms.length - 1; i > 0; i--) {
          const j = Math.floor(Math.random() * (i + 1));
          [pictograms[i], pictograms[j]] = [pictograms[j], pictograms[i]];
        }
      }
      
      // Function to merge adjacent pictograms
      function mergePictograms() {
        for (let i = 0; i < pictograms.length - 1; i++) {
          if (pictograms[i] === pictograms[i + 1]) {
            pictograms[i] = pictograms[i] + pictograms[i + 1];
            pictograms.splice(i + 1, 1);
          }
        }
      }
      
      // Function to display the game board
      function displayGameBoard() {
        const gameBoard = document.getElementById("game-board");
        gameBoard.innerHTML = "";
        
        for (const pictogram of pictograms) {
          const pictogramDiv = document.createElement("div");
          pictogramDiv.innerText = pictogram;
          gameBoard.appendChild(pictogramDiv);
        }
      }
      
      // Function to handle swipe gestures
      function handleSwipe(swipeDirection) {
        if (swipeDirection === "left") {
          mergePictograms();
          displayGameBoard();
        }
      }
      
      // Event listener for swipe gestures
      document.addEventListener("keydown", function(event) {
        const swipeDirections = ["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"];
        if (swipeDirections.includes(event.key)) {
          event.preventDefault();
          handleSwipe(event.key === "ArrowLeft" ? "left" : "right");
        }
      });
      
      // Function to start the game
      function startGame() {
        shufflePictograms();
        displayGameBoard();
      }
      
      // Call the startGame function to begin the game
      startGame();
    </script>
    
    <style>
      #game-board {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
        align-items: center;
        font-size: 2rem;
      }
      
      #game-board div {
        width: 50px;
        height: 50px;
        text-align: center;
        border: 1px solid black;
      }
    </style>
    
    <div id="game-board"></div>
  </body>
</html>