HTML and CSS Reference
In-Depth Information
// Cloud 2 Bitmap
var cloud2 = new cjs.Bitmap('images/cloud2.png');
cloud2.y = 300;
cloud2.alpha = 0.4;
this.addChild(cloud2);
// Cloud 2 Tween Animation
cjs.Tween.get(cloud2, {loop:true})
.to({x:game.setting.gameWidth + 50}, 0)
.wait(500)
.to({x:-300}, 50*1000);
}
BGLayer.prototype = Object.create(Layer.prototype);
return BGLayer;
})();
5. The user interface layer contains indicators and butons. We will add the butons
in later tasks. In this task, we set up the heads-up display using a separated
setupHUD method:
// User Interface
game.UILayer = (function(){
function UILayer() {
Layer.call(this);
this.setupHUD();
}
UILayer.prototype = Object.create(Layer.prototype);
// prototype functions to be placed here.
return UILayer;
})();
6. Seing up a user interface programmaically may require long and redundant code.
Thus, we create the following two methods to reuse bitmap and text creaion:
UILayer.prototype.placeBitmap = function(path, x, y) {
var bitmap = new cjs.Bitmap(path);
bitmap.x = x;
bitmap.y = y;
this.addChild(bitmap);
};
UILayer.prototype.placeText =
function(text, size, x, y, align) {
var text = new cjs.Text(text, size +
'px Arial', '#222');
text.x = x;
 
Search WWH ::




Custom Search