@tawaship/pixi-animate-runtime 0.1.0 → 0.1.1

package/README.md

@@ -280,7 +280,8 @@ content's frames.
   `lib.properties` (`width`, `height`, `fps`, `color` and so on; read-only)
 - To use an image of the content elsewhere, create the symbol that shows it and take its Pixi node:
   `content.create('Bitmap1').pixi.texture`
-- `container.speed` changes the playback speed (`1` is the published frame rate, `0` stops). When the
+- `container.speed` changes the playback speed (`1` is the published frame rate, `0` stops; a value below `0`
+  stops it as `0` does, and it goes on from where it stopped once the speed is above `0` again). When the
   display runs slower than the content, one call plays several frames; set `container.overSpeed = false`
   to play at most one frame per call
 - `container.smooth` (`true` by default) keeps the playing even when the time between frames of the display
@@ -441,6 +442,15 @@ Known faults are put into the player on purpose to confirm that the comparisons
 
 ## Change log
 
+### 0.1.1
+
+- A `speed` below `0` stops the playing as `0` does. It kept the playing stopped for a while after the speed was
+  set above `0` again (for as long as it had been below `0`)
+- Right after a goto made outside the playing (from a pointer event, for example), PixiJS drew synched and single
+  frame clips at their old frame, and clips coming back on the display list at the frame they had when they left,
+  until the content played its next frame (up to a frame of the content: about 0.1 s at 10 fps). They now show
+  what CreateJS shows from the first draw after the goto
+
 ### 0.1.0
 
 - First release: generates runtime content from content published by Adobe Animate for HTML5 Canvas (the command

package/dist/generator.cjs.js

@@ -1,5 +1,5 @@
 /*!
- * @tawaship/pixi-animate-runtime - v0.1.0
+ * @tawaship/pixi-animate-runtime - v0.1.1
  * 
  * @author tawaship (makazu.mori@gmail.com)
  * @license MIT
@@ -190,7 +190,7 @@ function checkVersion(version, range, known) {
 }
 
 /** The version of this package (written in from package.json when the package is built) */
-const VERSION = "0.1.0";
+const VERSION = "0.1.1";
 
 /**
  * The animate-data-converter versions this generator reads definitions of:

package/dist/pixi-animate-runtime.cjs.js

@@ -1,5 +1,5 @@
 /*!
- * @tawaship/pixi-animate-runtime - v0.1.0
+ * @tawaship/pixi-animate-runtime - v0.1.1
  * 
  * @author tawaship (makazu.mori@gmail.com)
  * @license MIT
@@ -446,6 +446,12 @@ var DisplayObject = /*@__PURE__*/(function (EventDispatcher) {
         this._maskHost = null;
         /** The objects this object masks (while they are on a display list) */
         this._maskTargets = [];
+        /**
+         * Set on a root when a timeline under it jumped outside the playing (a goto):
+         * its clips are to be settled before Pixi draws it (settleForDrawing), as a
+         * createjs draw would. The resolve phase of a frame clears it
+         */
+        this._pendingResolve = false;
         this.id = nextId++;
         this.pixi = pixi;
         pixi.owner = this;
@@ -1240,6 +1246,13 @@ var MovieClip = /*@__PURE__*/(function (Container) {
         if (position != null) {
             this._t = 0;
             this._updateTimeline(position, true);
+            // The clips it placed (synched ones, ones to start over) are settled by createjs when it
+            // draws: the root is to be settled before Pixi draws it, if no frame is played before
+            var root = this;
+            while (root.parent) {
+                root = root.parent;
+            }
+            root._pendingResolve = true;
         }
     };
     MovieClip.prototype._reset = function _reset () {
@@ -2684,7 +2697,7 @@ function checkVersion(version, range, known) {
 }
 
 /** The version of this package (written in from package.json when the package is built) */
-var VERSION = "0.1.0";
+var VERSION = "0.1.1";
 
 /**
  * The eases of CreateJS (createjs.Ease), computed as CreateJS computes them,
@@ -3331,6 +3344,7 @@ function tick(root, event) {
  * reverse order), without playing a frame.
  */
 function resolveState(node) {
+    node._pendingResolve = false;
     if (node instanceof MovieClip) {
         node._updateState();
     }
@@ -3343,6 +3357,34 @@ function resolveState(node) {
         }
     }
 }
+/**
+ * Settles a display tree for drawing without playing it on, as a createjs
+ * stage draw shows it (MovieClip.draw settles each clip): the synched and
+ * single frame clips are placed at the frame their parent gives, and a clip
+ * waiting to start over (an independent clip reset when its parent placed it
+ * again) is shown at its first frame the way a new clip is (no frame script,
+ * its playhead left to start on the next frame, as in the template, where
+ * createjs draws only after a frame). Children after their parent, in reverse
+ * order as the resolve phase.
+ */
+function settleForDrawing(node) {
+    if (node instanceof MovieClip) {
+        if (node.mode !== INDEPENDENT) {
+            node._updateState();
+        }
+        else if (node._rawPosition === -1) {
+            node._renderFirstFrame();
+        }
+    }
+    if (node instanceof Container) {
+        var children = node.children.slice();
+        for (var i = children.length - 1; i >= 0; i--) {
+            if (children[i] instanceof MovieClip) {
+                settleForDrawing(children[i]);
+            }
+        }
+    }
+}
 
 /** The frame rate a root plays at when its content does not give one */
 var DEFAULT_FPS = 60;
@@ -3368,7 +3410,7 @@ var PULL = 0.05;
  * on only settles it on its first frame.
  */
 var AnimateController = function AnimateController(container) {
-    /** Playback speed (1 is the content's own frame rate) */
+    /** Playback speed (1 is the content's own frame rate, 0 stops; a value below 0 is taken as 0) */
     this.speed = 1;
     /** Whether one call may play more than one frame (when the display runs slower than the content) */
     this.overSpeed = true;
@@ -3380,12 +3422,34 @@ var AnimateController = function AnimateController(container) {
     this._deltas = [];
     this._nextDelta = 0;
     this._container = container;
+    // Pixi updates the transforms of the tree before every draw: the roots a goto changed outside
+    // the playing are settled then, as a createjs draw settles them (frames played meanwhile settle them first)
+    var updateTransform = container.updateTransform;
+    var controller = this;
+    container.updateTransform = function () {
+        controller._settleForDrawing();
+        updateTransform.call(this);
+    };
+};
+/** Settles the roots marked by a goto since they were last resolved */
+AnimateController.prototype._settleForDrawing = function _settleForDrawing () {
+    var targets = this._targets;
+    Object.keys(targets).forEach(function (key) {
+        var target = targets[Number(key)];
+        if (target && target.root._pendingResolve) {
+            target.root._pendingResolve = false;
+            settleForDrawing(target.root);
+        }
+    });
 };
 AnimateController.prototype.handleTick = function handleTick (delta) {
         var this$1$1 = this;
 
-    var d = delta * this.speed;
-    var usual = this._usualDelta(delta) * this.speed;
+    // A speed below 0 plays as 0 does (nothing is played backward): the frames owed stay where they
+    // were, and the playing goes on from there once the speed is above 0 again
+    var speed = Math.max(this.speed, 0);
+    var d = delta * speed;
+    var usual = this._usualDelta(delta) * speed;
     var targets = this._targets;
     Object.keys(targets).forEach(function (key) {
         var target = targets[Number(key)];
@@ -3491,7 +3555,7 @@ var AnimateContainer = /*@__PURE__*/(function (superclass) {
     AnimateContainer.prototype.constructor = AnimateContainer;
 
     var prototypeAccessors = { speed: { configurable: true },overSpeed: { configurable: true },smooth: { configurable: true } };
-    /** Playback speed (1 is the content's own frame rate) */
+    /** Playback speed (1 is the content's own frame rate, 0 stops; a value below 0 is taken as 0) */
     prototypeAccessors.speed.get = function () { return this._controller.speed; };
     prototypeAccessors.speed.set = function (value) { this._controller.speed = value; };
     /** Whether one call may play more than one frame (when the display runs slower than the content) */