Make a game where you run away from a robot emoji, the player himself is a shock emoji, the background is grey's game

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

No:50527

305

←

Prev Next

→

Make a game where you run away from a robot emoji,..ALL
Developer User15365｜Date and time 24/3/8 20:37:17
Build time 7.11 sec｜Game capacity 2.325KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Escape from the Robot Emoji</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400" style="border:1px solid black;"></canvas>

var player = {
            x: 50,
            y: 50,
            size: 20,
            color: 'yellow',
            speed: 4
        };

var robot = {
            x: canvas.width - 50,
            y: canvas.height - 50,
            size: 20,
            color: 'red',
            speed: 2
        };

document.addEventListener('keydown', function(event) {
            switch(event.keyCode) {
                case 37: // left arrow key
                    player.x -= player.speed;
                    break;
                case 39: // right arrow key
                    player.x += player.speed;
                    break;
                case 38: // up arrow key
                    player.y -= player.speed;
                    break;
                case 40: // down arrow key
                    player.y += player.speed;
                    break;
            }
        });

function update() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
            drawRobot();

if(isColliding()) {
                alert('Game Over! You were caught by the robot emoji.');
                player.x = 50;
                player.y = 50;
            }

requestAnimationFrame(update);
        }

function drawPlayer() {
            ctx.fillStyle = player.color;
            ctx.fillRect(player.x, player.y, player.size, player.size);
        }

function drawRobot() {
            ctx.fillStyle = robot.color;
            ctx.fillRect(robot.x, robot.y, robot.size, robot.size);
            robot.x -= robot.speed;
            if(robot.x < 0) {
                robot.x = canvas.width;
            }
        }

function isColliding() {
            return player.x < robot.x + robot.size &&
                   player.x + player.size > robot.x &&
                   player.y < robot.y + robot.size &&
                   player.y + player.size > robot.y;
        }

update();
    </script>
</body>
</html>