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

No:35475

←

Prev Next

→

Merge Game
Developer User16552｜Date and time 24/1/14 14:40:18
Build time 32.565 sec｜Game capacity 9.346KB｜

Script

Sure! Here's a simple game called "Merge Game" that you can play on your smartphone using pictograms. It involves merging numbers to reach the highest number possible.

Merge Game

Score: 0

To play the game, save the above code as a `.html` file (e.g., `merge_game.html`) and open it in a web browser on your smartphone. You can swipe left, right, up, or down to move the numbers on the grid and merge them. The aim is to reach the highest number possible. Have fun!

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game called "Merge Game" that you can play on your smartphone using pictograms. It involves merging numbers to reach the highest number possible.

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Merge Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    .game-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 20px;
    }
    .cell {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 80px;
      height: 80px;
      background-color: #e2e2e2;
      border-radius: 4px;
      font-size: 24px;
      font-weight: bold;
    }
    .score {
      font-size: 18px;
      margin-top: 10px;
    }
    .game-over {
      font-size: 24px;
      font-weight: bold;
      color: red;
      margin-top: 20px;
    }
  </style>
</head>
<body>
  <h1>Merge Game</h1>
  <div class="game-container"></div>
  <div class="score">Score: 0</div>
  <div class="game-over"></div>

// Initialize the game
    function initializeGame() {
      grid = [
        [0, 0, 0, 0],
        [0, 0, 0, 0],
        [0, 0, 0, 0],
        [0, 0, 0, 0]
      ];
      score = 0;
      gameOver = false;

addRandomNumber();
      addRandomNumber();

updateUI();
    }

// Add a random number (2 or 4) to the grid
    function addRandomNumber() {
      var availableCells = [];
      for (var row = 0; row < 4; row++) {
        for (var col = 0; col < 4; col++) {
          if (grid[row][col] === 0) {
            availableCells.push({ row: row, col: col });
          }
        }
      }

if (availableCells.length > 0) {
        var randomCell = availableCells[Math.floor(Math.random() * availableCells.length)];
        var randomNumber = Math.random() < 0.9 ? 2 : 4;
        grid[randomCell.row][randomCell.col] = randomNumber;
      }
    }

// Update the user interface (UI) with the current state of the game
    function updateUI() {
      var gameContainer = document.querySelector('.game-container');
      gameContainer.innerHTML = '';

for (var row = 0; row < 4; row++) {
        for (var col = 0; col < 4; col++) {
          var cell = document.createElement('div');
          cell.className = 'cell';
          cell.textContent = grid[row][col] > 0 ? grid[row][col] : '';
          cell.style.backgroundColor = getCellColor(grid[row][col]);
          gameContainer.appendChild(cell);
        }
      }

document.querySelector('.score').textContent = 'Score: ' + score;
      document.querySelector('.game-over').textContent = gameOver ? 'Game Over!' : '';
    }

// Get the background color for a cell based on its value
    function getCellColor(value) {
      switch (value) {
        case 2:
          return '#ffdcdc';
        case 4:
          return '#ff8071';
        case 8:
          return '#ffa871';
        case 16:
          return '#ffc471';
        case 32:
          return '#ffe27d';
        case 64:
          return '#ffedb4';
        case 128:
          return '#fff449';
        case 256:
          return '#ffe745';
        case 512:
          return '#fed95c';
        case 1024:
          return '#fecf4e';
        case 2048:
          return '#ffcc4d';
        default:
          return '#e2e2e2';
      }
    }

// Handle swipe gestures
    var startX, startY;
    window.addEventListener('touchstart', function(event) {
      startX = event.touches[0].clientX;
      startY = event.touches[0].clientY;
    });

window.addEventListener('touchend', function(event) {
      var deltaX = event.changedTouches[0].clientX - startX;
      var deltaY = event.changedTouches[0].clientY - startY;
      var threshold = 50; // minimum swipe distance

if (Math.abs(deltaX) > Math.abs(deltaY)) {
        // horizontal swipe
        if (Math.abs(deltaX) > threshold) {
          if (deltaX > 0) {
            moveRight();
          } else {
            moveLeft();
          }
        }
      } else {
        // vertical swipe
        if (Math.abs(deltaY) > threshold) {
          if (deltaY > 0) {
            moveDown();
          } else {
            moveUp();
          }
        }
      }
    });

