@litecanvas/utils 0.17.1 → 0.18.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/actor.js +0 -3
- package/dist/actor.min.js +1 -1
- package/dist/all.js +43 -13
- package/dist/all.min.js +2 -2
- package/dist/tween.js +43 -15
- package/dist/tween.min.js +1 -1
- package/package.json +1 -1
- package/src/tween/README.md +43 -1
- package/src/tween/index.js +57 -10
package/dist/actor.js
CHANGED
package/dist/actor.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(()=>{var p=Object.defineProperty;var u=(o,t)=>{for(var e in t)p(o,e,{get:t[e],enumerable:!0})};globalThis.utils=globalThis.utils||{};globalThis.utils.global=()=>{for(let o in globalThis.utils)o!=="global"&&(globalThis[o]=globalThis.utils[o])};var l={};u(l,{ANCHOR_BOT_LEFT:()=>x,ANCHOR_BOT_RIGHT:()=>g,ANCHOR_CENTER:()=>
|
|
1
|
+
(()=>{var p=Object.defineProperty;var u=(o,t)=>{for(var e in t)p(o,e,{get:t[e],enumerable:!0})};globalThis.utils=globalThis.utils||{};globalThis.utils.global=()=>{for(let o in globalThis.utils)o!=="global"&&(globalThis[o]=globalThis.utils[o])};var l={};u(l,{ANCHOR_BOT_LEFT:()=>x,ANCHOR_BOT_RIGHT:()=>g,ANCHOR_CENTER:()=>d,ANCHOR_TOP_LEFT:()=>f,ANCHOR_TOP_RIGHT:()=>y,Actor:()=>c});var T=2*Math.PI,n=class{x;y;constructor(t=0,e=t){this.x=t,this.y=e}toString(){return`Vector (${this.x}, ${this.y})`}},h=o=>o instanceof n,r=(o=0,t=o)=>(h(o)&&(t=o.y,o=o.x),new n(o,t));var d=r(.5,.5),f=r(0,0),y=r(1,0),x=r(0,1),g=r(1,1),c=class{sprite;pos;_o;_s;flipX=!1;flipY=!1;angle=0;opacity=1;hidden=!1;constructor(t,e,s=f){this.sprite=t,this.pos=e||r(0),this._o=r(s),this._s=r(1,1)}set x(t){this.pos.x=t}get x(){return this.pos.x}set y(t){this.pos.y=t}get y(){return this.pos.y}set anchor(t){this._o.x=t.x,this._o.y=t.y}get anchor(){return this._o}get width(){return this.sprite.width*this._s.x}get height(){return this.sprite.height*this._s.y}get scale(){return this._s}scaleTo(t,e=t){this._s.x=t,this._s.y=e}scaleBy(t,e=t){this._s.x*=t,this._s.y*=e}getBounds(t=!0){let e=this.sprite.width*(t?this._s.x:1),s=this.sprite.height*(t?this._s.y:1),i=this.pos.x-e*this.anchor.x,a=this.pos.y-s*this.anchor.y;return[i,a,e,s]}draw(t=globalThis,e=!0){this.hidden||this.opacity<=0||(e&&t.push(),this.transform(t),this.drawImage(t),e&&t.pop())}transform(t){t.translate(this.pos.x,this.pos.y),t.rotate(this.angle),t.scale((this.flipX?-1:1)*this._s.x,(this.flipY?-1:1)*this._s.y)}drawImage(t,e=!0){let s=this.anchor,i=-this.sprite.width*(this.flipX?1-s.x:s.x),a=-this.sprite.height*(this.flipY?1-s.y:s.y);e&&t.alpha(this.opacity),t.image(i,a,this.sprite)}};globalThis.utils=Object.assign(globalThis.utils||{},l);})();
|
package/dist/all.js
CHANGED
|
@@ -723,9 +723,6 @@
|
|
|
723
723
|
var DOWN = /* @__PURE__ */ vec(0, 1);
|
|
724
724
|
var LEFT = /* @__PURE__ */ vec(-1, 0);
|
|
725
725
|
|
|
726
|
-
// node_modules/litecanvas/src/zzfx.js
|
|
727
|
-
globalThis.zzfxV = 1;
|
|
728
|
-
|
|
729
726
|
// src/actor/index.js
|
|
730
727
|
var ANCHOR_CENTER = /* @__PURE__ */ vec(0.5, 0.5);
|
|
731
728
|
var ANCHOR_TOP_LEFT = /* @__PURE__ */ vec(0, 0);
|
|
@@ -971,24 +968,30 @@
|
|
|
971
968
|
_o;
|
|
972
969
|
/** @type {string} */
|
|
973
970
|
_p;
|
|
974
|
-
/** @type {number} */
|
|
971
|
+
/** @type {number|number} */
|
|
975
972
|
_x;
|
|
976
973
|
/** @type {number} */
|
|
977
974
|
_d;
|
|
978
975
|
/** @type {(x: number) => number} */
|
|
979
976
|
_e;
|
|
977
|
+
/** @type {boolean} */
|
|
978
|
+
_rel;
|
|
980
979
|
/** @type {Function[]} */
|
|
981
980
|
_cb = [];
|
|
982
981
|
/** @type {number} */
|
|
983
982
|
_t = 0;
|
|
984
983
|
/** @type {Function} */
|
|
985
984
|
_u = 0;
|
|
985
|
+
/** @type {TweenController} */
|
|
986
|
+
_ch = this;
|
|
987
|
+
/** @type {TweenController} */
|
|
988
|
+
_cu = this;
|
|
986
989
|
/** @type {LitecanvasInstance} */
|
|
987
990
|
_lc;
|
|
988
991
|
/**
|
|
989
992
|
* @param {*} object
|
|
990
993
|
* @param {string} prop
|
|
991
|
-
* @param {number} toValue
|
|
994
|
+
* @param {number|number} toValue
|
|
992
995
|
* @param {number} duration
|
|
993
996
|
* @param {(x: number) => number} easing
|
|
994
997
|
*/
|
|
@@ -1000,24 +1003,27 @@
|
|
|
1000
1003
|
this._e = easing;
|
|
1001
1004
|
}
|
|
1002
1005
|
/**
|
|
1003
|
-
*
|
|
1004
|
-
* @
|
|
1006
|
+
* @param {LitecanvasInstance} [engine]
|
|
1007
|
+
* @returns {TweenController} this instance
|
|
1005
1008
|
*/
|
|
1006
|
-
start(engine
|
|
1009
|
+
start(engine) {
|
|
1007
1010
|
if (!this.running) {
|
|
1008
1011
|
this.stop();
|
|
1009
1012
|
}
|
|
1013
|
+
this._cu.stop(false);
|
|
1014
|
+
this._ch = this._cu = this;
|
|
1010
1015
|
const fromValue = this._o[this._p] || 0;
|
|
1011
|
-
this.
|
|
1012
|
-
this.
|
|
1013
|
-
|
|
1016
|
+
const toValue = this._rel ? fromValue + this._x : this._x;
|
|
1017
|
+
this._lc = this._lc || engine || globalThis;
|
|
1018
|
+
this._u = this._lc.listen("update", (dt) => {
|
|
1019
|
+
this._o[this._p] = this._lc.lerp(
|
|
1014
1020
|
fromValue,
|
|
1015
|
-
|
|
1021
|
+
toValue,
|
|
1016
1022
|
this._e(this._t / this._d)
|
|
1017
1023
|
);
|
|
1018
1024
|
this._t += dt;
|
|
1019
1025
|
if (this._t >= this._d) {
|
|
1020
|
-
this._o[this._p] =
|
|
1026
|
+
this._o[this._p] = toValue;
|
|
1021
1027
|
this.stop();
|
|
1022
1028
|
}
|
|
1023
1029
|
});
|
|
@@ -1038,16 +1044,40 @@
|
|
|
1038
1044
|
if (!this.running || !this._u) return;
|
|
1039
1045
|
this.running = false;
|
|
1040
1046
|
this._u();
|
|
1047
|
+
this._t = 0;
|
|
1041
1048
|
if (completed) {
|
|
1042
1049
|
for (const callback of this._cb) {
|
|
1043
1050
|
callback(this._o);
|
|
1044
1051
|
}
|
|
1045
1052
|
}
|
|
1046
1053
|
}
|
|
1054
|
+
/**
|
|
1055
|
+
* @param {TweenController} another
|
|
1056
|
+
* @returns {TweenController} this instance
|
|
1057
|
+
*/
|
|
1058
|
+
chain(another) {
|
|
1059
|
+
this._ch.onEnd(() => {
|
|
1060
|
+
this._cu = another.start(this._lc);
|
|
1061
|
+
});
|
|
1062
|
+
this._ch = another;
|
|
1063
|
+
return this;
|
|
1064
|
+
}
|
|
1047
1065
|
reset() {
|
|
1048
1066
|
this._cb.length = 0;
|
|
1049
1067
|
this.stop();
|
|
1050
1068
|
}
|
|
1069
|
+
relative(flag = true) {
|
|
1070
|
+
this._rel = flag;
|
|
1071
|
+
return this;
|
|
1072
|
+
}
|
|
1073
|
+
/**
|
|
1074
|
+
* Returns the current tween of the chain.
|
|
1075
|
+
*
|
|
1076
|
+
* @returns {TweenController}
|
|
1077
|
+
*/
|
|
1078
|
+
get current() {
|
|
1079
|
+
return this._cu;
|
|
1080
|
+
}
|
|
1051
1081
|
get progress() {
|
|
1052
1082
|
return this.running ? this._t / this._d : 0;
|
|
1053
1083
|
}
|
package/dist/all.min.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
(()=>{var J=Object.defineProperty;var Q=(e,t)=>{for(var s in t)J(e,s,{get:t[s],enumerable:!0})};globalThis.utils=globalThis.utils||{};globalThis.utils.global=()=>{for(let e in globalThis.utils)e!=="global"&&(globalThis[e]=globalThis.utils[e])};var D={};Q(D,{ANCHOR_BOT_LEFT:()=>
|
|
2
|
-
`)}},M=class e extends g{constructor(t,s,i=Uint8Array){super(t,s,null),this._c=new i(this._w*this._h)}has(t,s){return this.get(t,s)!==0}clone(){let t=new e(this._w,this._h,this._c.constructor);return this.forEach((s,i,r)=>{t.set(s,i,r)}),t}};function X(e,t,s){return e<t?t:e>s?s:e}var I=Math.sqrt,R=Math.cos,Y=Math.sin,v=2*Math.PI,p=class{x;y;constructor(t=0,s=t){this.x=t,this.y=s}toString(){return`Vector (${this.x}, ${this.y})`}},l=e=>e instanceof p,n=(e=0,t=e)=>(l(e)&&(t=e.y,e=e.x),new p(e,t)),
|
|
1
|
+
(()=>{var J=Object.defineProperty;var Q=(e,t)=>{for(var s in t)J(e,s,{get:t[s],enumerable:!0})};globalThis.utils=globalThis.utils||{};globalThis.utils.global=()=>{for(let e in globalThis.utils)e!=="global"&&(globalThis[e]=globalThis.utils[e])};var D={};Q(D,{ANCHOR_BOT_LEFT:()=>At,ANCHOR_BOT_RIGHT:()=>bt,ANCHOR_CENTER:()=>Mt,ANCHOR_TOP_LEFT:()=>G,ANCHOR_TOP_RIGHT:()=>It,Actor:()=>C,BACK_IN:()=>kt,BACK_IN_OUT:()=>Pt,BACK_OUT:()=>Dt,BOUNCE_IN:()=>Z,BOUNCE_IN_OUT:()=>Yt,BOUNCE_OUT:()=>k,Camera:()=>f,DOWN:()=>wt,EASE_IN:()=>Ot,EASE_IN_OUT:()=>St,EASE_OUT:()=>Ct,ELASTIC_IN:()=>Lt,ELASTIC_IN_OUT:()=>Rt,ELASTIC_OUT:()=>Xt,Grid:()=>g,LEFT:()=>Et,LINEAR:()=>K,ONE:()=>yt,RIGHT:()=>Tt,TypedGrid:()=>M,UP:()=>mt,Vector:()=>p,ZERO:()=>N,advance:()=>z,diff:()=>V,fract:()=>$,intersection:()=>d,range:()=>q,resolve:()=>L,tween:()=>Ht,vec:()=>n,vecAbs:()=>ut,vecAdd:()=>b,vecAngle:()=>nt,vecAngleBetween:()=>ht,vecCeil:()=>ft,vecClamp:()=>xt,vecCross:()=>at,vecDist:()=>rt,vecDist2:()=>ot,vecDiv:()=>y,vecDot:()=>W,vecEq:()=>A,vecFloor:()=>pt,vecIsZero:()=>gt,vecLerp:()=>ct,vecLimit:()=>it,vecMag:()=>F,vecMag2:()=>U,vecMove:()=>dt,vecMult:()=>_,vecNorm:()=>O,vecRand:()=>lt,vecReflect:()=>et,vecRotate:()=>tt,vecRound:()=>_t,vecSet:()=>B,vecSetMag:()=>st,vecSub:()=>H,wave:()=>j});var d=(e,t,s,i,r,o,h,a)=>{let c=Math.max(e,r),P=Math.min(e+s,r+h)-c,x=Math.max(t,o),T=Math.min(t+i,o+a)-x;return[c,x,P,T]};var L=(e,t,s,i,r,o,h,a)=>{let[c,P,x,T]=d(e,t,s,i,r,o,h,a),u="",w=e,E=t;return x<T?e<r?(u="right",w=r-s):(u="left",w=r+h):t<o?(u="bottom",E=o-i):(u="top",E=o+a),{direction:u,x:w,y:E}};var f=class{_engine=null;x=0;y=0;ox=0;oy=0;width=0;height=0;rotation=0;scale=1;_shake={x:0,y:0,removeListener:null};constructor(t=null,s=0,i=0,r=null,o=null){this._engine=t||globalThis,this.ox=s,this.oy=i,this.resize(r||this._engine.WIDTH-s,o||this._engine.HEIGHT-i),this.x=this.width/2,this.y=this.height/2}resize(t,s){this.width=t,this.height=s,this._engine.emit("camera-resized",this)}start(t=!1){this._engine.push(),t&&this._engine.cliprect(this.ox,this.oy,this.width,this.height);let s=this.ox+this.width/2,i=this.oy+this.height/2;this._engine.translate(s,i),this._engine.scale(this.scale),this._engine.rotate(this.rotation),this._engine.translate(-this.x+this._shake.x,-this.y+this._shake.y)}end(){this._engine.pop()}lookAt(t,s){this.x=t,this.y=s}move(t,s){this.x+=t,this.y+=s}zoom(t){this.scale*=t}zoomTo(t){this.scale=t}rotate(t){this.rotation+=t}rotateTo(t){this.rotation=t}getWorldPoint(t,s,i={}){let r=Math.cos(-this.rotation),o=Math.sin(-this.rotation);return t=(t-this.width/2-this.ox)/this.scale,s=(s-this.height/2-this.oy)/this.scale,i.x=r*t-o*s+this.x,i.y=o*t+r*s+this.y,i}getCameraPoint(t,s,i={}){let r=Math.cos(-this.rotation),o=Math.sin(-this.rotation);return t=t-this.x,s=s-this.y,t=r*t-o*s,s=o*t+r*s,i.x=t*this.scale+this.width/2+this.ox,i.y=s*this.scale+this.height/2+this.oy,i}getBounds(){return[this.ox,this.oy,this.width,this.height]}viewing(t,s,i,r){let o=this.width/2-this.x,h=this.height/2-this.y,a=this.width/this.scale,c=this.height/this.scale;return this._engine.colrect(t,s,i,r,o,h,a,c)}shake(t=1,s=.3){this.shaking||(this._shake.removeListener=this._engine.listen("update",i=>{this._shake.x=this._engine.randi(-t,t),this._shake.y=this._engine.randi(-t,t),s-=i,s<=0&&this.unshake()}))}unshake(){this.shaking&&(this._shake.removeListener(),this._shake.removeListener=null,this._shake.x=this._shake.y=0)}get shaking(){return this._shake.removeListener!==null}};var g=class e{_w;_h;_c;constructor(t,s,i=[]){this._w=Math.max(1,~~t),this._h=Math.max(1,~~s),this._c=i}[Symbol.iterator](){let t=0;return{next:()=>({value:[this.indexToPointX(t),this.indexToPointY(t),this._c[t++]],done:t>this._c.length})}}clone(){return new e(this._w,this._h,this._c)}clear(){this.forEach((t,s)=>this.set(t,s,void 0))}get width(){return this._w}get height(){return this._h}set(t,s,i){this._c[this.pointToIndex(t,s)]=i}get(t,s){return this._c[this.pointToIndex(t,s)]}has(t,s){return this.get(t,s)!=null}check(t,s){return t>=0&&t<this._w&&s>=0&&s<this._h}get length(){return this._w*this._h}pointToIndex(t,s){return this.clampX(~~t)+this.clampY(~~s)*this._w}indexToPointX(t){return t%this._w}indexToPointY(t){return Math.floor(t/this._w)}forEach(t,s=!1){let i=s?this.length-1:0,r=s?-1:this.length,o=s?-1:1;for(;i!==r;){let h=this.indexToPointX(i),a=this.indexToPointY(i),c=this._c[i];if(t(h,a,c,this)===!1)break;i+=o}}fill(t){this.forEach((s,i)=>{this.set(s,i,t)})}clampX(t){return X(t,0,this._w-1)}clampY(t){return X(t,0,this._h-1)}toArray(){return this._c.slice()}toString(t=" ",s=!0){if(!s)return this._c.join(t);let i=[];return this.forEach((r,o,h)=>{i[o]=i[o]||"",i[o]+=h+t}),i.join(`
|
|
2
|
+
`)}},M=class e extends g{constructor(t,s,i=Uint8Array){super(t,s,null),this._c=new i(this._w*this._h)}has(t,s){return this.get(t,s)!==0}clone(){let t=new e(this._w,this._h,this._c.constructor);return this.forEach((s,i,r)=>{t.set(s,i,r)}),t}};function X(e,t,s){return e<t?t:e>s?s:e}var I=Math.sqrt,R=Math.cos,Y=Math.sin,v=2*Math.PI,p=class{x;y;constructor(t=0,s=t){this.x=t,this.y=s}toString(){return`Vector (${this.x}, ${this.y})`}},l=e=>e instanceof p,n=(e=0,t=e)=>(l(e)&&(t=e.y,e=e.x),new p(e,t)),A=(e,t,s=t)=>l(t)?A(e,t.x,t.y):e.x===t&&e.y===s,B=(e,t,s=t)=>(l(t)?B(e,t.x,t.y):(e.x=t,e.y=s),e),b=(e,t,s=t)=>l(t)?b(e,t.x,t.y):(e.x+=t,e.y+=s,e),H=(e,t,s=t)=>l(t)?H(e,t.x,t.y):(e.x-=t,e.y-=s,e),_=(e,t,s=t)=>l(t)?_(e,t.x,t.y):(e.x*=t,e.y*=s,e),y=(e,t,s=t)=>l(t)?y(e,t.x,t.y):(e.x/=t||1,e.y/=s||1,e),tt=(e,t)=>{let s=R(t),i=Y(t);return e.x=s*e.x-i*e.y,e.y=i*e.x+s*e.y,e},et=(e,t)=>{let s=O(n(t));return H(e,_(s,2*W(e,s)))},st=(e,t)=>(O(e),_(e,t),e),F=e=>I(e.x*e.x+e.y*e.y),U=e=>e.x*e.x+e.y*e.y,O=e=>{let t=F(e);return t>0&&y(e,t),e},it=(e,t=1)=>{let s=U(e);return s>t*t&&(y(e,I(s)),_(e,t)),e},rt=(e,t)=>{let s=e.x-t.x,i=e.y-t.y;return I(s*s+i*i)},ot=(e,t)=>{let s=e.x-t.x,i=e.y-t.y;return s*s+i*i},nt=e=>Math.atan2(e.y,e.x),ht=(e,t)=>Math.atan2(t.y-e.y,t.x-e.x),W=(e,t)=>e.x*t.x+e.y*t.y,at=(e,t)=>e.x*t.y-e.y*t.x,ct=(e,t,s)=>(e.x+=(t.x-e.x)*s||0,e.y+=(t.y-e.y)*s||0,e),lt=(e=1,t=e,s=globalThis.rand||Math.random)=>{let i=s()*v,r=s()*(t-e)+e;return n(R(i)*r,Y(i)*r)},ut=e=>(e.x=Math.abs(e.x),e.y=Math.abs(e.y),e),ft=e=>(e.x=Math.ceil(e.x),e.y=Math.ceil(e.y),e),pt=e=>(e.x=Math.floor(e.x),e.y=Math.floor(e.y),e),_t=e=>(e.x=Math.round(e.x),e.y=Math.round(e.y),e),xt=(e,t,s)=>(e.x<t.x&&(e.x=t.x),e.x>s.x&&(e.x=s.x),e.y<t.y&&(e.y=t.y),e.y>s.y&&(e.y=s.y),e),dt=(e,t,s=1)=>b(e,t.x*s,t.y*s),gt=e=>A(e,N),N=n(0,0),yt=n(1,1),mt=n(0,-1),Tt=n(1,0),wt=n(0,1),Et=n(-1,0);var Mt=n(.5,.5),G=n(0,0),It=n(1,0),At=n(0,1),bt=n(1,1),C=class{sprite;pos;_o;_s;flipX=!1;flipY=!1;angle=0;opacity=1;hidden=!1;constructor(t,s,i=G){this.sprite=t,this.pos=s||n(0),this._o=n(i),this._s=n(1,1)}set x(t){this.pos.x=t}get x(){return this.pos.x}set y(t){this.pos.y=t}get y(){return this.pos.y}set anchor(t){this._o.x=t.x,this._o.y=t.y}get anchor(){return this._o}get width(){return this.sprite.width*this._s.x}get height(){return this.sprite.height*this._s.y}get scale(){return this._s}scaleTo(t,s=t){this._s.x=t,this._s.y=s}scaleBy(t,s=t){this._s.x*=t,this._s.y*=s}getBounds(t=!0){let s=this.sprite.width*(t?this._s.x:1),i=this.sprite.height*(t?this._s.y:1),r=this.pos.x-s*this.anchor.x,o=this.pos.y-i*this.anchor.y;return[r,o,s,i]}draw(t=globalThis,s=!0){this.hidden||this.opacity<=0||(s&&t.push(),this.transform(t),this.drawImage(t),s&&t.pop())}transform(t){t.translate(this.pos.x,this.pos.y),t.rotate(this.angle),t.scale((this.flipX?-1:1)*this._s.x,(this.flipY?-1:1)*this._s.y)}drawImage(t,s=!0){let i=this.anchor,r=-this.sprite.width*(this.flipX?1-i.x:i.x),o=-this.sprite.height*(this.flipY?1-i.y:i.y);s&&t.alpha(this.opacity),t.image(r,o,this.sprite)}};var V=(e,t)=>Math.abs(t-e)||0;var j=(e,t,s,i=Math.sin)=>e+(i(s)+1)/2*(t-e);var $=e=>e%1||0;var q=e=>Array.from(Array(e).keys());var z=advance=(e,t,s,i=1)=>{s&&(t.x+=s.x*i,t.y+=s.y*i),e.x+=t.x*i,e.y+=t.y*i};var m=Math.PI/2,Ht=(e,t,s,i=1,r=K)=>new S(e,t,s,i,r),K=e=>e,Ot=e=>e*e,Ct=e=>-e*(e-2),St=e=>e<.5?2*e*e:-2*e*e+4*e-1,kt=e=>e*e*e-e*Math.sin(e*Math.PI),Dt=e=>{let t=1-e;return 1-(t*t*t-t*Math.sin(t*Math.PI))},Pt=e=>{if(e<.5){let s=2*e;return .5*(s*s*s-s*Math.sin(s*Math.PI))}let t=1-(2*e-1);return .5*(1-(t*t*t-t*Math.sin(e*Math.PI)))+.5},Lt=e=>Math.sin(13*m*e)*Math.pow(2,10*(e-1)),Xt=e=>Math.sin(-13*m*(e+1))*Math.pow(2,-10*e)+1,Rt=e=>{if(e<.5){let i=Math.sin(13*m*(2*e)),r=Math.pow(2,10*(2*e-1));return .5*i*r}let t=Math.sin(-13*m*(2*e-1+1)),s=Math.pow(2,-10*(2*e-1));return .5*(t*s+2)},Z=e=>1-k(1-e),k=e=>e<4/11?121*e*e/16:e<8/11?363/40*e*e-99/10*e+17/5:e<9/10?4356/361*e*e-35442/1805*e+16061/1805:54/5*e*e-513/25*e+268/25,Yt=e=>e<.5?.5*Z(e*2):.5*k(e*2-1)+.5,S=class{running=!1;_o;_p;_x;_d;_e;_rel;_cb=[];_t=0;_u=0;_ch=this;_cu=this;_lc;constructor(t,s,i,r,o){this._o=t,this._p=s,this._x=i,this._d=r,this._e=o}start(t){this.running||this.stop(),this._cu.stop(!1),this._ch=this._cu=this;let s=this._o[this._p]||0,i=this._rel?s+this._x:this._x;return this._lc=this._lc||t||globalThis,this._u=this._lc.listen("update",r=>{this._o[this._p]=this._lc.lerp(s,i,this._e(this._t/this._d)),this._t+=r,this._t>=this._d&&(this._o[this._p]=i,this.stop())}),this.running=!0,this}onEnd(t){this._cb.push(t)}stop(t=!0){if(!(!this.running||!this._u)&&(this.running=!1,this._u(),this._t=0,t))for(let s of this._cb)s(this._o)}chain(t){return this._ch.onEnd(()=>{this._cu=t.start(this._lc)}),this._ch=t,this}reset(){this._cb.length=0,this.stop()}relative(t=!0){return this._rel=t,this}get current(){return this._cu}get progress(){return this.running?this._t/this._d:0}};globalThis.utils=Object.assign(globalThis.utils||{},D);})();
|
|
3
3
|
/*! @litecanvas/utils by Luiz Bills | MIT Licensed */
|
package/dist/tween.js
CHANGED
|
@@ -32,11 +32,6 @@
|
|
|
32
32
|
LINEAR: () => LINEAR,
|
|
33
33
|
tween: () => tween
|
|
34
34
|
});
|
|
35
|
-
|
|
36
|
-
// node_modules/litecanvas/src/zzfx.js
|
|
37
|
-
globalThis.zzfxV = 1;
|
|
38
|
-
|
|
39
|
-
// src/tween/index.js
|
|
40
35
|
var HALF_PI = Math.PI / 2;
|
|
41
36
|
var tween = (object, prop, toValue, duration = 1, easing = LINEAR) => {
|
|
42
37
|
return new TweenController(object, prop, toValue, duration, easing);
|
|
@@ -103,24 +98,30 @@
|
|
|
103
98
|
_o;
|
|
104
99
|
/** @type {string} */
|
|
105
100
|
_p;
|
|
106
|
-
/** @type {number} */
|
|
101
|
+
/** @type {number|number} */
|
|
107
102
|
_x;
|
|
108
103
|
/** @type {number} */
|
|
109
104
|
_d;
|
|
110
105
|
/** @type {(x: number) => number} */
|
|
111
106
|
_e;
|
|
107
|
+
/** @type {boolean} */
|
|
108
|
+
_rel;
|
|
112
109
|
/** @type {Function[]} */
|
|
113
110
|
_cb = [];
|
|
114
111
|
/** @type {number} */
|
|
115
112
|
_t = 0;
|
|
116
113
|
/** @type {Function} */
|
|
117
114
|
_u = 0;
|
|
115
|
+
/** @type {TweenController} */
|
|
116
|
+
_ch = this;
|
|
117
|
+
/** @type {TweenController} */
|
|
118
|
+
_cu = this;
|
|
118
119
|
/** @type {LitecanvasInstance} */
|
|
119
120
|
_lc;
|
|
120
121
|
/**
|
|
121
122
|
* @param {*} object
|
|
122
123
|
* @param {string} prop
|
|
123
|
-
* @param {number} toValue
|
|
124
|
+
* @param {number|number} toValue
|
|
124
125
|
* @param {number} duration
|
|
125
126
|
* @param {(x: number) => number} easing
|
|
126
127
|
*/
|
|
@@ -132,24 +133,27 @@
|
|
|
132
133
|
this._e = easing;
|
|
133
134
|
}
|
|
134
135
|
/**
|
|
135
|
-
*
|
|
136
|
-
* @
|
|
136
|
+
* @param {LitecanvasInstance} [engine]
|
|
137
|
+
* @returns {TweenController} this instance
|
|
137
138
|
*/
|
|
138
|
-
start(engine
|
|
139
|
+
start(engine) {
|
|
139
140
|
if (!this.running) {
|
|
140
141
|
this.stop();
|
|
141
142
|
}
|
|
143
|
+
this._cu.stop(false);
|
|
144
|
+
this._ch = this._cu = this;
|
|
142
145
|
const fromValue = this._o[this._p] || 0;
|
|
143
|
-
this.
|
|
144
|
-
this.
|
|
145
|
-
|
|
146
|
+
const toValue = this._rel ? fromValue + this._x : this._x;
|
|
147
|
+
this._lc = this._lc || engine || globalThis;
|
|
148
|
+
this._u = this._lc.listen("update", (dt) => {
|
|
149
|
+
this._o[this._p] = this._lc.lerp(
|
|
146
150
|
fromValue,
|
|
147
|
-
|
|
151
|
+
toValue,
|
|
148
152
|
this._e(this._t / this._d)
|
|
149
153
|
);
|
|
150
154
|
this._t += dt;
|
|
151
155
|
if (this._t >= this._d) {
|
|
152
|
-
this._o[this._p] =
|
|
156
|
+
this._o[this._p] = toValue;
|
|
153
157
|
this.stop();
|
|
154
158
|
}
|
|
155
159
|
});
|
|
@@ -170,16 +174,40 @@
|
|
|
170
174
|
if (!this.running || !this._u) return;
|
|
171
175
|
this.running = false;
|
|
172
176
|
this._u();
|
|
177
|
+
this._t = 0;
|
|
173
178
|
if (completed) {
|
|
174
179
|
for (const callback of this._cb) {
|
|
175
180
|
callback(this._o);
|
|
176
181
|
}
|
|
177
182
|
}
|
|
178
183
|
}
|
|
184
|
+
/**
|
|
185
|
+
* @param {TweenController} another
|
|
186
|
+
* @returns {TweenController} this instance
|
|
187
|
+
*/
|
|
188
|
+
chain(another) {
|
|
189
|
+
this._ch.onEnd(() => {
|
|
190
|
+
this._cu = another.start(this._lc);
|
|
191
|
+
});
|
|
192
|
+
this._ch = another;
|
|
193
|
+
return this;
|
|
194
|
+
}
|
|
179
195
|
reset() {
|
|
180
196
|
this._cb.length = 0;
|
|
181
197
|
this.stop();
|
|
182
198
|
}
|
|
199
|
+
relative(flag = true) {
|
|
200
|
+
this._rel = flag;
|
|
201
|
+
return this;
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* Returns the current tween of the chain.
|
|
205
|
+
*
|
|
206
|
+
* @returns {TweenController}
|
|
207
|
+
*/
|
|
208
|
+
get current() {
|
|
209
|
+
return this._cu;
|
|
210
|
+
}
|
|
183
211
|
get progress() {
|
|
184
212
|
return this.running ? this._t / this._d : 0;
|
|
185
213
|
}
|
package/dist/tween.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(()=>{var
|
|
1
|
+
(()=>{var h=Object.defineProperty;var p=(t,e)=>{for(var s in e)h(t,s,{get:e[s],enumerable:!0})};globalThis.utils=globalThis.utils||{};globalThis.utils.global=()=>{for(let t in globalThis.utils)t!=="global"&&(globalThis[t]=globalThis.utils[t])};var l={};p(l,{BACK_IN:()=>m,BACK_IN_OUT:()=>x,BACK_OUT:()=>E,BOUNCE_IN:()=>f,BOUNCE_IN_OUT:()=>w,BOUNCE_OUT:()=>n,EASE_IN:()=>d,EASE_IN_OUT:()=>T,EASE_OUT:()=>g,ELASTIC_IN:()=>I,ELASTIC_IN_OUT:()=>y,ELASTIC_OUT:()=>b,LINEAR:()=>c,tween:()=>_});var r=Math.PI/2,_=(t,e,s,i=1,o=c)=>new a(t,e,s,i,o),c=t=>t,d=t=>t*t,g=t=>-t*(t-2),T=t=>t<.5?2*t*t:-2*t*t+4*t-1,m=t=>t*t*t-t*Math.sin(t*Math.PI),E=t=>{let e=1-t;return 1-(e*e*e-e*Math.sin(e*Math.PI))},x=t=>{if(t<.5){let s=2*t;return .5*(s*s*s-s*Math.sin(s*Math.PI))}let e=1-(2*t-1);return .5*(1-(e*e*e-e*Math.sin(t*Math.PI)))+.5},I=t=>Math.sin(13*r*t)*Math.pow(2,10*(t-1)),b=t=>Math.sin(-13*r*(t+1))*Math.pow(2,-10*t)+1,y=t=>{if(t<.5){let i=Math.sin(13*r*(2*t)),o=Math.pow(2,10*(2*t-1));return .5*i*o}let e=Math.sin(-13*r*(2*t-1+1)),s=Math.pow(2,-10*(2*t-1));return .5*(e*s+2)},f=t=>1-n(1-t),n=t=>t<4/11?121*t*t/16:t<8/11?363/40*t*t-99/10*t+17/5:t<9/10?4356/361*t*t-35442/1805*t+16061/1805:54/5*t*t-513/25*t+268/25,w=t=>t<.5?.5*f(t*2):.5*n(t*2-1)+.5,a=class{running=!1;_o;_p;_x;_d;_e;_rel;_cb=[];_t=0;_u=0;_ch=this;_cu=this;_lc;constructor(e,s,i,o,u){this._o=e,this._p=s,this._x=i,this._d=o,this._e=u}start(e){this.running||this.stop(),this._cu.stop(!1),this._ch=this._cu=this;let s=this._o[this._p]||0,i=this._rel?s+this._x:this._x;return this._lc=this._lc||e||globalThis,this._u=this._lc.listen("update",o=>{this._o[this._p]=this._lc.lerp(s,i,this._e(this._t/this._d)),this._t+=o,this._t>=this._d&&(this._o[this._p]=i,this.stop())}),this.running=!0,this}onEnd(e){this._cb.push(e)}stop(e=!0){if(!(!this.running||!this._u)&&(this.running=!1,this._u(),this._t=0,e))for(let s of this._cb)s(this._o)}chain(e){return this._ch.onEnd(()=>{this._cu=e.start(this._lc)}),this._ch=e,this}reset(){this._cb.length=0,this.stop()}relative(e=!0){return this._rel=e,this}get current(){return this._cu}get progress(){return this.running?this._t/this._d:0}};globalThis.utils=Object.assign(globalThis.utils||{},l);})();
|
package/package.json
CHANGED
package/src/tween/README.md
CHANGED
|
@@ -57,7 +57,7 @@ function draw() {
|
|
|
57
57
|
|
|
58
58
|
### TweenController#start()
|
|
59
59
|
|
|
60
|
-
Starts the animation
|
|
60
|
+
Starts the animation.
|
|
61
61
|
|
|
62
62
|
Syntax: `.start(engine?: LitecanvasInstance): TweenController`
|
|
63
63
|
|
|
@@ -85,6 +85,48 @@ function init () {
|
|
|
85
85
|
}
|
|
86
86
|
```
|
|
87
87
|
|
|
88
|
+
### TweenController#relative()
|
|
89
|
+
|
|
90
|
+
If enabled (`flag = true`) the tween we animate from a value to another relative value.
|
|
91
|
+
|
|
92
|
+
Syntax: `.relative(flag?: boolean = true): void`
|
|
93
|
+
|
|
94
|
+
```js
|
|
95
|
+
const obj = { x: 0 }
|
|
96
|
+
|
|
97
|
+
// DEFAULT
|
|
98
|
+
// this tween animates the obj.x to 100
|
|
99
|
+
tween(obj, "x", 100)
|
|
100
|
+
|
|
101
|
+
// this tween animates the obj.x value to -100
|
|
102
|
+
tween(obj, "x", -100)
|
|
103
|
+
|
|
104
|
+
// RELATIVE
|
|
105
|
+
// this tween animates the obj.x increasing +100
|
|
106
|
+
tween(obj, "x", 100).relative()
|
|
107
|
+
|
|
108
|
+
// this tween animates the obj.x decreasing -100
|
|
109
|
+
tween(obj, "x", -100).relative()
|
|
110
|
+
```
|
|
111
|
+
|
|
112
|
+
### TweenController#chain()
|
|
113
|
+
|
|
114
|
+
Make another tween start right after this tween ends.
|
|
115
|
+
|
|
116
|
+
Syntax: `.relative(another: TweenController): TweenController`
|
|
117
|
+
|
|
118
|
+
```js
|
|
119
|
+
const obj = { x: 0, angle: 0 }
|
|
120
|
+
|
|
121
|
+
const moveRight = tween(obj, "x", 100, 1).relative()
|
|
122
|
+
const moveLeft = tween(obj, "x", -100, 1).relative()
|
|
123
|
+
const moveLeft = tween(obj, "angle", Math.PI, 1).relative()
|
|
124
|
+
|
|
125
|
+
// move 100px to right, move 100px to left and rotate
|
|
126
|
+
moveRight.chain(moveLeft)
|
|
127
|
+
moveRight.start()
|
|
128
|
+
```
|
|
129
|
+
|
|
88
130
|
### TweenController#onEnd()
|
|
89
131
|
|
|
90
132
|
Enqueues a callback to be executed when the animation finishes.
|
package/src/tween/index.js
CHANGED
|
@@ -2,6 +2,14 @@ import "litecanvas"
|
|
|
2
2
|
|
|
3
3
|
const HALF_PI = Math.PI / 2
|
|
4
4
|
|
|
5
|
+
/**
|
|
6
|
+
* @param {any} object
|
|
7
|
+
* @param {string} prop
|
|
8
|
+
* @param {number|number} toValue
|
|
9
|
+
* @param {number} [duration]
|
|
10
|
+
* @param {(n: number) => number} [easing]
|
|
11
|
+
* @returns {TweenController}
|
|
12
|
+
*/
|
|
5
13
|
export const tween = (object, prop, toValue, duration = 1, easing = LINEAR) => {
|
|
6
14
|
return new TweenController(object, prop, toValue, duration, easing)
|
|
7
15
|
}
|
|
@@ -74,25 +82,32 @@ class TweenController {
|
|
|
74
82
|
_o
|
|
75
83
|
/** @type {string} */
|
|
76
84
|
_p
|
|
77
|
-
/** @type {number} */
|
|
85
|
+
/** @type {number|number} */
|
|
78
86
|
_x
|
|
79
87
|
/** @type {number} */
|
|
80
88
|
_d
|
|
81
89
|
/** @type {(x: number) => number} */
|
|
82
90
|
_e
|
|
91
|
+
/** @type {boolean} */
|
|
92
|
+
_rel
|
|
93
|
+
|
|
83
94
|
/** @type {Function[]} */
|
|
84
95
|
_cb = []
|
|
85
96
|
/** @type {number} */
|
|
86
97
|
_t = 0
|
|
87
98
|
/** @type {Function} */
|
|
88
99
|
_u = 0
|
|
100
|
+
/** @type {TweenController} */
|
|
101
|
+
_ch = this
|
|
102
|
+
/** @type {TweenController} */
|
|
103
|
+
_cu = this
|
|
89
104
|
/** @type {LitecanvasInstance} */
|
|
90
105
|
_lc
|
|
91
106
|
|
|
92
107
|
/**
|
|
93
108
|
* @param {*} object
|
|
94
109
|
* @param {string} prop
|
|
95
|
-
* @param {number} toValue
|
|
110
|
+
* @param {number|number} toValue
|
|
96
111
|
* @param {number} duration
|
|
97
112
|
* @param {(x: number) => number} easing
|
|
98
113
|
*/
|
|
@@ -105,26 +120,31 @@ class TweenController {
|
|
|
105
120
|
}
|
|
106
121
|
|
|
107
122
|
/**
|
|
108
|
-
*
|
|
109
|
-
* @
|
|
123
|
+
* @param {LitecanvasInstance} [engine]
|
|
124
|
+
* @returns {TweenController} this instance
|
|
110
125
|
*/
|
|
111
|
-
start(engine
|
|
126
|
+
start(engine) {
|
|
112
127
|
if (!this.running) {
|
|
113
128
|
this.stop()
|
|
114
129
|
}
|
|
115
130
|
|
|
131
|
+
this._cu.stop(false)
|
|
132
|
+
this._ch = this._cu = this
|
|
133
|
+
|
|
116
134
|
const fromValue = this._o[this._p] || 0
|
|
135
|
+
const toValue = this._rel ? fromValue + this._x : this._x
|
|
117
136
|
|
|
118
|
-
this._lc = engine
|
|
119
|
-
|
|
120
|
-
|
|
137
|
+
this._lc = this._lc || engine || globalThis
|
|
138
|
+
|
|
139
|
+
this._u = this._lc.listen("update", (dt) => {
|
|
140
|
+
this._o[this._p] = this._lc.lerp(
|
|
121
141
|
fromValue,
|
|
122
|
-
|
|
142
|
+
toValue,
|
|
123
143
|
this._e(this._t / this._d)
|
|
124
144
|
)
|
|
125
145
|
this._t += dt
|
|
126
146
|
if (this._t >= this._d) {
|
|
127
|
-
this._o[this._p] =
|
|
147
|
+
this._o[this._p] = toValue
|
|
128
148
|
this.stop()
|
|
129
149
|
}
|
|
130
150
|
})
|
|
@@ -151,6 +171,7 @@ class TweenController {
|
|
|
151
171
|
this.running = false
|
|
152
172
|
|
|
153
173
|
this._u()
|
|
174
|
+
this._t = 0
|
|
154
175
|
|
|
155
176
|
if (completed) {
|
|
156
177
|
for (const callback of this._cb) {
|
|
@@ -159,11 +180,37 @@ class TweenController {
|
|
|
159
180
|
}
|
|
160
181
|
}
|
|
161
182
|
|
|
183
|
+
/**
|
|
184
|
+
* @param {TweenController} another
|
|
185
|
+
* @returns {TweenController} this instance
|
|
186
|
+
*/
|
|
187
|
+
chain(another) {
|
|
188
|
+
this._ch.onEnd(() => {
|
|
189
|
+
this._cu = another.start(this._lc)
|
|
190
|
+
})
|
|
191
|
+
this._ch = another
|
|
192
|
+
return this
|
|
193
|
+
}
|
|
194
|
+
|
|
162
195
|
reset() {
|
|
163
196
|
this._cb.length = 0
|
|
164
197
|
this.stop()
|
|
165
198
|
}
|
|
166
199
|
|
|
200
|
+
relative(flag = true) {
|
|
201
|
+
this._rel = flag
|
|
202
|
+
return this
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
/**
|
|
206
|
+
* Returns the current tween of the chain.
|
|
207
|
+
*
|
|
208
|
+
* @returns {TweenController}
|
|
209
|
+
*/
|
|
210
|
+
get current() {
|
|
211
|
+
return this._cu
|
|
212
|
+
}
|
|
213
|
+
|
|
167
214
|
get progress() {
|
|
168
215
|
return this.running ? this._t / this._d : 0
|
|
169
216
|
}
|