/SquaredJS

Grid-based game of forming squares to get points

Primary LanguageJavaScript

SquaredJS

A grid-based game of forming squares to get points. Play it here!

To Play

  1. Select a size for your grid (grid dimensions will be n2).
  2. Select a difficulty and color.
  3. Your move! Click on any dot you wish!
  4. Subsequent moves next to any previously selected dot, either by yourself or the opponent, will connect the two dots.
  5. Completing a square will give you one point.
  6. Go!

How It Works

SPOILERS: Play the game first!

  • The dots are drawn on screen using a simple PHP loop and the grid size chosen by the player
  • When a move is made, a series of events is triggered:
    • A sound clip is played
    • A CSS class is added to the dot to change the color
    • All adjacent dots are checked to see if any connecting lines should be drawn
    • Score increase for the move, if any, is calculated and added to the current total
    • An opponent move is triggered one second later
  • Since the connecting lines can only be vertical or horizontal, they are created using divs with the edges pressed together to make a solid line
  • The varying levels of difficulty are achieved by adjusting the probabilities that the oppenent will either:
    • Choose a move at random
    • Choose a move adjacent to your last move
    • Choose a move that will lead to the highest score (there could be multiple options w/ the same scoring potential)