AI game creator

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

No:26317

←

Prev Next

→

Blade ball
Developer User12408｜Date and time 23/11/29 3:15:50
Build time 54.787 sec｜Game capacity 3.48KB｜

Script

Sure, here's an example of a simple game called "Blade Ball" implemented as a single HTML file using JavaScript:

This code creates a canvas element where the game is rendered. It displays a ball that bounces off walls and a paddle that can be controlled using the arrow keys. The game loop constantly updates the position of the ball and paddle, handles collisions, and redraws the canvas. Feel free to modify the code to add additional features or customize the game mechanics as per your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

Sure, here's an example of a simple game called "Blade Ball" implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Blade Ball Game</title>
  <style>
    canvas {
      border: 1px solid black;
      display: block;
      margin: 0 auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="300"></canvas>
  
  <script>
    // Enclosing the game code in script tags
    
    // Game variables
    var canvas;
    var ctx;
    var ballX, ballY, ballRadius, ballSpeedX, ballSpeedY;
    var paddleWidth, paddleHeight, paddleX;
    var leftPressed, rightPressed;
  
    function startGame() {
      canvas = document.getElementById("gameCanvas");
      ctx = canvas.getContext("2d");
      ballX = canvas.width / 2;
      ballY = canvas.height - 30;
      ballRadius = 10;
      ballSpeedX = 2;
      ballSpeedY = -2;
      paddleWidth = 75;
      paddleHeight = 10;
      paddleX = (canvas.width - paddleWidth) / 2;
      leftPressed = false;
      rightPressed = false;
  
      // Event listeners for keyboard controls
      document.addEventListener("keydown", handleKeyDown, false);
      document.addEventListener("keyup", handleKeyUp, false);
      
      // Game loop
      setInterval(updateGame, 10);
    }
    
    function handleKeyDown(e) {
      if (e.key === "Right" || e.key === "ArrowRight") {
        rightPressed = true;
      } else if (e.key === "Left" || e.key === "ArrowLeft") {
        leftPressed = true;
      }
    }
    
    function handleKeyUp(e) {
      if (e.key === "Right" || e.key === "ArrowRight") {
        rightPressed = false;
      } else if (e.key === "Left" || e.key === "ArrowLeft") {
        leftPressed = false;
      }
    }
    
    function updateGame() {
      // Clear canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      
      // Draw ball
      ctx.beginPath();
      ctx.arc(ballX, ballY, ballRadius, 0, Math.PI * 2);
      ctx.fillStyle = "#0095DD";
      ctx.fill();
      ctx.closePath();
      
      // Draw paddle
      ctx.beginPath();
      ctx.rect(paddleX, canvas.height - paddleHeight, paddleWidth, paddleHeight);
      ctx.fillStyle = "#0095DD";
      ctx.fill();
      ctx.closePath();
      
      // Move ball
      ballX += ballSpeedX;
      ballY += ballSpeedY;
      
      // Ball collision with walls
      if (ballX + ballSpeedX > canvas.width - ballRadius || ballX + ballSpeedX < ballRadius) {
        ballSpeedX = -ballSpeedX;
      }
      if (ballY + ballSpeedY < ballRadius) {
        ballSpeedY = -ballSpeedY;
      }
      
      // Ball collision with paddle
      if (ballY + ballSpeedY > canvas.height - ballRadius - paddleHeight && ballX > paddleX && ballX < paddleX + paddleWidth) {
        ballSpeedY = -ballSpeedY;
      }
      
      // Move paddle
      if (rightPressed && paddleX < canvas.width - paddleWidth) {
        paddleX += 7;
      } else if (leftPressed && paddleX > 0) {
        paddleX -= 7;
      }
    }
    
    // Start the game when the page loads
    startGame();
  </script>
</body>
</html>
```