const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const grid = 20; let tetrominoes = [ [[1, 1, 1, 1]], [[1, 1], [1, 1]], [[0, 1, 0], [1, 1, 1]], [[1, 1, 0], [0, 1, 1]], [[0, 1, 1], [1, 1, 0]] ]; let colors = ['red', 'blue']; let board = Array.from({ length: 15 }, () => Array(15).fill(0)); let current = { shape: [], x: 0, y: 0, color: '' }; let dropStart = Date.now(); let gameOver = false; function drawSquare(x, y, color) { ctx.fillStyle = color; ctx.fillRect(x * grid, y * grid, grid - 1, grid - 1); } function drawBoard() { for (let r = 0; r < board.length; r++) { for (let c = 0; c < board[r].length; c++) { drawSquare(c, r, board[r][c] ? board[r][c] : 'white'); } } } function randomTetromino() { let r = Math.floor(Math.random() * tetrominoes.length); return { shape: tetrominoes[r], x: Math.floor(Math.random() * (15 - tetrominoes[r][0].length)), y: 0, color: colors[Math.floor(Math.random() * colors.length)] }; } function collision(x, y, shape) { for (let r = 0; r < shape.length; r++) { for (let c = 0; c < shape[r].length; c++) { if (shape[r][c]) { let newX = x + c; let newY = y + r; if (newX < 0 || newX >= 15 || newY >= 15) return true; if (board[newY][newX]) return true; } } } return false; } function rotate(shape) { let newShape = []; for (let c = 0; c < shape[0].length; c++) { newShape[c] = []; for (let r = shape.length - 1; r >= 0; r--) { newShape[c][shape.length - 1 - r] = shape[r][c]; } } return newShape; } function drop() { if (!collision(current.x, current.y + 1, current.shape)) { current.y++; } else { for (let r = 0; r < current.shape.length; r++) { for (let c = 0; c < current.shape[r].length; c++) { if (current.shape[r][c]) { board[current.y + r][current.x + c] = current.color; } } } current = randomTetromino(); if (collision(current.x, current.y, current.shape)) { gameOver = true; } } dropStart = Date.now(); } function removeFullRows() { for (let r = board.length - 1; r >= 0; r--) { if (board[r].every(cell => cell)) { board.splice(r, 1); board.unshift(Array(15).fill(0)); r++; } } } function draw() { ctx.clearRect(0, 0, canvas.width, canvas.height); drawBoard(); for (let r = 0; r < current.shape.length; r++) { for (let c = 0; c < current.shape[r].length; c++) { if (current.shape[r][c]) { drawSquare(current.x + c, current.y + r, current.color); } } } } function gameLoop() { if (gameOver) return; let now = Date.now(); if (now - dropStart > 1000) { drop(); removeFullRows(); } draw(); requestAnimationFrame(gameLoop); } document.addEventListener('keydown', e => { if (gameOver) return; if (e.key === 'ArrowLeft' && !collision(current.x - 1, current.y, current.shape)) { current.x--; } else if (e.key === 'ArrowRight' && !collision(current.x + 1, current.y, current.shape)) { current.x++; } else if (e.key === 'ArrowDown') { drop(); } else if (e.key === 'ArrowUp') { let rotated = rotate(current.shape); if (!collision(current.x, current.y, rotated)) { current.shape = rotated; } } }); current = randomTetromino(); gameLoop

GPTgame

Sign up for free tokens!

Tetris con solo dos colores, rojo y azul

GPTgame