HTML and CSS Reference
In-Depth Information
# ctrls {
text-align : center;
font-size : 18px;
Step 3: Implement time-saving scripts
Next, create a folder called js to house all of your JavaScript files. Inside create a file called
run.js that will house all of your run code. Next to run.js create a folder called engine. In-
side of engine create another folder called assets. You'll fill up the assets folder with four
scripts that will save you time.
Getting your engine up and running requires several different external files. You'll need the
• Paul Irish's requestAnimationFrame() inside animation.js
• A slightly modified version of John Resig's Class Extension script called classes.js
• A transformation matrix library called sylvester.js
• Helpers from webgl_util.js
We'll explain exactly what each component does and how it aids your engine's functional-
ity as we proceed.
Paul Irish's requestAnimationFrame
Our goal is to equip your engine with best animation practices similar to those we discussed
in chapter 6 on 2D Canvas. When we say “best animation practices,” we mean
• Using requestAnimationFrame() instead of setInterval for mobile
compatibility, to prevent updates when in another tab, and to prevent frame rate
• Testing for the requestAnimationFrame() in other browsers with Paul
Irish's polyfill and guaranteeing support for older browsers like IE8
Search WWH ::

Custom Search