AI game creator

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

No:25

416

←

Prev Next

→

Tennis
Developer User125｜Date and time 23/4/24 16:57:44
Build time 96.435 sec｜Game capacity 3.79KB｜

Script

tennis

People who love tennis, come join us!

In this game, you can enjoy tennis in a pseudo manner!

Tilt your smartphone left and right and move the racket up and down to return the ball!

Keep returning the opponent’s ball and challenge how far you can extend your score!

Gachapin’s bento was delicious!

But in the middle of the night my stomach started to churn. . .

As expected, I can’t take time off from work because of a stomachache, so I have no choice but to put up with it.

But I want to reward myself for working hard!

In that case, let’s play tennis!

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

<div style="text-align:center; font-size: 30px;">
    <p>テニス</p>
    <p style="font-size: 20px; margin-top: 50px;">テニスが好きな人、集まってくれー！</p>
    <p style="font-size: 20px;">このゲームは、疑似的にテニスを楽しめるんだ！</p>
    <p style="font-size: 20px;">スマホを左右に傾けて、ラケットの上下移動でボールを返そう！</p>
    <p style="font-size: 20px;">相手のボールを返し続けて、どこまでスコアを伸ばせるか挑戦しよう！</p>
</div>
<div style="text-align:center; padding-top: 80px;">
    <p style="font-size: 25px;">ガチャピンのお弁当、美味しかったー！</p>
    <p style="font-size: 25px;">でも、夜中にお腹がグルグルしてきた。。。</p>
    <p style="font-size: 25px;">さすがに腹痛で仕事を休むわけにもいかず、我慢するしかないか</p>
    <p style="font-size: 25px;">でも、頑張ってる自分にご褒美をあげたいな！</p>
    <p style="font-size: 25px;">そんな時は、テニスをやろう！</p>
</div>
<div style="text-align:center; padding-top: 80px;">
    <canvas id="game" width="400" height="600" style="border: solid 1px black;"></canvas>
</div>

const BALL_SIZE = 10;
    const BALL_SPEED = 5;
    const RACKET_WIDTH = 80;
    const RACKET_HEIGHT = 10;
    const RACKET_SPEED = 10;
    const CANVAS_WIDTH = canvas.width;
    const CANVAS_HEIGHT = canvas.height;
    let score = 0;
    let ballX = 100;
    let ballY = 100;
    let ballSpeedX = BALL_SPEED;
    let ballSpeedY = BALL_SPEED;
    let racketX = 160;
    let isGameOver = false;

const drawRacket = () => {
      ctx.fillStyle = 'black';
      ctx.fillRect(racketX, CANVAS_HEIGHT - RACKET_HEIGHT, RACKET_WIDTH, RACKET_HEIGHT);
    };

const drawBall = () => {
      ctx.beginPath();
      ctx.arc(ballX, ballY, BALL_SIZE, 0, Math.PI * 2, true);
      ctx.closePath();
      ctx.fillStyle = 'black';
      ctx.fill();
    };

const drawScore = () => {
      ctx.font = 'bold 20px Arial';
      ctx.fillText(`SCORE: ${score}`, CANVAS_WIDTH - 120, 20);
    };

const drawGameOver = () => {
      ctx.font = 'bold 40px Arial';
      ctx.fillStyle = 'red';
      ctx.textAlign = 'center';
      ctx.fillText('GAME OVER', CANVAS_WIDTH / 2, CANVAS_HEIGHT / 2);
    };

const update = () => {
      if (isGameOver) {
          drawGameOver();
          return;
      }
      ctx.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);
      moveBall();
      drawBall();
      drawRacket();
      drawScore();
      requestAnimationFrame(update);
    };
    update();
</script>