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

No:19246

←

Prev Next

→

Merge Game
Developer User8354｜Date and time 23/10/2 6:07:41
Build time 14.926 sec｜Game capacity 3.876KB｜

Script

Sure! Here's an example of a simple merge game implemented as a single HTML file, enclosed in script tags, using JavaScript:

Merge Game

This HTML file will display a simple Merge Game on a canvas element. The player can click on the numbers displayed on the canvas to merge them. Each merge generates a new random number and adds it to the score. The game ends when there are no more numbers left to merge.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple merge game implemented as a single HTML file, enclosed in script tags, using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Merge Game</title>
</head>
<body>
  <h1>Merge Game</h1>
  
  <canvas id="gameCanvas" width="320" height="480"></canvas>
  
  <script>
    const canvas = document.getElementById("gameCanvas");
    const context = canvas.getContext("2d");
    
    // Game variables
    let score = 0;
    let merged = [];
    let numbers = [];
    let gameOver = false;
    
    // Initialize the game
    function startGame() {
      // Create initial numbers on the board
      for (let i = 0; i < 2; i++) {
        numbers.push(getRandomNumber());
      }
      
      // Set up event listener for touch/click input
      canvas.addEventListener("click", mergeNumbers);
      
      // Start game loop
      gameLoop();
    }
    
    // Game loop
    function gameLoop() {
      if (!gameOver) {
        update();
        render();
        requestAnimationFrame(gameLoop);
      }
    }
    
    // Update game state
    function update() {
      // Check for game over condition
      if (numbers.length === 0) {
        gameOver = true;
        return;
      }
      
      // Move merged numbers
      for (let i = 0; i < merged.length; i++) {
        merged[i].y += 1;
      }
      
      // Remove merged numbers that have moved out of the canvas
      merged = merged.filter(num => num.y < 480);
    }
    
    // Render game objects on the canvas
    function render() {
      // Clear the canvas
      context.clearRect(0, 0, canvas.width, canvas.height);
      
      // Draw numbers
      context.font = "20px Arial";
      context.fillStyle = "black";
      for(let i = 0; i < numbers.length; i++) {
        const num = numbers[i];
        context.fillText(num, (i % 4) * 80 + 20, Math.floor(i / 4) * 80 + 60);
      }
      
      // Draw merged numbers
      context.fillStyle = "red";
      for(let i = 0; i < merged.length; i++) {
        const num = merged[i].number;
        const x = (merged[i].column % 4) * 80 + 20;
        const y = merged[i].y;
        context.fillText(num, x, y);
      }
      
      // Draw score
      context.font = "24px Arial";
      context.fillStyle = "blue";
      context.fillText("Score: " + score, 10, canvas.height - 20);
      
      // Draw game over message
      if (gameOver) {
        context.font = "36px Arial";
        context.fillStyle = "red";
        context.fillText("Game Over", 80, canvas.height / 2);
      }
    }
    
    // Merge the selected numbers
    function mergeNumbers(event) {
      if (gameOver) {
        return;
      }
      
      const clickX = event.pageX - canvas.offsetLeft;
      const clickY = event.pageY - canvas.offsetTop;
      
      const column = Math.floor((clickX - 20) / 80);
      const row = Math.floor((clickY - 60) / 80);
      const index = row * 4 + column;
      
      if (index >= 0 && index < numbers.length) {
        const numberToMerge = numbers[index];
        
        const newNumber = getRandomNumber();
        numbers.splice(index, 1, newNumber);
        
        merged.push({
          number: sum(numberToMerge, newNumber),
          column: column,
          y: 0
        });
        
        score += numberToMerge + newNumber;
      }
    }
    
    // Get a random number (2 or 4)
    function getRandomNumber() {
      return Math.random() < 0.9 ? 2 : 4;
    }
    
    // Sum two numbers
    function sum(a, b) {
      return a + b;
    }
    
    // Start the game
    startGame();
  </script>
</body>
</html>
```