// Move functions
    function moveRight() {
      if (!gameOver) {
        var hasMoved = false;

for (var row = 0; row < 4; row++) {
          for (var col = 2; col >= 0; col--) {
            if (grid[row][col] !== 0) {
              var currentCol = col;
              while (currentCol + 1 < 4 && grid[row][currentCol + 1] === 0) {
                // Move the cell to the right
                grid[row][currentCol + 1] = grid[row][currentCol];
                grid[row][currentCol] = 0;
                currentCol++;
                hasMoved = true;
              }

if (currentCol + 1 < 4 && grid[row][currentCol + 1] === grid[row][currentCol]) {
                // Merge the cells
                grid[row][currentCol + 1] *= 2;
                score += grid[row][currentCol + 1];
                grid[row][currentCol] = 0;
                hasMoved = true;
              }
            }
          }
        }

if (hasMoved) {
          addRandomNumber();
          updateUI();
          checkGameOver();
        }
      }
    }

function moveLeft() {
      if (!gameOver) {
        var hasMoved = false;

for (var row = 0; row < 4; row++) {
          for (var col = 1; col < 4; col++) {
            if (grid[row][col] !== 0) {
              var currentCol = col;
              while (currentCol - 1 >= 0 && grid[row][currentCol - 1] === 0) {
                // Move the cell to the left
                grid[row][currentCol - 1] = grid[row][currentCol];
                grid[row][currentCol] = 0;
                currentCol--;
                hasMoved = true;
              }

if (currentCol - 1 >= 0 && grid[row][currentCol - 1] === grid[row][currentCol]) {
                // Merge the cells
                grid[row][currentCol - 1] *= 2;
                score += grid[row][currentCol - 1];
                grid[row][currentCol] = 0;
                hasMoved = true;
              }
            }
          }
        }

if (hasMoved) {
          addRandomNumber();
          updateUI();
          checkGameOver();
        }
      }
    }

function moveDown() {
      if (!gameOver) {
        var hasMoved = false;

for (var col = 0; col < 4; col++) {
          for (var row = 2; row >= 0; row--) {
            if (grid[row][col] !== 0) {
              var currentRow = row;
              while (currentRow + 1 < 4 && grid[currentRow + 1][col] === 0) {
                // Move the cell down
                grid[currentRow + 1][col] = grid[currentRow][col];
                grid[currentRow][col] = 0;
                currentRow++;
                hasMoved = true;
              }

if (currentRow + 1 < 4 && grid[currentRow + 1][col] === grid[currentRow][col]) {
                // Merge the cells
                grid[currentRow + 1][col] *= 2;
                score += grid[currentRow + 1][col];
                grid[currentRow][col] = 0;
                hasMoved = true;
              }
            }
          }
        }
        
        if (hasMoved) {
          addRandomNumber();
          updateUI();
          checkGameOver();
        }
      }
    }

function moveUp() {
      if (!gameOver) {
        var hasMoved = false;

for (var col = 0; col < 4; col++) {
          for (var row = 1; row < 4; row++) {
            if (grid[row][col] !== 0) {
              var currentRow = row;
              while (currentRow - 1 >= 0 && grid[currentRow - 1][col] === 0) {
                // Move the cell up
                grid[currentRow - 1][col] = grid[currentRow][col];
                grid[currentRow][col] = 0;
                currentRow--;
                hasMoved = true;
              }

if (currentRow - 1 >= 0 && grid[currentRow - 1][col] === grid[currentRow][col]) {
                // Merge the cells
                grid[currentRow - 1][col] *= 2;
                score += grid[currentRow - 1][col];
                grid[currentRow][col] = 0;
                hasMoved = true;
              }
            }
          }
        }

if (hasMoved) {
          addRandomNumber();
          updateUI();
          checkGameOver();
        }
      }
    }

// Check if the game is over
    function checkGameOver() {
      var hasEmptyCell = false;

for (var row = 0; row < 4; row++) {
        for (var col = 0; col < 4; col++) {
          if (grid[row][col] === 0) {
            hasEmptyCell = true;
          }
        }
      }

if (!hasEmptyCell) {
        gameOver = true;
      }
    }

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