@makefully/platypus 4.1.9 → 4.1.11

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@makefully/platypus",
-    "version": "4.1.9",
+    "version": "4.1.11",
     "description": "2D tile-based HTML5 game engine with a component-based entity model",
     "license": "MIT",
     "contributors": [

package/src/AssetManager.js

@@ -7,6 +7,7 @@
 /* global platypus, setTimeout */
 import Data from './Data.js';
 import DataMap from './DataMap.js';
+import PIXIAnimation from './PIXIAnimation.js';
 import {Assets} from 'pixi.js';
 import {arrayCache} from './utils/array.js';
 
@@ -26,6 +27,9 @@ const
             'src', path,
             'data', asset.data ?? null
         );
+    },
+    isRegisteredWithPixi = function (alias, src) {
+        return Assets.resolver.hasKey(alias) || (src && src !== alias && Assets.resolver.hasKey(src));
     };
 
 export default class AssetManager {
@@ -55,6 +59,7 @@ export default class AssetManager {
                     asset.src = '';
                 }
                 assets.delete(alias);
+                PIXIAnimation.invalidateTextureSources(alias);
             }
 
             return !counts[alias];
@@ -71,7 +76,18 @@ export default class AssetManager {
      * @return {Object} Returns the asset if defined.
      */
     get (alias) {
-        return this.assets.get(alias);
+        if (this.assets.has(alias)) {
+            return this.assets.get(alias);
+        }
+
+        const
+            fileId = this.getFileId(alias);
+
+        if (fileId !== alias && this.assets.has(fileId)) {
+            return this.assets.get(fileId);
+        }
+
+        return undefined;
     }
 
     /**
@@ -131,6 +147,7 @@ export default class AssetManager {
         const
             counts = this.counts,
             needsLoading = arrayCache.setUp(),
+            needsRelink = arrayCache.setUp(),
             adds = Data.setUp();
 
         if (platypus.game?.options?.images ?? platypus.game?.options?.audio) {
@@ -154,13 +171,39 @@ export default class AssetManager {
                 adds[alias] += 1;
             } else {
                 adds[alias] = 1;
+                if (isRegisteredWithPixi(alias, item.src)) {
+                    needsRelink.push(item);
+                } else {
+                    needsLoading.push(item);
+                }
+            }
+        }
+
+        for (let i = needsRelink.length - 1; i >= 0; i--) {
+            const
+                item = needsRelink[i],
+                alias = item.alias[0],
+                asset = Assets.get(alias) ?? Assets.get(item.src);
+
+            if (asset) {
+                this.set(alias, asset, adds[alias]);
+                needsRelink.splice(i, 1);
+            } else {
                 needsLoading.push(item);
+                needsRelink.splice(i, 1);
             }
         }
 
         if (needsLoading.length) {
             // Do this first to pass `data` property if needed
-            needsLoading.forEach((asset) => Assets.add(asset));
+            needsLoading.forEach((asset) => {
+                const
+                    alias = asset.alias[0];
+
+                if (!isRegisteredWithPixi(alias, asset.src)) {
+                    Assets.add(asset);
+                }
+            });
 
             const
                 aliases = needsLoading.map((asset) => asset.alias[0]),
@@ -188,6 +231,7 @@ export default class AssetManager {
         }
 
         arrayCache.recycle(needsLoading);
+        arrayCache.recycle(needsRelink);
     }
 
     /**

package/src/PIXIAnimation.js

@@ -4,15 +4,74 @@ import {arrayCache, greenSlice} from './utils/array.js';
 import Data from './Data.js';
 
 const
-    MAX_KEY_LENGTH_PER_IMAGE = 128,
     animationCache = {},
     textureSourceCache = {},
     doNothing = function () {},
     emptyFrame = Texture.EMPTY,
-    regex = /[\[\]{},-]/g,
+    imageBasename = /([\w-\.]+)\.(\w+)$/,
+    hashString = function (value) {
+        const
+            str = typeof value === 'string' ? value : JSON.stringify(value);
+        let hash = 5381;
+
+        for (let i = 0; i < str.length; i++) {
+            hash = ((hash << 5) + hash) ^ str.charCodeAt(i);
+        }
+
+        return (hash >>> 0).toString(36);
+    },
+    getTextureCacheKey = function (path) {
+        return platypus.assetCache?.getFileId ? platypus.assetCache.getFileId(path) : path;
+    },
+    resolveTextureAsset = function (path) {
+        const
+            assetCache = platypus.assetCache;
+
+        if (!assetCache) {
+            return null;
+        }
+
+        let asset = assetCache.get(path);
+
+        if (asset) {
+            return asset;
+        }
+
+        const
+            basename = typeof path === 'string' ? path.match(imageBasename) : null;
+
+        if (basename) {
+            asset = assetCache.get(basename[1]);
+
+            if (asset) {
+                return asset;
+            }
+        }
+
+        return null;
+    },
+    getTextureSourceAliases = function (alias) {
+        const
+            aliases = arrayCache.setUp(alias),
+            basename = typeof alias === 'string' ? alias.match(imageBasename) : null;
+
+        if (platypus.assetCache?.getFileId) {
+            const
+                fileId = platypus.assetCache.getFileId(alias);
+
+            if (fileId !== alias) {
+                aliases.push(fileId);
+            }
+        }
+
+        if (basename) {
+            aliases.push(basename[1]);
+        }
+
+        return aliases;
+    },
     getTextureSources = function (images) {
         const
-            assetCache = platypus.assetCache,
             bts = arrayCache.setUp();
         
         for (let i = 0; i < images.length; i++) {
@@ -20,17 +79,21 @@ const
                 path = images[i];
 
             if (typeof path === 'string') {
-                if (!textureSourceCache[path]) {
-                    const
-                        asset = assetCache.get(path);
+                const
+                    cacheKey = getTextureCacheKey(path),
+                    asset = resolveTextureAsset(path);
 
-                    if (!asset) {
-                        platypus.debug.warn(`PIXIAnimation: "${path}" is not a loaded asset.`);
-                        break;
-                    }
-                    textureSourceCache[path] = asset.source;
+                if (!asset) {
+                    delete textureSourceCache[cacheKey];
+                    platypus.debug.warn(`PIXIAnimation: "${path}" is not a loaded asset.`);
+                    break;
+                }
+
+                if (textureSourceCache[cacheKey] !== asset.source) {
+                    textureSourceCache[cacheKey] = asset.source;
                 }
-                bts.push(textureSourceCache[path]);
+
+                bts.push(textureSourceCache[cacheKey]);
             } else {
                 bts.push(new TextureSource(path));
             }
@@ -49,9 +112,7 @@ const
             }
         }
         
-        spriteSheet.id = JSON.stringify(spriteSheet).replace(regex, '');
-
-        return spriteSheet.id;
+        return `ss-${hashString(spriteSheet)}`;
     },
     getDefaultAnimation = function (length, textures) {
         const
@@ -397,6 +458,29 @@ const
             };
         }
         
+        /**
+         * Removes cached texture sources for an unloaded asset alias.
+         *
+         * @method platypus.PIXIAnimation.invalidateTextureSources
+         * @param {*} alias Asset alias or path used when the texture was cached.
+         */
+        static invalidateTextureSources (alias) {
+            const
+                aliases = getTextureSourceAliases(alias),
+                cacheKey = getTextureCacheKey(alias);
+            let i = aliases.length;
+
+            if (aliases.indexOf(cacheKey) === -1) {
+                aliases.push(cacheKey);
+            }
+
+            while (i--) {
+                delete textureSourceCache[aliases[i]];
+            }
+
+            arrayCache.recycle(aliases);
+        }
+
         /**
          * This method formats a provided value into a valid PIXIAnimation Sprite Sheet. This includes accepting the EaselJS spec, strings mapping to Platypus sprite sheets, or arrays of either.
          *
@@ -406,7 +490,6 @@ const
          */
         static formatSpriteSheet (spriteSheet) {
             const
-                imageParts = /([\w-\.]+)\.(\w+)$/,
                 addAnimations = function (source = {}, destination, speedRatio, firstFrameIndex, id) {
                     const
                         keys = Object.keys(source),
@@ -458,7 +541,6 @@ const
                         ));
                     }
                 },
-                createId = (images) => images.map((image) => (image.src ?? image).substring(0, MAX_KEY_LENGTH_PER_IMAGE)).join(','),
                 format = function (source, destination) {
                     const
                         {
@@ -479,11 +561,8 @@ const
                         firstImageIndex = dImages.length,
                         firstFrameIndex = dFrames.length;
                     
-                    // Set up id
-                    if (dID) {
-                        destination.id = `${dID};${sID ?? createId(sImages)}`;
-                    } else {
-                        destination.id = sID ?? createId(sImages);
+                    if (sID) {
+                        destination.id = dID ? `${dID};${sID}` : sID;
                     }
                     
                     // Set up images array
@@ -546,7 +625,7 @@ const
                 formatImages = function (name) {
                     if (typeof name === 'string') {
                         const
-                            match = name.match(imageParts);
+                            match = name.match(imageBasename);
 
                         if (match) {
                             return match[1];

package/src/VOPlayer.js

@@ -662,7 +662,7 @@ class VOPlayer extends Messenger {
      * @public
      */
     unloadSound (sound) {
-        this.assetCache.delete(sound);
+        this.assetCache.delete(this.assetCache.getFileId(sound));
     }
 
     /**