/** * @author Mat Groves http://matgroves.com/ @Doormat23 */ /** * The image loader class is responsible for loading images file formats ('jpeg', 'jpg', 'png' and 'gif') * Once the image has been loaded it is stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrame() and PIXI.Sprite.fromFrame() * When loaded this class will dispatch a 'loaded' event * * @class ImageLoader * @uses EventTarget * @constructor * @param url {String} The url of the image * @param crossorigin {Boolean} Whether requests should be treated as crossorigin */ PIXI.ImageLoader = function(url, crossorigin) { /** * The texture being loaded * * @property texture * @type Texture */ this.texture = PIXI.Texture.fromImage(url, crossorigin); /** * if the image is loaded with loadFramedSpriteSheet * frames will contain the sprite sheet frames * * @property frames * @type Array * @readOnly */ this.frames = []; }; // constructor PIXI.ImageLoader.prototype.constructor = PIXI.ImageLoader; PIXI.EventTarget.mixin(PIXI.ImageLoader.prototype); /** * Loads image or takes it from cache * * @method load */ PIXI.ImageLoader.prototype.load = function() { if(!this.texture.baseTexture.hasLoaded) { this.texture.baseTexture.on('loaded', this.onLoaded.bind(this)); } else { this.onLoaded(); } }; /** * Invoked when image file is loaded or it is already cached and ready to use * * @method onLoaded * @private */ PIXI.ImageLoader.prototype.onLoaded = function() { this.emit('loaded', { content: this }); }; /** * Loads image and split it to uniform sized frames * * @method loadFramedSpriteSheet * @param frameWidth {Number} width of each frame * @param frameHeight {Number} height of each frame * @param textureName {String} if given, the frames will be cached in <textureName>-<ord> format */ PIXI.ImageLoader.prototype.loadFramedSpriteSheet = function(frameWidth, frameHeight, textureName) { this.frames = []; if(!this.texture.baseTexture.hasLoaded) { var scope = this; textureName = textureName || scope.texture.baseTexture.imageUrl; this.texture.baseTexture.addEventListener('loaded', function () { var texture; var cols = Math.floor(scope.texture.width / frameWidth); var rows = Math.floor(scope.texture.height / frameHeight); var i = 0; for (var y = 0; y < rows; y++) { for (var x = 0; x < cols; x++, i++) { if (!PIXI.TextureCache[textureName + '-' + i]) { texture = new PIXI.Texture(scope.texture, { x: x * frameWidth, y: y * frameHeight, width: frameWidth, height: frameHeight }); PIXI.TextureCache[textureName + '-' + i] = texture; } else { texture = PIXI.TextureCache[textureName + '-' + i]; } scope.frames.push(texture); } } scope.onLoaded(); }); } else { textureName = textureName || this.texture.baseTexture.imageUrl; var texture; var cols = Math.floor(this.texture.width / frameWidth); var rows = Math.floor(this.texture.height / frameHeight); var i = 0; for (var y = 0; y < rows; y++) { for (var x = 0; x < cols; x++, i++) { if (!PIXI.TextureCache[textureName + '-' + i]) { texture = new PIXI.Texture(this.texture, { x: x * frameWidth, y: y * frameHeight, width: frameWidth, height: frameHeight }); PIXI.TextureCache[textureName + '-' + i] = texture; } else { texture = PIXI.TextureCache[textureName + '-' + i]; } this.frames.push(texture); } } this.onLoaded(); } };