Donkey Kong ChatGPT

<!DOCTYPE html>
<html>
<head>
    <title>Donkey Kong Clone</title>
    <style>
        svg {
            border: 1px solid black;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <svg id="gameCanvas" width="400" height="400"></svg>
    <script>
        const svg = document.getElementById('gameCanvas');
        const player = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
        const platforms = [];
        const ladders = [];

        // Create player character
        player.setAttribute('x', 50);
        player.setAttribute('y', 320);
        player.setAttribute('width', 30);
        player.setAttribute('height', 30);
        player.setAttribute('fill', 'blue');
        svg.appendChild(player);

        // Create platforms
        createPlatform(0, 350, 400, 20);
        createPlatform(100, 300, 100, 20);
        createPlatform(250, 250, 100, 20);

        // Create ladders
        createLadder(175, 250, 30, 100);
        createLadder(75, 300, 30, 50);

        function createPlatform(x, y, width, height) {
            const platform = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
            platform.setAttribute('x', x);
            platform.setAttribute('y', y);
            platform.setAttribute('width', width);
            platform.setAttribute('height', height);
            platform.setAttribute('fill', 'green');
            platforms.push(platform);
            svg.appendChild(platform);
        }

        function createLadder(x, y, width, height) {
            const ladder = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
            ladder.setAttribute('x', x);
            ladder.setAttribute('y', y);
            ladder.setAttribute('width', width);
            ladder.setAttribute('height', height);
            ladder.setAttribute('fill', 'brown');
            ladders.push(ladder);
            svg.appendChild(ladder);
        }

        // Character state
        let isJumping = false;
        let isClimbing = false;
        let jumpHeight = 0;

        // Game loop
        function gameLoop() {
            if (isJumping) {
                jumpHeight++;
                const newY = parseFloat(player.getAttribute('y')) - 5;
                player.setAttribute('y', newY);
                if (jumpHeight === 50) {
                    isJumping = false;
                }
            } else if (isClimbing) {
                const newY = parseFloat(player.getAttribute('y')) - 1;
                player.setAttribute('y', newY);
            }

            requestAnimationFrame(gameLoop);
        }

        // Handle keyboard input
        window.addEventListener('keydown', (event) => {
            if (event.key === 'ArrowLeft') {
                const newX = parseFloat(player.getAttribute('x')) - 5;
                player.setAttribute('x', newX);
            } else if (event.key === 'ArrowRight') {
                const newX = parseFloat(player.getAttribute('x')) + 5;
                player.setAttribute('x', newX);
            } else if (event.key === 'ArrowUp') {
                const playerX = parseFloat(player.getAttribute('x'));
                const playerY = parseFloat(player.getAttribute('y'));
                for (const ladder of ladders) {
                    const ladderX = parseFloat(ladder.getAttribute('x'));
                    const ladderY = parseFloat(ladder.getAttribute('y'));
                    const ladderWidth = parseFloat(ladder.getAttribute('width'));
                    if (
                        playerX + player.getAttribute('width') >= ladderX &&
                        playerX <= ladderX + ladderWidth &&
                        playerY + player.getAttribute('height') > ladderY
                    ) {
                        isClimbing = true;
                        break;
                    }
                }
            } else if (event.key === ' ') {
                if (!isJumping) {
                    isJumping = true;
                    jumpHeight = 0;
                }
            }
        });

        // Handle releasing the "Up" arrow key
        window.addEventListener('keyup', (event) => {
            if (event.key === 'ArrowUp') {
                isClimbing = false;
            }
        });

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