AI game creator

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

No:28881

119

←

Prev Next

→

Super mario 7
Developer User14291｜Date and time 23/12/14 22:25:24
Build time 33.862 sec｜Game capacity 2.238KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Super Mario 7</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="480" height="320"></canvas>
    <script>
        // Initialize the game variables
        var canvas = document.getElementById('gameCanvas');
        var context = canvas.getContext('2d');
        var marioImage = new Image();
        marioImage.src = 'mario.png';
        var marioX = canvas.width / 2;
        var marioY = canvas.height - 80;
        var marioSpeed = 5;

// Event listeners for smartphone operation
        canvas.addEventListener('touchstart', handleTouchStart);
        canvas.addEventListener('touchmove', handleTouchMove);

// Touch event handling functions
        var xDown = null;
        var yDown = null;

function handleTouchStart(event) {
            xDown = event.touches[0].clientX;
            yDown = event.touches[0].clientY;
        }

function handleTouchMove(event) {
            if (!xDown || !yDown) {
                return;
            }

var xUp = event.touches[0].clientX;
            var yUp = event.touches[0].clientY;
            var xDiff = xDown - xUp;
            var yDiff = yDown - yUp;

// Move Mario based on touch swipe direction
            if (Math.abs(xDiff) > Math.abs(yDiff)) {
                if (xDiff > 0) {
                    marioX -= marioSpeed;
                } else {
                    marioX += marioSpeed;
                }
            } else {
                if (yDiff > 0) {
                    marioY -= marioSpeed;
                } else {
                    marioY += marioSpeed;
                }
            }

xDown = null;
            yDown = null;
        }

// Game loop function
        function gameLoop() {
            context.clearRect(0, 0, canvas.width, canvas.height);
            context.drawImage(marioImage, marioX, marioY, 32, 32);

// Call gameLoop every frame
            requestAnimationFrame(gameLoop);
        }

// Start the game
        marioImage.onload = function () {
            gameLoop();
        };
    </script>
</body>
</html>