litecanvas 0.68.2 → 0.69.1

package/dist/dist.js

@@ -41,6 +41,7 @@
   ];
 
   // src/index.js
+  globalThis.litecanvas = litecanvas;
   function litecanvas(settings = {}) {
     const root = globalThis, PI = Math.PI, TWO_PI = PI * 2, raf = requestAnimationFrame, _browserEventListeners = [], on = (elem, evt, callback) => {
       elem.addEventListener(evt, callback, false);
@@ -709,10 +710,11 @@
        * Stops the litecanvas instance and remove all event listeners.
        */
       quit() {
-        _focused = _events = false;
+        instance.emit("quit");
         for (const removeListener of _browserEventListeners) {
           removeListener();
         }
+        _focused = _events = false;
         if (_global) {
           for (const key in instance) {
             delete root[key];
@@ -864,7 +866,6 @@
           _focused = false;
         });
         on(root, "focus", () => {
-          _lastFrame = performance.now();
           _focused = true;
           raf(drawFrame);
         });
@@ -875,19 +876,19 @@
       raf(drawFrame);
     }
     function drawFrame(now) {
-      let emitDraw = !_animated, delta = now - _lastFrame;
-      _accumulated += delta > 1e3 ? _stepMs : delta;
+      let shouldRender = !_animated, delta = now - _lastFrame;
+      _accumulated += delta > 100 ? _stepMs : delta;
+      _lastFrame = now;
       while (_accumulated >= _stepMs) {
         instance.emit("update", _step * _timeScale);
         instance.setvar("ELAPSED", instance.ELAPSED + _step * _timeScale);
         _accumulated -= _stepMs;
-        emitDraw = 1;
+        shouldRender = true;
       }
-      if (emitDraw) {
+      if (shouldRender) {
         instance.textalign("start", "top");
         instance.emit("draw");
       }
-      _lastFrame = now;
       if (_focused && _animated) {
         raf(drawFrame);
       }
@@ -963,7 +964,4 @@
     }
     return instance;
   }
-
-  // src/web.js
-  globalThis.litecanvas = litecanvas;
 })();

package/dist/dist.min.js

