AI game creator

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

No:41174

←

Prev Next

→

Friday night funkin
Developer User18485｜Date and time 24/2/6 12:28:23
Build time 12.578 sec｜Game capacity 4.042KB｜

Script

Sure, here's an example of a simple JavaScript game based on the popular rhythm game "Friday Night Funkin'" that can be played on a smartphone. The game uses pictograms as graphics for simplicity. Just copy the code below into a single HTML file:

Please note that in order to run this code, you'll need to replace the `emozi_all/player.png`, `emozi_himawari.png`, `emozi_cat.png`, `emozi_rabbit.png`, and `emozi_apple.png` image files with actual pictograms or image files of your choice. Additionally, you can modify the code further to add sound effects, scoring, levels, etc., based on your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Friday Night Funkin'</title>
</head>
<body>
    <canvas id="gameCanvas" width="320" height="480"></canvas>
    <script>
        // Game variables
        var canvas, context;
        var player;
        var arrows = [];

// Pictograms
        var playerImage = new Image();
        playerImage.src = "player.png";
        var arrowImages = {
            "up": new Image(),
            "down": new Image(),
            "left": new Image(),
            "right": new Image()
        };
        arrowImages.up.src = "up.png";
        arrowImages.down.src = "down.png";
        arrowImages.left.src = "left.png";
        arrowImages.right.src = "right.png";

// Game initialization
        function init() {
            canvas = document.getElementById("gameCanvas");
            context = canvas.getContext("2d");
            player = { x: 150, y: 400 };

// Arrow spawning loop
            setInterval(function() {
                var arrow = {
                    x: Math.random() * (canvas.width - 50),
                    y: -50,
                    type: getRandomArrowType()
                };
                arrows.push(arrow);
            }, 1000);
            
            // Key listeners
            canvas.addEventListener("keydown", function(event) {
                movePlayer(event.keyCode);
            });
        }

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

// Draw player
            context.drawImage(playerImage, player.x, player.y, 50, 50);

// Draw arrows
            for (var i = 0; i < arrows.length; i++) {
                var arrow = arrows[i];
                context.drawImage(arrowImages[arrow.type], arrow.x, arrow.y, 50, 50);
                arrow.y += 5; // Arrow speed
                if (arrow.y + 50 > canvas.height) {
                    arrows.splice(i, 1); // Remove arrow if it reaches the bottom of the screen
                    i--;
                }
            }
            
            // Collision detection
            for (var i = 0; i < arrows.length; i++) {
                var arrow = arrows[i];
                if (player.x < arrow.x + 50 &&
                    player.x + 50 > arrow.x &&
                    player.y < arrow.y + 50 &&
                    player.y + 50 > arrow.y) {
                    arrows.splice(i, 1); // Remove arrow if it collides with the player
                    i--;
                }
            }
            
            // Game over condition
            if (arrows.length > 10) {
                alert("Game Over!");
                location.reload(); // Restart the game
            }

// Request next frame
            requestAnimationFrame(update);
        }

// Function to move the player
        function movePlayer(keyCode) {
            if (keyCode === 37) { // Left arrow key
                player.x -= 50;
            } else if (keyCode === 39) { // Right arrow key
                player.x += 50;
            }
        }

// Function to get a random arrow type
        function getRandomArrowType() {
            var types = ["up", "down", "left", "right"];
            return types[Math.floor(Math.random() * types.length)];
        }

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

Please note that in order to run this code, you'll need to replace the `player.png`, `up.png`, `down.png`, `left.png`, and `right.png` image files with actual pictograms or image files of your choice. Additionally, you can modify the code further to add sound effects, scoring, levels, etc., based on your requirements.