RCWeb Tetris App

The RCWeb Tetris App (app/tetris) is a competitive two-player arcade puzzle game leveraging the Asymmetric Pattern. It renders two independent drop-matrices on a single viewer screen while remote clients connect to act as dedicated gamepads.

Icon

Screenshot

What it does

• Dual-Matrix Gameplay: Runs two independent game boards (Player 1 "Red" and Player 2 "Blue") side-by-side using two separate HTML5 <canvas> elements.
• Classic Mechanics: Implements standard tetrimino behaviors including wall-kicks (offset checks), hard-drops, and score-based gravity increments (drop speed increases as lines are cleared).
• Matchmaking UI: Automatically reserves the first connecting controller as Player 1 and the second as Player 2, dynamically generating a joined-session QR code and broadcasting dynamic UI theme colors to each remote participant.

How it works

The core script.js manages state through a structured object approach rather than a global singleton, allowing it to easily manage multiple independent arenas.

• State Templates: The stateTemplate factory function instantiates isolated playerState objects containing the matrix array, position pos, score, and drop counters for each player.
• Collision Detection: The collide function iterates the active matrix grid against the settled arena grid mathematically, ensuring blocks stop correctly and restricting illegal rotations from intersecting existing geometry.
• Bi-directional Feedback: When a user scores points or "tops out", the game engine actively sends UI commands back to the controller via rc.send() (e.g., controls.setScore(0) or controls.setTheme('default')) to keep the gamepad's LCD-style readouts perfectly synced.

Launch RCWeb App