@makefully/platypus 4.1.11 → 4.1.14

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@makefully/platypus",
-    "version": "4.1.11",
+    "version": "4.1.14",
     "description": "2D tile-based HTML5 game engine with a component-based entity model",
     "license": "MIT",
     "contributors": [
@@ -73,7 +73,7 @@
         "webpack-dev-server": "^5.2.2"
     },
     "peerDependencies": {
-        "@esotericsoftware/spine-pixi-v8": "^4.3.7",
+        "@esotericsoftware/spine-pixi-v8": "^4.3.13",
         "@pixi/sound": "github:Makefully-Studios/sound#feature/media-file",
         "@tweenjs/tween.js": "^23.1.1",
         "pako": "^2.1.0",

package/src/Messenger.js

@@ -1,9 +1,8 @@
-/* global platypus, window */
+/* global performance, platypus */
 import EventHandlerList from './EventHandlerList.js';
 import {arrayCache, greenSlice} from './utils/array.js';
 
 const
-    getPerfTools = () => typeof performance !== 'undefined' && performance.mark && performance.measure ? performance : null,
     runBoth = function (f1, f2) {
         return function () {
             f1.apply(this, arguments);
@@ -57,8 +56,6 @@ class Messenger {
                 
                 // Debug logging.
                 if (debugLogging || this.debug) {
-                    const perfTools = getPerfTools();
-
                     for (let i = 0; i < this.loopCheck.length; i++) {
                         if (this.loopCheck[i] === event) {
                             debugCount += 1;
@@ -72,17 +69,13 @@ class Messenger {
     
                     this.loopCheck.push(event);
 
-                    if (perfTools) {
-                        perfTools.mark("a");
-                    }
+                    performance.mark("a");
 
                     const
                         count = triggerEvent.apply(this, arguments);
 
-                    if (perfTools) {
-                        perfTools.mark("b");
-                        perfTools.measure(this.type + ":" + event, 'a', 'b');
-                    }
+                    performance.mark("b");
+                    performance.measure(this.type + ":" + event, 'a', 'b');
                     this.loopCheck.length = this.loopCheck.length - 1;
                     if (debugLogging) {
                         if (count) {
@@ -341,7 +334,14 @@ class Messenger {
                 key = methods[i];
 
             if (key !== 'constructor') {
-                if (toProto[key]) {
+                const
+                    descriptor = Object.getOwnPropertyDescriptor(fromProto, key);
+
+                // Preserve accessors (e.g. `destroyed`); assigning fromProto[key] would
+                // evaluate getters and copy a stale value instead.
+                if (descriptor.get || descriptor.set) {
+                    Object.defineProperty(toProto, key, descriptor);
+                } else if (Object.prototype.hasOwnProperty.call(toProto, key) || toProto[key]) {
                     toProto[key] = runBoth(toProto[key], fromProto[key]);
                 } else {
                     toProto[key] = fromProto[key];

package/src/PIXIAnimation.js

@@ -339,6 +339,9 @@ const
         */
         stop () {
             this.paused = true;
+            if (this._animation?.stop) {
+                this._animation.stop();
+            }
         };
                 
         /**
@@ -348,6 +351,9 @@ const
         */
         play () {
             this.paused = false;
+            if (this._animation?.play) {
+                this._animation.play();
+            }
         };
         
         /**

package/src/components/EntityContainer.js

@@ -139,6 +139,10 @@ const
             },
             
             addNewPrivateEvent (event) {
+                if (this.destroyed || !this.entities || !this._childEvents) {
+                    return false;
+                }
+
                 if (this._childEvents[event]) {
                     return false;
                 }
@@ -148,7 +152,17 @@ const
                 // Listen for message on children
                 for (let x = 0; x < this.entities.length; x++) {
                     const
-                        listenerList = this.entities[x]._listeners[event];
+                        entity = this.entities[x],
+                        listeners = entity && entity._listeners;
+
+                    // Child may already be destroyed while still listed (e.g. re-entrant
+                    // input during container teardown).
+                    if (!listeners) {
+                        continue;
+                    }
+
+                    const
+                        listenerList = listeners[event];
 
                     if (listenerList) {
                         const
@@ -156,7 +170,7 @@ const
 
                         for (let y = 0; y < handlers.length; y++) {
                             this.addChildEventListener(
-                                this.entities[x],
+                                entity,
                                 event,
                                 handlers[y]
                             );
@@ -174,7 +188,13 @@ const
             
             addChildEventListeners (entity) {
                 const
-                    {_listeners} = entity,
+                    {_listeners} = entity;
+
+                if (!_listeners) {
+                    return;
+                }
+
+                const
                     keys = Object.keys(_listeners),
                     {length} = keys;
 
@@ -268,10 +288,14 @@ const
             },
 
             destroy: function () {
+                // Mark destroyed first so re-entrant input (e.g. Enter:down) cannot
+                // walk children mid-teardown after their `_listeners` are nulled.
+                this._destroyed = true;
+
                 const
-                    entities = greenSlice(this.entities); // Make a copy to handle entities being destroyed while processing list.
+                    entities = this.entities ? greenSlice(this.entities) : arrayCache.setUp(); // Make a copy to handle entities being destroyed while processing list.
                 let i = entities.length;
-                
+
                 while (i--) {
                     const
                         entity = entities[i];
@@ -279,14 +303,22 @@ const
                     this.removeChildEventListeners(entity);
                     entity.destroy();
                 }
-                
+
                 arrayCache.recycle(entities);
-                arrayCache.recycle(this.entities);
+                if (this.entities) {
+                    arrayCache.recycle(this.entities);
+                    this.entities = null;
+                }
                 this.owner.entities = null;
-                arrayCache.recycle(this.childEvents);
-                this.childEvents = null;
-                arrayCache.recycle(this.newAdds);
-                this.newAdds = null;
+                this._childEvents = null;
+                if (this.childEvents) {
+                    arrayCache.recycle(this.childEvents);
+                    this.childEvents = null;
+                }
+                if (this.newAdds) {
+                    arrayCache.recycle(this.newAdds);
+                    this.newAdds = null;
+                }
             }
         },
         
@@ -485,7 +517,7 @@ const
              * @param {*} debug
              */
             triggerEventOnChildren: function (event, message, debug) {
-                if (this.destroyed) {
+                if (this.destroyed || !this.entities || !this._childEvents) {
                     return 0;
                 }
                 
@@ -504,7 +536,7 @@ const
              * @param {*} debug
              */
             triggerOnChildren: function (event) {
-                if (this.destroyed) {
+                if (this.destroyed || !this.entities || !this._childEvents) {
                     return 0;
                 }
                 

package/src/components/RenderSpine.js

@@ -379,14 +379,6 @@ export default createComponentClass(/** @lends platypus.components.RenderSpine.p
                     spine = this.spine = new Spine({skeletonData, autoUpdate: false}),
                     map = createAnimationMap(this.animationMap, skeleton.animations);
 
-                // Spine 4.3 inherits Pixi container world-transform deltas into skeleton physics by default.
-                // Platypus pans the camera by moving the world container, which shifts every entity's world
-                // transform even when owner.x/y are unchanged — causing unwanted physics on stationary characters.
-                // Use the `apply-spine-physics` event for intentional movement-driven physics instead.
-                spine.setPhysicsPositionInheritanceFactor(0, 0);
-                spine.physicsRotationInheritanceFactor = 0;
-                spine.resetPhysicsTransform();
-
                 let animation = '';
 
                 spine.state.addListener({

package/src/components/RenderSprite.js

@@ -430,15 +430,20 @@ export default createComponentClass(/** @lends platypus.components.RenderSprite.
     events: {
         "handle-render": function (renderData) {
             if (this.sprite) {
+                const
+                    playing = !this.sprite.paused;
+
                 /**
                  * This event is triggered each tick to check for animation updates.
                  *
                  * @event platypus.Entity#update-animation
                  * @param playing {Boolean} Whether the animation is in a playing or paused state.
                  */
-                this.owner.triggerEvent('update-animation', true);
+                this.owner.triggerEvent('update-animation', playing);
 
-                this.sprite.update(renderData.delta);
+                if (playing) {
+                    this.sprite.update(renderData.delta);
+                }
             }
         },
         

package/src/index.js

@@ -5,7 +5,7 @@
 /**
  * @namespace platypus
  */
-/* global global, navigator, window */
+/* global global, navigator */
 
 import AssetManager from './AssetManager.js';
 import {Debugger} from 'springroll';
@@ -46,7 +46,6 @@ const
         components
     },
     uagent    = navigator.userAgent.toLowerCase(),
-    isEdge    = (uagent.search('edge')    > -1),
     isIPod    = (uagent.search('ipod')    > -1),
     isIPhone  = (uagent.search('iphone')  > -1),
     isIPad    = (uagent.search('ipad')    > -1) || (uagent.search('mac') > -1 && navigator.maxTouchPoints > 2 && !isIPhone),
@@ -109,20 +108,21 @@ const
 
 /**
  * This is an object of boolean key/value pairs describing the current browser's properties.
+ * Obsolete capability flags (`touch`, `edge`, `ie`) are fixed to match modern browser support.
  * @property supports
  * @type Object
  **/
 platypus.supports = {
-    touch: (window.ontouchstart !== 'undefined'),
-    edge: isEdge,
+    touch: true, // Touch Events are universally available in modern browsers
+    edge: false, // Legacy EdgeHTML is no longer supported
     iPod: isIPod,
     iPhone: isIPhone,
     iPad: isIPad,
-    safari: (uagent.search('safari') > -1) && !isEdge,
-    ie: (uagent.search('msie') > -1) || (uagent.search('trident') > -1),
+    safari: (uagent.search('safari') > -1),
+    ie: false, // Internet Explorer is no longer supported
     firefox: (uagent.search('firefox') > -1),
     android: isAndroid,
-    chrome: (uagent.search('chrome') > -1) && !isEdge,
+    chrome: (uagent.search('chrome') > -1),
     silk: isSilk,
     iOS: isIOS,
     mobile: isMobile,

package/src/platypus.css

@@ -1,8 +1,6 @@
 div#captions {
-    user-select: none;
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
+    user-select: none;
     -webkit-touch-callout: none;
 }
 
@@ -11,11 +9,10 @@ canvas.platypus-canvas {
     position: relative;
     width: 100%;
 
-    user-select: none;
-    -moz-user-select: none;
     -webkit-user-select: none;
-    -ms-user-select: none;
+    user-select: none;
     -webkit-touch-callout: none;
+    touch-action: none;
 }
 
 .platypus-debugging {
@@ -28,6 +25,7 @@ canvas.platypus-canvas {
     z-index: 2;
     font-family: "Lucida Console", Monaco, monospace;
     -webkit-touch-callout: none;
+    -webkit-user-select: none;
     user-select: none;
     cursor: default;
     margin: 0;

package/src/sayHello.js

@@ -30,7 +30,7 @@ export default function (app) {
         author = docAuth ? `by ${docAuth}` : '',
         title = `${options.name ?? app.name ?? document.title ?? ''}${version ? ` ${version}` : ''}`,
         using = arrayCache.setUp(),
-        {springroll, supports} = platypus;
+        {springroll} = platypus;
     
     if (springroll) {
         using.push('SpringRoll ' + springroll.version);
@@ -38,13 +38,10 @@ export default function (app) {
     
     using.push('Pixi.js ' + pixiVersion);
     
-    if (supports.firefox || supports.chrome) {
-        console.log(`%c ${title} %c ${author}`, getStyle(title, title.substr(title.lastIndexOf(' ') - title.length + 1)), 'line-height: 1.5em;');
-        using.push(`Platypus ${platypus.version}`);
-        console.log(`Using %c ${using.join(' %c %c ')} %c `, ...getVersions(using));
-    } else {
-        console.log(`--- "${title}" ${author} - Using ${using.join(', ')}, and Platypus ${platypus.version} ---`);
-    }
+    // Styled console (%c) is supported in all modern browsers.
+    console.log(`%c ${title} %c ${author}`, getStyle(title, title.substr(title.lastIndexOf(' ') - title.length + 1)), 'line-height: 1.5em;');
+    using.push(`Platypus ${platypus.version}`);
+    console.log(`Using %c ${using.join(' %c %c ')} %c `, ...getVersions(using));
 
     arrayCache.recycle(using);
 };