AI game creator

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

No:42936

←

Prev Next

→

Merge Game
Developer User19029｜Date and time 24/2/13 15:09:08
Build time 10.928 sec｜Game capacity 3.746KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!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>
</head>
<body>
    <script>
        // Game Variables
        let numbers = [];
        let score = 0;

// Function to initialize the game
        function initGame() {
            // Creating pictograms for numbers
            const pictograms = ["🍇", "🍉", "🍊", "🍋", "🍌", "🍎", "🥥", "🍓", "🍒", "🍐"];

// Fill the numbers array with random pictograms
            for (let i = 0; i < 4; i++) {
                let row = [];
                for (let j = 0; j < 4; j++) {
                    row.push(pictograms[Math.floor(Math.random() * pictograms.length)]);
                }
                numbers.push(row);
            }

// Display the initial game board
            displayBoard();

// Start listening for user input
            document.addEventListener('keydown', handleKeyPress);
        }

// Function to display the game board on the screen
        function displayBoard() {
            let boardContainer = document.createElement('div');
            boardContainer.style.display = 'grid';
            boardContainer.style.gridTemplateColumns = '1fr 1fr 1fr 1fr';
            boardContainer.style.gridGap = '10px';

// Clear previous board
            document.body.innerHTML = '';

// Display the game board with pictograms
            numbers.forEach(row => {
                row.forEach(number => {
                    let cell = document.createElement('div');
                    cell.style.fontSize = '40px';
                    cell.style.width = '100px';
                    cell.style.height = '100px';
                    cell.style.backgroundColor = 'lightgray';
                    cell.style.borderRadius = '10px';
                    cell.style.display = 'flex';
                    cell.style.alignItems = 'center';
                    cell.style.justifyContent = 'center';
                    cell.innerText = number;
                    boardContainer.appendChild(cell);
                });
            });

// Display the score
            let scoreDisplay = document.createElement('div');
            scoreDisplay.style.fontSize = '30px';
            scoreDisplay.style.marginTop = '20px';
            scoreDisplay.innerText = `Score: ${score}`;

// Add the board and score display to the HTML body
            document.body.appendChild(boardContainer);
            document.body.appendChild(scoreDisplay);
        }

// Function to handle user key press events
        function handleKeyPress(event) {
            let direction;

// Determine the arrow key that was pressed
            if (event.key === "ArrowUp") {
                direction = "up";
            } else if (event.key === "ArrowDown") {
                direction = "down";
            } else if (event.key === "ArrowLeft") {
                direction = "left";
            } else if (event.key === "ArrowRight") {
                direction = "right";
            } else {
                return; // Ignore other key presses
            }

// Perform the merge operation
            mergeNumbers(direction);

// Display the updated game board
            displayBoard();
        }

// Function to merge and update the numbers based on the user's move
        function mergeNumbers(direction) {
            // Implement merge logic here
            // ...

// Update the score
            score += 10;
        }

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