Sounds and Asset Management - Beginning HTML5 Games with CreateJS - page 202

The EventDispatcher class is used throughout the entire CreateJS suite. If you recall, all EaselJS display objects
extend DisplayObject , which itself inherits from EventDispatcher . This is how you can set event listeners on shapes,
sprites, and containers. You can also create your own events on these objects and dispatch them. This will be done in
the “Creating and Dispatching Events” section when handling the preloading of assets in the AssetManager class.
To extend EventDispatcher , set up an object the same as you would when extending display objects (see Listing 9-4).
Listing 9-4. Extending the EventDispatcher Class
(function () {
var AssetManager = function () {
this.initialize();
}
var p = AssetManager.prototype = new createjs.EventDispatcher();
p.EventDispatcher_initialize = p.initialize;
p.initialize = function () {
this.EventDispatcher_initialize();
}
window.AssetManager = AssetManager;
}());
This should look familiar to you already as it uses the exact same structure you used when extending display
objects in Chapter 8. To use this class, simply instantiate it like you did with your custom display objects.
var assets = new AssetManager();
This class will be meant to handle assets, so naturally you are going to need to reference the actual assets.
Declaring the Assets and Events
For each asset needed in the application, a string constant should be made. This will be a property that will hold the
string used when identifying the file in the load manifest. Listing 9-5 shows an example of some assets being declared.
Listing 9-5. Constants Used for File Ids
//sounds
p.EXPLOSION = 'explosion';
p.SHIP_FIRE = 'ship fire';
p.POWER_UP = 'power up';
p.SOUNDTRACK = 'soundtrack';
//graphics
p.GAME_SPRITES = 'game sprites';
p.UI_SPRITES = 'ui sprites';
//data
p.GAME_SPRITES_DATA = 'game sprites data';
p.UI_SPRITES_DATA = 'ui game sprites data';