@@ -1 +1 @@
-(()=>{var e=new AudioContext,t=(t=1,a=.05,l=220,n=0,i=0,r=.1,o=0,s=1,c=0,f=0,u=0,p=0,d=0,g=0,h=0,m=0,v=0,E=1,T=0,x=0,b=0)=>{let w=Math,H=2*w.PI,D=c*=500*H/44100/44100,y=l*=(1-a+2*a*w.random(a=[]))*H/44100,I=0,S=0,A=0,k=1,C=0,L=0,X=0,O=b<0?-1:1,W=H*O*b*2/44100,z=w.cos(W),M=w.sin,P=M(W)/4,Y=1+P,B=-2*z/Y,F=(1-P)/Y,G=(1+O*z)/2/Y,_=-(O+z)/Y,R=0,N=0,U=0,$=0;for(n=44100*n+9,T*=44100,i*=44100,r*=44100,v*=44100,f*=500*H/85766121e6,h*=H/44100,u*=H/44100,p*=44100,d=44100*d|0,t*=.3*(globalThis.zzfxV||1),O=n+T+i+r+v|0;A<O;a[A++]=X*t)++L%(100*m|0)||(X=o?1<o?2<o?3<o?M(I*I):w.max(w.min(w.tan(I),1),-1):1-(2*I/H%2+2)%2:1-4*w.abs(w.round(I/H)-I/H):M(I),X=(d?1-x+x*M(H*A/d):1)*(X<0?-1:1)*w.abs(X)**s*(A<n?A/n:A<n+T?1-(A-n)/T*(1-E):A<n+T+i?E:A<O-v?(O-A-v)/r*E:0),X=v?X/2+(v>A?0:(A<O-v?1:(O-A)/v)*a[A-v|0]/2/t):X,b&&(X=$=G*R+_*(R=N)+G*(N=X)-F*U-B*(U=$))),I+=(W=(l+=c+=f)*w.cos(h*S++))+W*g*M(A**5),k&&++k>p&&(l+=u,y+=u,k=0),!d||++C%d||(l=y,c=D,k=k||1);(t=e.createBuffer(1,O,44100)).getChannelData(0).set(a),(l=e.createBufferSource()).buffer=t,l.connect(e.destination),l.start()},a=["#111","#6a7799","#aec2c2","#FFF1E8","#e83b3b","#fabc20","#155fd9","#3cbcfc","#327345","#63c64d","#6c2c1f","#ac7c00"];globalThis.litecanvas=function(e={}){let l=globalThis,n=Math.PI,i=2*n,r=requestAnimationFrame,o=[],s=(e,t,a)=>{e.addEventListener(t,a,!1),o.push(()=>e.removeEventListener(t,a,!1))};e=Object.assign({fps:60,fullscreen:!0,width:null,height:null,autoscale:!0,pixelart:!1,antialias:!1,canvas:null,global:!0,loop:null,pauseOnBlur:!0,tapEvents:!0,keyboardEvents:!0,animate:!0},e);let c=!1,f=[],u=e.canvas||document.createElement("canvas"),p=e.fullscreen,d=e.autoscale,g=e.animate,h=1,m,v=1,E,T,x,b=0,w=!0,H="sans-serif",D="",y=32,I=Date.now(),S=e.global,A={init:null,update:null,draw:null,resized:null,tap:null,untap:null,tapping:null,tapped:null},k={settings:Object.assign({},e),colors:a},C={WIDTH:e.width,HEIGHT:e.height||e.width,CANVAS:null,ELAPSED:0,CENTERX:0,CENTERY:0,MOUSEX:-1,MOUSEY:-1,DEFAULT_SFX:[.5,,1675,,.06,.2,1,1.8,,,637,.06],PI:n,TWO_PI:i,HALF_PI:.5*n,lerp:(e,t,a)=>e+a*(t-e),deg2rad:e=>n/180*e,rad2deg:e=>180/n*e,clamp:(e,t,a)=>e<t?t:e>a?a:e,wrap:(e,t,a)=>e-(a-t)*Math.floor((e-t)/(a-t)),map(e,t,a,l,n,i){let r=(e-t)/(a-t)*(n-l)+l;return i?C.clamp(r,l,n):r},norm:(e,t,a)=>C.map(e,t,a,0,1),rand:(e=0,t=1)=>(I=(1664525*I+0x3c6ef35f)%0x100000000)/0x100000000*(t-e)+e,randi:(e=0,t=1)=>Math.floor(C.rand(e,t+1)),seed:e=>null==e?I:I=~~e,cls(e){null==e?m.clearRect(0,0,C.WIDTH,C.HEIGHT):C.rectfill(0,0,C.WIDTH,C.HEIGHT,e)},rect(e,t,a,l,n=0,i=null){m.beginPath(),m[i?"roundRect":"rect"](~~e,~~t,a,l,i),C.stroke(n)},rectfill(e,t,a,l,n=0,i=null){m.beginPath(),m[i?"roundRect":"rect"](~~e,~~t,a,l,i),C.fill(n)},circ(e,t,a,l){m.beginPath(),m.arc(~~e,~~t,a,0,i),C.stroke(l)},circfill(e,t,a,l){m.beginPath(),m.arc(~~e,~~t,a,0,i),C.fill(l)},line(e,t,a,l,n){m.beginPath(),m.moveTo(~~e,~~t),m.lineTo(~~a,~~l),C.stroke(n)},linewidth(e){m.lineWidth=e},linedash(e,t=0){m.setLineDash(e),m.lineDashOffset=t},text(e,t,a,l=3){m.font=`${D} ${y}px ${H}`,m.fillStyle=C.getcolor(l),m.fillText(a,~~e,~~t)},textfont(e){H=e},textsize(e){y=e},textstyle(e){D=e||""},textalign(e,t){e&&(m.textAlign=e),t&&(m.textBaseline=t)},textmetrics(e,t=y){m.font=`${D} ${t}px ${H}`;let a=m.measureText(e);return a.height=a.actualBoundingBoxAscent+a.actualBoundingBoxDescent,a},image(e,t,a){m.drawImage(a,~~e,~~t)},paint(e,t,a,l={}){let n=l.canvas||new OffscreenCanvas(1,1),i=l.scale||1,r=m;if(n.width=e*i,n.height=t*i,(m=n.getContext("2d")).scale(i,i),a.push){let e=0,t=0;for(let l of(m.imageSmoothingEnabled=!1,a)){for(let a of l)" "!==a&&"."!==a&&C.rectfill(e,t,1,1,parseInt(a,16)),e++;t++,e=0}}else a(m);return m=r,n},ctx:e=>(e&&(m=e),m),push:()=>m.save(),pop:()=>m.restore(),translate:(e,t)=>m.translate(~~e,~~t),scale:(e,t)=>m.scale(e,t||e),rotate:e=>m.rotate(e),transform:(e,t,a,l,n,i,r=!0)=>m[r?"setTransform":"transform"](e,t,a,l,n,i),alpha(e){m.globalAlpha=C.clamp(e,0,1)},path:e=>new Path2D(e),fill(e,t){m.fillStyle=C.getcolor(e),t?m.fill(t):m.fill()},stroke(e,t){m.strokeStyle=C.getcolor(e),t?m.stroke(t):m.stroke()},clip(e){m.clip(e)},sfx:(e,a=0,n=1)=>!(l.zzfxV<=0)&&(!navigator.userActivation||!!navigator.userActivation.hasBeenActive)&&(e=e||C.DEFAULT_SFX,(a>0||1!==n)&&((e=e.slice())[0]=n*(e[0]||1),e[10]=~~e[10]+a),t.apply(0,e),e),volume(e){l.zzfxV=+e},colrect:(e,t,a,l,n,i,r,o)=>e<n+r&&e+a>n&&t<i+o&&t+l>i,colcirc:(e,t,a,l,n,i)=>(l-e)**2+(n-t)**2<=(a+i)**2,use(e,t={}){c?z(e,t):f.push([e,t])},listen:(e,t)=>(A[e]=A[e]||new Set,A[e].add(t),()=>A[e].delete(t)),emit(e,t,a,l,n){W("before:"+e,t,a,l,n),W(e,t,a,l,n),W("after:"+e,t,a,l,n)},getcolor:e=>a[~~e%a.length],setvar(e,t){C[e]=t,S&&(l[e]=t)},resize(e,t){C.setvar("WIDTH",u.width=e),C.setvar("HEIGHT",u.height=t||e),O()},timescale(e){v=e},setfps(e){x=1e3*(T=1/e),b=0},quit(){for(let e of(w=A=!1,o))e();if(S){for(let e in C)delete l[e];delete l.__litecanvas}}};for(let e of["sin","cos","atan2","hypot","tan","abs","ceil","round","floor","trunc","min","max","pow","sqrt","sign","exp"])C[e]=Math[e];function L(){c=!0;let t=e.loop?e.loop:l;for(let e in A)t[e]&&C.listen(e,t[e]);for(let[e,t]of f)z(e,t);if((p||d)&&s(l,"resize",O),O(),e.tapEvents){let e=(e,t)=>[(e-u.offsetLeft)/h,(t-u.offsetTop)/h],t=new Map,a=(e,a,l)=>{let n={x:a,y:l,startX:a,startY:l,ts:performance.now()};return t.set(e,n),n},n=(e,l,n)=>{let i=t.get(e)||a(e);i.x=l,i.y=n},i=e=>e&&performance.now()-e.ts<=200,r=!1;s(u,"mousedown",t=>{t.preventDefault();let[l,n]=e(t.pageX,t.pageY);C.emit("tap",l,n,0),a(0,l,n),r=!0}),s(u,"mousemove",t=>{t.preventDefault();let[a,l]=e(t.pageX,t.pageY);C.setvar("MOUSEX",a),C.setvar("MOUSEY",l),r&&(C.emit("tapping",a,l,0),n(0,a,l))}),s(u,"mouseup",a=>{a.preventDefault();let l=t.get(0),[n,o]=e(a.pageX,a.pageY);i(l)&&C.emit("tapped",l.startX,l.startY,0),C.emit("untap",n,o,0),t.delete(0),r=!1}),s(u,"touchstart",t=>{for(let l of(t.preventDefault(),t.changedTouches)){let[t,n]=e(l.pageX,l.pageY);C.emit("tap",t,n,l.identifier+1),a(l.identifier+1,t,n)}}),s(u,"touchmove",t=>{for(let a of(t.preventDefault(),t.changedTouches)){let[t,l]=e(a.pageX,a.pageY);C.emit("tapping",t,l,a.identifier+1),n(a.identifier+1,t,l)}});let o=e=>{e.preventDefault();let a=[];if(e.targetTouches.length>0)for(let t of e.targetTouches)a.push(t.identifier+1);for(let[e,l]of t)a.includes(e)||(i(l)&&C.emit("tapped",l.startX,l.startY,e),C.emit("untap",l.x,l.y,e),t.delete(e))};s(u,"touchend",o),s(u,"touchcancel",o),s(l,"blur",()=>{for(let[e,a]of(r=!1,t))C.emit("untap",a.x,a.y,e),t.delete(e)})}if(e.keyboardEvents){let e=new Set;C.setvar("iskeydown",t=>"any"===t?e.size>0:e.has(t.toLowerCase())),s(l,"keydown",t=>{e.add(t.key.toLowerCase())}),s(l,"keyup",t=>{e.delete(t.key.toLowerCase())}),s(l,"blur",()=>e.clear())}e.pauseOnBlur&&(s(l,"blur",()=>{w=!1}),s(l,"focus",()=>{E=performance.now(),w=!0,r(X)})),C.setfps(e.fps),C.emit("init",C),E=performance.now(),r(X)}function X(e){let t=!g,a=e-E;for(b+=a>1e3?x:a;b>=x;)C.emit("update",T*v),C.setvar("ELAPSED",C.ELAPSED+T*v),b-=x,t=1;t&&(C.textalign("start","top"),C.emit("draw")),E=e,w&&g&&r(X)}function O(){let t=l.innerWidth,a=l.innerHeight,n=u.style;n.display="block",p?(n.position="absolute",n.inset=0,C.setvar("WIDTH",u.width=t),C.setvar("HEIGHT",u.height=a)):d&&(n.margin="auto",h=Math.min(t/C.WIDTH,a/C.HEIGHT),h=(e.pixelart?~~h:h)||1,n.width=C.WIDTH*h+"px",n.height=C.HEIGHT*h+"px"),C.setvar("CENTERX",C.WIDTH/2),C.setvar("CENTERY",C.HEIGHT/2),(!e.antialias||e.pixelart)&&(m.imageSmoothingEnabled=!1,u.style.imageRendering="pixelated"),C.emit("resized",h),g||r(X)}function W(e,t,a,l,n){if(A[e])for(let i of A[e])i(t,a,l,n)}function z(e,t){let a=e(C,k,t);if("object"==typeof a)for(let e of Object.keys(a))C.setvar(e,a[e])}if(S){if(l.__litecanvas)throw"global litecanvas already instantiated";Object.assign(l,C),l.__litecanvas=C}return u="string"==typeof u?document.querySelector(u):u,C.setvar("CANVAS",u),m=u.getContext("2d"),s(u,"click",()=>l.focus()),C.WIDTH>0&&(p=!1),u.style="",u.width=C.WIDTH,u.height=C.HEIGHT||C.WIDTH,u.parentNode||document.body.appendChild(u),"loading"===document.readyState?s(l,"DOMContentLoaded",()=>r(L)):r(L),C}})();
+(()=>{var e=new AudioContext,t=(t=1,a=.05,l=220,n=0,i=0,r=.1,o=0,s=1,c=0,f=0,u=0,p=0,d=0,g=0,h=0,m=0,v=0,E=1,T=0,x=0,b=0)=>{let w=Math,H=2*w.PI,D=c*=500*H/44100/44100,y=l*=(1-a+2*a*w.random(a=[]))*H/44100,I=0,S=0,A=0,k=1,C=0,L=0,X=0,O=b<0?-1:1,W=H*O*b*2/44100,z=w.cos(W),M=w.sin,P=M(W)/4,Y=1+P,B=-2*z/Y,F=(1-P)/Y,G=(1+O*z)/2/Y,_=-(O+z)/Y,R=0,N=0,U=0,$=0;for(n=44100*n+9,T*=44100,i*=44100,r*=44100,v*=44100,f*=500*H/85766121e6,h*=H/44100,u*=H/44100,p*=44100,d=44100*d|0,t*=.3*(globalThis.zzfxV||1),O=n+T+i+r+v|0;A<O;a[A++]=X*t)++L%(100*m|0)||(X=o?1<o?2<o?3<o?M(I*I):w.max(w.min(w.tan(I),1),-1):1-(2*I/H%2+2)%2:1-4*w.abs(w.round(I/H)-I/H):M(I),X=(d?1-x+x*M(H*A/d):1)*(X<0?-1:1)*w.abs(X)**s*(A<n?A/n:A<n+T?1-(A-n)/T*(1-E):A<n+T+i?E:A<O-v?(O-A-v)/r*E:0),X=v?X/2+(v>A?0:(A<O-v?1:(O-A)/v)*a[A-v|0]/2/t):X,b&&(X=$=G*R+_*(R=N)+G*(N=X)-F*U-B*(U=$))),I+=(W=(l+=c+=f)*w.cos(h*S++))+W*g*M(A**5),k&&++k>p&&(l+=u,y+=u,k=0),!d||++C%d||(l=y,c=D,k=k||1);(t=e.createBuffer(1,O,44100)).getChannelData(0).set(a),(l=e.createBufferSource()).buffer=t,l.connect(e.destination),l.start()},a=["#111","#6a7799","#aec2c2","#FFF1E8","#e83b3b","#fabc20","#155fd9","#3cbcfc","#327345","#63c64d","#6c2c1f","#ac7c00"];globalThis.litecanvas=function(e={}){let l=globalThis,n=Math.PI,i=2*n,r=requestAnimationFrame,o=[],s=(e,t,a)=>{e.addEventListener(t,a,!1),o.push(()=>e.removeEventListener(t,a,!1))};e=Object.assign({fps:60,fullscreen:!0,width:null,height:null,autoscale:!0,pixelart:!1,antialias:!1,canvas:null,global:!0,loop:null,pauseOnBlur:!0,tapEvents:!0,keyboardEvents:!0,animate:!0},e);let c=!1,f=[],u=e.canvas||document.createElement("canvas"),p=e.fullscreen,d=e.autoscale,g=e.animate,h=1,m,v=1,E,T,x,b=0,w=!0,H="sans-serif",D="",y=32,I=Date.now(),S=e.global,A={init:null,update:null,draw:null,resized:null,tap:null,untap:null,tapping:null,tapped:null},k={settings:Object.assign({},e),colors:a},C={WIDTH:e.width,HEIGHT:e.height||e.width,CANVAS:null,ELAPSED:0,CENTERX:0,CENTERY:0,MOUSEX:-1,MOUSEY:-1,DEFAULT_SFX:[.5,,1675,,.06,.2,1,1.8,,,637,.06],PI:n,TWO_PI:i,HALF_PI:.5*n,lerp:(e,t,a)=>e+a*(t-e),deg2rad:e=>n/180*e,rad2deg:e=>180/n*e,clamp:(e,t,a)=>e<t?t:e>a?a:e,wrap:(e,t,a)=>e-(a-t)*Math.floor((e-t)/(a-t)),map(e,t,a,l,n,i){let r=(e-t)/(a-t)*(n-l)+l;return i?C.clamp(r,l,n):r},norm:(e,t,a)=>C.map(e,t,a,0,1),rand:(e=0,t=1)=>(I=(1664525*I+0x3c6ef35f)%0x100000000)/0x100000000*(t-e)+e,randi:(e=0,t=1)=>Math.floor(C.rand(e,t+1)),seed:e=>null==e?I:I=~~e,cls(e){null==e?m.clearRect(0,0,C.WIDTH,C.HEIGHT):C.rectfill(0,0,C.WIDTH,C.HEIGHT,e)},rect(e,t,a,l,n=0,i=null){m.beginPath(),m[i?"roundRect":"rect"](~~e,~~t,a,l,i),C.stroke(n)},rectfill(e,t,a,l,n=0,i=null){m.beginPath(),m[i?"roundRect":"rect"](~~e,~~t,a,l,i),C.fill(n)},circ(e,t,a,l){m.beginPath(),m.arc(~~e,~~t,a,0,i),C.stroke(l)},circfill(e,t,a,l){m.beginPath(),m.arc(~~e,~~t,a,0,i),C.fill(l)},line(e,t,a,l,n){m.beginPath(),m.moveTo(~~e,~~t),m.lineTo(~~a,~~l),C.stroke(n)},linewidth(e){m.lineWidth=e},linedash(e,t=0){m.setLineDash(e),m.lineDashOffset=t},text(e,t,a,l=3){m.font=`${D} ${y}px ${H}`,m.fillStyle=C.getcolor(l),m.fillText(a,~~e,~~t)},textfont(e){H=e},textsize(e){y=e},textstyle(e){D=e||""},textalign(e,t){e&&(m.textAlign=e),t&&(m.textBaseline=t)},textmetrics(e,t=y){m.font=`${D} ${t}px ${H}`;let a=m.measureText(e);return a.height=a.actualBoundingBoxAscent+a.actualBoundingBoxDescent,a},image(e,t,a){m.drawImage(a,~~e,~~t)},paint(e,t,a,l={}){let n=l.canvas||new OffscreenCanvas(1,1),i=l.scale||1,r=m;if(n.width=e*i,n.height=t*i,(m=n.getContext("2d")).scale(i,i),a.push){let e=0,t=0;for(let l of(m.imageSmoothingEnabled=!1,a)){for(let a of l)" "!==a&&"."!==a&&C.rectfill(e,t,1,1,parseInt(a,16)),e++;t++,e=0}}else a(m);return m=r,n},ctx:e=>(e&&(m=e),m),push:()=>m.save(),pop:()=>m.restore(),translate:(e,t)=>m.translate(~~e,~~t),scale:(e,t)=>m.scale(e,t||e),rotate:e=>m.rotate(e),transform:(e,t,a,l,n,i,r=!0)=>m[r?"setTransform":"transform"](e,t,a,l,n,i),alpha(e){m.globalAlpha=C.clamp(e,0,1)},path:e=>new Path2D(e),fill(e,t){m.fillStyle=C.getcolor(e),t?m.fill(t):m.fill()},stroke(e,t){m.strokeStyle=C.getcolor(e),t?m.stroke(t):m.stroke()},clip(e){m.clip(e)},sfx:(e,a=0,n=1)=>!(l.zzfxV<=0)&&(!navigator.userActivation||!!navigator.userActivation.hasBeenActive)&&(e=e||C.DEFAULT_SFX,(a>0||1!==n)&&((e=e.slice())[0]=n*(e[0]||1),e[10]=~~e[10]+a),t.apply(0,e),e),volume(e){l.zzfxV=+e},colrect:(e,t,a,l,n,i,r,o)=>e<n+r&&e+a>n&&t<i+o&&t+l>i,colcirc:(e,t,a,l,n,i)=>(l-e)**2+(n-t)**2<=(a+i)**2,use(e,t={}){c?z(e,t):f.push([e,t])},listen:(e,t)=>(A[e]=A[e]||new Set,A[e].add(t),()=>A[e].delete(t)),emit(e,t,a,l,n){W("before:"+e,t,a,l,n),W(e,t,a,l,n),W("after:"+e,t,a,l,n)},getcolor:e=>a[~~e%a.length],setvar(e,t){C[e]=t,S&&(l[e]=t)},resize(e,t){C.setvar("WIDTH",u.width=e),C.setvar("HEIGHT",u.height=t||e),O()},timescale(e){v=e},setfps(e){x=1e3*(T=1/e),b=0},quit(){for(let e of(C.emit("quit"),o))e();if(w=A=!1,S){for(let e in C)delete l[e];delete l.__litecanvas}}};for(let e of["sin","cos","atan2","hypot","tan","abs","ceil","round","floor","trunc","min","max","pow","sqrt","sign","exp"])C[e]=Math[e];function L(){c=!0;let t=e.loop?e.loop:l;for(let e in A)t[e]&&C.listen(e,t[e]);for(let[e,t]of f)z(e,t);if((p||d)&&s(l,"resize",O),O(),e.tapEvents){let e=(e,t)=>[(e-u.offsetLeft)/h,(t-u.offsetTop)/h],t=new Map,a=(e,a,l)=>{let n={x:a,y:l,startX:a,startY:l,ts:performance.now()};return t.set(e,n),n},n=(e,l,n)=>{let i=t.get(e)||a(e);i.x=l,i.y=n},i=e=>e&&performance.now()-e.ts<=200,r=!1;s(u,"mousedown",t=>{t.preventDefault();let[l,n]=e(t.pageX,t.pageY);C.emit("tap",l,n,0),a(0,l,n),r=!0}),s(u,"mousemove",t=>{t.preventDefault();let[a,l]=e(t.pageX,t.pageY);C.setvar("MOUSEX",a),C.setvar("MOUSEY",l),r&&(C.emit("tapping",a,l,0),n(0,a,l))}),s(u,"mouseup",a=>{a.preventDefault();let l=t.get(0),[n,o]=e(a.pageX,a.pageY);i(l)&&C.emit("tapped",l.startX,l.startY,0),C.emit("untap",n,o,0),t.delete(0),r=!1}),s(u,"touchstart",t=>{for(let l of(t.preventDefault(),t.changedTouches)){let[t,n]=e(l.pageX,l.pageY);C.emit("tap",t,n,l.identifier+1),a(l.identifier+1,t,n)}}),s(u,"touchmove",t=>{for(let a of(t.preventDefault(),t.changedTouches)){let[t,l]=e(a.pageX,a.pageY);C.emit("tapping",t,l,a.identifier+1),n(a.identifier+1,t,l)}});let o=e=>{e.preventDefault();let a=[];if(e.targetTouches.length>0)for(let t of e.targetTouches)a.push(t.identifier+1);for(let[e,l]of t)a.includes(e)||(i(l)&&C.emit("tapped",l.startX,l.startY,e),C.emit("untap",l.x,l.y,e),t.delete(e))};s(u,"touchend",o),s(u,"touchcancel",o),s(l,"blur",()=>{for(let[e,a]of(r=!1,t))C.emit("untap",a.x,a.y,e),t.delete(e)})}if(e.keyboardEvents){let e=new Set;C.setvar("iskeydown",t=>"any"===t?e.size>0:e.has(t.toLowerCase())),s(l,"keydown",t=>{e.add(t.key.toLowerCase())}),s(l,"keyup",t=>{e.delete(t.key.toLowerCase())}),s(l,"blur",()=>e.clear())}e.pauseOnBlur&&(s(l,"blur",()=>{w=!1}),s(l,"focus",()=>{w=!0,r(X)})),C.setfps(e.fps),C.emit("init",C),E=performance.now(),r(X)}function X(e){let t=!g,a=e-E;for(b+=a>100?x:a,E=e;b>=x;)C.emit("update",T*v),C.setvar("ELAPSED",C.ELAPSED+T*v),b-=x,t=!0;t&&(C.textalign("start","top"),C.emit("draw")),w&&g&&r(X)}function O(){let t=l.innerWidth,a=l.innerHeight,n=u.style;n.display="block",p?(n.position="absolute",n.inset=0,C.setvar("WIDTH",u.width=t),C.setvar("HEIGHT",u.height=a)):d&&(n.margin="auto",h=Math.min(t/C.WIDTH,a/C.HEIGHT),h=(e.pixelart?~~h:h)||1,n.width=C.WIDTH*h+"px",n.height=C.HEIGHT*h+"px"),C.setvar("CENTERX",C.WIDTH/2),C.setvar("CENTERY",C.HEIGHT/2),(!e.antialias||e.pixelart)&&(m.imageSmoothingEnabled=!1,u.style.imageRendering="pixelated"),C.emit("resized",h),g||r(X)}function W(e,t,a,l,n){if(A[e])for(let i of A[e])i(t,a,l,n)}function z(e,t){let a=e(C,k,t);if("object"==typeof a)for(let e of Object.keys(a))C.setvar(e,a[e])}if(S){if(l.__litecanvas)throw"global litecanvas already instantiated";Object.assign(l,C),l.__litecanvas=C}return u="string"==typeof u?document.querySelector(u):u,C.setvar("CANVAS",u),m=u.getContext("2d"),s(u,"click",()=>l.focus()),C.WIDTH>0&&(p=!1),u.style="",u.width=C.WIDTH,u.height=C.HEIGHT||C.WIDTH,u.parentNode||document.body.appendChild(u),"loading"===document.readyState?s(l,"DOMContentLoaded",()=>r(L)):r(L),C}})();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "litecanvas",
-    "version": "0.68.2",
+    "version": "0.69.1",
     "description": "Lightweight HTML5 canvas engine suitable for small games and animations.",
     "license": "MIT",
     "author": "Luiz Bills <luizbills@pm.me>",
