@leafer-in/motion-path 1.0.7 → 1.0.8

package/dist/motion-path.cjs

@@ -235,28 +235,30 @@ draw.Transition.register('motion', function (from, to, t, target) {
         to = draw.UnitConvert.number(to, target.getMotionTotal());
     return draw.Transition.number(from, to, t);
 });
+draw.Transition.register('motionRotation', function (from, to, t) {
+    return draw.Transition.number(from, to, t);
+});
 const ui = draw.UI.prototype;
+const { updateMatrix, updateAllMatrix } = draw.LeafHelper;
+const { updateBounds } = draw.BranchHelper;
 motionPathType()(ui, 'motionPath');
 motionPathType()(ui, 'motion');
 motionPathType(true)(ui, 'motionRotation');
 ui.getMotionPathData = function () {
-    const { parent } = this;
-    if (!this.motionPath && parent) {
-        const { children } = parent;
-        for (let i = 0; i < children.length; i++) {
-            if (children[i].motionPath)
-                return children[i].getMotionPathData();
-        }
-    }
-    const data = this.__;
-    if (data.__pathForMotion)
-        return data.__pathForMotion;
-    return data.__pathForMotion = HighCurveHelper.getMotionPathData(this.getPath(true, true));
+    return getMotionPathData(getMotionPath(this));
 };
 ui.getMotionPoint = function (motionDistance) {
-    const data = this.getMotionPathData();
+    const path = getMotionPath(this);
+    const data = getMotionPathData(path);
+    if (!data.total)
+        return {};
     const point = HighCurveHelper.getDistancePoint(data, motionDistance);
-    draw.MatrixHelper.toOuterPoint(this.localTransform, point);
+    draw.MatrixHelper.toOuterPoint(path.localTransform, point);
+    const { motionRotation } = this;
+    if (motionRotation === false)
+        delete point.rotation;
+    else if (typeof motionRotation === 'number')
+        point.rotation += motionRotation;
     return point;
 };
 ui.getMotionTotal = function () {
@@ -268,48 +270,58 @@ ui.__updateMotionPath = function () {
         data.__pathForMotion = undefined;
     if (this.motionPath) {
         let child;
-        const { children } = this.parent;
+        const { children } = this.parent, { leaferIsReady } = this;
         for (let i = 0; i < children.length; i++) {
             child = children[i];
-            if (!draw.isNull(child.motion))
+            if (!draw.isNull(child.motion) && !child.__layout.matrixChanged) {
+                if (leaferIsReady && child !== this)
+                    this.leafer.layouter.addExtra(child);
                 updateMotion(child);
+            }
         }
     }
-    else {
+    else
         updateMotion(this);
-    }
 };
 function updateMotion(leaf) {
-    const { motion, motionRotation } = leaf;
+    const { motion, leaferIsCreated } = leaf;
     if (draw.isNull(motion))
         return;
+    if (leaferIsCreated)
+        leaf.leafer.created = false;
     if (leaf.motionPath) {
-        const data = leaf.getMotionPathData();
+        const data = getMotionPathData(leaf);
         if (data.total)
             leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion);
     }
     else {
-        let child;
-        const { children } = leaf.parent;
+        leaf.set(leaf.getMotionPoint(motion));
+        if (!leaf.__hasAutoLayout) {
+            if (leaf.isBranch)
+                updateAllMatrix(leaf), updateBounds(leaf, leaf);
+            else
+                updateMatrix(leaf);
+        }
+    }
+    if (leaferIsCreated)
+        leaf.leafer.created = true;
+}
+function getMotionPath(leaf) {
+    const { parent } = leaf;
+    if (!leaf.motionPath && parent) {
+        const { children } = parent;
         for (let i = 0; i < children.length; i++) {
-            child = children[i];
-            if (child.motionPath) {
-                const data = child.getMotionPathData();
-                if (!data.total)
-                    return;
-                const point = child.getMotionPoint(motion);
-                if (motionRotation === false)
-                    delete point.rotation;
-                else {
-                    point.rotation += child.rotation;
-                    if (typeof motionRotation === 'number')
-                        point.rotation += motionRotation;
-                }
-                leaf.set(point);
-                break;
-            }
+            if (children[i].motionPath)
+                return children[i];
         }
     }
+    return leaf;
+}
+function getMotionPathData(leaf) {
+    const data = leaf.__;
+    if (data.__pathForMotion)
+        return data.__pathForMotion;
+    return data.__pathForMotion = HighCurveHelper.getMotionPathData(leaf.getPath(true, true));
 }
 
 exports.HighBezierHelper = HighBezierHelper;

package/dist/motion-path.esm.js

@@ -1,4 +1,4 @@
-import { PathCommandMap, MatrixHelper, PointHelper, UnitConvert, BezierHelper, decorateLeafAttr, attr, isNull, Transition, UI } from '@leafer-ui/draw';
+import { PathCommandMap, MatrixHelper, PointHelper, UnitConvert, BezierHelper, decorateLeafAttr, attr, isNull, Transition, UI, LeafHelper, BranchHelper } from '@leafer-ui/draw';
 
 const gaussNodes = [0.1488743389, 0.4333953941, 0.6794095682, 0.8650633666, 0.9739065285];
 const gaussWeights = [0.2955242247, 0.2692667193, 0.2190863625, 0.1494513491, 0.0666713443];
@@ -233,28 +233,30 @@ Transition.register('motion', function (from, to, t, target) {
         to = UnitConvert.number(to, target.getMotionTotal());
     return Transition.number(from, to, t);
 });
+Transition.register('motionRotation', function (from, to, t) {
+    return Transition.number(from, to, t);
+});
 const ui = UI.prototype;
+const { updateMatrix, updateAllMatrix } = LeafHelper;
+const { updateBounds } = BranchHelper;
 motionPathType()(ui, 'motionPath');
 motionPathType()(ui, 'motion');
 motionPathType(true)(ui, 'motionRotation');
 ui.getMotionPathData = function () {
-    const { parent } = this;
-    if (!this.motionPath && parent) {
-        const { children } = parent;
-        for (let i = 0; i < children.length; i++) {
-            if (children[i].motionPath)
-                return children[i].getMotionPathData();
-        }
-    }
-    const data = this.__;
-    if (data.__pathForMotion)
-        return data.__pathForMotion;
-    return data.__pathForMotion = HighCurveHelper.getMotionPathData(this.getPath(true, true));
+    return getMotionPathData(getMotionPath(this));
 };
 ui.getMotionPoint = function (motionDistance) {
-    const data = this.getMotionPathData();
+    const path = getMotionPath(this);
+    const data = getMotionPathData(path);
+    if (!data.total)
+        return {};
     const point = HighCurveHelper.getDistancePoint(data, motionDistance);
-    MatrixHelper.toOuterPoint(this.localTransform, point);
+    MatrixHelper.toOuterPoint(path.localTransform, point);
+    const { motionRotation } = this;
+    if (motionRotation === false)
+        delete point.rotation;
+    else if (typeof motionRotation === 'number')
+        point.rotation += motionRotation;
     return point;
 };
 ui.getMotionTotal = function () {
@@ -266,48 +268,58 @@ ui.__updateMotionPath = function () {
         data.__pathForMotion = undefined;
     if (this.motionPath) {
         let child;
-        const { children } = this.parent;
+        const { children } = this.parent, { leaferIsReady } = this;
         for (let i = 0; i < children.length; i++) {
             child = children[i];
-            if (!isNull(child.motion))
+            if (!isNull(child.motion) && !child.__layout.matrixChanged) {
+                if (leaferIsReady && child !== this)
+                    this.leafer.layouter.addExtra(child);
                 updateMotion(child);
+            }
         }
     }
-    else {
+    else
         updateMotion(this);
-    }
 };
 function updateMotion(leaf) {
-    const { motion, motionRotation } = leaf;
+    const { motion, leaferIsCreated } = leaf;
     if (isNull(motion))
         return;
+    if (leaferIsCreated)
+        leaf.leafer.created = false;
     if (leaf.motionPath) {
-        const data = leaf.getMotionPathData();
+        const data = getMotionPathData(leaf);
         if (data.total)
             leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion);
     }
     else {
-        let child;
-        const { children } = leaf.parent;
+        leaf.set(leaf.getMotionPoint(motion));
+        if (!leaf.__hasAutoLayout) {
+            if (leaf.isBranch)
+                updateAllMatrix(leaf), updateBounds(leaf, leaf);
+            else
+                updateMatrix(leaf);
+        }
+    }
+    if (leaferIsCreated)
+        leaf.leafer.created = true;
+}
+function getMotionPath(leaf) {
+    const { parent } = leaf;
+    if (!leaf.motionPath && parent) {
+        const { children } = parent;
         for (let i = 0; i < children.length; i++) {
-            child = children[i];
-            if (child.motionPath) {
-                const data = child.getMotionPathData();
-                if (!data.total)
-                    return;
-                const point = child.getMotionPoint(motion);
-                if (motionRotation === false)
-                    delete point.rotation;
-                else {
-                    point.rotation += child.rotation;
-                    if (typeof motionRotation === 'number')
-                        point.rotation += motionRotation;
-                }
-                leaf.set(point);
-                break;
-            }
+            if (children[i].motionPath)
+                return children[i];
         }
     }
+    return leaf;
+}
+function getMotionPathData(leaf) {
+    const data = leaf.__;
+    if (data.__pathForMotion)
+        return data.__pathForMotion;
+    return data.__pathForMotion = HighCurveHelper.getMotionPathData(leaf.getPath(true, true));
 }
 
 export { HighBezierHelper, HighCurveHelper, motionPathType };

