@eva/plugin-renderer-lottie 2.0.1-beta.4 → 2.0.1-beta.40

package/dist/EVA.plugin.renderer.lottie.js

@@ -197,7 +197,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
   } else {
     createTypedArray = createRegularArray;
   }
-  function createSizedArray$1(len) {
+  function createSizedArray$2(len) {
     return new Array(len);
   }
   var NEWTON_ITERATIONS = 4;
@@ -307,7 +307,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
     getBezierEasing: getBezierEasing
   };
   function _double(arr) {
-    return arr.concat(createSizedArray$1(arr.length));
+    return arr.concat(createSizedArray$2(arr.length));
   }
   var pooling = {
     double: _double
@@ -315,7 +315,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
   var PoolFactory = function PoolFactory(initialLength, _create, _release) {
     var _length = 0;
     var _maxLength = initialLength;
-    var pool = createSizedArray$1(_maxLength);
+    var pool = createSizedArray$2(_maxLength);
     var ob = {
       newElement: newElement,
       release: release
@@ -464,7 +464,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       var bezierData = new BezierData(curveSegments);
       var len = pt3.length;
       for (var k = 0; k < curveSegments; k += 1) {
-        point = createSizedArray$1(len);
+        point = createSizedArray$2(len);
         var perc = k / (curveSegments - 1);
         ptDistance = 0;
         for (var i = 0; i < len; i += 1) {
@@ -1368,9 +1368,9 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this.c = false;
       this._length = 0;
       this._maxLength = 8;
-      this.v = createSizedArray$1(this._maxLength);
-      this.o = createSizedArray$1(this._maxLength);
-      this.i = createSizedArray$1(this._maxLength);
+      this.v = createSizedArray$2(this._maxLength);
+      this.o = createSizedArray$2(this._maxLength);
+      this.i = createSizedArray$2(this._maxLength);
     }
     return _createClass(ShapePath, [{
       key: 'setPathData',
@@ -1396,9 +1396,9 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
     }, {
       key: 'doubleArrayLength',
       value: function doubleArrayLength() {
-        this.v = this.v.concat(createSizedArray$1(this._maxLength));
-        this.i = this.i.concat(createSizedArray$1(this._maxLength));
-        this.o = this.o.concat(createSizedArray$1(this._maxLength));
+        this.v = this.v.concat(createSizedArray$2(this._maxLength));
+        this.i = this.i.concat(createSizedArray$2(this._maxLength));
+        this.o = this.o.concat(createSizedArray$2(this._maxLength));
         this._maxLength *= 2;
       }
     }, {
@@ -1489,13 +1489,13 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       _classCallCheck(this, ShapeCollection);
       this._length = 0;
       this._maxLength = 4;
-      this.shapes = createSizedArray$1(this._maxLength);
+      this.shapes = createSizedArray$2(this._maxLength);
     }
     return _createClass(ShapeCollection, [{
       key: 'addShape',
       value: function addShape(shapeData) {
         if (this._length === this._maxLength) {
-          this.shapes = this.shapes.concat(createSizedArray$1(this._maxLength));
+          this.shapes = this.shapes.concat(createSizedArray$2(this._maxLength));
           this._maxLength *= 2;
         }
         this.shapes[this._length] = shapeData;
@@ -1513,7 +1513,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
   }();
   var _length = 0;
   var _maxLength = 4;
-  var pool = createSizedArray$1(_maxLength);
+  var pool = createSizedArray$2(_maxLength);
   function newShapeCollection() {
     var shapeCollection;
     if (_length) {
@@ -2082,7 +2082,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       _this.propType = 'mask';
       _this.masksProperties = masksProperties || [];
       _this.initDynamicPropertyContainer(elem);
-      _this.viewData = createSizedArray$1(_this.masksProperties.length);
+      _this.viewData = createSizedArray$2(_this.masksProperties.length);
       var len = _this.masksProperties.length;
       var hasMasks = false;
       for (var i = 0; i < len; i++) {
@@ -3693,7 +3693,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       _this = _callSuper(this, DashProperty);
       _this.elem = elem;
       _this.frameId = -1;
-      _this.dataProps = createSizedArray$1(data.length);
+      _this.dataProps = createSizedArray$2(data.length);
       _this.k = false;
       _this.dashArray = createTypedArray('float32', data.length ? data.length - 1 : 0);
       _this.dashoffset = createTypedArray('float32', 1);
@@ -4840,7 +4840,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       _this._textData = textData;
       _this._renderType = renderType;
       _this.elem = elem;
-      _this._animatorsData = createSizedArray$1(_this._textData.a.length);
+      _this._animatorsData = createSizedArray$2(_this._textData.a.length);
       _this._pathData = {};
       _this._moreOptions = {
         alignment: {}
@@ -6856,7 +6856,6 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
     }
   };
   ({
-    UPDATE_PRIORITY: pixi_js.UPDATE_PRIORITY,
     animationTicker: pixi_js.Ticker.shared
   });
   const p = n => n > 0 ? n : 0;
@@ -6904,6 +6903,26 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       });
     }
   }
+  const updateTransformByHierarchy = (container, transform, parent) => {
+    if (transform.p) {
+      container.x = transform.p.v[0];
+      container.y = transform.p.v[1];
+    } else {
+      container.x = transform.px.v;
+      container.y = transform.py.v;
+    }
+    container.pivot.x = transform.a.v[0];
+    container.pivot.y = transform.a.v[1];
+    container.scale.x = transform.s.v[0];
+    container.scale.y = transform.s.v[1];
+    if (transform.r) {
+      container.rotation = transform.r.v + transform.orientation;
+    } else if (transform.rz) {
+      container.rotation = transform.rz.v + transform.or.v[2];
+    }
+    const parentAlpha = parent ? parent.alpha : 1;
+    container.alpha = parentAlpha * transform.o.v;
+  };
   class CompElement extends pixi_js.Container {
     constructor(lottieLayer, isRoot) {
       super();
@@ -6933,23 +6952,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this._onUpdate();
     }
     updateLottieTransform(transform) {
-      if (transform.p) {
-        this.x = transform.p.v[0];
-        this.y = transform.p.v[1];
-      } else {
-        this.x = transform.px.v;
-        this.y = transform.py.v;
-      }
-      this.pivot.x = transform.a.v[0];
-      this.pivot.y = transform.a.v[1];
-      this.scale.x = transform.s.v[0];
-      this.scale.y = transform.s.v[1];
-      if (transform.r) {
-        this.rotation = transform.r.v + transform.orientation;
-      } else if (transform.rz) {
-        this.rotation = transform.rz.v + transform.or.v[2];
-      }
-      this.alpha = transform.o.v;
+      updateTransformByHierarchy(this, transform, this.hierarchy);
     }
     updateLottieMasks(masks) {
       this.mask.updateMasks(masks);
@@ -7060,23 +7063,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this.hierarchy = parent;
     }
     updateLottieTransform(transform) {
-      if (transform.p) {
-        this.x = transform.p.v[0];
-        this.y = transform.p.v[1];
-      } else {
-        this.x = transform.px.v;
-        this.y = transform.py.v;
-      }
-      this.pivot.x = transform.a.v[0];
-      this.pivot.y = transform.a.v[1];
-      this.scale.x = transform.s.v[0];
-      this.scale.y = transform.s.v[1];
-      if (transform.r) {
-        this.rotation = transform.r.v + transform.orientation;
-      } else if (transform.rz) {
-        this.rotation = transform.rz.v + transform.or.v[2];
-      }
-      this.alpha = transform.o.v;
+      updateTransformByHierarchy(this, transform, this.hierarchy);
     }
     updateLottieMasks(masks) {
       this.mask.updateMasks(masks);
@@ -7092,6 +7079,116 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       length: len
     });
   }
+  class TextElement extends pixi_js.Text {
+    constructor(lottieLayer) {
+      super();
+      this.label = lottieLayer.fullname;
+      this.lottieLayer = lottieLayer;
+      this.lottieLayer.lettersChangedFlag = true;
+      if (this.lottieLayer.masks) {
+        this.mask = new LottieGraphicsMask(this.lottieLayer.session.local, this.lottieLayer);
+        this.addChild(this.mask);
+      }
+      this.init();
+      this.buildNewText();
+      this.updateLottie = this.updateLottie.bind(this);
+      this.updateLottie(this.lottieLayer, true);
+      this.lottieLayer.on('updatelayer', this.updateLottie);
+      this.onRender = () => {
+        this.updateLottie(this.lottieLayer, true);
+      };
+    }
+    init() {
+      this._textSpans = [];
+      this._yOffset = 0;
+      this._fillColorAnim = false;
+      this._strokeColorAnim = false;
+      this._strokeWidthAnim = false;
+      this._stroke = false;
+      this._fill = false;
+      this._justifyOffset = 0;
+      this._currentRender = null;
+      this._renderType = 'canvas';
+      this._fillStyle = {};
+      this._values = {
+        fill: '#000000',
+        stroke: '#000000',
+        sWidth: 0,
+        fValue: ''
+      };
+    }
+    buildNewText() {
+      const documentData = this.lottieLayer.textProperty.currentData;
+      this.renderedLetters = createSizedArray(documentData.l ? documentData.l.length : 0);
+      let hasFill = false;
+      if (documentData.fc) {
+        hasFill = true;
+        this._values.fill = Tools.rgb2hex(documentData.fc.map(item => {
+          return item > 1 ? item : item * 255;
+        }), documentData.fc);
+      } else {
+        this._values.fill = '#000000';
+      }
+      this._fill = hasFill;
+      let hasStroke = false;
+      if (documentData.sc) {
+        hasStroke = true;
+        this._values.stroke = this.buildColor(documentData.sc);
+        this._values.sWidth = documentData.sw;
+      }
+      const fontManager = this.lottieLayer.global.fontManager;
+      this._stroke = hasStroke;
+      this._values.fontSize = documentData.finalSize;
+      this._values.fontFamily = fontManager.getFontByName(documentData.f).fFamily;
+      this._values.fontWeight = documentData.fWeight;
+      this._values.fontStyle = documentData.fStyle;
+      this._values.lineHeight = documentData.finalLineHeight;
+      this._text = documentData.t;
+      this.renderText();
+    }
+    async renderText() {
+      this.text = this._text;
+      if (this.style.fontFamily) {
+        await pixi_js.Assets.get(this.style.fontFamily);
+      }
+      this.style.fontFamily = this._values.fontFamily;
+      this.style.fontSize = this._values.fontSize;
+      this.style.fill = this._values.fill;
+      this.style.fontWeight = this._values.fontWeight;
+      this.style.fontStyle = this._values.fontStyle;
+      this.style.lineHeight = this._values.lineHeight;
+      this.anchor.x = 0.5;
+      this.anchor.y = 0.8;
+    }
+    updateLottie(lottieLayer, _forceUpdate = false) {
+      let forceUpdate = true;
+      if (lottieLayer.transform && forceUpdate) {
+        this.updateLottieTransform(lottieLayer.transform);
+      }
+      if (lottieLayer.masks && forceUpdate) {
+        this.updateLottieMasks(lottieLayer.masks);
+      }
+      if (lottieLayer._mdf) {
+        this.renderText();
+      }
+      this.visible = lottieLayer.isInRange;
+      this._onUpdate();
+    }
+    setTransformHierarchy(parent) {
+      this.hierarchy = parent;
+    }
+    updateLottieTransform(transform) {
+      updateTransformByHierarchy(this, transform, this.hierarchy);
+    }
+    updateLottieMasks(masks) {
+      this.mask.updateMasks(masks);
+    }
+  }
+  function createSizedArray$1(len) {
+    return Array.apply(null, {
+      length: len
+    });
+  }
   class MatrixHelper extends pixi_js.Matrix {
     reset() {
       this.a = 1;
@@ -7118,7 +7215,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       return points.map(point => this.applyToY(point.x, point.y));
     }
   }
-  class TextElement extends pixi_js.Graphics {
+  class TextGlyphsElement extends pixi_js.Graphics {
     constructor(lottieLayer) {
       super();
       this.label = lottieLayer.fullname;
@@ -7158,11 +7255,13 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
     }
     buildNewText() {
       const documentData = this.lottieLayer.textProperty.currentData;
-      this.renderedLetters = createSizedArray(documentData.l ? documentData.l.length : 0);
+      this.renderedLetters = createSizedArray$1(documentData.l ? documentData.l.length : 0);
       let hasFill = false;
       if (documentData.fc) {
         hasFill = true;
-        this._values.fill = Tools.rgb2hex(documentData.fc);
+        this._values.fill = Tools.rgb2hex(documentData.fc.map(item => {
+          return item > 1 ? item : item * 255;
+        }), documentData.fc);
       } else {
         this._values.fill = '#000000';
       }
@@ -7211,8 +7310,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
         shapes = shapeData.shapes ? shapeData.shapes[0].it : [];
         jLen = shapes.length;
         matrixHelper.scale(documentData.finalSize / 100, documentData.finalSize / 100);
-        commands = createSizedArray(jLen - 1);
-        window.$commands.push(commands);
+        commands = createSizedArray$1(jLen - 1);
         let commandsCounter = 0;
         for (j = 0; j < jLen; j += 1) {
           if (shapes[j].ty === 'sh') {
@@ -7371,23 +7469,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this.hierarchy = parent;
     }
     updateLottieTransform(transform) {
-      if (transform.p) {
-        this.x = transform.p.v[0];
-        this.y = transform.p.v[1];
-      } else {
-        this.x = transform.px.v;
-        this.y = transform.py.v;
-      }
-      this.pivot.x = transform.a.v[0];
-      this.pivot.y = transform.a.v[1];
-      this.scale.x = transform.s.v[0];
-      this.scale.y = transform.s.v[1];
-      if (transform.r) {
-        this.rotation = transform.r.v + transform.orientation;
-      } else if (transform.rz) {
-        this.rotation = transform.rz.v + transform.or.v[2];
-      }
-      this.alpha = transform.o.v;
+      updateTransformByHierarchy(this, transform, this.hierarchy);
     }
     updateLottieMasks(masks) {
       this.mask.updateMasks(masks);
@@ -7419,23 +7501,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this.hierarchy = parent;
     }
     updateLottieTransform(transform) {
-      if (transform.p) {
-        this.x = transform.p.v[0];
-        this.y = transform.p.v[1];
-      } else {
-        this.x = transform.px.v;
-        this.y = transform.py.v;
-      }
-      this.pivot.x = transform.a.v[0];
-      this.pivot.y = transform.a.v[1];
-      this.scale.x = transform.s.v[0];
-      this.scale.y = transform.s.v[1];
-      if (transform.r) {
-        this.rotation = transform.r.v + transform.orientation;
-      } else if (transform.rz) {
-        this.rotation = transform.rz.v + transform.or.v[2];
-      }
-      this.alpha = transform.o.v;
+      updateTransformByHierarchy(this, transform, this.hierarchy);
     }
     updateLottieMasks(masks) {
       this.mask.updateMasks(masks);
@@ -7473,23 +7539,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this.hierarchy = parent;
     }
     updateLottieTransform(transform) {
-      if (transform.p) {
-        this.x = transform.p.v[0];
-        this.y = transform.p.v[1];
-      } else {
-        this.x = transform.px.v;
-        this.y = transform.py.v;
-      }
-      this.pivot.x = transform.a.v[0];
-      this.pivot.y = transform.a.v[1];
-      this.scale.x = transform.s.v[0];
-      this.scale.y = transform.s.v[1];
-      if (transform.r) {
-        this.rotation = transform.r.v + transform.orientation;
-      } else if (transform.rz) {
-        this.rotation = transform.rz.v + transform.or.v[2];
-      }
-      this.alpha = transform.o.v;
+      updateTransformByHierarchy(this, transform, this.hierarchy);
     }
     updateLottieMasks(masks) {
       this.mask.updateMasks(masks);
@@ -7623,6 +7673,30 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
   function loadJson(path) {
     return new LoadJson(path);
   }
+  const getLayerBySubstituteId = (lottieFile, substituteId) => {
+    const {
+      substituteIds
+    } = lottieFile || {};
+    if (!substituteIds || Object.keys(substituteIds).length === 0) return null;
+    let layer;
+    if (substituteId && substituteId.indexOf('_') === -1) {
+      const outerIndex = Number(substituteId);
+      if (!Number.isNaN(outerIndex)) {
+        var _lottieFile$layers;
+        layer = lottieFile === null || lottieFile === void 0 ? void 0 : (_lottieFile$layers = lottieFile.layers) === null || _lottieFile$layers === void 0 ? void 0 : _lottieFile$layers[outerIndex];
+      }
+    } else if (substituteId) {
+      const substituteIdArr = substituteId.split('_');
+      const outerIndex = Number(substituteIdArr[0]);
+      const innerIndex = Number(substituteIdArr[1]);
+      if (!Number.isNaN(outerIndex) && !Number.isNaN(innerIndex)) {
+        var _asset$layers;
+        const asset = lottieFile.assets[outerIndex];
+        layer = asset === null || asset === void 0 ? void 0 : (_asset$layers = asset.layers) === null || _asset$layers === void 0 ? void 0 : _asset$layers[innerIndex];
+      }
+    }
+    return layer;
+  };
   class AnimationGroup extends Eventer {
     constructor(options) {
       super();
@@ -7666,7 +7740,14 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       }
       if (options.keyframes) {
         if (!this._prefix && options.keyframes.prefix) this._prefix = options.keyframes.prefix;
-        this._setupDate(options.keyframes);
+        if (!options.replaceData) {
+          this._setupDate(options.keyframes);
+        } else {
+          this._response = options.keyframes;
+          if (this._replaceData) {
+            this._setupReplaceData();
+          }
+        }
       } else if (options.path) {
         let prefix = '';
         if (options.path.lastIndexOf('\\') !== -1) {
@@ -7677,14 +7758,57 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
         if (!this._prefix && prefix) this._prefix = prefix;
         this.jsonLoader = loadJson(options.path);
         this.jsonLoader.once('success', response => {
-          this._setupDate(response);
+          if (!options.replaceData) {
+            this._setupDate(response);
+          } else {
+            this._response = response;
+            if (this._replaceData) {
+              this._setupReplaceData();
+            }
+          }
         });
         this.jsonLoader.once('error', error => {
           this.emit('error', error);
         });
       }
     }
+    replaceData(data) {
+      this._replaceData = data;
+      this._setupReplaceData();
+    }
+    _setupReplaceData() {
+      if (this._response && this._replaceData) {
+        if (this._response.substituteIds) {
+          const revertSubstituteIds = {};
+          for (const key in this._response.substituteIds) {
+            const value = this._response.substituteIds[key];
+            revertSubstituteIds[value] = key;
+          }
+          for (const name in this._replaceData) {
+            const data = this._replaceData[name];
+            const layer = getLayerBySubstituteId(this._response, revertSubstituteIds[name]);
+            if (!layer) continue;
+            const {
+              ty
+            } = layer;
+            if (ty === 2) {
+              const asset = lottieFile.assets.find(item => item.id === layer.refId);
+              if (asset) {
+                asset.p = data;
+              }
+            } else if (ty === 5) {
+              var _layer$t, _layer$t$d, _layer$t$d$k, _layer$t$d$k$, _layer$t$d$k$$s;
+              if (layer !== null && layer !== void 0 && (_layer$t = layer.t) !== null && _layer$t !== void 0 && (_layer$t$d = _layer$t.d) !== null && _layer$t$d !== void 0 && (_layer$t$d$k = _layer$t$d.k) !== null && _layer$t$d$k !== void 0 && (_layer$t$d$k$ = _layer$t$d$k[0]) !== null && _layer$t$d$k$ !== void 0 && (_layer$t$d$k$$s = _layer$t$d$k$.s) !== null && _layer$t$d$k$$s !== void 0 && _layer$t$d$k$$s.t) {
+                layer.t.d.k[0].s.t = data;
+              }
+            }
+          }
+        }
+        this._setupDate(this._response);
+      }
+    }
     _setupDate(data) {
+      var _data$fonts, _data$fonts$list;
       this._sourceData = data;
       if (this._copyJSON) data = Tools.copyJSON(data);
       DataManager.completeData(data);
@@ -7756,8 +7880,20 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
           st
         }
       };
-      session.fontManager.addChars(data.chars);
+      session.fontManager.addChars(data.chars || []);
       session.fontManager.addFonts(data.fonts, document.body);
+      if ((_data$fonts = data.fonts) !== null && _data$fonts !== void 0 && (_data$fonts$list = _data$fonts.list) !== null && _data$fonts$list !== void 0 && _data$fonts$list.length) {
+        const fonts = data.fonts.list.map(item => ({
+          alias: item.fFamily,
+          src: item.fPath,
+          data: {
+            family: item.fFamily
+          }
+        })).filter(item => item.src);
+        pixi_js.Assets.load(fonts).catch(e => {
+          console.error(e);
+        });
+      }
       this._buildElements(session);
       if (this.textureLoader !== null && this._justDisplayOnImagesLoaded && !this.textureLoader.loaded && this._justDisplayNeedSet !== null) {
         this.group.visible = false;
@@ -7939,9 +8075,15 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       return lottieLayer;
     }
     _extraText(layer, session) {
+      var _session$fontManager$;
       layer.global = session;
       const lottieLayer = new TextLottieLayer(layer, session);
-      lottieLayer.display = new TextElement(lottieLayer);
+      const usesGlyphs = !!((_session$fontManager$ = session.fontManager.chars) !== null && _session$fontManager$ !== void 0 && _session$fontManager$.length);
+      if (usesGlyphs) {
+        lottieLayer.display = new TextGlyphsElement(lottieLayer);
+      } else {
+        lottieLayer.display = new TextElement(lottieLayer);
+      }
       return lottieLayer;
     }
     _extraCamera(layer, session) {
@@ -8062,8 +8204,11 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
     }
     update(snippetCache, firstFrame = false) {
       if (!this.living || !this.isDisplayLoaded || this.isPaused && !firstFrame) return;
-      const isEnd = this._updateTime(snippetCache);
-      const correctedFrameNum = this.beginFrame + this.frameNum;
+      let isEnd = this._updateTime(snippetCache);
+      const correctedFrameNum = this.direction === 1 ? this.beginFrame + this.frameNum : this.frameNum;
+      if (this.direction === -1 && correctedFrameNum <= this.beginFrame) {
+        isEnd = true;
+      }
       this.root.updateFrame(correctedFrameNum);
       const np = correctedFrameNum >> 0;
       if (this._lastFrame !== np) {
@@ -8141,6 +8286,11 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       if (Tools.isBoolean(options.alternate)) this.alternate = options.alternate;
       if (Tools.isNumber(options.wait)) this.wait = options.wait;
       if (Tools.isNumber(options.delay)) this.delay = options.delay;
+      if (Tools.isNumber(options.direction)) {
+        this.direction = options.direction;
+      } else {
+        this.direction = 1;
+      }
       this.replay();
       return this;
     }
@@ -8195,9 +8345,12 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       this._repeatsCut = this.repeats;
       this._delayCut = this.delay;
       this.living = true;
-      this.frameNum = 0;
+      if (this.direction === -1) {
+        this.frameNum = this.duration;
+      } else {
+        this.frameNum = 0;
+      }
       this.duration = Math.floor(this.endFrame - this.beginFrame);
-      this.direction = 1;
       return this;
     }
     show() {
@@ -8421,19 +8574,20 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       });
     }
     add(changed) {
+      var _a, _b;
       return __awaiter(this, void 0, void 0, function* () {
         this.manager = new AnimationManager(this.app);
         const component = changed.component;
         const container = this.renderSystem.containerManager.getContainer(changed.gameObject.id);
         if (!container) return;
-        const _a = component.options,
+        const _c = component.options,
           {
             resource: rn
-          } = _a,
-          otherOpts = __rest(_a, ["resource"]);
+          } = _c,
+          otherOpts = __rest(_c, ["resource"]);
         const res = yield eva_js.resource.getResource(rn);
         const data = res.data;
-        const url = res.src.json.url;
+        const url = ((_b = (_a = res.src) === null || _a === void 0 ? void 0 : _a.json) === null || _b === void 0 ? void 0 : _b.url) || '';
         const json = _extends({}, data.json || {});
         const assets = json.assets || [];
         assets.forEach(item => {
@@ -8444,6 +8598,9 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
           prefix: this.getDir(url)
         }, otherOpts));
         component.anim = anim;
+        if (component._replaceData) {
+          anim.replaceData(component._replaceData);
+        }
         container.addChildAt(anim.group, 0);
         this.managerLife.forEach(eventName => {
           anim.on(eventName, e => component.emit(eventName, e));
@@ -8452,6 +8609,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       });
     }
     getDir(url) {
+      if (!url) return url;
       return new URL('./', url).href;
     }
     remove(changed) {
@@ -8472,6 +8630,7 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
   class Lottie extends eva_js.Component {
     constructor(options) {
       super();
+      this._replaceData = null;
       this.loadStatus = false;
       this.firstPlay = null;
       this.prevSlot = {};
@@ -8544,6 +8703,11 @@ var _EVA_IIFE_lottie = function (exports, eva_js, pluginRenderer, pixi_js) {
       });
       this.anim.playSegment(this.playParamsHandle(params), expandOpts);
     }
+    replaceData(data) {
+      if (data) {
+        if (this.anim) this.anim.replaceData(data);else this._replaceData = data;
+      }
+    }
     playParamsHandle(params) {
       let p = [].concat(params);
       const {