@@ -25,7 +25,7 @@
     "scripts": {
         "test": "ava",
         "dev:test": "ava --watch",
-        "dev": "esbuild src/web.js --bundle --watch --outfile=dist/dist.js --servedir=.",
+        "dev": "esbuild src/index.js --bundle --watch --outfile=dist/dist.js --servedir=.",
         "build": "node script/build.js",
         "gzip-size": "gzip -c dist/dist.min.js | wc -c | xargs printf \"  Gzip size: %s bytes\n\"",
         "format": "prettier -w src/* samples/* types/* script/* types/*",

package/src/index.js

@@ -2,6 +2,8 @@ import { zzfx } from './zzfx.js'
 import { colors } from './palette.js'
 import './types.js'
 
+globalThis.litecanvas = litecanvas
+
 /**
  * The litecanvas constructor
  *
@@ -835,10 +837,11 @@ export default function litecanvas(settings = {}) {
          * Stops the litecanvas instance and remove all event listeners.
          */
         quit() {
-            _focused = _events = false
+            instance.emit('quit')
             for (const removeListener of _browserEventListeners) {
                 removeListener()
             }
+            _focused = _events = false
             if (_global) {
                 for (const key in instance) {
                     delete root[key]
@@ -1043,7 +1046,6 @@ export default function litecanvas(settings = {}) {
             })
 
             on(root, 'focus', () => {
-                _lastFrame = performance.now()
                 _focused = true
                 raf(drawFrame)
             })
@@ -1062,25 +1064,24 @@ export default function litecanvas(settings = {}) {
      * @param {number} now
      */
     function drawFrame(now) {
-        let emitDraw = !_animated,
+        let shouldRender = !_animated,
             delta = now - _lastFrame
 
-        _accumulated += delta > 1000 ? _stepMs : delta
+        _accumulated += delta > 100 ? _stepMs : delta
+        _lastFrame = now
 
         while (_accumulated >= _stepMs) {
             instance.emit('update', _step * _timeScale)
             instance.setvar('ELAPSED', instance.ELAPSED + _step * _timeScale)
             _accumulated -= _stepMs
-            emitDraw = 1
+            shouldRender = true
         }
 
-        if (emitDraw) {
+        if (shouldRender) {
             instance.textalign('start', 'top') // default values for textAlign & textBaseline
             instance.emit('draw')
         }
 
-        _lastFrame = now
-
         if (_focused && _animated) {
             raf(drawFrame)
         }

package/src/web.js

@@ -1,3 +0,0 @@
-import litecanvas from './index.js'
-
-globalThis.litecanvas = litecanvas