Coding the Engine

I take an iterative approach to writing this game, adding layers to the game to build and hone it to a working game. With the scaffold out of the way, the first thing I want to do is create some variables that will store the canvas DOM element, as well as create a context for the game. Below the <footer>, add a <script> element with Listing 6–5.

Listing 6–5. Defining the canvas Element

<script> var canvas = document.getElementById('game'); var context = canvas.getContext('2d'); </script>

I am placing the script at the bottom of the page to ensure that all the page content loads before the code for the game loads into the browser’s memory. Next, I want to stub out a gameLoop function that will handle all the drawing on the ...

Get Beginning Facebook Game Apps Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.