AI game creator

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

No:44595

←

Prev Next

→

Tetris
Developer User19425｜Date and time 24/2/18 15:25:58
Build time 6.304 sec｜Game capacity 2.121KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Tetris</title>
    <style>
      body {
        font-family: Arial, sans-serif;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        margin: 0;
      }
      canvas {
        border: 1px solid #333;
      }
    </style>
  </head>
  <body>
    <canvas id="tetrisCanvas" width="300" height="600"></canvas>
    <script>
      const canvas = document.getElementById('tetrisCanvas');
      const ctx = canvas.getContext('2d');
      const scale = 30;

const matrix = [
        [0, 0, 0],
        [1, 1, 1],
        [0, 1, 0]
      ];

const colors = [
        null,
        '#FF0D72',
        '#0DC2FF',
        '#0DFF72',
        '#F538FF',
        '#FF8E0D',
        '#FFE138',
        '#3877FF'
      ];

const player = {
        matrix: matrix,
        pos: { x: 5, y: 0 },
      };

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        drawMatrix(player.matrix, player.pos);
      }

let dropCounter = 0;
      let dropInterval = 1000;

let lastTime = 0;

function update(time = 0) {
        const deltaTime = time - lastTime;
        lastTime = time;

dropCounter += deltaTime;
        if (dropCounter > dropInterval) {
          playerDrop();
        }

draw();
        requestAnimationFrame(update);
      }

function playerDrop() {
        player.pos.y++;
        dropCounter = 0;
      }

update();
    </script>
  </body>
</html>