AI game creator

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

No:8483

3698

←

Prev Next

→

Make me hockey game
Developer anonymous｜Date and time 70/1/1 9:51:05
Build time unknown sec｜Game capacity 3.065KB｜

Script

Sure! Here's a simple example of a hockey game implemented as a single HTML file using JavaScript:

To play the game, simply open the HTML file in a web browser, and you'll see a canvas with a red ball and a blue paddle. Use the arrow keys or the "Left" and "Right" keys on your keyboard to move the paddle. The objective is to bounce the ball off the paddle and prevent it from touching the bottom of the canvas. If the ball hits the bottom, a message saying "Game Over" will appear, and the game will restart.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure! Here's a simple example of a hockey game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Hockey Game</title>
  <style>
    canvas {
      background: #f1f1f1;
      display: block;
      margin: 20px auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
  
  <script>
    // Initialize the game
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");
    
    var ballRadius = 10;
    var x = canvas.width / 2;
    var y = canvas.height - 30;
    var dx = 2;
    var dy = -2;

var paddleHeight = 10;
    var paddleWidth = 75;
    var paddleX = (canvas.width - paddleWidth) / 2;

var rightPressed = false;
    var leftPressed = false;

// Event listeners for keyboard controls
    document.addEventListener("keydown", keyDownHandler, false);
    document.addEventListener("keyup", keyUpHandler, false);

function keyDownHandler(e) {
      if (e.key === "Right" || e.key === "ArrowRight") {
        rightPressed = true;
      } else if (e.key === "Left" || e.key === "ArrowLeft") {
        leftPressed = true;
      }
    }

function keyUpHandler(e) {
      if (e.key === "Right" || e.key === "ArrowRight") {
        rightPressed = false;
      } else if (e.key === "Left" || e.key === "ArrowLeft") {
        leftPressed = false;
      }
    }

// Drawing functions
    function drawBall() {
      ctx.beginPath();
      ctx.arc(x, y, ballRadius, 0, Math.PI * 2, false);
      ctx.fillStyle = "red";
      ctx.fill();
      ctx.closePath();
    }

function drawPaddle() {
      ctx.beginPath();
      ctx.rect(paddleX, canvas.height - paddleHeight, paddleWidth, paddleHeight);
      ctx.fillStyle = "blue";
      ctx.fill();
      ctx.closePath();
    }

function draw() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      drawBall();
      drawPaddle();

// Ball movement logic
      if (x + dx > canvas.width - ballRadius || x + dx < ballRadius) {
        dx = -dx;
      }
      if (y + dy < ballRadius) {
        dy = -dy;
      } else if (y + dy > canvas.height - ballRadius - paddleHeight) {
        if (x > paddleX && x < paddleX + paddleWidth) {
          dy = -dy;
        } else {
          alert("Game Over");
          document.location.reload();
        }
      }

if (rightPressed && paddleX < canvas.width - paddleWidth) {
        paddleX += 7;
      } else if (leftPressed && paddleX > 0) {
        paddleX -= 7;
      }

x += dx;
      y += dy;
    }

setInterval(draw, 10); // Start the game loop
  </script>
</body>
</html>
```