Game Development Reference
In-Depth Information
preloader.x = (stage.canvas.width / 2) - (preloader.width / 2);
preloader.y = (stage.canvas.height / 2) - (preloader.height / 2);
stage.addChild(preloader);
queue.addEventListener("complete", initGame);
queue.addEventListener('progress', onFileProgress);
queue.load();
}
function onFileProgress(e) {
preloader.update(e.progress);
}
function initGame() {
stage.removeChild(preloader);
preloader = null;
spritesheet = new createjs.SpriteSheet({
"images":[queue.getResult("runner")],
"frames":{"regX":0, "height":292, "count":64, "regY":0, "width":165},
"animations":{"idle":[60], "run":[0, 25], "jump":[31, 60, 'idle']}
});
buildRunner();
buildButtons();
}
function buildRunner() {
runner = new sprites.Runner(spritesheet);
runner.y = 100;
stage.addChild(runner);
}
function buildButtons() {
var jumpBtn = new ui.SimpleButton("JUMP");
var runBtn = new ui.SimpleButton("RUN");
var idleBtn = new ui.SimpleButton("IDLE");
jumpBtn.on('click', function (e) {
runner.jump();
});
runBtn.on('click', function (e) {
runner.run();
});
runBtn.x = jumpBtn.width + 10;
idleBtn.on('click', function (e) {
runner.stand();
});
idleBtn.x = runBtn.x + runBtn.width + 10;
stage.addChild(jumpBtn, runBtn, idleBtn);
}
When running this application, it is likely that you won't even see the preloader in action. This is because only
one file is being loaded. If you would like to see it animate, try running the application on a server, or include some
extra, larger files in the manifest.
Click the buttons to make the runner run, jump, or stop entirely. Figure
8-9
shows the runner in full stride, after
the Jump button has been clicked while running.
