Board Game Experiment, with JS Prototypes and Canvas

Okay fellows. It took me ages, but I coded my very first game in JavaScript. It’s based on Quoridor, a really interesting “abstract strategy” board game, designed by Mirko Marchesi and published by Gigamic. The rules and logic of it are quite simple, so I thought it would be a nice project for my first experiment of this kind.

What I’m about to do here, is to review step by step how I made it. It was my first real use of Javascript Prototypes and HTML5 canvas, and I learned a lot, so maybe this little “tutorial” will be interesting for you.

  1. Introduction
  2. Markup
  3. Rules
  4. Classes
  5. Game Object
  6. Rendering
  7. Square Object
  8. requestAnimationFrame
  9. Player Object
  10. User Player
  11. Computer Player
  12. Fences Manipulation
  13. Setting Form
  14. Style Sheet
  15. Launching
The game “Quoridor” is legally owned and protected by Gigamic, so you guys understand that this code can’t go further than our private experimental use.

Maybe you would like to play the demo before we make this work and rock.