AI game creator

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

No:10171

114

←

Prev Next

→

Wally's world
Developer User4491｜Date and time 23/7/29 5:38:03
Build time 19.586 sec｜Game capacity 3.225KB｜

Script

Sure! Here's an example of a simple game called "Wally's World" implemented as a single HTML file using JavaScript. The game can be played on a smartphone and incorporates pictograms for added visual appeal:

Please note that in order to run this code, you would need to have two pictogram images, one named "emozi_all/pictogram.png" representing the character and another named "emozi_apple.png" representing the goal object.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Wally's World</title> 
</head>
<body>
    <canvas id="gameCanvas" width="320" height="480"></canvas>

// Pictograms
        const wallyImage = new Image();
        wallyImage.src = "wally.png";
        const goalImage = new Image();
        goalImage.src = "goal.png";

// Game variables
        let wallyX = canvas.width / 2;
        let wallyY = canvas.height - 50;
        let goalX = Math.random() * (canvas.width - 32) + 16;
        let goalY = 20;
        let score = 0;

// Game functions
        function draw() {
            // Clear canvas
            context.clearRect(0, 0, canvas.width, canvas.height);

// Draw Wally
            context.drawImage(wallyImage, wallyX, wallyY, 32, 32);

// Draw Goal
            context.drawImage(goalImage, goalX, goalY, 32, 32);

// Draw score
            context.font = "16px Arial";
            context.fillStyle = "#000";
            context.fillText("Score: " + score, 10, 25);
        }

function update() {
            // Update Wally's position based on device tilt
            if (window.DeviceOrientationEvent) {
                window.addEventListener("deviceorientation", function (event) {
                    wallyX += event.gamma / 10;
                    wallyY += event.beta / 10;
                }, true);
            }

// Keep Wally within the canvas bounds
            if (wallyX < 0) {
                wallyX = 0;
            }
            if (wallyX > canvas.width - 32) {
                wallyX = canvas.width - 32;
            }
            if (wallyY < 0) {
                wallyY = 0;
            }
            if (wallyY > canvas.height - 32) {
                wallyY = canvas.height - 32;
            }

// Check for collision between Wally and the goal
            if (wallyX < goalX + 32 &&
                wallyX + 32 > goalX &&
                wallyY < goalY + 32 &&
                wallyY + 32 > goalY) {
                score++;
                goalX = Math.random() * (canvas.width - 32) + 16;
                goalY = 20;
            }

// Move the goal downwards
            goalY += 2;

// Game over condition
            if (wallyY > canvas.height - 64) {
                alert("Game over! Your score: " + score);
                // Add any desired reset logic here
            }
        }

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

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

Please note that in order to run this code, you would need to have two pictogram images, one named "wally.png" representing the character and another named "goal.png" representing the goal object.