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

No:21890

←

Prev Next

→

Pink Pacman sandbox
Developer User10110｜Date and time 23/10/19 5:59:06
Build time 79.833 sec｜Game capacity 4.343KB｜

Script

Pink Pacman Sandbox

Score: 0

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Pink Pacman Sandbox</title>
    <style>
        #game-board {
            width: 400px;
            height: 400px;
            background-color: pink;
            position: relative;
            border: 2px solid black;
        }

.pacman {
            width: 50px;
            height: 50px;
            position: absolute;
            background-color: yellow;
            border-radius: 50%;
        }

.food {
            width: 10px;
            height: 10px;
            position: absolute;
            background-color: red;
        }

.ghost {
            width: 40px;
            height: 40px;
            position: absolute;
            background-color: cyan;
            border-radius: 50%;
        }

#score {
            font-size: 20px;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <h1>Pink Pacman Sandbox</h1>
    <div id="game-board">
        <div id="pacman" class="pacman"></div>
        <div id="food-1" class="food"></div>
        <div id="food-2" class="food"></div>
        <div id="food-3" class="food"></div>
        <div id="food-4" class="food"></div>
        <div id="ghost-1" class="ghost"></div>
        <div id="ghost-2" class="ghost"></div>
    </div>
    <div id="score">Score: 0</div>

var gameBoard = document.getElementById("game-board");
    var boardWidth = gameBoard.clientWidth;
    var boardHeight = gameBoard.clientHeight;

var pacmanWidth = pacman.clientWidth;
    var pacmanHeight = pacman.clientHeight;

var pacmanX = boardWidth / 2 - pacmanWidth / 2; // Initial position of pacman
    var pacmanY = boardHeight / 2 - pacmanHeight / 2; // Initial position of pacman

pacman.style.left = pacmanX + "px";
    pacman.style.top = pacmanY + "px";

var foodCount = food.length;

var direction = ""; // Holds the current direction of movement

// Check for collision with food
        for (var i = 0; i < food.length; i++) {
            if (checkCollision(pacman, food[i])) {
                food[i].style.display = "none";
                score += 10;
                foodCount--;
                scoreDisplay.innerText = "Score: " + score;

if (foodCount === 0) {
                    clearInterval(gameLoop);
                    alert("Game Over! Your score is: " + score);
                }
            }
        }

// Check for collision with ghosts
        for (var j = 0; j < ghosts.length; j++) {
            if (checkCollision(pacman, ghosts[j])) {
                clearInterval(gameLoop);
                alert("Game Over! Your score is: " + score);
            }
        }
    }

function checkCollision(obj1, obj2) {
        var rect1 = obj1.getBoundingClientRect();
        var rect2 = obj2.getBoundingClientRect();

return (
            rect1.left < rect2.right &&
            rect1.right > rect2.left &&
            rect1.top < rect2.bottom &&
            rect1.bottom > rect2.top
        );
    }

var gameLoop = setInterval(movePacman, 50);
</script>
</body>
</html>