AI game creator

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

No:39062

←

Prev Next

→

Merge Game
Developer User17488｜Date and time 24/1/26 13:48:37
Build time 25.482 sec｜Game capacity 5.357KB｜

Script

Sure! Here's a simple merge game implemented as a single HTML file using JavaScript and pictograms for smartphone operation:

This HTML file creates a 4x4 game board with tiles initially set to null. When a user presses the arrow keys on their smartphone, the tiles are moved and merged based on the direction chosen. Pictograms are used to represent different tile values. The game randomly generates a new tile (either 2 or 4) at an empty position after every move. Users can play the game by merging tiles and aiming to reach the tile with a value of 2048. Keep in mind that this is just a basic implementation of the merge game, and you can enhance it further according to your specific requirements and preferences.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple merge game implemented as a single HTML file using JavaScript and pictograms for smartphone operation:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background-color: #f7f7f7;
    }
    #game-container {
      display: flex;
      flex-wrap: wrap;
      width: 300px;
      height: 300px;
    }
    .tile {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 70px;
      height: 70px;
      font-size: 25px;
      font-weight: bold;
      background-color: #eee;
      border-radius: 10px;
      margin: 5px;
    }
  </style>
</head>
<body>
  <div id="game-container"></div>

// Create initial game board
    let gameBoard = [
      [null, null, null, null],
      [null, null, null, null],
      [null, null, null, null],
      [null, null, null, null]
    ];

// Initialize game
    generateRandomTile();
    generateRandomTile();
    displayGameBoard();

// Generate a random tile (either 2 or 4) at a random empty position
    function generateRandomTile() {
      const availablePositions = [];
      for (let i = 0; i < gameBoard.length; i++) {
        for (let j = 0; j < gameBoard[i].length; j++) {
          if (gameBoard[i][j] === null) {
            availablePositions.push({ row: i, col: j });
          }
        }
      }
      if (availablePositions.length > 0) {
        const randomPosition = availablePositions[Math.floor(Math.random() * availablePositions.length)];
        const randomValue = Math.random() < 0.9 ? 2 : 4;
        gameBoard[randomPosition.row][randomPosition.col] = randomValue;
      }
    }

// Display the game board on the screen
    function displayGameBoard() {
      const gameContainer = document.getElementById('game-container');
      gameContainer.innerHTML = '';

for (let i = 0; i < gameBoard.length; i++) {
        for (let j = 0; j < gameBoard[i].length; j++) {
          const tile = document.createElement('div');
          tile.className = 'tile';
          tile.innerText = gameBoard[i][j] ? pictograms[gameBoard[i][j]] : '';
          gameContainer.appendChild(tile);
        }
      }
    }

// Handle key events for merging tiles
    document.addEventListener('keydown', (event) => {
      if (event.key === 'ArrowUp') {
        moveTilesUp();
      } else if (event.key === 'ArrowDown') {
        moveTilesDown();
      } else if (event.key === 'ArrowLeft') {
        moveTilesLeft();
      } else if (event.key === 'ArrowRight') {
        moveTilesRight();
      }

generateRandomTile();
      displayGameBoard();
    });

// Merge tiles and move them upwards
    function moveTilesUp() {
      for (let col = 0; col < gameBoard[0].length; col++) {
        let mergeAllowed = true;
        let mergedPositions = [];

for (let row = 1; row < gameBoard.length; row++) {
          if (gameBoard[row][col] !== null) {
            let currentRow = row;
            while (currentRow > 0 && (gameBoard[currentRow - 1][col] === null || gameBoard[currentRow - 1][col] === gameBoard[row][col])) {
              if (mergedPositions.includes((currentRow - 1) * gameBoard.length + col)) {
                break;
              }
              if (gameBoard[currentRow - 1][col] !== null) {
                mergedPositions.push((currentRow - 1) * gameBoard.length + col);
                gameBoard[currentRow - 1][col] *= 2;
                gameBoard[row][col] = null;
                mergeAllowed = false;
                break;
              }
              currentRow--;
            }

if (currentRow !== row) {
              gameBoard[currentRow][col] = gameBoard[row][col];
              gameBoard[row][col] = null;
              mergeAllowed = false;
            }
          }
        }
        
        if (mergeAllowed) {
          mergedPositions = [];
        }
      }
    }

// Merge tiles and move them downwards
    function moveTilesDown() {
      // Implementation for moving down and merging tiles
      // ...
    }

// Merge tiles and move them to the left
    function moveTilesLeft() {
      // Implementation for moving left and merging tiles
      // ...
    }

// Merge tiles and move them to the right
    function moveTilesRight() {
      // Implementation for moving right and merging tiles
      // ...
    }
  </script>
</body>
</html>
```

Keep in mind that this is just a basic implementation of the merge game, and you can enhance it further according to your specific requirements and preferences.