🧱 Tetris

🎮 How to play

Reach the goal score before the stack reaches the top. Filling a whole row clears it and scores points. If a new block has no room, the game is over.

• ◀ ▶ buttons or ← →: Move the block.
• ⟳ or ↑ (or Z): Rotate the block.
• ▼ or ↓: Drop one row faster.
• ⤓ or the space bar: Drop the block all the way down.

⚙️ Your functions

You write these functions. The game calls them when something happens.

• onLine(count)

  Runs when you clear one or more lines. count says how many you cleared at once.

  function onLine(count) {
    score = score + count * 100;
  }

• onLand()

  Runs when a block lands without clearing any lines.

  function onLand() {
    score = score + 1;
  }

🎚️ Settings you can change

Variables at the top of your code are the game's settings. Change a value, press Play, and see what happens.

goal = 500

Reach this score to win.

speed = 2

From 1 (slow) to 5 (fast).

lines = 0

How many lines you have cleared in total. The game keeps this up to date for you. set by the game

score = 0

Your points. The game starts it at 0 and you change it in your functions. set by the game

🪜 Step by step

Each step shows code you can add to the end of your game's code. A function or variable written later replaces the earlier one, so you never have to delete anything.

1. 1Play the starter

   Clear a line or two. onLine(count) gets the number of lines cleared at once, and by default each line is worth 100 points.

   function onLine(count) {
     score = score + count * 100;
   }

2. 2A bonus for a Tetris

   Clearing 4 lines at once is called a Tetris! Give it a big bonus, and score the normal 100 per line otherwise.

   function onLine(count) {
     if (count === 4) {
       score = score + 1000;
     } else {
       score = score + count * 100;
     }
   }

3. 3Speed up with your score

   Make the game faster once your score passes 1000. Rules can depend on any variable, including the score itself.

   function onLine(count) {
     score = score + count * 100;
     if (score >= 1000) {
       speed = 3;
     }
   }

4. 4A one-time first-line bonus

   A variable can be true or false. firstLine starts true, gives a bonus once, and is then switched off.

   let firstLine = true;
   
   function onLine(count) {
     score = score + count * 100;
     if (firstLine) {
       score = score + 200;
       firstLine = false;
     }
   }

// 🧱 Tetris!
let goal = 500;         // reach this score to win
let speed = 2;         // 1 (slow) to 5 (fast)
// The game keeps a variable called lines: how many lines you have cleared in total.

// count is how many lines you just cleared in one go
function onLine(count) {
  score = score + count * 100;
}

function onLand() {
  score = score + 1;
}

💡 Ideas to try

• Make a super-hard mode that starts at speed 4.
• Give a bonus of 1000 for a Tetris (4 lines).
• Make the goal 5000 and speed up every 5 lines.

Tips

• Leave no gaps! Holes make rows impossible to clear.
• The preview shows the next block, so you can plan ahead.

🎓 Lessons for this game

• 🔒Tetris: scoringPremium
• 🔒Tetris: level upPremium
• 🔒Tetris: combosPremium