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

No:41633

The Baldi School's Play Movie
Developer User18645｜Date and time 24/2/8 19:29:34
Build time 12.1 sec｜Game capacity 3.404KB｜

Script

Baldi's School Game

Click on the pictogram to win!

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Baldi's School Game</title>
    <style>
        body {
            font-family: "Arial", sans-serif;
            text-align: center;
        }
        
        #game-board {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            grid-gap: 10px;
            max-width: 400px;
            margin: 0 auto;
            padding-top: 100px;
        }
        
        .card {
            width: 100%;
            height: 100px;
            border: 2px solid #333;
            border-radius: 10px;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: #eee;
            font-size: 30px;
            cursor: pointer;
        }
        
        .card:hover {
            background-color: #ccc;
        }
    </style>
</head>
<body>
    <h1>Baldi's School Game</h1>
    <h3>Click on the pictogram to win!</h3>
    
    <div id="game-board">
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
        <div class="card"></div>
    </div>
    
    <script>
        // Create an array of pictograms
        var pictograms = ["📘", "🎒", "📏", "📚", "⏰", "📝", "🖍️", "🎈", "📎"];
        
        // Shuffle the pictograms array
        function shuffle(array) {
            var currentIndex = array.length, temporaryValue, randomIndex;
            while (0 !== currentIndex) {
                randomIndex = Math.floor(Math.random() * currentIndex);
                currentIndex -= 1;
                temporaryValue = array[currentIndex];
                array[currentIndex] = array[randomIndex];
                array[randomIndex] = temporaryValue;
            }
            return array;
        }
        
        // Shuffle the pictograms and assign them to cards
        function assignPictograms() {
            var cards = document.getElementsByClassName("card");
            var shuffledPictograms = shuffle(pictograms);
            for (var i = 0; i < cards.length; i++) {
                cards[i].innerHTML = shuffledPictograms[i];
            }
        }
        
        // Check if all cards have been clicked
        function checkWin() {
            var cards = document.getElementsByClassName("card");
            for (var i = 0; i < cards.length; i++) {
                if (cards[i].innerHTML === "") {
                    return false;
                }
            }
            return true;
        }
        
        // Event listener for card clicks
        function handleClick(event) {
            var card = event.target;
            card.innerHTML = "";
            card.style.backgroundColor = "#eee";
            if (checkWin()) {
                alert("Congratulations! You won!");
                assignPictograms();
            }
        }
        
        // Add click event listener to each card
        var cards = document.getElementsByClassName("card");
        for (var i = 0; i < cards.length; i++) {
            cards[i].addEventListener("click", handleClick);
        }
        
        // Start the game by assigning pictograms to cards
        assignPictograms();
    </script>
</body>
</html>