A Game About your a snake and you need to eat fruit to get longer and longer you cant touch black fruit's game

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

No:10968

104

←

Prev Next

→

A Game About your a snake and you need to eat frui..ALL
Developer User4715｜Date and time 23/8/6 9:41:54
Build time 20.738 sec｜Game capacity 4.104KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            background-color: black;
            margin: 0;
            overflow: hidden;
        }
        
        canvas {
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>
    
    <script>
        document.addEventListener("DOMContentLoaded", function(){
            const canvas = document.getElementById("gameCanvas");
            const context = canvas.getContext("2d");
            
            // Set canvas size
            const canvasWidth = window.innerWidth;
            const canvasHeight = window.innerHeight;
            canvas.width = canvasWidth;
            canvas.height = canvasHeight;
            
            // Snake initial position and size
            let snakeX = canvasWidth / 2;
            let snakeY = canvasHeight / 2;
            const snakeSize = 20;
            
            // Fruit position and size
            let fruitX = Math.floor(Math.random() * (canvasWidth - snakeSize));
            let fruitY = Math.floor(Math.random() * (canvasHeight - snakeSize));
            const fruitSize = 20;
            
            // Movement variables
            let dx = snakeSize; // move right by default
            let dy = 0;
            
            // Score
            let score = 0;
            
            // Function to draw snake and fruit
            function draw() {
                // Clear canvas
                context.clearRect(0, 0, canvasWidth, canvasHeight);
                
                // Draw snake
                context.fillStyle = "green";
                context.fillRect(snakeX, snakeY, snakeSize, snakeSize);
                
                // Draw fruit
                context.fillStyle = "red";
                context.fillRect(fruitX, fruitY, fruitSize, fruitSize);
            }
            
            // Function to check collision with fruit
            function checkCollision() {
                if (snakeX === fruitX && snakeY === fruitY) {
                    // Increase snake length
                    score++;
                    
                    // Generate new random fruit position
                    fruitX = Math.floor(Math.random() * (canvasWidth - snakeSize));
                    fruitY = Math.floor(Math.random() * (canvasHeight - snakeSize));
                }
            }
            
            // Function to handle user input
            function handleInput(event) {
                if (event.keyCode === 37 && dx !== snakeSize) { // left arrow
                    dx = -snakeSize;
                    dy = 0;
                } else if (event.keyCode === 38 && dy !== snakeSize) { // up arrow
                    dx = 0;
                    dy = -snakeSize;
                } else if (event.keyCode === 39 && dx !== -snakeSize) { // right arrow
                    dx = snakeSize;
                    dy = 0;
                } else if (event.keyCode === 40 && dy !== -snakeSize) { // down arrow
                    dx = 0;
                    dy = snakeSize;
                }
            }
            
            // Function to update snake position
            function update() {
                snakeX += dx;
                snakeY += dy;
                
                // Check collision with canvas edges
                if (snakeX < 0 || snakeX >= canvasWidth || snakeY < 0 || snakeY >= canvasHeight) {
                    // Game over
                    alert("Game Over! Your score: " + score);
                    document.location.reload(); // refresh the page to restart the game
                }
                
                // Check collision with fruit
                checkCollision();
                
                // Call draw function to update game visuals
                draw();
            }
            
            // Start the game loop
            setInterval(update, 100);
            
            // Listen for user input on arrow keys
            document.addEventListener("keydown", handleInput);
        });
    </script>
</body>
</html>