mirror of
https://github.com/photonstorm/phaser
synced 2024-11-27 07:01:20 +00:00
Added in normal map support
This commit is contained in:
parent
9b7d6d0254
commit
b0c853a782
5 changed files with 147 additions and 81 deletions
|
@ -15,6 +15,7 @@ var MultiFile = require('../MultiFile.js');
|
|||
/**
|
||||
* @classdesc
|
||||
* An Atlas JSON File.
|
||||
* https://www.codeandweb.com/texturepacker/tutorials/how-to-create-sprite-sheets-for-phaser3?source=photonstorm
|
||||
*
|
||||
* @class AtlasJSONFile
|
||||
* @extends Phaser.Loader.MultiFile
|
||||
|
@ -51,26 +52,28 @@ var AtlasJSONFile = new Class({
|
|||
var image = new ImageFile(loader, key, textureURL, textureXhrSettings);
|
||||
var data = new JSONFile(loader, key, atlasURL, atlasXhrSettings);
|
||||
|
||||
if (image.linkFile)
|
||||
{
|
||||
// Image has a normal map
|
||||
MultiFile.call(this, loader, 'atlasjson', key, [ image, data, image.linkFile ]);
|
||||
}
|
||||
else
|
||||
{
|
||||
MultiFile.call(this, loader, 'atlasjson', key, [ image, data ]);
|
||||
}
|
||||
},
|
||||
|
||||
addToCache: function ()
|
||||
{
|
||||
if (this.isReadyToProcess())
|
||||
{
|
||||
var fileA = this.files[0];
|
||||
var fileB = this.files[1];
|
||||
var image = this.files[0];
|
||||
var json = this.files[1];
|
||||
var normalMap = (this.files[2]) ? this.files[2].data : null;
|
||||
|
||||
if (fileA.type === 'image')
|
||||
{
|
||||
this.loader.textureManager.addAtlas(fileA.key, fileA.data, fileB.data);
|
||||
fileB.addToCache();
|
||||
}
|
||||
else
|
||||
{
|
||||
this.loader.textureManager.addAtlas(fileB.key, fileB.data, fileA.data);
|
||||
fileA.addToCache();
|
||||
}
|
||||
this.loader.textureManager.addAtlas(image.key, image.data, json.data, normalMap);
|
||||
|
||||
json.addToCache();
|
||||
|
||||
this.complete = true;
|
||||
}
|
||||
|
|
|
@ -49,26 +49,28 @@ var AtlasXMLFile = new Class({
|
|||
var image = new ImageFile(loader, key, textureURL, textureXhrSettings);
|
||||
var data = new XMLFile(loader, key, atlasURL, atlasXhrSettings);
|
||||
|
||||
if (image.linkFile)
|
||||
{
|
||||
// Image has a normal map
|
||||
MultiFile.call(this, loader, 'atlasxml', key, [ image, data, image.linkFile ]);
|
||||
}
|
||||
else
|
||||
{
|
||||
MultiFile.call(this, loader, 'atlasxml', key, [ image, data ]);
|
||||
}
|
||||
},
|
||||
|
||||
addToCache: function ()
|
||||
{
|
||||
if (this.isReadyToProcess())
|
||||
{
|
||||
var fileA = this.files[0];
|
||||
var fileB = this.files[1];
|
||||
var image = this.files[0];
|
||||
var xml = this.files[1];
|
||||
var normalMap = (this.files[2]) ? this.files[2].data : null;
|
||||
|
||||
if (fileA.type === 'image')
|
||||
{
|
||||
this.loader.textureManager.addAtlasXML(fileA.key, fileA.data, fileB.data);
|
||||
fileB.addToCache();
|
||||
}
|
||||
else
|
||||
{
|
||||
this.loader.textureManager.addAtlasXML(fileB.key, fileB.data, fileA.data);
|
||||
fileA.addToCache();
|
||||
}
|
||||
this.loader.textureManager.addAtlasXML(image.key, image.data, xml.data, normalMap);
|
||||
|
||||
xml.addToCache();
|
||||
|
||||
this.complete = true;
|
||||
}
|
||||
|
|
|
@ -36,7 +36,7 @@ var ImageFile = new Class({
|
|||
function ImageFile (loader, key, url, xhrSettings, frameConfig)
|
||||
{
|
||||
var extension = 'png';
|
||||
var normalMap;
|
||||
var normalMapURL;
|
||||
|
||||
if (IsPlainObject(key))
|
||||
{
|
||||
|
@ -44,7 +44,7 @@ var ImageFile = new Class({
|
|||
|
||||
key = GetFastValue(config, 'key');
|
||||
url = GetFastValue(config, 'url');
|
||||
normalMap = GetFastValue(config, 'normalMap');
|
||||
normalMapURL = GetFastValue(config, 'normalMap');
|
||||
xhrSettings = GetFastValue(config, 'xhrSettings');
|
||||
extension = GetFastValue(config, 'extension', extension);
|
||||
frameConfig = GetFastValue(config, 'frameConfig');
|
||||
|
@ -52,7 +52,7 @@ var ImageFile = new Class({
|
|||
|
||||
if (Array.isArray(url))
|
||||
{
|
||||
normalMap = url[1];
|
||||
normalMapURL = url[1];
|
||||
url = url[0];
|
||||
}
|
||||
|
||||
|
@ -70,9 +70,15 @@ var ImageFile = new Class({
|
|||
File.call(this, loader, fileConfig);
|
||||
|
||||
// Do we have a normal map to load as well?
|
||||
if (normalMap)
|
||||
if (normalMapURL)
|
||||
{
|
||||
// var
|
||||
var normalMap = new ImageFile(loader, key, normalMapURL, xhrSettings, frameConfig);
|
||||
|
||||
normalMap.type = 'normalMap';
|
||||
|
||||
this.setLink(normalMap);
|
||||
|
||||
loader.addFile(normalMap);
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -105,10 +111,37 @@ var ImageFile = new Class({
|
|||
|
||||
addToCache: function ()
|
||||
{
|
||||
var texture = this.cache.addImage(this.key, this.data);
|
||||
console.log('addToCache', this.key, this.type);
|
||||
|
||||
var texture;
|
||||
|
||||
if (this.linkFile && this.linkFile.state === CONST.FILE_COMPLETE)
|
||||
{
|
||||
console.log('linkFile ready');
|
||||
|
||||
// Both files are ready
|
||||
var fileA = this;
|
||||
var fileB = this.linkFile;
|
||||
|
||||
if (fileA.type === 'image')
|
||||
{
|
||||
texture = this.cache.addImage(fileA.key, fileA.data, fileB.data);
|
||||
}
|
||||
else
|
||||
{
|
||||
texture = this.cache.addImage(fileB.key, fileB.data, fileA.data);
|
||||
}
|
||||
|
||||
fileA.pendingDestroy(texture);
|
||||
fileB.pendingDestroy(texture);
|
||||
}
|
||||
else if (!this.linkFile)
|
||||
{
|
||||
texture = this.cache.addImage(this.key, this.data);
|
||||
|
||||
this.pendingDestroy(texture);
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
|
|
@ -49,26 +49,28 @@ var UnityAtlasFile = new Class({
|
|||
var image = new ImageFile(loader, key, textureURL, textureXhrSettings);
|
||||
var data = new TextFile(loader, key, atlasURL, atlasXhrSettings);
|
||||
|
||||
if (image.linkFile)
|
||||
{
|
||||
// Image has a normal map
|
||||
MultiFile.call(this, loader, 'unityatlas', key, [ image, data, image.linkFile ]);
|
||||
}
|
||||
else
|
||||
{
|
||||
MultiFile.call(this, loader, 'unityatlas', key, [ image, data ]);
|
||||
}
|
||||
},
|
||||
|
||||
addToCache: function ()
|
||||
{
|
||||
if (this.failed === 0 && !this.complete)
|
||||
{
|
||||
var fileA = this.files[0];
|
||||
var fileB = this.files[1];
|
||||
var image = this.files[0];
|
||||
var text = this.files[1];
|
||||
var normalMap = (this.files[2]) ? this.files[2].data : null;
|
||||
|
||||
if (fileA.type === 'image')
|
||||
{
|
||||
this.loader.textureManager.addUnityAtlas(fileA.key, fileA.data, fileB.data);
|
||||
fileB.addToCache();
|
||||
}
|
||||
else
|
||||
{
|
||||
this.loader.textureManager.addUnityAtlas(fileB.key, fileB.data, fileA.data);
|
||||
fileA.addToCache();
|
||||
}
|
||||
this.loader.textureManager.addUnityAtlas(image.key, image.data, text.data, normalMap);
|
||||
|
||||
text.addToCache();
|
||||
|
||||
this.complete = true;
|
||||
}
|
||||
|
|
|
@ -385,19 +385,20 @@ var TextureManager = new Class({
|
|||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {HTMLImageElement} source - The source Image element.
|
||||
* @param {object} data - The Texture Atlas data.
|
||||
* @param {HTMLImageElement} [dataSource] - An optional data Image element.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addAtlas: function (key, source, data)
|
||||
addAtlas: function (key, source, data, dataSource)
|
||||
{
|
||||
// New Texture Packer format?
|
||||
if (Array.isArray(data.textures) || Array.isArray(data.frames))
|
||||
{
|
||||
return this.addAtlasJSONArray(key, source, data);
|
||||
return this.addAtlasJSONArray(key, source, data, dataSource);
|
||||
}
|
||||
else
|
||||
{
|
||||
return this.addAtlasJSONHash(key, source, data);
|
||||
return this.addAtlasJSONHash(key, source, data, dataSource);
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -412,10 +413,11 @@ var TextureManager = new Class({
|
|||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {(HTMLImageElement|HTMLImageElement[])} source - The source Image element/s.
|
||||
* @param {(object|object[])} data - The Texture Atlas data/s.
|
||||
* @param {HTMLImageElement} [dataSource] - An optional data Image element.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addAtlasJSONArray: function (key, source, data)
|
||||
addAtlasJSONArray: function (key, source, data, dataSource)
|
||||
{
|
||||
var texture = null;
|
||||
|
||||
|
@ -423,6 +425,7 @@ var TextureManager = new Class({
|
|||
{
|
||||
texture = this.create(key, source);
|
||||
|
||||
// Multi-Atlas?
|
||||
if (Array.isArray(data))
|
||||
{
|
||||
var singleAtlasFile = (data.length === 1); // multi-pack with one atlas file for all images
|
||||
|
@ -440,6 +443,11 @@ var TextureManager = new Class({
|
|||
Parser.JSONArray(texture, 0, data);
|
||||
}
|
||||
|
||||
if (dataSource)
|
||||
{
|
||||
texture.setDataSource(dataSource);
|
||||
}
|
||||
|
||||
this.emit('addtexture', key, texture);
|
||||
}
|
||||
|
||||
|
@ -457,10 +465,11 @@ var TextureManager = new Class({
|
|||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {HTMLImageElement} source - The source Image element.
|
||||
* @param {object} data - The Texture Atlas data.
|
||||
* @param {HTMLImageElement} [dataSource] - An optional data Image element.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addAtlasJSONHash: function (key, source, data)
|
||||
addAtlasJSONHash: function (key, source, data, dataSource)
|
||||
{
|
||||
var texture = null;
|
||||
|
||||
|
@ -480,6 +489,46 @@ var TextureManager = new Class({
|
|||
Parser.JSONHash(texture, 0, data);
|
||||
}
|
||||
|
||||
if (dataSource)
|
||||
{
|
||||
texture.setDataSource(dataSource);
|
||||
}
|
||||
|
||||
this.emit('addtexture', key, texture);
|
||||
}
|
||||
|
||||
return texture;
|
||||
},
|
||||
|
||||
/**
|
||||
* Adds a Texture Atlas to this Texture Manager, where the atlas data is given
|
||||
* in the XML format.
|
||||
*
|
||||
* @method Phaser.Textures.TextureManager#addAtlasXML
|
||||
* @since 3.7.0
|
||||
*
|
||||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {HTMLImageElement} source - The source Image element.
|
||||
* @param {object} data - The Texture Atlas XML data.
|
||||
* @param {HTMLImageElement} [dataSource] - An optional data Image element.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addAtlasXML: function (key, source, data, dataSource)
|
||||
{
|
||||
var texture = null;
|
||||
|
||||
if (this.checkKey(key))
|
||||
{
|
||||
texture = this.create(key, source);
|
||||
|
||||
Parser.AtlasXML(texture, 0, data);
|
||||
|
||||
if (dataSource)
|
||||
{
|
||||
texture.setDataSource(dataSource);
|
||||
}
|
||||
|
||||
this.emit('addtexture', key, texture);
|
||||
}
|
||||
|
||||
|
@ -496,10 +545,11 @@ var TextureManager = new Class({
|
|||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {HTMLImageElement} source - The source Image element.
|
||||
* @param {object} data - The Texture Atlas data.
|
||||
* @param {HTMLImageElement} [dataSource] - An optional data Image element.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addUnityAtlas: function (key, source, data)
|
||||
addUnityAtlas: function (key, source, data, dataSource)
|
||||
{
|
||||
var texture = null;
|
||||
|
||||
|
@ -509,6 +559,11 @@ var TextureManager = new Class({
|
|||
|
||||
Parser.UnityYAML(texture, 0, data);
|
||||
|
||||
if (dataSource)
|
||||
{
|
||||
texture.setDataSource(dataSource);
|
||||
}
|
||||
|
||||
this.emit('addtexture', key, texture);
|
||||
}
|
||||
|
||||
|
@ -625,35 +680,6 @@ var TextureManager = new Class({
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Adds a Texture Atlas to this Texture Manager, where the atlas data is given
|
||||
* in the XML format.
|
||||
*
|
||||
* @method Phaser.Textures.TextureManager#addAtlasXML
|
||||
* @since 3.7.0
|
||||
*
|
||||
* @param {string} key - The unique string-based key of the Texture.
|
||||
* @param {HTMLImageElement} source - The source Image element.
|
||||
* @param {object} data - The Texture Atlas XML data.
|
||||
*
|
||||
* @return {?Phaser.Textures.Texture} The Texture that was created, or `null` if the key is already in use.
|
||||
*/
|
||||
addAtlasXML: function (key, source, data)
|
||||
{
|
||||
var texture = null;
|
||||
|
||||
if (this.checkKey(key))
|
||||
{
|
||||
texture = this.create(key, source);
|
||||
|
||||
Parser.AtlasXML(texture, 0, data);
|
||||
|
||||
this.emit('addtexture', key, texture);
|
||||
}
|
||||
|
||||
return texture;
|
||||
},
|
||||
|
||||
/**
|
||||
* Creates a new Texture using the given source and dimensions.
|
||||
*
|
||||
|
|
Loading…
Reference in a new issue