Textures updated to class structure.

This commit is contained in:
photonstorm 2017-07-04 13:23:58 +01:00
parent 89c0acf06e
commit e7708fedcf
6 changed files with 312 additions and 353 deletions

View file

@ -1,4 +1,4 @@
var CHECKSUM = {
build: '942ca080-60b1-11e7-a37a-5153af2d75bf'
build: '8b2cc8f0-60b3-11e7-9c06-896e751f0cb1'
};
module.exports = CHECKSUM;

View file

@ -5,4 +5,4 @@ var CONST = {
};
module.exports = CONST;
module.exports = CONST;

View file

@ -1,9 +1,5 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var Class = require('../utils/Class');
var Extend = require('../utils/object/Extend');
/**
@ -18,156 +14,156 @@ var Extend = require('../utils/object/Extend');
* @param {number} width - Width of the frame within the Texture.
* @param {number} height - Height of the frame within the Texture.
*/
var Frame = function (texture, name, sourceIndex, x, y, width, height)
{
/**
* @property {Phaser.Texture} texture - The Texture this frame belongs to.
*/
this.texture = texture;
var Frame = new Class({
/**
* @property {string} name - The name of this frame within the Texture.
*/
this.name = name;
initialize:
this.source = texture.source[sourceIndex];
function Frame (texture, name, sourceIndex, x, y, width, height)
{
/**
* @property {Phaser.Texture} texture - The Texture this frame belongs to.
*/
this.texture = texture;
this.sourceIndex = sourceIndex;
/**
* @property {string} name - The name of this frame within the Texture.
*/
this.name = name;
/**
* @property {number} cutX - X position within the source image to cut from.
*/
this.cutX = x;
this.source = texture.source[sourceIndex];
/**
* @property {number} cutY - Y position within the source image to cut from.
*/
this.cutY = y;
this.sourceIndex = sourceIndex;
/**
* @property {number} cutWidth - The width of the area in the source image to cut.
*/
this.cutWidth = width;
/**
* @property {number} cutX - X position within the source image to cut from.
*/
this.cutX = x;
/**
* @property {number} cutHeight - The height of the area in the source image to cut.
*/
this.cutHeight = height;
/**
* @property {number} cutY - Y position within the source image to cut from.
*/
this.cutY = y;
/**
* @property {number} x - The X rendering offset of this Frame, taking trim into account.
*/
this.x = 0;
/**
* @property {number} cutWidth - The width of the area in the source image to cut.
*/
this.cutWidth = width;
/**
* @property {number} y - The Y rendering offset of this Frame, taking trim into account.
*/
this.y = 0;
/**
* @property {number} cutHeight - The height of the area in the source image to cut.
*/
this.cutHeight = height;
/**
* @property {number} width - The rendering width of this Frame, taking trim into account.
*/
this.width = width;
/**
* @property {number} x - The X rendering offset of this Frame, taking trim into account.
*/
this.x = 0;
/**
* @property {number} height - The rendering height of this Frame, taking trim into account.
*/
this.height = height;
/**
* @property {number} y - The Y rendering offset of this Frame, taking trim into account.
*/
this.y = 0;
/**
* @property {number} width - The rendering width of this Frame, taking trim into account.
*/
this.centerX = Math.floor(width / 2);
/**
* @property {number} width - The rendering width of this Frame, taking trim into account.
*/
this.width = width;
/**
* @property {number} height - The rendering height of this Frame, taking trim into account.
*/
this.centerY = Math.floor(height / 2);
/**
* @property {number} height - The rendering height of this Frame, taking trim into account.
*/
this.height = height;
/**
* Is this frame is rotated or not in the Texture?
* Rotation allows you to use rotated frames in texture atlas packing.
* It has nothing to do with Sprite rotation.
*
* @property {boolean} rotated
* @default
*/
this.rotated = false;
/**
* @property {number} width - The rendering width of this Frame, taking trim into account.
*/
this.centerX = Math.floor(width / 2);
/**
* Is this a tiling texture? As used by the likes of a TilingSprite.
* TODO: Try and remove this, it shouldn't be here
*
* @property {boolean} isTiling
* @default
*/
this.isTiling = false;
/**
* @property {number} height - The rendering height of this Frame, taking trim into account.
*/
this.centerY = Math.floor(height / 2);
/**
* This will let a renderer know that a tinted parent has updated its texture.
* TODO: Try and remove this, it shouldn't be here
*
* @property {boolean} requiresReTint
* @default
*/
this.requiresReTint = false;
/**
* Is this frame is rotated or not in the Texture?
* Rotation allows you to use rotated frames in texture atlas packing.
* It has nothing to do with Sprite rotation.
*
* @property {boolean} rotated
* @default
*/
this.rotated = false;
// Over-rides the Renderer setting? -1 = use Renderer Setting, 0 = No rounding, 1 = Round
this.autoRound = -1;
/**
* Is this a tiling texture? As used by the likes of a TilingSprite.
* TODO: Try and remove this, it shouldn't be here
*
* @property {boolean} isTiling
* @default
*/
this.isTiling = false;
/**
* The un-modified source frame, trim and UV data.
*
* @private
* @property {object} data
*/
this.data = {
cut: {
x: x,
y: y,
w: width,
h: height,
r: x + width,
b: y + height
},
trim: false,
sourceSize: {
w: width,
h: height
},
spriteSourceSize: {
x: 0,
y: 0,
w: width,
h: height
},
uvs: {
x0: 0,
y0: 0,
x1: 0,
y1: 0,
x2: 0,
y2: 0,
x3: 0,
y3: 0
},
radius: 0.5 * Math.sqrt(width * width + height * height),
drawImage: {
sx: x,
sy: y,
sWidth: width,
sHeight: height,
dWidth: width,
dHeight: height
}
};
/**
* This will let a renderer know that a tinted parent has updated its texture.
* TODO: Try and remove this, it shouldn't be here
*
* @property {boolean} requiresReTint
* @default
*/
this.requiresReTint = false;
this.updateUVs();
};
// Over-rides the Renderer setting? -1 = use Renderer Setting, 0 = No rounding, 1 = Round
this.autoRound = -1;
Frame.prototype.constructor = Frame;
/**
* The un-modified source frame, trim and UV data.
*
* @private
* @property {object} data
*/
this.data = {
cut: {
x: x,
y: y,
w: width,
h: height,
r: x + width,
b: y + height
},
trim: false,
sourceSize: {
w: width,
h: height
},
spriteSourceSize: {
x: 0,
y: 0,
w: width,
h: height
},
uvs: {
x0: 0,
y0: 0,
x1: 0,
y1: 0,
x2: 0,
y2: 0,
x3: 0,
y3: 0
},
radius: 0.5 * Math.sqrt(width * width + height * height),
drawImage: {
sx: x,
sy: y,
sWidth: width,
sHeight: height,
dWidth: width,
dHeight: height
}
};
Frame.prototype = {
this.updateUVs();
},
/**
* If the frame was trimmed when added to the Texture Atlas, this records the trim and source data.
@ -295,11 +291,7 @@ Frame.prototype = {
destroy: function ()
{
}
};
Object.defineProperties(Frame.prototype, {
},
/**
* The width of the Frame in its un-trimmed, un-padded state, as prepared in the art package,
@ -310,8 +302,6 @@ Object.defineProperties(Frame.prototype, {
*/
realWidth: {
enumerable: true,
get: function ()
{
return this.data.sourceSize.w;
@ -328,8 +318,6 @@ Object.defineProperties(Frame.prototype, {
*/
realHeight: {
enumerable: true,
get: function ()
{
return this.data.sourceSize.h;
@ -345,8 +333,6 @@ Object.defineProperties(Frame.prototype, {
*/
uvs: {
enumerable: true,
get: function ()
{
return this.data.uvs;
@ -361,8 +347,6 @@ Object.defineProperties(Frame.prototype, {
*/
radius: {
enumerable: true,
get: function ()
{
return this.data.radius;
@ -377,8 +361,6 @@ Object.defineProperties(Frame.prototype, {
*/
trimmed: {
enumerable: true,
get: function ()
{
return this.data.trim;
@ -394,8 +376,6 @@ Object.defineProperties(Frame.prototype, {
*/
canvasData: {
enumerable: true,
get: function ()
{
return this.data.drawImage;

View file

@ -1,9 +1,5 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var Class = require('../utils/Class');
var Frame = require('./Frame');
var TextureSource = require('./TextureSource');
@ -23,45 +19,45 @@ var TextureSource = require('./TextureSource');
* @param {object} source
* @param {number} scaleMode
*/
var Texture = function (manager, key, source, width, height)
{
this.manager = manager;
var Texture = new Class({
if (!Array.isArray(source))
initialize:
function Texture (manager, key, source, width, height)
{
source = [ source ];
}
this.manager = manager;
this.key = key;
if (!Array.isArray(source))
{
source = [ source ];
}
/**
* The source that is used to create the texture.
* Usually an Image, but can also be a Canvas.
*
* @property source
* @type array
*/
this.source = [];
this.key = key;
/**
* @property {object} frames - Frames
*/
this.frames = {};
/**
* The source that is used to create the texture.
* Usually an Image, but can also be a Canvas.
*
* @property source
* @type array
*/
this.source = [];
this.firstFrame = '__BASE';
/**
* @property {object} frames - Frames
*/
this.frames = {};
this.frameTotal = 0;
this.firstFrame = '__BASE';
// Load the Sources
for (var i = 0; i < source.length; i++)
{
this.source.push(new TextureSource(this, source[i], width, height));
}
};
this.frameTotal = 0;
Texture.prototype.constructor = Texture;
Texture.prototype = {
// Load the Sources
for (var i = 0; i < source.length; i++)
{
this.source.push(new TextureSource(this, source[i], width, height));
}
},
add: function (name, sourceIndex, x, y, width, height)
{
@ -155,32 +151,24 @@ Texture.prototype = {
{
this.source[i].glTextureIndex = index;
// console.log(this.source[i].image.currentSrc, 'index = ', index);
index++;
}
return index;
},
/**
* Destroys this base texture
*
* @method destroy
*/
destroy: function ()
{
// TODO
},
setFilter: function (filterMode)
{
for (var i = 0; i < this.source.length; i++)
{
this.source[i].setFilter(filterMode);
}
},
destroy: function ()
{
}
};
});
module.exports = Texture;

View file

@ -1,14 +1,10 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var CanvasPool = require('../dom/CanvasPool');
var Class = require('../utils/Class');
var GenerateTexture = require('../create/GenerateTexture');
var GetValue = require('../utils/object/GetValue');
var Parser = require('./parsers');
var Texture = require('./Texture');
var CanvasPool = require('../dom/CanvasPool');
var GetValue = require('../utils/object/GetValue');
var GenerateTexture = require('../create/GenerateTexture');
/**
* Textures are managed by the global TextureManager. This is a singleton class that is
@ -21,19 +17,19 @@ var GenerateTexture = require('../create/GenerateTexture');
* @class Phaser.TextureManager
* @constructor
*/
var TextureManager = function (game)
{
this.game = game;
var TextureManager = new Class({
this.list = {};
initialize:
this.addBase64('__DEFAULT', game.config.defaultImage);
this.addBase64('__MISSING', game.config.missingImage);
};
function TextureManager (game)
{
this.game = game;
TextureManager.prototype.constructor = TextureManager;
this.list = {};
TextureManager.prototype = {
this.addBase64('__DEFAULT', game.config.defaultImage);
this.addBase64('__MISSING', game.config.missingImage);
},
addBase64: function (key, data)
{
@ -327,6 +323,6 @@ TextureManager.prototype = {
}
}
};
});
module.exports = TextureManager;

View file

@ -1,145 +1,140 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var Class = require('../utils/Class');
var CONST = require('../const');
var ScaleModes = require('../renderer/ScaleModes');
var IsSizePowerOfTwo = require('../math/pow2/IsSizePowerOfTwo');
var ScaleModes = require('../renderer/ScaleModes');
/**
*
* @class Phaser.TextureSource
* @constructor
* @param {object} source
* @param {number} scaleMode
*/
var TextureSource = function (texture, source, width, height)
{
this.texture = texture;
var TextureSource = new Class({
this.image = source;
initialize:
this.compressionAlgorithm = null;
/**
* The Resolution of the texture.
*
* @property resolution
* @type Number
*/
this.resolution = 1;
/**
* The width of the Texture.
*
* @property width
* @type Number
* @readOnly
*/
this.width = width || source.naturalWidth || source.width || 0;
/**
* The height of the Texture.
*
* @property height
* @type Number
* @readOnly
*/
this.height = height || source.naturalHeight || source.height || 0;
/**
* The scale mode to apply when scaling this texture.
* NEAREST or DEFAULT
*
* @property scaleMode
* @type {Number}
* @default Phaser.scaleModes.DEFAULT;
*/
this.scaleMode = ScaleModes.DEFAULT;
/**
* Controls if RGB channels should be pre-multiplied by Alpha (WebGL only)
*
* @property premultipliedAlpha
* @type Boolean
* @default true
*/
this.premultipliedAlpha = true;
/**
* Set this to true if a mipmap of this texture needs to be generated. This value needs to be set before the texture is used
* Also the texture must be a power of two size to work
*
* @property mipmapLevel
* @type {integer}
*/
this.mipmapLevel = 0;
/**
* A BaseTexture can be set to skip the rendering phase in the WebGL Sprite Batch.
*
* You may want to do this if you have a parent Sprite with no visible texture (i.e. uses the internal `__default` texture)
* that has children that you do want to render, without causing a batch flush in the process.
*
* @property renderable
* @type Boolean
*/
this.renderable = true;
/**
* @property isPowerOf2
* @type boolean
*/
this.isPowerOf2 = IsSizePowerOfTwo(this.width, this.height);
/**
* @property glTexture
*/
this.glTexture = null;
/**
* The multi texture batching index number.
* @property glTextureIndex
* @type Number
*/
this.glTextureIndex = 0;
/**
* The timestamp when this texture was last used by the WebGL renderer.
* Can be used to purge out 'dead' textures from GPU memory.
* @property glLastUsed
* @type Number
*/
this.glLastUsed = 0;
/**
* @property glDirty
*/
this.glDirty = true;
var game = texture.manager.game;
if (game.config.renderType === CONST.WEBGL)
function TextureSource (texture, source, width, height)
{
game.renderer.createTexture(this, width, height);
this.texture = texture;
this.image = source;
this.compressionAlgorithm = null;
/**
* The Resolution of the texture.
*
* @property resolution
* @type Number
*/
this.resolution = 1;
/**
* The width of the Texture.
*
* @property width
* @type Number
* @readOnly
*/
this.width = width || source.naturalWidth || source.width || 0;
/**
* The height of the Texture.
*
* @property height
* @type Number
* @readOnly
*/
this.height = height || source.naturalHeight || source.height || 0;
/**
* The scale mode to apply when scaling this texture.
* NEAREST or DEFAULT
*
* @property scaleMode
* @type {Number}
* @default Phaser.scaleModes.DEFAULT;
*/
this.scaleMode = ScaleModes.DEFAULT;
/**
* Controls if RGB channels should be pre-multiplied by Alpha (WebGL only)
*
* @property premultipliedAlpha
* @type Boolean
* @default true
*/
this.premultipliedAlpha = true;
/**
* Set this to true if a mipmap of this texture needs to be generated. This value needs to be set before the texture is used
* Also the texture must be a power of two size to work
*
* @property mipmapLevel
* @type {integer}
*/
this.mipmapLevel = 0;
/**
* A BaseTexture can be set to skip the rendering phase in the WebGL Sprite Batch.
*
* You may want to do this if you have a parent Sprite with no visible texture (i.e. uses the internal `__default` texture)
* that has children that you do want to render, without causing a batch flush in the process.
*
* @property renderable
* @type Boolean
*/
this.renderable = true;
/**
* @property isPowerOf2
* @type boolean
*/
this.isPowerOf2 = IsSizePowerOfTwo(this.width, this.height);
/**
* @property glTexture
*/
this.glTexture = null;
/**
* The multi texture batching index number.
* @property glTextureIndex
* @type Number
*/
this.glTextureIndex = 0;
/**
* The timestamp when this texture was last used by the WebGL renderer.
* Can be used to purge out 'dead' textures from GPU memory.
* @property glLastUsed
* @type Number
*/
this.glLastUsed = 0;
/**
* @property glDirty
*/
this.glDirty = true;
var game = texture.manager.game;
if (game.config.renderType === CONST.WEBGL)
{
game.renderer.createTexture(this, width, height);
}
if (game.config.pixelArt)
{
this.setFilter(1);
}
},
setFilter: function (filterMode)
{
var game = this.texture.manager.game;
if (game.config.renderType === CONST.WEBGL)
{
game.renderer.setTextureFilterMode(this.glTexture, filterMode);
}
}
if (game.config.pixelArt)
{
this.setFilter(1);
}
};
TextureSource.prototype.setFilter = function (filterMode)
{
var game = this.texture.manager.game;
if (game.config.renderType === CONST.WEBGL)
{
game.renderer.setTextureFilterMode(this.glTexture, filterMode);
}
};
});
module.exports = TextureSource;