const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const blockSize = 20; const rows = canvas.height / blockSize; const columns = canvas.width / blockSize; let score = 0; const colors = [ 'cyan', 'yellow', 'purple', 'green', 'red', 'blue', 'orange' ]; const tetrominoes = [ [[1, 1, 1, 1]], [[1, 1], [1, 1]], [[1, 1, 0], [0, 1, 1]], [[0, 1, 1], [1, 1, 0]], [[1, 1, 1], [0, 1, 0]], [[1, 1, 1], [1, 0, 0]], [[1, 1, 1], [0, 0, 1]] ]; let currentTetromino = getRandomTetromino(); let currentX = Math.floor(columns / 2) - Math.floor(currentTetromino[0].length / 2); let currentY = 0; let gameLoopInterval; function getRandomTetromino() { const randomIndex = Math.floor(Math.random() * tetrominoes.length); return tetrominoes[randomIndex]; } function drawBlock(x, y, color) { ctx.fillStyle = color; ctx.fillRect(x * blockSize, y * blockSize, blockSize, blockSize); ctx.strokeStyle = 'black'; ctx.strokeRect(x * blockSize, y * blockSize, blockSize, blockSize); } function drawTetromino() { for (let y = 0; y < currentTetromino.length; y++) { for (let x = 0; x < currentTetromino[y].length; x++) { if (currentTetromino[y][x]) { drawBlock(currentX + x, currentY + y, colors[currentTetromino[y][x] - 1]); } } } } function clearTetromino() { for (let y = 0; y < currentTetromino.length; y++) { for (let x = 0; x < currentTetromino[y].length; x++) { if (currentTetromino[y][x]) { drawBlock(currentX + x, currentY + y, 'white'); } } } } function moveTetrominoDown() { if (!isCollision(0, 1, currentTetromino)) { clearTetromino(); currentY++; drawTetromino(); } else { mergeTetromino(); checkForLineClear(); if (!isGameOver()) { currentTetromino = getRandomTetromino(); currentX = Math.floor(columns / 2) - Math.floor(currentTetromino[0].length / 2); currentY = 0; } else { clearInterval(gameLoopInterval); } } } function moveTetrominoLeft() { if (!isCollision(-1, 0, currentTetromino)) { clearTetromino(); currentX--; drawTetromino(); } } function moveTetrominoRight() { if (!isCollision(1, 0, currentTetromino)) { clearTetromino(); currentX++; drawTetromino(); } } function rotateTetromino() { const rotatedTetromino = rotateMatrix(currentTetromino); if (!isCollision(0, 0, rotatedTetromino)) { clearTetromino(); currentTetromino = rotatedTetromino; drawTetromino(); } } function rotateMatrix(matrix) { const rotatedMatrix = []; const rows = matrix.length; const columns = matrix[0].length; for (let y = 0; y < columns; y++) { rotatedMatrix[y] = []; for (let x = 0; x < rows; x++) { rotatedMatrix[y][x] = matrix[rows - 1 - x][y]; } } return rotatedMatrix; } function isCollision(offsetX, offsetY, tetromino) { for (let y = 0; y < tetromino.length; y++) { for (let x = 0; x < tetromino[y].length; x++) { if (tetromino[y][x]) { const newX = currentX + x + offsetX; const newY = currentY + y + offsetY; if (newX < 0 || newX >= columns || newY >= rows || isOccupied(newX, newY)) { return true; } } } } return false; } function isOccupied(x, y) { return (ctx.fillStyle !== 'white' && ctx.fillStyle !== undefined); } function mergeTetromino() { for (let y = 0; y < currentTetromino.length; y++) { for (let x = 0; x < currentTetromino[y].length; x++) { if (currentTetromino[y][x]) { ctx.fillStyle = colors[currentTetromino[y][x] - 1]; ctx.fillRect((currentX + x) * blockSize, (currentY + y) * blockSize, blockSize, blockSize); ctx.strokeStyle = 'black'; ctx.strokeRect((currentX + x) * blockSize, (currentY + y) * blockSize, blockSize, blockSize); } } } } function checkForLineClear() { for (let y = rows - 1; y >= 0; y--) { let isLineFull = true; for (let x = 0; x < columns; x++) { if (!isOccupied(x, y)) { isLineFull = false; break; } } if (isLineFull) { clearLine(y); moveLinesDown(y); score += 10; } } } function clearLine(lineIndex) { for (let x = 0; x < columns; x++) { drawBlock(x, lineIndex, 'white'); } } function moveLinesDown(lineIndex) { for (let y = lineIndex - 1; y >= 0; y--) { for (let x = 0; x < columns; x++) { if (isOccupied(x, y)) { const color = ctx.fillStyle; drawBlock(x, y + 1, color); drawBlock(x, y, 'white'); } } } } function isGameOver() { for (let x = 0; x < columns; x++) { if (isOccupied(x, 0)) { return true; } } return false; } function drawScore() { ctx.fillStyle = 'black'; ctx.font = '20px Arial'; ctx.fillText('Score: ' + score, 10, 30); } function gameLoop() { moveTetrominoDown(); drawScore(); } document.addEventListener('keydown', function(event) { switch (event.keyCode) { case 37: // Left arrow key moveTetrominoLeft(); break; case 39: // Right arrow key moveTetrominoRight(); break; case 40: // Down arrow key moveTetrominoDown(); break; case 38: // Up arrow key rotateTetromino(); break; } }); gameLoopInterval = setInterval(gameLoop, 1000); drawTetromino();

GPTgame

Sign up for free tokens!

made a tetris. if a block collide with bottom, stop it and generate new.

GPTgame