Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-27 07:01:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

Added in normal map support

Browse source
This commit is contained in:
Richard Davey 2018-05-04 14:32:13 +01:00
parent 9b7d6d0254
commit b0c853a782
5 changed files with 147 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/loader/filetypes/AtlasJSONFile.js
View file

@ -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);
MultiFile.call(this, loader, 'atlasjson', key, [ image, data ]);
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;
}

28
src/loader/filetypes/AtlasXMLFile.js
View file

@ -49,26 +49,28 @@ var AtlasXMLFile = new Class({
var image = new ImageFile(loader, key, textureURL, textureXhrSettings);
var data = new XMLFile(loader, key, atlasURL, atlasXhrSettings);
MultiFile.call(this, loader, 'atlasxml', key, [ image, data ]);
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;
}

47
src/loader/filetypes/ImageFile.js
View file

@ -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,9 +111,36 @@ var ImageFile = new Class({
addToCache: function ()
{
var texture = this.cache.addImage(this.key, this.data);
console.log('addToCache', this.key, this.type);
this.pendingDestroy(texture);
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);
}
}
});

28
src/loader/filetypes/UnityAtlasFile.js
View file

@ -49,26 +49,28 @@ var UnityAtlasFile = new Class({
var image = new ImageFile(loader, key, textureURL, textureXhrSettings);
var data = new TextFile(loader, key, atlasURL, atlasXhrSettings);
MultiFile.call(this, loader, 'unityatlas', key, [ image, data ]);
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;
}

96
src/textures/TextureManager.js
View file

@ -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.
*