AI game creator

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

No:32020

←

Prev Next

→

bounce girl
Developer User15300｜Date and time 23/12/29 7:25:16
Build time 15.622 sec｜Game capacity 2.621KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Bounce Girl Game</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <script>
        // Getting the canvas and its context
        const canvas = document.createElement("canvas");
        const context = canvas.getContext("2d");

canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

document.body.appendChild(canvas);

// Defining the player object
        const player = {
            x: canvas.width / 2,
            y: canvas.height / 2,
            radius: 30,
            speed: 5,
            dx: 0,
            dy: 0,
        };

// Handling player movement
        function movePlayer() {
            if (keys.ArrowUp || keys.w) {
                if (player.y - player.radius - player.speed > 0) {
                    player.y -= player.speed;
                }
            }
            if (keys.ArrowDown || keys.s) {
                if (player.y + player.radius + player.speed < canvas.height) {
                    player.y += player.speed;
                }
            }
            if (keys.ArrowLeft || keys.a) {
                if (player.x - player.radius - player.speed > 0) {
                    player.x -= player.speed;
                }
            }
            if (keys.ArrowRight || keys.d) {
                if (player.x + player.radius + player.speed < canvas.width) {
                    player.x += player.speed;
                }
            }
        }

// Handling key press
        const keys = {};

document.addEventListener("keydown", function (event) {
            keys[event.key] = true;
        });

document.addEventListener("keyup", function (event) {
            delete keys[event.key];
        });

// Drawing the player
        function drawPlayer() {
            context.beginPath();
            context.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
            context.fillStyle = "blue";
            context.fill();
            context.closePath();
        }

// Updating game state (player movement)
        function update() {
            movePlayer();
        }

// Rendering game objects
        function render() {
            context.clearRect(0, 0, canvas.width, canvas.height);
            drawPlayer();
        }

// Game loop
        function gameLoop() {
            update();
            render();
            requestAnimationFrame(gameLoop);
        }

// Starting the game
        gameLoop();
    </script>
</body>
</html>