AI game creator

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

No:42327

←

Prev Next

→

テトリス
Developer User18736｜Date and time 24/2/11 11:15:37
Build time 22.516 sec｜Game capacity 5.22KB｜

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 { 
  background-color: black; 
} 
canvas { 
  background-color: #4d4d4d; 
  border: 1px solid black; 
  display: block; 
  margin: 0 auto; 
} 
</style> 
</head> 
<body> 
<canvas id="tetris" width="240" height="400"></canvas>

context.scale(20, 20);

function arenaSweep() { 
  let rowCount = 1; 
  outer: for (let y = arena.length - 1; y > 0; --y) { 
    for (let x = 0; x < arena[y].length; ++x) { 
      if (arena[y][x] === 0) { 
        continue outer; 
      } 
    } 
    const row = arena.splice(y, 1)[0].fill(0); 
    arena.unshift(row); 
    ++y;

player.score += rowCount * 10; 
    rowCount *= 2; 
  } 
}

function createMatrix(w, h) { 
  const matrix = []; 
  while (h--) { 
    matrix.push(new Array(w).fill(0)); 
  } 
  return matrix; 
}

function draw() { 
  context.fillStyle = '#000'; 
  context.fillRect(0, 0, canvas.width, canvas.height);

drawMatrix(arena, {x: 0, y: 0}); 
  drawMatrix(player.matrix, player.pos); 
}

function playerDrop() { 
  player.pos.y++; 
  if (collide(arena, player)) { 
    player.pos.y--; 
    merge(arena, player); 
    playerReset(); 
    arenaSweep(); 
    updateScore(); 
  } 
  dropCounter = 0; 
}

function playerMove(dir) { 
  player.pos.x += dir; 
  if (collide(arena, player)) { 
    player.pos.x -= dir; 
  } 
}

function playerReset() { 
  const pieces = 'ILJOTSZ'; 
  player.matrix = createPiece(pieces[pieces.length * Math.random() | 0]); 
  player.pos.y = 0; 
  player.pos.x = (arena[0].length / 2 | 0) - (player.matrix[0].length / 2 | 0); 
  if (collide(arena, player)) { 
    arena.forEach(row => row.fill(0)); 
    player.score = 0; 
    updateScore(); 
  } 
}

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 updateScore() { 
  document.getElementById('score').innerText = player.score; 
}

const colors = [ 
  null, 
  'purple', 
  'yellow', 
  'orange', 
  'blue', 
  'aqua', 
  'green', 
  'red' 
];

const arena = createMatrix(12, 20);

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

playerReset(); 
updateScore(); 
update(); 
</script>

</body> 
</html>