const canvas = document.getElementById("gameCanvas");
const ctx = canvas.getContext("2d");
const ROWS = 20;
const COLS = 10;
const BLOCK_SIZE = 30;
const COLORS = ["cyan", "blue", "orange", "yellow", "green", "purple", "red"];

let board = Array.from({ length: ROWS }, () => Array(COLS).fill(null));
let currentPiece;
let gameOver = false;
let score = 0;

// Define Tetriminos
const TETROMINOS = {
    I: [[1, 1, 1, 1]],
    O: [[1, 1], [1, 1]],
    T: [[0, 1, 0], [1, 1, 1]],
    L: [[1, 0], [1, 0], [1, 1]],
    J: [[0, 1], [0, 1], [1, 1]],
    S: [[0, 1, 1], [1, 1, 0]],
    Z: [[1, 1, 0], [0, 1, 1]]
};

// Randomly choose a tetromino
function randomTetromino() {
    const keys = Object.keys(TETROMINOS);
    const key = keys[Math.floor(Math.random() * keys.length)];
    return { shape: TETROMINOS[key], color: COLORS[keys.indexOf(key)], x: 4, y: 0 };
}

// Draw the board
function drawBoard() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    for (let r = 0; r < ROWS; r