package/dist/motion-path.esm.min.js

@@ -1 +1 @@
-import{PathCommandMap as t,MatrixHelper as o,PointHelper as e,UnitConvert as n,BezierHelper as a,decorateLeafAttr as i,attr as r,isNull as s,Transition as h,UI as c}from"@leafer-ui/draw";const l=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],u=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:g}=Math,f={getDistance(t,o,e,n,a,i,r,s){let h,c,f,P,_,p,M=0;for(let D=0;D<l.length;D++)h=.5*(1+l[D]),c=.5*(1-l[D]),f=m(h,t,e,a,r),P=m(h,o,n,i,s),_=m(c,t,e,a,r),p=m(c,o,n,i,s),M+=u[D]*(g(f*f+P*P)+g(_*_+p*p));return.5*M},getDerivative(t,o,e,n,a){const i=1-t;return 3*i*i*(e-o)+6*i*t*(n-e)+3*t*t*(a-n)},cut(o,e,n,a,i,r,s,h,c,l){const u=1-e,g=u*n+e*i,f=u*a+e*r,m=u*i+e*s,P=u*r+e*h,_=u*g+e*m,p=u*f+e*P,M=u*_+e*(u*m+e*(u*s+e*c)),D=u*p+e*(u*P+e*(u*h+e*l));o.push(t.C,g,f,_,p,M,D)}},{getDerivative:m}=f,{M:P,L:_,C:p,Z:M}=t,D={},d={},b={transform(t,o){let e,n=0;const a=t.length;for(;n<a;)switch(e=t[n],e){case P:case _:b.transformPoints(t,o,n,1),n+=3;break;case p:b.transformPoints(t,o,n,3),n+=7;break;case M:n+=1}},transformPoints(t,e,n,a){for(let i=n+1,r=i+2*a;i<r;i+=2)D.x=t[i],D.y=t[i+1],o.toOuterPoint(e,D),t[i]=D.x,t[i+1]=D.y},getMotionPathData(t){let o,n,a,i,r=0,s=[],h=0,c=0,l=0;const u=t.length;for(;h<u;){switch(i=t[h],i){case P:case _:n=t[h+1],a=t[h+2],o=i===_&&h>0?e.getDistanceFrom(c,l,n,a):0,c=n,l=a,h+=3;break;case p:n=t[h+5],a=t[h+6],o=f.getDistance(c,l,t[h+1],t[h+2],t[h+3],t[h+4],n,a),c=n,l=a,h+=7;break;case M:h+=1;default:o=0}s.push(o),r+=o}return{total:r,segments:s,data:t}},getDistancePoint(t,o){const{segments:i,data:r}=t;o=n.number(o,t.total);let s,h,c,l,u=0,g={},f=0,m=0,D=0,b=0;const y=r.length;for(;f<y;){switch(l=r[f],l){case P:case _:if(h=r[f+1],c=r[f+2],s=i[m],u+s>o||!t.total)return f||(D=h,b=c),d.x=D,d.y=b,g.x=h,g.y=c,e.getDistancePoint(d,g,o-u,!0),g.rotation=e.getAngle(d,g),g;D=h,b=c,f+=3;break;case p:if(h=r[f+5],c=r[f+6],s=i[m],u+s>o){const t=r[f+1],n=r[f+2],i=r[f+3],l=r[f+4];return o-=u,a.getPointAndSet(o/s,D,b,t,n,i,l,h,c,g),a.getPointAndSet(Math.max(0,o-.1)/s,D,b,t,n,i,l,h,c,d),g.rotation=e.getAngle(d,g),g}D=h,b=c,f+=7;break;case M:f+=1;default:s=0}m++,u+=s}return g},getDistancePath(t,o){const{segments:a,data:i}=t,r=[];o=n.number(o,t.total);let s,h,c,l,u=0,g={},m=0,D=0,b=0,y=0;const x=i.length;for(;m<x;){switch(l=i[m],l){case P:case _:if(h=i[m+1],c=i[m+2],s=a[D],u+s>o||!t.total)return m||(b=h,y=c),d.x=b,d.y=y,g.x=h,g.y=c,e.getDistancePoint(d,g,o-u,!0),r.push(l,g.x,g.y),r;b=h,y=c,m+=3,r.push(l,b,y);break;case p:const n=i[m+1],x=i[m+2],k=i[m+3],F=i[m+4];if(h=i[m+5],c=i[m+6],s=a[D],u+s>o)return f.cut(r,(o-u)/s,b,y,n,x,k,F,h,c),r;b=h,y=c,m+=7,r.push(l,n,x,k,F,h,c);break;case M:m+=1,r.push(l);default:s=0}D++,u+=s}return r}};function y(t){return i(t,(t=>r({set(o){this.__setAttr(t,o),this.__hasMotionPath=this.motionPath||!s(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}h.register("motion",(function(t,o,e,a){return t?"object"==typeof t&&(t=n.number(t,a.getMotionTotal())):t=0,o?"object"==typeof o&&(o=n.number(o,a.getMotionTotal())):o=0,h.number(t,o,e)}));const x=c.prototype;function k(t){const{motion:o,motionRotation:e}=t;if(!s(o))if(t.motionPath){const e=t.getMotionPathData();e.total&&(t.__.__pathForRender=b.getDistancePath(e,o))}else{let n;const{children:a}=t.parent;for(let i=0;i<a.length;i++)if(n=a[i],n.motionPath){if(!n.getMotionPathData().total)return;const a=n.getMotionPoint(o);!1===e?delete a.rotation:(a.rotation+=n.rotation,"number"==typeof e&&(a.rotation+=e)),t.set(a);break}}}y()(x,"motionPath"),y()(x,"motion"),y(!0)(x,"motionRotation"),x.getMotionPathData=function(){const{parent:t}=this;if(!this.motionPath&&t){const{children:o}=t;for(let t=0;t<o.length;t++)if(o[t].motionPath)return o[t].getMotionPathData()}const o=this.__;return o.__pathForMotion?o.__pathForMotion:o.__pathForMotion=b.getMotionPathData(this.getPath(!0,!0))},x.getMotionPoint=function(t){const e=this.getMotionPathData(),n=b.getDistancePoint(e,t);return o.toOuterPoint(this.localTransform,n),n},x.getMotionTotal=function(){return this.getMotionPathData().total},x.__updateMotionPath=function(){const t=this.__;if(this.__layout.resized&&t.__pathForMotion&&(t.__pathForMotion=void 0),this.motionPath){let t;const{children:o}=this.parent;for(let e=0;e<o.length;e++)t=o[e],s(t.motion)||k(t)}else k(this)};export{f as HighBezierHelper,b as HighCurveHelper,y as motionPathType};
+import{PathCommandMap as t,MatrixHelper as e,PointHelper as o,UnitConvert as n,BezierHelper as a,decorateLeafAttr as r,attr as i,isNull as s,Transition as c,UI as h,LeafHelper as u,BranchHelper as l}from"@leafer-ui/draw";const f=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],g=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:m}=Math,_={getDistance(t,e,o,n,a,r,i,s){let c,h,u,l,_,P,p=0;for(let M=0;M<f.length;M++)c=.5*(1+f[M]),h=.5*(1-f[M]),u=d(c,t,o,a,i),l=d(c,e,n,r,s),_=d(h,t,o,a,i),P=d(h,e,n,r,s),p+=g[M]*(m(u*u+l*l)+m(_*_+P*P));return.5*p},getDerivative(t,e,o,n,a){const r=1-t;return 3*r*r*(o-e)+6*r*t*(n-o)+3*t*t*(a-n)},cut(e,o,n,a,r,i,s,c,h,u){const l=1-o,f=l*n+o*r,g=l*a+o*i,m=l*r+o*s,_=l*i+o*c,d=l*f+o*m,P=l*g+o*_,p=l*d+o*(l*m+o*(l*s+o*h)),M=l*P+o*(l*_+o*(l*c+o*u));e.push(t.C,f,g,d,P,p,M)}},{getDerivative:d}=_,{M:P,L:p,C:M,Z:y}=t,b={},x={},D={transform(t,e){let o,n=0;const a=t.length;for(;n<a;)switch(o=t[n],o){case P:case p:D.transformPoints(t,e,n,1),n+=3;break;case M:D.transformPoints(t,e,n,3),n+=7;break;case y:n+=1}},transformPoints(t,o,n,a){for(let r=n+1,i=r+2*a;r<i;r+=2)b.x=t[r],b.y=t[r+1],e.toOuterPoint(o,b),t[r]=b.x,t[r+1]=b.y},getMotionPathData(t){let e,n,a,r,i=0,s=[],c=0,h=0,u=0;const l=t.length;for(;c<l;){switch(r=t[c],r){case P:case p:n=t[c+1],a=t[c+2],e=r===p&&c>0?o.getDistanceFrom(h,u,n,a):0,h=n,u=a,c+=3;break;case M:n=t[c+5],a=t[c+6],e=_.getDistance(h,u,t[c+1],t[c+2],t[c+3],t[c+4],n,a),h=n,u=a,c+=7;break;case y:c+=1;default:e=0}s.push(e),i+=e}return{total:i,segments:s,data:t}},getDistancePoint(t,e){const{segments:r,data:i}=t;e=n.number(e,t.total);let s,c,h,u,l=0,f={},g=0,m=0,_=0,d=0;const b=i.length;for(;g<b;){switch(u=i[g],u){case P:case p:if(c=i[g+1],h=i[g+2],s=r[m],l+s>e||!t.total)return g||(_=c,d=h),x.x=_,x.y=d,f.x=c,f.y=h,o.getDistancePoint(x,f,e-l,!0),f.rotation=o.getAngle(x,f),f;_=c,d=h,g+=3;break;case M:if(c=i[g+5],h=i[g+6],s=r[m],l+s>e){const t=i[g+1],n=i[g+2],r=i[g+3],u=i[g+4];return e-=l,a.getPointAndSet(e/s,_,d,t,n,r,u,c,h,f),a.getPointAndSet(Math.max(0,e-.1)/s,_,d,t,n,r,u,c,h,x),f.rotation=o.getAngle(x,f),f}_=c,d=h,g+=7;break;case y:g+=1;default:s=0}m++,l+=s}return f},getDistancePath(t,e){const{segments:a,data:r}=t,i=[];e=n.number(e,t.total);let s,c,h,u,l=0,f={},g=0,m=0,d=0,b=0;const D=r.length;for(;g<D;){switch(u=r[g],u){case P:case p:if(c=r[g+1],h=r[g+2],s=a[m],l+s>e||!t.total)return g||(d=c,b=h),x.x=d,x.y=b,f.x=c,f.y=h,o.getDistancePoint(x,f,e-l,!0),i.push(u,f.x,f.y),i;d=c,b=h,g+=3,i.push(u,d,b);break;case M:const n=r[g+1],D=r[g+2],k=r[g+3],A=r[g+4];if(c=r[g+5],h=r[g+6],s=a[m],l+s>e)return _.cut(i,(e-l)/s,d,b,n,D,k,A,c,h),i;d=c,b=h,g+=7,i.push(u,n,D,k,A,c,h);break;case y:g+=1,i.push(u);default:s=0}m++,l+=s}return i}};function k(t){return r(t,(t=>i({set(e){this.__setAttr(t,e),this.__hasMotionPath=this.motionPath||!s(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}c.register("motion",(function(t,e,o,a){return t?"object"==typeof t&&(t=n.number(t,a.getMotionTotal())):t=0,e?"object"==typeof e&&(e=n.number(e,a.getMotionTotal())):e=0,c.number(t,e,o)})),c.register("motionRotation",(function(t,e,o){return c.number(t,e,o)}));const A=h.prototype,{updateMatrix:F,updateAllMatrix:C}=u,{updateBounds:v}=l;function w(t){const{motion:e,leaferIsCreated:o}=t;if(!s(e)){if(o&&(t.leafer.created=!1),t.motionPath){const o=T(t);o.total&&(t.__.__pathForRender=D.getDistancePath(o,e))}else t.set(t.getMotionPoint(e)),t.__hasAutoLayout||(t.isBranch?(C(t),v(t,t)):F(t));o&&(t.leafer.created=!0)}}function R(t){const{parent:e}=t;if(!t.motionPath&&e){const{children:t}=e;for(let e=0;e<t.length;e++)if(t[e].motionPath)return t[e]}return t}function T(t){const e=t.__;return e.__pathForMotion?e.__pathForMotion:e.__pathForMotion=D.getMotionPathData(t.getPath(!0,!0))}k()(A,"motionPath"),k()(A,"motion"),k(!0)(A,"motionRotation"),A.getMotionPathData=function(){return T(R(this))},A.getMotionPoint=function(t){const o=R(this),n=T(o);if(!n.total)return{};const a=D.getDistancePoint(n,t);e.toOuterPoint(o.localTransform,a);const{motionRotation:r}=this;return!1===r?delete a.rotation:"number"==typeof r&&(a.rotation+=r),a},A.getMotionTotal=function(){return this.getMotionPathData().total},A.__updateMotionPath=function(){const t=this.__;if(this.__layout.resized&&t.__pathForMotion&&(t.__pathForMotion=void 0),this.motionPath){let t;const{children:e}=this.parent,{leaferIsReady:o}=this;for(let n=0;n<e.length;n++)t=e[n],s(t.motion)||t.__layout.matrixChanged||(o&&t!==this&&this.leafer.layouter.addExtra(t),w(t))}else w(this)};export{_ as HighBezierHelper,D as HighCurveHelper,k as motionPathType};

package/dist/motion-path.js

@@ -235,28 +235,30 @@ this.LeaferIN.motionPath = (function (exports, draw) {
             to = draw.UnitConvert.number(to, target.getMotionTotal());
         return draw.Transition.number(from, to, t);
     });
+    draw.Transition.register('motionRotation', function (from, to, t) {
+        return draw.Transition.number(from, to, t);
+    });
     const ui = draw.UI.prototype;
+    const { updateMatrix, updateAllMatrix } = draw.LeafHelper;
+    const { updateBounds } = draw.BranchHelper;
     motionPathType()(ui, 'motionPath');
     motionPathType()(ui, 'motion');
     motionPathType(true)(ui, 'motionRotation');
     ui.getMotionPathData = function () {
-        const { parent } = this;
-        if (!this.motionPath && parent) {
-            const { children } = parent;
-            for (let i = 0; i < children.length; i++) {
-                if (children[i].motionPath)
-                    return children[i].getMotionPathData();
-            }
-        }
-        const data = this.__;
-        if (data.__pathForMotion)
-            return data.__pathForMotion;
-        return data.__pathForMotion = HighCurveHelper.getMotionPathData(this.getPath(true, true));
+        return getMotionPathData(getMotionPath(this));
     };
     ui.getMotionPoint = function (motionDistance) {
-        const data = this.getMotionPathData();
+        const path = getMotionPath(this);
+        const data = getMotionPathData(path);
+        if (!data.total)
+            return {};
         const point = HighCurveHelper.getDistancePoint(data, motionDistance);
-        draw.MatrixHelper.toOuterPoint(this.localTransform, point);
+        draw.MatrixHelper.toOuterPoint(path.localTransform, point);
+        const { motionRotation } = this;
+        if (motionRotation === false)
+            delete point.rotation;
+        else if (typeof motionRotation === 'number')
+            point.rotation += motionRotation;
         return point;
     };
     ui.getMotionTotal = function () {
@@ -268,48 +270,58 @@ this.LeaferIN.motionPath = (function (exports, draw) {
             data.__pathForMotion = undefined;
         if (this.motionPath) {
             let child;
-            const { children } = this.parent;
+            const { children } = this.parent, { leaferIsReady } = this;
             for (let i = 0; i < children.length; i++) {
                 child = children[i];
-                if (!draw.isNull(child.motion))
+                if (!draw.isNull(child.motion) && !child.__layout.matrixChanged) {
+                    if (leaferIsReady && child !== this)
+                        this.leafer.layouter.addExtra(child);
                     updateMotion(child);
+                }
             }
         }
-        else {
+        else
             updateMotion(this);
-        }
     };
     function updateMotion(leaf) {
-        const { motion, motionRotation } = leaf;
+        const { motion, leaferIsCreated } = leaf;
         if (draw.isNull(motion))
             return;
+        if (leaferIsCreated)
+            leaf.leafer.created = false;
         if (leaf.motionPath) {
-            const data = leaf.getMotionPathData();
+            const data = getMotionPathData(leaf);
             if (data.total)
                 leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion);
         }
         else {
-            let child;
-            const { children } = leaf.parent;
+            leaf.set(leaf.getMotionPoint(motion));
+            if (!leaf.__hasAutoLayout) {
+                if (leaf.isBranch)
+                    updateAllMatrix(leaf), updateBounds(leaf, leaf);
+                else
+                    updateMatrix(leaf);
+            }
+        }
+        if (leaferIsCreated)
+            leaf.leafer.created = true;
+    }
+    function getMotionPath(leaf) {
+        const { parent } = leaf;
+        if (!leaf.motionPath && parent) {
+            const { children } = parent;
             for (let i = 0; i < children.length; i++) {
-                child = children[i];
-                if (child.motionPath) {
-                    const data = child.getMotionPathData();
-                    if (!data.total)
-                        return;
-                    const point = child.getMotionPoint(motion);
-                    if (motionRotation === false)
-                        delete point.rotation;
-                    else {
-                        point.rotation += child.rotation;
-                        if (typeof motionRotation === 'number')
-                            point.rotation += motionRotation;
-                    }
-                    leaf.set(point);
-                    break;
-                }
+                if (children[i].motionPath)
+                    return children[i];
             }
         }
+        return leaf;
+    }
+    function getMotionPathData(leaf) {
+        const data = leaf.__;
+        if (data.__pathForMotion)
+            return data.__pathForMotion;
+        return data.__pathForMotion = HighCurveHelper.getMotionPathData(leaf.getPath(true, true));
     }
 
     exports.HighBezierHelper = HighBezierHelper;

package/dist/motion-path.min.cjs

@@ -1 +1 @@
-"use strict";var t=require("@leafer-ui/draw");const e=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],o=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:n}=Math,a={getDistance(t,a,r,s,h,c,l,u){let g,P,f,p,m,_,M=0;for(let d=0;d<e.length;d++)g=.5*(1+e[d]),P=.5*(1-e[d]),f=i(g,t,r,h,l),p=i(g,a,s,c,u),m=i(P,t,r,h,l),_=i(P,a,s,c,u),M+=o[d]*(n(f*f+p*p)+n(m*m+_*_));return.5*M},getDerivative(t,e,o,n,a){const i=1-t;return 3*i*i*(o-e)+6*i*t*(n-o)+3*t*t*(a-n)},cut(e,o,n,a,i,r,s,h,c,l){const u=1-o,g=u*n+o*i,P=u*a+o*r,f=u*i+o*s,p=u*r+o*h,m=u*g+o*f,_=u*P+o*p,M=u*m+o*(u*f+o*(u*s+o*c)),d=u*_+o*(u*p+o*(u*h+o*l));e.push(t.PathCommandMap.C,g,P,m,_,M,d)}},{getDerivative:i}=a,{M:r,L:s,C:h,Z:c}=t.PathCommandMap,l={},u={},g={transform(t,e){let o,n=0;const a=t.length;for(;n<a;)switch(o=t[n],o){case r:case s:g.transformPoints(t,e,n,1),n+=3;break;case h:g.transformPoints(t,e,n,3),n+=7;break;case c:n+=1}},transformPoints(e,o,n,a){for(let i=n+1,r=i+2*a;i<r;i+=2)l.x=e[i],l.y=e[i+1],t.MatrixHelper.toOuterPoint(o,l),e[i]=l.x,e[i+1]=l.y},getMotionPathData(e){let o,n,i,l,u=0,g=[],P=0,f=0,p=0;const m=e.length;for(;P<m;){switch(l=e[P],l){case r:case s:n=e[P+1],i=e[P+2],o=l===s&&P>0?t.PointHelper.getDistanceFrom(f,p,n,i):0,f=n,p=i,P+=3;break;case h:n=e[P+5],i=e[P+6],o=a.getDistance(f,p,e[P+1],e[P+2],e[P+3],e[P+4],n,i),f=n,p=i,P+=7;break;case c:P+=1;default:o=0}g.push(o),u+=o}return{total:u,segments:g,data:e}},getDistancePoint(e,o){const{segments:n,data:a}=e;o=t.UnitConvert.number(o,e.total);let i,l,g,P,f=0,p={},m=0,_=0,M=0,d=0;const D=a.length;for(;m<D;){switch(P=a[m],P){case r:case s:if(l=a[m+1],g=a[m+2],i=n[_],f+i>o||!e.total)return m||(M=l,d=g),u.x=M,u.y=d,p.x=l,p.y=g,t.PointHelper.getDistancePoint(u,p,o-f,!0),p.rotation=t.PointHelper.getAngle(u,p),p;M=l,d=g,m+=3;break;case h:if(l=a[m+5],g=a[m+6],i=n[_],f+i>o){const e=a[m+1],n=a[m+2],r=a[m+3],s=a[m+4];return o-=f,t.BezierHelper.getPointAndSet(o/i,M,d,e,n,r,s,l,g,p),t.BezierHelper.getPointAndSet(Math.max(0,o-.1)/i,M,d,e,n,r,s,l,g,u),p.rotation=t.PointHelper.getAngle(u,p),p}M=l,d=g,m+=7;break;case c:m+=1;default:i=0}_++,f+=i}return p},getDistancePath(e,o){const{segments:n,data:i}=e,l=[];o=t.UnitConvert.number(o,e.total);let g,P,f,p,m=0,_={},M=0,d=0,D=0,b=0;const x=i.length;for(;M<x;){switch(p=i[M],p){case r:case s:if(P=i[M+1],f=i[M+2],g=n[d],m+g>o||!e.total)return M||(D=P,b=f),u.x=D,u.y=b,_.x=P,_.y=f,t.PointHelper.getDistancePoint(u,_,o-m,!0),l.push(p,_.x,_.y),l;D=P,b=f,M+=3,l.push(p,D,b);break;case h:const x=i[M+1],y=i[M+2],H=i[M+3],v=i[M+4];if(P=i[M+5],f=i[M+6],g=n[d],m+g>o)return a.cut(l,(o-m)/g,D,b,x,y,H,v,P,f),l;D=P,b=f,M+=7,l.push(p,x,y,H,v,P,f);break;case c:M+=1,l.push(p);default:g=0}d++,m+=g}return l}};function P(e){return t.decorateLeafAttr(e,(e=>t.attr({set(o){this.__setAttr(e,o),this.__hasMotionPath=this.motionPath||!t.isNull(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}t.Transition.register("motion",(function(e,o,n,a){return e?"object"==typeof e&&(e=t.UnitConvert.number(e,a.getMotionTotal())):e=0,o?"object"==typeof o&&(o=t.UnitConvert.number(o,a.getMotionTotal())):o=0,t.Transition.number(e,o,n)}));const f=t.UI.prototype;function p(e){const{motion:o,motionRotation:n}=e;if(!t.isNull(o))if(e.motionPath){const t=e.getMotionPathData();t.total&&(e.__.__pathForRender=g.getDistancePath(t,o))}else{let t;const{children:a}=e.parent;for(let i=0;i<a.length;i++)if(t=a[i],t.motionPath){if(!t.getMotionPathData().total)return;const a=t.getMotionPoint(o);!1===n?delete a.rotation:(a.rotation+=t.rotation,"number"==typeof n&&(a.rotation+=n)),e.set(a);break}}}P()(f,"motionPath"),P()(f,"motion"),P(!0)(f,"motionRotation"),f.getMotionPathData=function(){const{parent:t}=this;if(!this.motionPath&&t){const{children:e}=t;for(let t=0;t<e.length;t++)if(e[t].motionPath)return e[t].getMotionPathData()}const e=this.__;return e.__pathForMotion?e.__pathForMotion:e.__pathForMotion=g.getMotionPathData(this.getPath(!0,!0))},f.getMotionPoint=function(e){const o=this.getMotionPathData(),n=g.getDistancePoint(o,e);return t.MatrixHelper.toOuterPoint(this.localTransform,n),n},f.getMotionTotal=function(){return this.getMotionPathData().total},f.__updateMotionPath=function(){const e=this.__;if(this.__layout.resized&&e.__pathForMotion&&(e.__pathForMotion=void 0),this.motionPath){let e;const{children:o}=this.parent;for(let n=0;n<o.length;n++)e=o[n],t.isNull(e.motion)||p(e)}else p(this)},exports.HighBezierHelper=a,exports.HighCurveHelper=g,exports.motionPathType=P;
+"use strict";var t=require("@leafer-ui/draw");const e=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],o=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:n}=Math,a={getDistance(t,a,i,s,c,h,l,u){let f,g,p,m,P,_,d=0;for(let M=0;M<e.length;M++)f=.5*(1+e[M]),g=.5*(1-e[M]),p=r(f,t,i,c,l),m=r(f,a,s,h,u),P=r(g,t,i,c,l),_=r(g,a,s,h,u),d+=o[M]*(n(p*p+m*m)+n(P*P+_*_));return.5*d},getDerivative(t,e,o,n,a){const r=1-t;return 3*r*r*(o-e)+6*r*t*(n-o)+3*t*t*(a-n)},cut(e,o,n,a,r,i,s,c,h,l){const u=1-o,f=u*n+o*r,g=u*a+o*i,p=u*r+o*s,m=u*i+o*c,P=u*f+o*p,_=u*g+o*m,d=u*P+o*(u*p+o*(u*s+o*h)),M=u*_+o*(u*m+o*(u*c+o*l));e.push(t.PathCommandMap.C,f,g,P,_,d,M)}},{getDerivative:r}=a,{M:i,L:s,C:c,Z:h}=t.PathCommandMap,l={},u={},f={transform(t,e){let o,n=0;const a=t.length;for(;n<a;)switch(o=t[n],o){case i:case s:f.transformPoints(t,e,n,1),n+=3;break;case c:f.transformPoints(t,e,n,3),n+=7;break;case h:n+=1}},transformPoints(e,o,n,a){for(let r=n+1,i=r+2*a;r<i;r+=2)l.x=e[r],l.y=e[r+1],t.MatrixHelper.toOuterPoint(o,l),e[r]=l.x,e[r+1]=l.y},getMotionPathData(e){let o,n,r,l,u=0,f=[],g=0,p=0,m=0;const P=e.length;for(;g<P;){switch(l=e[g],l){case i:case s:n=e[g+1],r=e[g+2],o=l===s&&g>0?t.PointHelper.getDistanceFrom(p,m,n,r):0,p=n,m=r,g+=3;break;case c:n=e[g+5],r=e[g+6],o=a.getDistance(p,m,e[g+1],e[g+2],e[g+3],e[g+4],n,r),p=n,m=r,g+=7;break;case h:g+=1;default:o=0}f.push(o),u+=o}return{total:u,segments:f,data:e}},getDistancePoint(e,o){const{segments:n,data:a}=e;o=t.UnitConvert.number(o,e.total);let r,l,f,g,p=0,m={},P=0,_=0,d=0,M=0;const x=a.length;for(;P<x;){switch(g=a[P],g){case i:case s:if(l=a[P+1],f=a[P+2],r=n[_],p+r>o||!e.total)return P||(d=l,M=f),u.x=d,u.y=M,m.x=l,m.y=f,t.PointHelper.getDistancePoint(u,m,o-p,!0),m.rotation=t.PointHelper.getAngle(u,m),m;d=l,M=f,P+=3;break;case c:if(l=a[P+5],f=a[P+6],r=n[_],p+r>o){const e=a[P+1],n=a[P+2],i=a[P+3],s=a[P+4];return o-=p,t.BezierHelper.getPointAndSet(o/r,d,M,e,n,i,s,l,f,m),t.BezierHelper.getPointAndSet(Math.max(0,o-.1)/r,d,M,e,n,i,s,l,f,u),m.rotation=t.PointHelper.getAngle(u,m),m}d=l,M=f,P+=7;break;case h:P+=1;default:r=0}_++,p+=r}return m},getDistancePath(e,o){const{segments:n,data:r}=e,l=[];o=t.UnitConvert.number(o,e.total);let f,g,p,m,P=0,_={},d=0,M=0,x=0,y=0;const b=r.length;for(;d<b;){switch(m=r[d],m){case i:case s:if(g=r[d+1],p=r[d+2],f=n[M],P+f>o||!e.total)return d||(x=g,y=p),u.x=x,u.y=y,_.x=g,_.y=p,t.PointHelper.getDistancePoint(u,_,o-P,!0),l.push(m,_.x,_.y),l;x=g,y=p,d+=3,l.push(m,x,y);break;case c:const b=r[d+1],D=r[d+2],H=r[d+3],C=r[d+4];if(g=r[d+5],p=r[d+6],f=n[M],P+f>o)return a.cut(l,(o-P)/f,x,y,b,D,H,C,g,p),l;x=g,y=p,d+=7,l.push(m,b,D,H,C,g,p);break;case h:d+=1,l.push(m);default:f=0}M++,P+=f}return l}};function g(e){return t.decorateLeafAttr(e,(e=>t.attr({set(o){this.__setAttr(e,o),this.__hasMotionPath=this.motionPath||!t.isNull(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}t.Transition.register("motion",(function(e,o,n,a){return e?"object"==typeof e&&(e=t.UnitConvert.number(e,a.getMotionTotal())):e=0,o?"object"==typeof o&&(o=t.UnitConvert.number(o,a.getMotionTotal())):o=0,t.Transition.number(e,o,n)})),t.Transition.register("motionRotation",(function(e,o,n){return t.Transition.number(e,o,n)}));const p=t.UI.prototype,{updateMatrix:m,updateAllMatrix:P}=t.LeafHelper,{updateBounds:_}=t.BranchHelper;function d(e){const{motion:o,leaferIsCreated:n}=e;if(!t.isNull(o)){if(n&&(e.leafer.created=!1),e.motionPath){const t=x(e);t.total&&(e.__.__pathForRender=f.getDistancePath(t,o))}else e.set(e.getMotionPoint(o)),e.__hasAutoLayout||(e.isBranch?(P(e),_(e,e)):m(e));n&&(e.leafer.created=!0)}}function M(t){const{parent:e}=t;if(!t.motionPath&&e){const{children:t}=e;for(let e=0;e<t.length;e++)if(t[e].motionPath)return t[e]}return t}function x(t){const e=t.__;return e.__pathForMotion?e.__pathForMotion:e.__pathForMotion=f.getMotionPathData(t.getPath(!0,!0))}g()(p,"motionPath"),g()(p,"motion"),g(!0)(p,"motionRotation"),p.getMotionPathData=function(){return x(M(this))},p.getMotionPoint=function(e){const o=M(this),n=x(o);if(!n.total)return{};const a=f.getDistancePoint(n,e);t.MatrixHelper.toOuterPoint(o.localTransform,a);const{motionRotation:r}=this;return!1===r?delete a.rotation:"number"==typeof r&&(a.rotation+=r),a},p.getMotionTotal=function(){return this.getMotionPathData().total},p.__updateMotionPath=function(){const e=this.__;if(this.__layout.resized&&e.__pathForMotion&&(e.__pathForMotion=void 0),this.motionPath){let e;const{children:o}=this.parent,{leaferIsReady:n}=this;for(let a=0;a<o.length;a++)e=o[a],t.isNull(e.motion)||e.__layout.matrixChanged||(n&&e!==this&&this.leafer.layouter.addExtra(e),d(e))}else d(this)},exports.HighBezierHelper=a,exports.HighCurveHelper=f,exports.motionPathType=g;

package/dist/motion-path.min.js

@@ -1 +1 @@
-this.LeaferIN=this.LeaferIN||{},this.LeaferIN.motionPath=function(t,e){"use strict";const o=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],n=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:a}=Math,i={getDistance(t,e,i,s,h,c,l,u){let g,f,P,m,p,_,M=0;for(let d=0;d<o.length;d++)g=.5*(1+o[d]),f=.5*(1-o[d]),P=r(g,t,i,h,l),m=r(g,e,s,c,u),p=r(f,t,i,h,l),_=r(f,e,s,c,u),M+=n[d]*(a(P*P+m*m)+a(p*p+_*_));return.5*M},getDerivative(t,e,o,n,a){const i=1-t;return 3*i*i*(o-e)+6*i*t*(n-o)+3*t*t*(a-n)},cut(t,o,n,a,i,r,s,h,c,l){const u=1-o,g=u*n+o*i,f=u*a+o*r,P=u*i+o*s,m=u*r+o*h,p=u*g+o*P,_=u*f+o*m,M=u*p+o*(u*P+o*(u*s+o*c)),d=u*_+o*(u*m+o*(u*h+o*l));t.push(e.PathCommandMap.C,g,f,p,_,M,d)}},{getDerivative:r}=i,{M:s,L:h,C:c,Z:l}=e.PathCommandMap,u={},g={},f={transform(t,e){let o,n=0;const a=t.length;for(;n<a;)switch(o=t[n],o){case s:case h:f.transformPoints(t,e,n,1),n+=3;break;case c:f.transformPoints(t,e,n,3),n+=7;break;case l:n+=1}},transformPoints(t,o,n,a){for(let i=n+1,r=i+2*a;i<r;i+=2)u.x=t[i],u.y=t[i+1],e.MatrixHelper.toOuterPoint(o,u),t[i]=u.x,t[i+1]=u.y},getMotionPathData(t){let o,n,a,r,u=0,g=[],f=0,P=0,m=0;const p=t.length;for(;f<p;){switch(r=t[f],r){case s:case h:n=t[f+1],a=t[f+2],o=r===h&&f>0?e.PointHelper.getDistanceFrom(P,m,n,a):0,P=n,m=a,f+=3;break;case c:n=t[f+5],a=t[f+6],o=i.getDistance(P,m,t[f+1],t[f+2],t[f+3],t[f+4],n,a),P=n,m=a,f+=7;break;case l:f+=1;default:o=0}g.push(o),u+=o}return{total:u,segments:g,data:t}},getDistancePoint(t,o){const{segments:n,data:a}=t;o=e.UnitConvert.number(o,t.total);let i,r,u,f,P=0,m={},p=0,_=0,M=0,d=0;const D=a.length;for(;p<D;){switch(f=a[p],f){case s:case h:if(r=a[p+1],u=a[p+2],i=n[_],P+i>o||!t.total)return p||(M=r,d=u),g.x=M,g.y=d,m.x=r,m.y=u,e.PointHelper.getDistancePoint(g,m,o-P,!0),m.rotation=e.PointHelper.getAngle(g,m),m;M=r,d=u,p+=3;break;case c:if(r=a[p+5],u=a[p+6],i=n[_],P+i>o){const t=a[p+1],n=a[p+2],s=a[p+3],h=a[p+4];return o-=P,e.BezierHelper.getPointAndSet(o/i,M,d,t,n,s,h,r,u,m),e.BezierHelper.getPointAndSet(Math.max(0,o-.1)/i,M,d,t,n,s,h,r,u,g),m.rotation=e.PointHelper.getAngle(g,m),m}M=r,d=u,p+=7;break;case l:p+=1;default:i=0}_++,P+=i}return m},getDistancePath(t,o){const{segments:n,data:a}=t,r=[];o=e.UnitConvert.number(o,t.total);let u,f,P,m,p=0,_={},M=0,d=0,D=0,b=0;const y=a.length;for(;M<y;){switch(m=a[M],m){case s:case h:if(f=a[M+1],P=a[M+2],u=n[d],p+u>o||!t.total)return M||(D=f,b=P),g.x=D,g.y=b,_.x=f,_.y=P,e.PointHelper.getDistancePoint(g,_,o-p,!0),r.push(m,_.x,_.y),r;D=f,b=P,M+=3,r.push(m,D,b);break;case c:const y=a[M+1],H=a[M+2],x=a[M+3],C=a[M+4];if(f=a[M+5],P=a[M+6],u=n[d],p+u>o)return i.cut(r,(o-p)/u,D,b,y,H,x,C,f,P),r;D=f,b=P,M+=7,r.push(m,y,H,x,C,f,P);break;case l:M+=1,r.push(m);default:u=0}d++,p+=u}return r}};function P(t){return e.decorateLeafAttr(t,(t=>e.attr({set(o){this.__setAttr(t,o),this.__hasMotionPath=this.motionPath||!e.isNull(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}e.Transition.register("motion",(function(t,o,n,a){return t?"object"==typeof t&&(t=e.UnitConvert.number(t,a.getMotionTotal())):t=0,o?"object"==typeof o&&(o=e.UnitConvert.number(o,a.getMotionTotal())):o=0,e.Transition.number(t,o,n)}));const m=e.UI.prototype;function p(t){const{motion:o,motionRotation:n}=t;if(!e.isNull(o))if(t.motionPath){const e=t.getMotionPathData();e.total&&(t.__.__pathForRender=f.getDistancePath(e,o))}else{let e;const{children:a}=t.parent;for(let i=0;i<a.length;i++)if(e=a[i],e.motionPath){if(!e.getMotionPathData().total)return;const a=e.getMotionPoint(o);!1===n?delete a.rotation:(a.rotation+=e.rotation,"number"==typeof n&&(a.rotation+=n)),t.set(a);break}}}return P()(m,"motionPath"),P()(m,"motion"),P(!0)(m,"motionRotation"),m.getMotionPathData=function(){const{parent:t}=this;if(!this.motionPath&&t){const{children:e}=t;for(let t=0;t<e.length;t++)if(e[t].motionPath)return e[t].getMotionPathData()}const e=this.__;return e.__pathForMotion?e.__pathForMotion:e.__pathForMotion=f.getMotionPathData(this.getPath(!0,!0))},m.getMotionPoint=function(t){const o=this.getMotionPathData(),n=f.getDistancePoint(o,t);return e.MatrixHelper.toOuterPoint(this.localTransform,n),n},m.getMotionTotal=function(){return this.getMotionPathData().total},m.__updateMotionPath=function(){const t=this.__;if(this.__layout.resized&&t.__pathForMotion&&(t.__pathForMotion=void 0),this.motionPath){let t;const{children:o}=this.parent;for(let n=0;n<o.length;n++)t=o[n],e.isNull(t.motion)||p(t)}else p(this)},t.HighBezierHelper=i,t.HighCurveHelper=f,t.motionPathType=P,t}({},LeaferUI);
+this.LeaferIN=this.LeaferIN||{},this.LeaferIN.motionPath=function(t,e){"use strict";const o=[.1488743389,.4333953941,.6794095682,.8650633666,.9739065285],n=[.2955242247,.2692667193,.2190863625,.1494513491,.0666713443],{sqrt:a}=Math,r={getDistance(t,e,r,s,h,c,l,u){let f,g,m,p,P,_,d=0;for(let M=0;M<o.length;M++)f=.5*(1+o[M]),g=.5*(1-o[M]),m=i(f,t,r,h,l),p=i(f,e,s,c,u),P=i(g,t,r,h,l),_=i(g,e,s,c,u),d+=n[M]*(a(m*m+p*p)+a(P*P+_*_));return.5*d},getDerivative(t,e,o,n,a){const r=1-t;return 3*r*r*(o-e)+6*r*t*(n-o)+3*t*t*(a-n)},cut(t,o,n,a,r,i,s,h,c,l){const u=1-o,f=u*n+o*r,g=u*a+o*i,m=u*r+o*s,p=u*i+o*h,P=u*f+o*m,_=u*g+o*p,d=u*P+o*(u*m+o*(u*s+o*c)),M=u*_+o*(u*p+o*(u*h+o*l));t.push(e.PathCommandMap.C,f,g,P,_,d,M)}},{getDerivative:i}=r,{M:s,L:h,C:c,Z:l}=e.PathCommandMap,u={},f={},g={transform(t,e){let o,n=0;const a=t.length;for(;n<a;)switch(o=t[n],o){case s:case h:g.transformPoints(t,e,n,1),n+=3;break;case c:g.transformPoints(t,e,n,3),n+=7;break;case l:n+=1}},transformPoints(t,o,n,a){for(let r=n+1,i=r+2*a;r<i;r+=2)u.x=t[r],u.y=t[r+1],e.MatrixHelper.toOuterPoint(o,u),t[r]=u.x,t[r+1]=u.y},getMotionPathData(t){let o,n,a,i,u=0,f=[],g=0,m=0,p=0;const P=t.length;for(;g<P;){switch(i=t[g],i){case s:case h:n=t[g+1],a=t[g+2],o=i===h&&g>0?e.PointHelper.getDistanceFrom(m,p,n,a):0,m=n,p=a,g+=3;break;case c:n=t[g+5],a=t[g+6],o=r.getDistance(m,p,t[g+1],t[g+2],t[g+3],t[g+4],n,a),m=n,p=a,g+=7;break;case l:g+=1;default:o=0}f.push(o),u+=o}return{total:u,segments:f,data:t}},getDistancePoint(t,o){const{segments:n,data:a}=t;o=e.UnitConvert.number(o,t.total);let r,i,u,g,m=0,p={},P=0,_=0,d=0,M=0;const y=a.length;for(;P<y;){switch(g=a[P],g){case s:case h:if(i=a[P+1],u=a[P+2],r=n[_],m+r>o||!t.total)return P||(d=i,M=u),f.x=d,f.y=M,p.x=i,p.y=u,e.PointHelper.getDistancePoint(f,p,o-m,!0),p.rotation=e.PointHelper.getAngle(f,p),p;d=i,M=u,P+=3;break;case c:if(i=a[P+5],u=a[P+6],r=n[_],m+r>o){const t=a[P+1],n=a[P+2],s=a[P+3],h=a[P+4];return o-=m,e.BezierHelper.getPointAndSet(o/r,d,M,t,n,s,h,i,u,p),e.BezierHelper.getPointAndSet(Math.max(0,o-.1)/r,d,M,t,n,s,h,i,u,f),p.rotation=e.PointHelper.getAngle(f,p),p}d=i,M=u,P+=7;break;case l:P+=1;default:r=0}_++,m+=r}return p},getDistancePath(t,o){const{segments:n,data:a}=t,i=[];o=e.UnitConvert.number(o,t.total);let u,g,m,p,P=0,_={},d=0,M=0,y=0,b=0;const x=a.length;for(;d<x;){switch(p=a[d],p){case s:case h:if(g=a[d+1],m=a[d+2],u=n[M],P+u>o||!t.total)return d||(y=g,b=m),f.x=y,f.y=b,_.x=g,_.y=m,e.PointHelper.getDistancePoint(f,_,o-P,!0),i.push(p,_.x,_.y),i;y=g,b=m,d+=3,i.push(p,y,b);break;case c:const x=a[d+1],D=a[d+2],H=a[d+3],C=a[d+4];if(g=a[d+5],m=a[d+6],u=n[M],P+u>o)return r.cut(i,(o-P)/u,y,b,x,D,H,C,g,m),i;y=g,b=m,d+=7,i.push(p,x,D,H,C,g,m);break;case l:d+=1,i.push(p);default:u=0}M++,P+=u}return i}};function m(t){return e.decorateLeafAttr(t,(t=>e.attr({set(o){this.__setAttr(t,o),this.__hasMotionPath=this.motionPath||!e.isNull(this.motion),this.__layout.matrixChanged||this.__layout.matrixChange()}})))}e.Transition.register("motion",(function(t,o,n,a){return t?"object"==typeof t&&(t=e.UnitConvert.number(t,a.getMotionTotal())):t=0,o?"object"==typeof o&&(o=e.UnitConvert.number(o,a.getMotionTotal())):o=0,e.Transition.number(t,o,n)})),e.Transition.register("motionRotation",(function(t,o,n){return e.Transition.number(t,o,n)}));const p=e.UI.prototype,{updateMatrix:P,updateAllMatrix:_}=e.LeafHelper,{updateBounds:d}=e.BranchHelper;function M(t){const{motion:o,leaferIsCreated:n}=t;if(!e.isNull(o)){if(n&&(t.leafer.created=!1),t.motionPath){const e=b(t);e.total&&(t.__.__pathForRender=g.getDistancePath(e,o))}else t.set(t.getMotionPoint(o)),t.__hasAutoLayout||(t.isBranch?(_(t),d(t,t)):P(t));n&&(t.leafer.created=!0)}}function y(t){const{parent:e}=t;if(!t.motionPath&&e){const{children:t}=e;for(let e=0;e<t.length;e++)if(t[e].motionPath)return t[e]}return t}function b(t){const e=t.__;return e.__pathForMotion?e.__pathForMotion:e.__pathForMotion=g.getMotionPathData(t.getPath(!0,!0))}return m()(p,"motionPath"),m()(p,"motion"),m(!0)(p,"motionRotation"),p.getMotionPathData=function(){return b(y(this))},p.getMotionPoint=function(t){const o=y(this),n=b(o);if(!n.total)return{};const a=g.getDistancePoint(n,t);e.MatrixHelper.toOuterPoint(o.localTransform,a);const{motionRotation:r}=this;return!1===r?delete a.rotation:"number"==typeof r&&(a.rotation+=r),a},p.getMotionTotal=function(){return this.getMotionPathData().total},p.__updateMotionPath=function(){const t=this.__;if(this.__layout.resized&&t.__pathForMotion&&(t.__pathForMotion=void 0),this.motionPath){let t;const{children:o}=this.parent,{leaferIsReady:n}=this;for(let a=0;a<o.length;a++)t=o[a],e.isNull(t.motion)||t.__layout.matrixChanged||(n&&t!==this&&this.leafer.layouter.addExtra(t),M(t))}else M(this)},t.HighBezierHelper=r,t.HighCurveHelper=g,t.motionPathType=m,t}({},LeaferUI);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer-in/motion-path",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "@leafer-in/motion-path",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -14,7 +14,11 @@
   "types": "types/index.d.ts",
   "unpkg": "dist/motion-path.js",
   "jsdelivr": "dist/motion-path.js",
-  "files": ["src","types","dist"],
+  "files": [
+    "src",
+    "types",
+    "dist"
+  ],
   "repository": {
     "type": "git",
     "url": "https://github.com/leaferjs/leafer-in.git"
@@ -30,8 +34,8 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer-ui/draw": "^1.0.7",
-    "@leafer-ui/interface": "^1.0.7",
-    "@leafer-in/interface": "^1.0.7"
+    "@leafer-ui/draw": "^1.0.8",
+    "@leafer-ui/interface": "^1.0.8",
+    "@leafer-in/interface": "^1.0.8"
   }
 }

package/src/index.ts

@@ -3,7 +3,7 @@ export { HighBezierHelper } from './HighBezierHelper'
 export { motionPathType } from './decorator'
 
 import { IMotionPathData, IUI, IUnitData, IRotationPointData } from '@leafer-ui/interface'
-import { isNull, MatrixHelper, Transition, UI, UnitConvert } from '@leafer-ui/draw'
+import { isNull, MatrixHelper, LeafHelper, BranchHelper, Transition, UI, UnitConvert } from '@leafer-ui/draw'
 
 import { HighCurveHelper } from './HighCurveHelper'
 import { motionPathType } from './decorator'
@@ -17,8 +17,14 @@ Transition.register('motion', function (from: any, to: any, t: number, target: I
     return Transition.number(from, to, t)
 })
 
+Transition.register('motionRotation', function (from: any, to: any, t: number): number {
+    return Transition.number(from, to, t)
+})
+
 
 const ui = UI.prototype
+const { updateMatrix, updateAllMatrix } = LeafHelper
+const { updateBounds } = BranchHelper
 
 
 // addAttr
@@ -28,24 +34,20 @@ motionPathType(true)(ui, 'motionRotation')
 
 
 ui.getMotionPathData = function (): IMotionPathData {
-    const { parent } = this
-
-    if (!this.motionPath && parent) {
-        const { children } = parent
-        for (let i = 0; i < children.length; i++) {
-            if (children[i].motionPath) return children[i].getMotionPathData()
-        }
-    }
-
-    const data = this.__
-    if (data.__pathForMotion) return data.__pathForMotion
-    return data.__pathForMotion = HighCurveHelper.getMotionPathData(this.getPath(true, true))
+    return getMotionPathData(getMotionPath(this))
 }
 
 ui.getMotionPoint = function (motionDistance: number | IUnitData): IRotationPointData {
-    const data = this.getMotionPathData()
+    const path = getMotionPath(this)
+    const data = getMotionPathData(path)
+    if (!data.total) return {} as IRotationPointData
+
     const point = HighCurveHelper.getDistancePoint(data, motionDistance)
-    MatrixHelper.toOuterPoint(this.localTransform, point)
+    MatrixHelper.toOuterPoint(path.localTransform, point)
+
+    const { motionRotation } = this
+    if (motionRotation === false) delete point.rotation
+    else if (typeof motionRotation === 'number') point.rotation += motionRotation
     return point
 }
 
@@ -59,45 +61,56 @@ ui.__updateMotionPath = function (): void {
 
     if (this.motionPath) {
         let child: IUI
-        const { children } = this.parent
+        const { children } = this.parent, { leaferIsReady } = this
         for (let i = 0; i < children.length; i++) {
             child = children[i]
-            if (!isNull(child.motion)) updateMotion(child)
+            if (!isNull(child.motion) && !child.__layout.matrixChanged) {
+                if (leaferIsReady && child !== this) this.leafer.layouter.addExtra(child) // add part 
+                updateMotion(child)
+            }
         }
-    } else {
-        updateMotion(this)
-    }
+    } else updateMotion(this)
 }
 
+
 function updateMotion(leaf: IUI): void {
-    const { motion, motionRotation } = leaf
+    const { motion, leaferIsCreated } = leaf
     if (isNull(motion)) return
 
+    if (leaferIsCreated) leaf.leafer.created = false // 拦截布局更新通知，进行手动更新布局
+
     if (leaf.motionPath) {
 
-        const data = leaf.getMotionPathData()
+        const data = getMotionPathData(leaf)
         if (data.total) leaf.__.__pathForRender = HighCurveHelper.getDistancePath(data, motion) // 生长路径
 
     } else {
 
-        let child: IUI
-        const { children } = leaf.parent
-        for (let i = 0; i < children.length; i++) {
-            child = children[i]
-            if (child.motionPath) {
-                const data = child.getMotionPathData()
-                if (!data.total) return
-                const point = child.getMotionPoint(motion)
-                if (motionRotation === false) delete point.rotation
-                else {
-                    point.rotation += child.rotation
-                    if (typeof motionRotation === 'number') point.rotation += motionRotation
-                }
-
-                leaf.set(point) // 动画路径
-                break
-            }
+        leaf.set(leaf.getMotionPoint(motion)) // 动画路径
+
+        if (!leaf.__hasAutoLayout) { // 手动更新布局
+            if (leaf.isBranch) updateAllMatrix(leaf), updateBounds(leaf, leaf)
+            else updateMatrix(leaf)
         }
 
     }
+
+    if (leaferIsCreated) leaf.leafer.created = true
+}
+
+function getMotionPath(leaf: IUI): IUI {
+    const { parent } = leaf
+    if (!leaf.motionPath && parent) {
+        const { children } = parent
+        for (let i = 0; i < children.length; i++) {
+            if (children[i].motionPath) return children[i]
+        }
+    }
+    return leaf
+}
+
+function getMotionPathData(leaf: IUI): IMotionPathData {
+    const data = leaf.__
+    if (data.__pathForMotion) return data.__pathForMotion
+    return data.__pathForMotion = HighCurveHelper.getMotionPathData(leaf.getPath(true, true))
 }