diff --git a/src/core/textures/Spritesheet.js b/src/core/textures/Spritesheet.js index 1a9223f..adb555c 100644 --- a/src/core/textures/Spritesheet.js +++ b/src/core/textures/Spritesheet.js @@ -156,20 +156,24 @@ while (frameIndex - initialFrameIndex < maxFrames && frameIndex < this._frameKeys.length) { const i = this._frameKeys[frameIndex]; - const rect = this._frames[i].frame; + const data = this._frames[i]; + const rect = data.frame; if (rect) { let frame = null; let trim = null; + const sourceSize = data.trimmed !== false && data.sourceSize + ? data.sourceSize : data.frame; + const orig = new Rectangle( 0, 0, - Math.floor(this._frames[i].sourceSize.w * sourceScale) / this.resolution, - Math.floor(this._frames[i].sourceSize.h * sourceScale) / this.resolution + Math.floor(sourceSize.w * sourceScale) / this.resolution, + Math.floor(sourceSize.h * sourceScale) / this.resolution ); - if (this._frames[i].rotated) + if (data.rotated) { frame = new Rectangle( Math.floor(rect.x * sourceScale) / this.resolution, @@ -189,11 +193,11 @@ } // Check to see if the sprite is trimmed - if (this._frames[i].trimmed) + if (data.trimmed !== false && data.spriteSourceSize) { trim = new Rectangle( - Math.floor(this._frames[i].spriteSourceSize.x * sourceScale) / this.resolution, - Math.floor(this._frames[i].spriteSourceSize.y * sourceScale) / this.resolution, + Math.floor(data.spriteSourceSize.x * sourceScale) / this.resolution, + Math.floor(data.spriteSourceSize.y * sourceScale) / this.resolution, Math.floor(rect.w * sourceScale) / this.resolution, Math.floor(rect.h * sourceScale) / this.resolution ); @@ -204,7 +208,7 @@ frame, orig, trim, - this._frames[i].rotated ? 2 : 0 + data.rotated ? 2 : 0 ); // lets also add the frame to pixi's global cache for fromFrame and fromImage functions diff --git a/src/core/textures/Spritesheet.js b/src/core/textures/Spritesheet.js index 1a9223f..adb555c 100644 --- a/src/core/textures/Spritesheet.js +++ b/src/core/textures/Spritesheet.js @@ -156,20 +156,24 @@ while (frameIndex - initialFrameIndex < maxFrames && frameIndex < this._frameKeys.length) { const i = this._frameKeys[frameIndex]; - const rect = this._frames[i].frame; + const data = this._frames[i]; + const rect = data.frame; if (rect) { let frame = null; let trim = null; + const sourceSize = data.trimmed !== false && data.sourceSize + ? data.sourceSize : data.frame; + const orig = new Rectangle( 0, 0, - Math.floor(this._frames[i].sourceSize.w * sourceScale) / this.resolution, - Math.floor(this._frames[i].sourceSize.h * sourceScale) / this.resolution + Math.floor(sourceSize.w * sourceScale) / this.resolution, + Math.floor(sourceSize.h * sourceScale) / this.resolution ); - if (this._frames[i].rotated) + if (data.rotated) { frame = new Rectangle( Math.floor(rect.x * sourceScale) / this.resolution, @@ -189,11 +193,11 @@ } // Check to see if the sprite is trimmed - if (this._frames[i].trimmed) + if (data.trimmed !== false && data.spriteSourceSize) { trim = new Rectangle( - Math.floor(this._frames[i].spriteSourceSize.x * sourceScale) / this.resolution, - Math.floor(this._frames[i].spriteSourceSize.y * sourceScale) / this.resolution, + Math.floor(data.spriteSourceSize.x * sourceScale) / this.resolution, + Math.floor(data.spriteSourceSize.y * sourceScale) / this.resolution, Math.floor(rect.w * sourceScale) / this.resolution, Math.floor(rect.h * sourceScale) / this.resolution ); @@ -204,7 +208,7 @@ frame, orig, trim, - this._frames[i].rotated ? 2 : 0 + data.rotated ? 2 : 0 ); // lets also add the frame to pixi's global cache for fromFrame and fromImage functions diff --git a/test/core/Spritesheet.js b/test/core/Spritesheet.js index dccde04..2ee1136 100644 --- a/test/core/Spritesheet.js +++ b/test/core/Spritesheet.js @@ -27,6 +27,32 @@ done(); }); }; + + this.parseFrame = function (frameData, callback) + { + const data = { + frames: { frame: frameData }, + meta: { scale: 1 }, + }; + const baseTexture = PIXI.BaseTexture.fromCanvas( + document.createElement('canvas') + ); + + baseTexture.imageUrl = 'test.png'; + + const sheet = new PIXI.Spritesheet(baseTexture, data); + + sheet.parse(() => + { + const { frame } = sheet.textures; + + expect(frame).to.be.instanceof(PIXI.Texture); + + callback(frame); + + sheet.destroy(true); + }); + }; }); it('should exist on PIXI', function () @@ -102,4 +128,86 @@ this.validate(spritesheet, done); }; }); + + it('should parse full data untrimmed', function (done) + { + const data = { + frame: { x: 0, y: 0, w: 14, h: 16 }, + rotated: false, + trimmed: false, + spriteSourceSize: { x: 0, y: 0, w: 14, h: 16 }, + sourceSize: { w: 14, h: 16 }, + }; + + this.parseFrame(data, (texture) => + { + expect(texture.width).to.equal(14); + expect(texture.height).to.equal(16); + done(); + }); + }); + + it('should parse texture from trimmed', function (done) + { + const data = { + frame: { x: 0, y: 28, w: 14, h: 14 }, + rotated: false, + trimmed: true, + spriteSourceSize: { x: 0, y: 0, w: 40, h: 20 }, + sourceSize: { w: 40, h: 20 }, + }; + + this.parseFrame(data, (texture) => + { + expect(texture.width).to.equal(40); + expect(texture.height).to.equal(20); + done(); + }); + }); + + it('should parse texture from minimal data', function (done) + { + const data = { frame: { x: 0, y: 0, w: 14, h: 14 } }; + + this.parseFrame(data, (texture) => + { + expect(texture.width).to.equal(14); + expect(texture.height).to.equal(14); + done(); + }); + }); + + it('should parse texture without trimmed or sourceSize', function (done) + { + const data = { + frame: { x: 0, y: 14, w: 14, h: 14 }, + rotated: false, + trimmed: false, + spriteSourceSize: { x: 0, y: 0, w: 20, h: 30 }, + }; + + this.parseFrame(data, (texture) => + { + expect(texture.width).to.equal(14); + expect(texture.height).to.equal(14); + done(); + }); + }); + + it('should parse as trimmed if spriteSourceSize is set', function (done) + { + // shoebox format + const data = { + frame: { x: 0, y: 0, w: 14, h: 16 }, + spriteSourceSize: { x: 0, y: 0, w: 120, h: 100 }, + sourceSize: { w: 120, h: 100 }, + }; + + this.parseFrame(data, (texture) => + { + expect(texture.width).to.equal(120); + expect(texture.height).to.equal(100); + done(); + }); + }); });