AI game creator

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

No:36582

←

Prev Next

→

Golf Game
Developer User16822｜Date and time 24/1/17 23:51:45
Build time 13.338 sec｜Game capacity 2.903KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Golf Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
        // Variables for game canvas and context
        var canvas = document.getElementById("gameCanvas");
        var ctx = canvas.getContext("2d");

// Variables for ball and hole positions
        var ballX = 200;
        var ballY = 300;
        var holeX = Math.random() * 380;
        var holeY = Math.random() * 500;

// Variable for game score
        var score = 0;

// Function to handle touch/click event on canvas
        function handleEvent(event) {
            var rect = canvas.getBoundingClientRect();
            var x = event.clientX - rect.left;
            var y = event.clientY - rect.top;

// Check if touch/click is within hole bounds
            if (x >= holeX && x < holeX + 20 && y >= holeY && y < holeY + 20) {
                score++; // Increase score
                resetBallAndHole(); // Reset ball and hole positions
            }
        }

// Function to reset ball and hole positions
        function resetBallAndHole() {
            ballX = 200;
            ballY = 300;
            holeX = Math.random() * 380;
            holeY = Math.random() * 500;
        }

// Function to update game canvas
        function updateCanvas() {
            // Clear canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw hole
            ctx.fillRect(holeX, holeY, 20, 20);

// Draw ball
            ctx.beginPath();
            ctx.arc(ballX, ballY, 10, 0, 2 * Math.PI);
            ctx.fillStyle = "green";
            ctx.fill();
            ctx.closePath();

// Draw score
            ctx.font = "20px Arial";
            ctx.fillText("Score: " + score, 10, 30);
        }

// Function to handle ball movement
        function moveBall(event) {
            var rect = canvas.getBoundingClientRect();
            var x = event.clientX - rect.left;
            var y = event.clientY - rect.top;

// Calculate ball movement based on touch/click position
            if (x > ballX) {
                ballX += 5;
            } else if (x < ballX) {
                ballX -= 5;
            }

if (y > ballY) {
                ballY += 5;
            } else if (y < ballY) {
                ballY -= 5;
            }
        }

// Add event listeners for touch/click and ball movement
        canvas.addEventListener("touchstart", handleEvent, false);
        canvas.addEventListener("mousedown", handleEvent, false);
        canvas.addEventListener("touchmove", moveBall, false);
        canvas.addEventListener("mousemove", moveBall, false);

// Start game processing by updating canvas continuously
        setInterval(updateCanvas, 10);
    </script>
</body>
</html>