Buat game zombie's game | AI game creator

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

No:34190

89

Buat game zombie
Developer User16163｜Date and time 24/1/9 2:18:12
Build time 38.316 sec｜Game capacity 4.058KB｜

→ 　

0　

0　

　

　
　
　

[PR]現在の売れ筋グッズランキング

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

(C)2023 HisashiApp

<!DOCTYPE html>
<html>
<head>
    <title>Game Zombie</title>
    <style>
        canvas {
            border: solid 1px #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

<script>
        // Inisialisasi variabel
        var canvas = document.getElementById("gameCanvas");
        var ctx = canvas.getContext("2d");
        
        var player = {
            x: canvas.width / 2,
            y: canvas.height - 30,
            size: 20,
            speed: 5,
            color: "#000"
        };
        
        var zombies = [];
        var zombieSize = 20;
        var zombieSpeed = 2;
        var zombieSpawnRate = 1000; // in milliseconds
        var lastZombieSpawnedTime = 0;
        
        var keys = [];
        
        // Fungsi untuk menggambar pemain
        function drawPlayer() {
            ctx.beginPath();
            ctx.rect(player.x, player.y, player.size, player.size);
            ctx.fillStyle = player.color;
            ctx.fill();
            ctx.closePath();
        }
        
        // Fungsi untuk menggambar zombie
        function drawZombies() {
            for (var i = 0; i < zombies.length; i++) {
                ctx.beginPath();
                ctx.rect(zombies[i].x, zombies[i].y, zombieSize, zombieSize);
                ctx.fillStyle = "#f00";
                ctx.fill();
                ctx.closePath();
            }
        }
        
        // Fungsi untuk menggerakkan pemain
        function movePlayer() {
            if (keys[87] && player.y > 0) { // W key
                player.y -= player.speed;
            }
            if (keys[83] && player.y < canvas.height - player.size) { // S key
                player.y += player.speed;
            }
            if (keys[65] && player.x > 0) { // A key
                player.x -= player.speed;
            }
            if (keys[68] && player.x < canvas.width - player.size) { // D key
                player.x += player.speed;
            }
        }
        
        // Fungsi untuk menggerakkan zombie secara acak
        function moveZombies() {
            for (var i = 0; i < zombies.length; i++) {
                zombies[i].y += zombieSpeed;
                
                // Deteksi jika pemain bertabrakan dengan zombie
                if (zombies[i].y + zombieSize > player.y && player.x + player.size > zombies[i].x && player.x < zombies[i].x + zombieSize) {
                    alert("Game Over!");
                    document.location.reload();
                }
                
                // Hapus zombie yang sudah keluar dari layar
                if (zombies[i].y > canvas.height) {
                    zombies.splice(i, 1);
                }
            }
        }
        
        // Fungsi untuk membuat zombie dalam waktu acak
        function spawnZombie() {
            var currentTime = new Date().getTime();
            if (currentTime - lastZombieSpawnedTime > zombieSpawnRate) {
                var zombieX = Math.random() * (canvas.width - zombieSize);
                zombies.push({ x: zombieX, y: -zombieSize });
                lastZombieSpawnedTime = currentTime;
            }
        }
        
        // Fungsi untuk menggambar seluruh elemen dalam canvas
        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawPlayer();
            drawZombies();
        }
        
        // Fungsi utama yang dijalankan secara terus-menerus
        function update() {
            movePlayer();
            spawnZombie();
            moveZombies();
            draw();
            requestAnimationFrame(update);
        }
        
        // Menangkap tombol yang ditekan atau dilepas
        document.addEventListener("keydown", function(event) {
            keys[event.keyCode] = true;
        });
        
        document.addEventListener("keyup", function(event) {
            keys[event.keyCode] = false;
        });
        
        // Memulai permainan
        update();
    </script>
</body>
</html>