Ein Badminton Spiel .'s game

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

No:24293

←

Prev Next

→

Ein Badminton Spiel .
Developer User11409｜Date and time 23/11/7 5:42:59
Build time 63.797 sec｜Game capacity 2.361KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Badminton Spiel</title>
</head>
<body>
    <canvas id="badmintonCourt" width="400" height="600"></canvas>

const playerImage = new Image();
        playerImage.src = "player.png";

// Initialisierung des Spiels
        function startGame() {
            myGameArea.start();
            myGamePiece = new component(30, 30, playerImage, 175, 570);
            myBall = new component(10, 10, ballImage, 195, 300);
        }

// Spielbereich
        const myGameArea = {
            canvas: document.getElementById("badmintonCourt"),
            start: function () {
                this.context = this.canvas.getContext("2d");
                this.interval = setInterval(updateGameArea, 20);
            },
            clear: function () {
                this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
            }
        };

// Komponente
        function component(width, height, image, x, y) {
            this.width = width;
            this.height = height;
            this.image = image;
            this.x = x;
            this.y = y;
            this.update = function () {
                const ctx = myGameArea.context;
                ctx.drawImage(this.image, this.x, this.y, this.width, this.height);
            };
            this.newPos = function (x, y) {
                this.x += x;
                this.y += y;
            };
        }

// Aktualisierung des Spiels
        function updateGameArea() {
            myGameArea.clear();
            myGamePiece.update();
            myBall.update();
        }

// Steuerung des Spielers auf Smartphone
        function moveLeft() {
            myGamePiece.newPos(-10, 0);
        }

function moveRight() {
            myGamePiece.newPos(10, 0);
        }

// Event Listener zur Steuerung
        document.addEventListener('keydown', function (event) {
            if (event.keyCode === 37) {
                moveLeft();
            } else if (event.keyCode === 39) {
                moveRight();
            }
        });

// Spiel starten
        startGame();
    </script>
</body>
</html>