VerTris: A 2-Player HTML5 Tetris Game

VerTris is a modern, 2-player Tetris game built with HTML5, CSS, and JavaScript. It offers a local multiplayer experience on a single screen, complete with PS4 controller support and competitive mechanics.

Key Features

  • Local Multiplayer: Two players can compete against each other on the same screen, each with their own game board.
  • PS4 Controller Support: The game seamlessly integrates with PS4 controllers, providing an intuitive and console-like gaming experience.
  • Keyboard Controls: For those who prefer a classic setup, the game also supports keyboard controls for both players.
  • Garbage Line Mechanic: Clearing multiple lines sends "garbage" lines to the opponent's board, adding a strategic layer to the gameplay.
  • Hold Piece: Players can "hold" a Tetrimino to save it for later use, allowing for more strategic piece placement.
  • Ghost Piece: A "ghost" of the current piece is displayed at the bottom of the board, showing where it will land. This helps players plan their moves more accurately.
  • AI Opponent: If Player 2 is idle for a certain period, a simple AI takes over, ensuring the game can still be played.
  • Modern Aesthetics: The game features a clean, dark theme with neon green accents, providing a visually appealing experience.

How to Play

  1. Start the Game: Open the index.html file in a modern web browser.
  2. Controls:
    1. Player 1 (Keyboard):
      1. Move: A / D
      2. Soft Drop: S
      3. Hard Drop: Space
      4. Rotate: Q / E
      5. Hold: R
    2. Player 2 (Keyboard):
      1. Move: Left / Right Arrow Keys
      2. Soft Drop: Down Arrow Key
      3. Hard Drop: Up Arrow Key
      4. Rotate: , / .
      5. Hold: /
    3. Gamepad (PS4 Controller):
      1. Move: D-Pad
      2. Hard Drop: X Button
      3. Rotate: L1 / R1 Triggers
      4. Hold: Circle Button
  3. Gameplay:
    1. Clear lines to score points.
    2. Clearing 2 or more lines at once will send garbage lines to your opponent.
    3. The game ends when a player's pieces stack up to the top of the board.

Technical Details

Frontend: The game is built entirely with HTML, CSS, and vanilla JavaScript.

Gamepad API: The Gamepad API is used to detect and handle input from connected controllers.

Canvas: The game boards are rendered on HTML <canvas> elements.

No Dependencies: The project has no external libraries or frameworks, making it lightweight and easy to run.

Leave a comment

Log in with itch.io to leave a comment.