mirror of
https://github.com/photonstorm/phaser
synced 2025-02-17 06:28:30 +00:00
Added Loader.SpriteSheet, now using a new config object rather than a bunch of arguments.
This commit is contained in:
parent
426e5af447
commit
7c06670f90
8 changed files with 67 additions and 17 deletions
|
@ -1,4 +1,4 @@
|
|||
var CHECKSUM = {
|
||||
build: '618b02c0-e81b-11e6-ac0a-578aa8c24501'
|
||||
build: '9a80e320-ea9a-11e6-9ca7-bb7438e31195'
|
||||
};
|
||||
module.exports = CHECKSUM;
|
|
@ -10,10 +10,6 @@ var BaseLoader = function ()
|
|||
// To finish the loader ...
|
||||
//
|
||||
// 3) Progress update
|
||||
// 4) JSON loader
|
||||
// 5) XML Loader
|
||||
// 6) Multi File support (atlas + data)
|
||||
// 7) Atlas Loader
|
||||
|
||||
this.events = new EventDispatcher();
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@ var XHRLoader = require('./XHRLoader');
|
|||
var XHRSettings = require('./XHRSettings');
|
||||
var MergeXHRSettings = require('./MergeXHRSettings');
|
||||
|
||||
var File = function (type, key, url, responseType, xhrSettings)
|
||||
var File = function (type, key, url, responseType, xhrSettings, config)
|
||||
{
|
||||
// file type (image, json, etc) for sorting within the Loader
|
||||
this.type = type;
|
||||
|
@ -41,6 +41,9 @@ var File = function (type, key, url, responseType, xhrSettings)
|
|||
// The actual processed file data
|
||||
this.data = undefined;
|
||||
|
||||
// A config object that can be used by file types to store transitional data
|
||||
this.config = config || {};
|
||||
|
||||
// Multipart file? (i.e. an atlas and its json together)
|
||||
this.linkFile = undefined;
|
||||
this.linkType = '';
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
var CONST = require('../const');
|
||||
var File = require('../File');
|
||||
|
||||
var ImageFile = function (key, url, path, xhrSettings)
|
||||
var ImageFile = function (key, url, path, xhrSettings, options)
|
||||
{
|
||||
if (path === undefined) { path = ''; }
|
||||
|
||||
|
@ -20,7 +20,7 @@ var ImageFile = function (key, url, path, xhrSettings)
|
|||
url = path.concat(url);
|
||||
}
|
||||
|
||||
File.call(this, 'image', key, url, 'blob', xhrSettings);
|
||||
File.call(this, 'image', key, url, 'blob', xhrSettings, options);
|
||||
};
|
||||
|
||||
ImageFile.prototype = Object.create(File.prototype);
|
||||
|
|
15
v3/src/loader/filetypes/SpriteSheet.js
Normal file
15
v3/src/loader/filetypes/SpriteSheet.js
Normal file
|
@ -0,0 +1,15 @@
|
|||
var ImageFile = require('./ImageFile.js');
|
||||
|
||||
// config can include: frameWidth, frameHeight, startFrame, endFrame, margin, spacing
|
||||
|
||||
var SpriteSheet = function (key, url, config, path, xhrSettings)
|
||||
{
|
||||
var image = new ImageFile(key, url, path, xhrSettings, config);
|
||||
|
||||
// Override the File type
|
||||
image.type = 'spritesheet';
|
||||
|
||||
return image;
|
||||
};
|
||||
|
||||
module.exports = SpriteSheet;
|
|
@ -9,6 +9,7 @@ var BinaryFile = require('../../loader/filetypes/BinaryFile');
|
|||
var GLSLFile = require('../../loader/filetypes/GLSLFile');
|
||||
var TextFile = require('../../loader/filetypes/TextFile');
|
||||
var AtlasJSONFile = require('../../loader/filetypes/AtlasJSONFile');
|
||||
var SpriteSheet = require('../../loader/filetypes/SpriteSheet');
|
||||
|
||||
var Loader = function (state)
|
||||
{
|
||||
|
@ -68,6 +69,14 @@ Loader.prototype.glsl = function (key, url, xhrSettings)
|
|||
return this.addFile(file);
|
||||
};
|
||||
|
||||
// config can include: frameWidth, frameHeight, startFrame, endFrame, margin, spacing
|
||||
Loader.prototype.spritesheet = function (key, url, config, xhrSettings)
|
||||
{
|
||||
var file = new SpriteSheet(key, url, config, this.path, xhrSettings);
|
||||
|
||||
return this.addFile(file);
|
||||
};
|
||||
|
||||
Loader.prototype.atlas = function (key, textureURL, atlasURL, textureXhrSettings, atlasXhrSettings)
|
||||
{
|
||||
// Returns an object with two properties: 'texture' and 'data'
|
||||
|
@ -210,6 +219,10 @@ Loader.prototype.processCallback = function ()
|
|||
}
|
||||
break;
|
||||
|
||||
case 'spritesheet':
|
||||
textures.addSpriteSheet(file.key, file.data, file.config);
|
||||
break;
|
||||
|
||||
case 'json':
|
||||
cache.json.add(file.key, file.data);
|
||||
break;
|
||||
|
|
|
@ -99,19 +99,31 @@ TextureManager.prototype = {
|
|||
return texture;
|
||||
},
|
||||
|
||||
addSpriteSheet: function (key, source, frameWidth, frameHeight, startFrame, endFrame, margin, spacing)
|
||||
/**
|
||||
* [addSpriteSheet description]
|
||||
* @param {[type]} key [description]
|
||||
* @param {[type]} source [description]
|
||||
* @param {[type]} config [description]
|
||||
* @param {number} config.frameWidth - The fixed width of each frame.
|
||||
* @param {number} [config.frameHeight] - The fixed height of each frame. If not set it will use the frameWidth as the height.
|
||||
* @param {number} [config.startFrame=0] - Skip a number of frames. Useful when there are multiple sprite sheets in one Texture.
|
||||
* @param {number} [config.endFrame=-1] - The total number of frames to extract from the Sprite Sheet. The default value of -1 means "extract all frames".
|
||||
* @param {number} [config.margin=0] - If the frames have been drawn with a margin, specify the amount here.
|
||||
* @param {number} [config.spacing=0] - If the frames have been drawn with spacing between them, specify the amount here.
|
||||
*/
|
||||
addSpriteSheet: function (key, source, config)
|
||||
{
|
||||
var texture = this.create(key, source);
|
||||
|
||||
var width = texture.source[0].width;
|
||||
var height = texture.source[0].height;
|
||||
|
||||
Parser.SpriteSheet(texture, 0, 0, 0, width, height, frameWidth, frameHeight, startFrame, endFrame, margin, spacing);
|
||||
Parser.SpriteSheet(texture, 0, 0, 0, width, height, config);
|
||||
|
||||
return texture;
|
||||
},
|
||||
|
||||
addSpriteSheetFromAtlas: function (key, atlasKey, atlasFrame, frameWidth, frameHeight, startFrame, endFrame, margin, spacing)
|
||||
addSpriteSheetFromAtlas: function (key, atlasKey, atlasFrame, config)
|
||||
{
|
||||
var atlas = this.get(atlasKey);
|
||||
var sheet = atlas.get(atlasFrame);
|
||||
|
@ -120,7 +132,7 @@ TextureManager.prototype = {
|
|||
{
|
||||
var texture = this.create(key, sheet.source.image);
|
||||
|
||||
Parser.SpriteSheet(texture, 0, sheet.cutX, sheet.cutY, sheet.cutWidth, sheet.cutHeight, frameWidth, frameHeight, startFrame, endFrame, margin, spacing);
|
||||
Parser.SpriteSheet(texture, 0, sheet.cutX, sheet.cutY, sheet.cutWidth, sheet.cutHeight, config);
|
||||
|
||||
return texture;
|
||||
}
|
||||
|
|
|
@ -4,6 +4,8 @@
|
|||
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
|
||||
*/
|
||||
|
||||
var GetObjectValue = require('../../utils/GetObjectValue');
|
||||
|
||||
/**
|
||||
* Parse a Sprite Sheet and extracts the frame data from it.
|
||||
*
|
||||
|
@ -19,12 +21,21 @@
|
|||
* @param {number} [spacing=0] - If the frames have been drawn with spacing between them, specify the amount here.
|
||||
* @return {Phaser.FrameData} A FrameData object containing the parsed frames.
|
||||
*/
|
||||
var SpriteSheetTextureParser = function (texture, sourceIndex, x, y, width, height, frameWidth, frameHeight, startFrame, endFrame, margin, spacing)
|
||||
var SpriteSheetTextureParser = function (texture, sourceIndex, x, y, width, height, config)
|
||||
{
|
||||
if (startFrame === undefined) { startFrame = 0; }
|
||||
if (endFrame === undefined) { endFrame = -1; }
|
||||
if (margin === undefined) { margin = 0; }
|
||||
if (spacing === undefined) { spacing = 0; }
|
||||
var frameWidth = GetObjectValue(config, 'frameWidth', null);
|
||||
var frameHeight = GetObjectValue(config, 'frameHeight', frameWidth);
|
||||
|
||||
// If missing we can't proceed
|
||||
if (frameWidth === null)
|
||||
{
|
||||
throw new Error('TextureManager.SpriteSheetTextureParser: Invalid frameWidth given.');
|
||||
}
|
||||
|
||||
var startFrame = GetObjectValue(config, 'startFrame', 0);
|
||||
var endFrame = GetObjectValue(config, 'endFrame', -1);
|
||||
var margin = GetObjectValue(config, 'margin', 0);
|
||||
var spacing = GetObjectValue(config, 'spacing', 0);
|
||||
|
||||
var row = Math.floor((width - margin) / (frameWidth + spacing));
|
||||
var column = Math.floor((height - margin) / (frameHeight + spacing));
|
||||
|
|
Loading…
Add table
Reference in a new issue