diff --git a/package-lock.json b/package-lock.json
index 41a0c59..4753e82 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -523,9 +523,9 @@
       }
     },
     "node_modules/@litecanvas/litecanvas": {
-      "version": "0.29.0",
-      "resolved": "https://registry.npmjs.org/@litecanvas/litecanvas/-/litecanvas-0.29.0.tgz",
-      "integrity": "sha512-en+7YFnh/a5L1oLpHIkOPFMIBhePdFcHmr1jRP90w12lcgsaBhcIxK5xxeTCo2QHCByaZnsa1z32+Yr8Vy/q1A=="
+      "version": "0.30.0",
+      "resolved": "https://registry.npmjs.org/@litecanvas/litecanvas/-/litecanvas-0.30.0.tgz",
+      "integrity": "sha512-MEzOMquCPiOR5hUTkjzgUvvYnzLAlYYtCjVEgMZCgTp0+c61o9Z2eCBVmzZoJzfseEXdeQHLuHMfWdBRAv+tWQ=="
     },
     "node_modules/@litecanvas/plugin-asset-loader": {
       "version": "0.4.2",
diff --git a/public/about.html b/public/about.html
index 2e7c2d1..1bd9121 100644
--- a/public/about.html
+++ b/public/about.html
@@ -509,7 +509,11 @@ <h2><a id="plugin-api">Plugin API</a></h2>
 
 // add a game loop listener
 // returns a function that removes the listener
-listen(event: string, callback: function, highPriority = false): function</code></pre>
+listen(event: string, callback: function, highPriority = false): function
+
+// resizes the game canvas
+// also, emit the "resized" event
+resize(width: number, height: number): void</code></pre>
 
       <h2><a id="advanced">Advanced Features</a></h2>
 
diff --git a/public/app.js b/public/app.js
index 833ebc0..dd54ece 100644
--- a/public/app.js
+++ b/public/app.js
@@ -241,7 +241,7 @@ function draw () {
     <\/script>
     <script>${e}<\/script>
   </body>
-</html>`}function $O(r){let e=r.matchBefore(/\w*/);return e.from==e.to&&!r.explicit?null:{from:e.from,options:[{label:"CANVAS",type:"constant",info:"game canvas HTML element"},{label:"WIDTH",type:"variable",info:"width of the game screen"},{label:"HEIGHT",type:"variable",info:"height of the game screen"},{label:"TAPPED",type:"variable",info:"true when the game screen is tapped"},{label:"TAPPING",type:"variable",info:"true when the game screen is holding the mouse/touch"},{label:"TAPX",type:"variable",info:"position X of the tap"},{label:"TAPY",type:"variable",info:"position Y of the tap"},{label:"ELAPSED",type:"variable",info:"seconds since the game started"},{label:"FPS",type:"variable",info:"frames per second"},{label:"DT",type:"variable",info:"The fixed delta time"},{label:"CENTERX",type:"variable",info:"middle X of the game screen"},{label:"CENTERY",type:"variable",info:"middle Y of the game screen"},{label:"PI",type:"constant"},{label:"TWO_PI",type:"constant"},{label:"HALF_PI",type:"constant"},{label:"clear",type:"function",apply:"clear(",detail:"(color = null)",info:"clear the game screen"},{label:"cls",type:"function",apply:"cls(",detail:"(color = null)",info:"clear the game screen"},{label:"rect",type:"function",apply:"rect(",detail:"(x, y, width, height, color = 0)"},{label:"rectfill",type:"function",apply:"rectfill(",detail:"(x, y, width, height, color = 0)"},{label:"circ",type:"function",apply:"circ(",detail:"(x, y, radius, color = 0)"},{label:"circfill",type:"function",apply:"circfill(",detail:"(x, y, radius, color = 0)"},{label:"line",type:"function",apply:"line(",detail:"(x1, y1, x2, y2, color = 0)"},{label:"linewidth",type:"function",apply:"linewidth(",detail:"(value)"},{label:"linecap",type:"function",apply:"linecap(",detail:"(value)"},{label:"linedash",type:"function",apply:"linedash(",detail:"(pattern, ofsset)"},{label:"linejoin",type:"function",apply:"linejoin(",detail:"(value)"},{label:"text",type:"function",apply:"text(",detail:"(x, y, text, color = 3)"},{label:"print",type:"function",apply:"print(",detail:"(x, y, text, color = 3)"},{label:"textfont",type:"function",apply:"textfont(",detail:"(fontName)",info:"default font: 'sans-serif'"},{label:"textsize",type:"function",apply:"textsize(",detail:"(size)",info:"default font size: 32"},{label:"textalign",type:"function",apply:"textalign(",detail:"(align, baseline)"},{label:"textstyle",type:"function",apply:"textstyle(",detail:"(style)"},{label:"textmetrics",type:"function",apply:"textmetrics(",detail:"(text, [size])"},{label:"image",type:"function",apply:"image(",detail:"(x, y, image)"},{label:"paint",type:"function",apply:"paint(",detail:"(width, height, callback|array, options)",info:"Creates a offscreen canvas to draw on it"},{label:"transform",type:"function",apply:"transform(",detail:"(a, b, c, d, e, f, reset = true)"},{label:"translate",type:"function",apply:"translate(",detail:"(x, y)"},{label:"scale",type:"function",apply:"scale(",detail:"(x, y)"},{label:"rotate",type:"function",apply:"rotate(",detail:"(radians)"},{label:"blendmode",type:"function",apply:"blendmode(",detail:"(mode)",info:"sets the type of compositing operation to apply when drawing new shapes"},{label:"filter",type:"function",apply:"filter(",detail:"(effect)"},{label:"push",type:"function",apply:"push()",detail:"",info:"save the rendering context"},{label:"pop",type:"function",apply:"pop()",detail:"",info:"restore the rendering context"},{label:"ctx",type:"function",apply:"ctx()"},{label:"cliprect",type:"function",apply:"cliprect(",detail:"(x, y, width, height)",info:"create a rectagular clipping region"},{label:"clipcirc",type:"function",apply:"clipcirc(",detail:"(x, y, radius)",info:"create a circular clipping region"},{label:"sfx",type:"function",apply:"sfx(0)",detail:"(sound:number|Array, volume = 1, pitch = 0, randomness = 0)",info:"play a sound"},{label:"rand",type:"function",apply:"rand()",detail:"(min = 0.0, max = 1.0)",info:"get a pseudo-random float between min (inclusive) and max (exclusive)"},{label:"randi",type:"function",apply:"randi()",detail:"(min = 0, max = 1)",info:"get a pseudo-random integer between min (inclusive) and max (inclusive)"},{label:"map",type:"function",apply:"map(",detail:"(val, l1, h1, l2, h2, withinBounds=false)"},{label:"norm",type:"function",apply:"norm(",detail:"(val, start, stop)"},{label:"diff",type:"function",apply:"diff(",detail:"(a, b)"},{label:"clamp",type:"function",apply:"clamp(",detail:"(value, min, max)"},{label:"lerp",type:"function",apply:"lerp(",detail:"(start, end, t)",info:"linear interpolation from `start` to `end` over `t`%."},{label:"chance",type:"function",apply:"chance(",detail:"(p)"},{label:"deg2rad",type:"function",apply:"deg2rad(",detail:"(degrees)"},{label:"rad2deg",type:"function",apply:"rad2deg(",detail:"(radians)"},{label:"sin",type:"function",apply:"sin(",detail:"(radians)"},{label:"cos",type:"function",apply:"cos(",detail:"(radians)"},{label:"tan",type:"function",apply:"tan(",detail:"(radians)"},{label:"abs",type:"function",apply:"abs(",detail:"(value)"},{label:"ceil",type:"function",apply:"ceil(",detail:"(value)"},{label:"round",type:"function",apply:"round(",detail:"(value)"},{label:"floor",type:"function",apply:"floor(",detail:"(value)"},{label:"trunc",type:"function",apply:"trunc(",detail:"(value)"},{label:"fract",type:"function",apply:"fract(",detail:"(value)"},{label:"wave",type:"function",apply:"wave(",detail:"(lower, higher, t, fn = math.sin)"},{label:"min",type:"function",apply:"min(",detail:"(...values)"},{label:"max",type:"function",apply:"max(",detail:"(...values)"},{label:"pow",type:"function",apply:"pow(",detail:"(a, b)"},{label:"sqrt",type:"function",apply:"sqrt(",detail:"(value)"},{label:"sign",type:"function",apply:"sign(",detail:"(value)"},{label:"atan2",type:"function",apply:"atan2(",detail:"(y, x)"},{label:"hypot",type:"function",apply:"hypot(",detail:"(...values)"},{label:"exp",type:"function",apply:"exp(",detail:"(x)"},{label:"colrect",type:"function",apply:"colrect(",detail:"(x1, y1, w1, h1, x2, y2, w2, h2)",info:"Check collision between 2 rectangles"},{label:"colcirc",type:"function",apply:"colcirc(",detail:"(x1, y1, r1, x2, y2, r2)",info:"Check collision between 2 circles"},{label:"use",type:"function",apply:"use(",detail:"(callback)",info:"Loads a plugin to extend the litecanvas engine"},{label:"setvar",type:"function",apply:"setvar(",detail:"(name,value)"},{label:"getcolor",type:"function",apply:"getcolor(",detail:"(index)"},{label:"listen",type:"function",apply:"listen(",detail:"(event,callback,[highPriority])"},{label:"loadScript",type:"function",apply:"loadScript(",detail:"(url, callback)",info:"Load a JavaScript file"},{label:"loadImage",type:"function",apply:"loadImage(",detail:"(url, callback)",info:"Load a image"},{label:"loadFont",type:"function",apply:"loadFont(",detail:"(name, url, callback)",info:"Load a font"},{label:"LOADING",type:"variable",info:"return the amount of assets that are loading"}]}}function MO(r){let e=visualViewport;if(!e)return;let t=u(),s=document.querySelector(".editor .code"),n=0,i=[{name:"indent",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m5.25 4.5 7.5 7.5-7.5 7.5m6-15 7.5 7.5-7.5 7.5" /></svg>',callback:vu},{name:"toggle comment",label:"//",callback:rh},{name:"undo",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9 15 3 9m0 0 6-6M3 9h12a6 6 0 0 1 0 12h-3" /></svg>',callback:mu},{name:"redo",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m15 15 6-6m0 0-6-6m6 6H9a6 6 0 0 0 0 12h3" /></svg>',callback:Co}],a=document.createElement("div");a.classList.add("mobile-buttons"),a.style.display="none";for(let h of i){let f=document.createElement("button"),d=h.focus==null?!0:h.focus;f.innerHTML=h.label,f.setAttribute("title",h.name),f.setAttribute("aria-label",h.name),f.setAttribute("data-focus",d?"true":"false"),f.addEventListener("click",m=>{m.preventDefault(),h.callback(r),d&&r.contentDOM.focus()}),a.appendChild(f)}s.appendChild(a),requestAnimationFrame(o);function l(){n&&cancelAnimationFrame(n),n=requestAnimationFrame(o)}e.addEventListener("resize",l),e.addEventListener("scroll",l);function o(){n=!1;let h=a.getBoundingClientRect(),f=e.offsetLeft,d=e.height+e.offsetTop-h.height;a.style.transform=`translate(${f}px, ${d}px)`,console.log(~~e.height),console.log(~~t.height),console.log(Math.abs(~~e.height-~~t.height)),Math.abs(e.height-t.height)>100?p():c()}r.contentDOM.addEventListener("click",()=>{p()}),r.contentDOM.addEventListener("focus",()=>{p()});function u(){return{width:document.documentElement.clientWidth,height:document.documentElement.clientHeight}}function c(){console.log("hide"),a.style.display="none"}function p(){console.log("show"),a.style.display=""}}var Sa={autosave:!0,autosaveInterval:5e3,codeChanged:!1},wc=new URL(location.href);wc.searchParams.get("reset")!==null&&(hX(),window.location=location.origin);var iX=wc.searchParams.get("autoplay")!=0,Go=wc.searchParams.get("c");Go!==null&&(Go=fX(Go),Go&&(Sa.autosave=!1,Xn("#changing-shared-code").style.display=""));document.addEventListener("visibilitychange",function(){document.visibilityState==="hidden"&&Sa.autosave&&vN()});window.addEventListener("beforeunload",r=>{Sa.autosave||(r.preventDefault(),r.returnValue=!0)});var mN=[],gN=Xn(".code"),qO=Xn(".game"),Ec=Xn("#play"),QO=Xn("#stop"),aX=Xn("#share"),oX=Xn("#copy"),yN=Xn("#frame"),UO=innerWidth<1024,lX=navigator.userAgent.match(/android|iphone|ipad/i)!==null,jO=null;fetch("litecanvas.js").then(r=>r.text()).then(r=>{jO=r,UO?(xa(Ec),Oa(qO)):iX&&Cc()});Ec.addEventListener("click",()=>{Oa(gN),xa(qO),Oa(Ec),xa(QO),Cc()});QO.addEventListener("click",bN);document.addEventListener("backbutton",bN);function bN(r){r.preventDefault(),xa(gN),Oa(qO),xa(Ec),Oa(QO),yN.srcdoc=""}aX.addEventListener("click",r=>{if(!navigator.clipboard)return alert("Your browser not support this feature. Consider installing Firefox or Chrome.");let e=codeEditor.state.doc.toString(),t=location.origin+"?c="+encodeURIComponent(cX(e));if(t.length>2048)return alert("Code too long to encode in URL");navigator.clipboard.writeText(t).then(()=>{alert("Your shareable url was copied to clipboard!")},s=>{alert("Error: Unable to generate your shareable url!"),console.error("Error on copying text to clipboard:",s)})});oX.addEventListener("click",r=>{if(!navigator.clipboard)return alert("Your browser not support this feature. Consider installing Firefox or Chrome.");let e=codeEditor.state.doc.toString();navigator.clipboard.writeText(e).then(()=>{},t=>{alert("Error: Unable to generate your shareable url!"),console.error("Error on copying text to clipboard:",t)})});function Cc(){if(!jO)return alert("The library  was not loaded. Try reloading the page.");let r=codeEditor.state.doc.toString();yN.srcdoc=LO(jO,r)}if(!UO){let t=function(s){s.docChanged&&(r&&(clearTimeout(r),r=0),r=setTimeout(Cc,e))},r=0,e=1e3;mN.push(at.updateListener.of(t))}var uX=Ut.create({doc:Go||pX()||dN(),extensions:[hN(),As.of([GC,{key:"Ctrl-s",run(){return Cc(),!0}}]),pA,iA(),$k(),Ik(aA(new pN,{languageOptions:{ecmaVersion:"latest",sourceType:"script"},rules:{}})),Vn.data.of({autocomplete:$O}),at.theme({"&":{height:"100%",fontSize:UO?"16px":"18px"},".cm-scroller":{overflow:"auto"}}),at.lineWrapping,at.updateListener.of(r=>{r.docChanged&&(Sa.codeChanged=!0)}),...mN]});window.codeEditor=new at({state:uX,parent:Xn(".code .cm-container")});function cX(r){return btoa(String.fromCharCode.apply(null,Array.from(sf.deflate(r))))}function fX(r){let e=null,t=0;for(;t<2;)try{t===1&&(r=decodeURIComponent(r),r=r.replace(/ /g,"+")),e=sf.inflate(new Uint8Array(atob(r).split("").map(s=>s.charCodeAt(0))),{to:"string"}),console.log("Playground url decoded successfully!");break}catch(s){console.error(`Failed decode the playground url (${t+1}/2). Error:`,s),console.log("Trying to decode again (fixing some characters)..."),e=null,t++}return e||alert("Invalid playground url."),e}Sa.autosave&&setInterval(()=>{document.visibilityState==="visible"&&vN()},Sa.autosaveInterval);function vN(){localStorage.setItem("litecanvas_code",codeEditor.state.doc.toString())}function pX(){return localStorage.getItem("litecanvas_code")}function hX(){localStorage.clear()}lX&&MO(codeEditor);window.isUpdateAvailable=new Promise(function(r){("serviceWorker"in navigator&&location.hostname.indexOf("127.0.0")===-1||wc.searchParams.get("test_service_worker")==="on")&&(navigator.serviceWorker.register("sw.js").then(e=>{e.onupdatefound=()=>{let t=e.installing;t.onstatechange=()=>{switch(t.state){case"installed":navigator.serviceWorker.controller?r(!0):r(!1);break}}}}).catch(e=>console.error("[SW ERROR]",e)),navigator.serviceWorker.ready.then(e=>{e.active.postMessage({type:"GET_VERSION"})}),navigator.serviceWorker.addEventListener("message",e=>{e.data.type==="GET_VERSION"&&console.log("litecanvas playground version:",e.data.res)}))});window.isUpdateAvailable.then(r=>{r&&alert("New Update available! Reload the webapp to see the latest changes.")});})();
+</html>`}function $O(r){let e=r.matchBefore(/\w*/);return e.from==e.to&&!r.explicit?null:{from:e.from,options:[{label:"CANVAS",type:"constant",info:"game canvas HTML element"},{label:"WIDTH",type:"variable",info:"width of the game screen"},{label:"HEIGHT",type:"variable",info:"height of the game screen"},{label:"TAPPED",type:"variable",info:"true when the game screen is tapped"},{label:"TAPPING",type:"variable",info:"true when the game screen is holding the mouse/touch"},{label:"TAPX",type:"variable",info:"position X of the tap"},{label:"TAPY",type:"variable",info:"position Y of the tap"},{label:"ELAPSED",type:"variable",info:"seconds since the game started"},{label:"FPS",type:"variable",info:"frames per second"},{label:"DT",type:"variable",info:"The fixed delta time"},{label:"CENTERX",type:"variable",info:"middle X of the game screen"},{label:"CENTERY",type:"variable",info:"middle Y of the game screen"},{label:"PI",type:"constant"},{label:"TWO_PI",type:"constant"},{label:"HALF_PI",type:"constant"},{label:"clear",type:"function",apply:"clear(",detail:"(color = null)",info:"clear the game screen"},{label:"cls",type:"function",apply:"cls(",detail:"(color = null)",info:"clear the game screen"},{label:"rect",type:"function",apply:"rect(",detail:"(x, y, width, height, color = 0)"},{label:"rectfill",type:"function",apply:"rectfill(",detail:"(x, y, width, height, color = 0)"},{label:"circ",type:"function",apply:"circ(",detail:"(x, y, radius, color = 0)"},{label:"circfill",type:"function",apply:"circfill(",detail:"(x, y, radius, color = 0)"},{label:"line",type:"function",apply:"line(",detail:"(x1, y1, x2, y2, color = 0)"},{label:"linewidth",type:"function",apply:"linewidth(",detail:"(value)"},{label:"linecap",type:"function",apply:"linecap(",detail:"(value)"},{label:"linedash",type:"function",apply:"linedash(",detail:"(pattern, ofsset)"},{label:"linejoin",type:"function",apply:"linejoin(",detail:"(value)"},{label:"text",type:"function",apply:"text(",detail:"(x, y, text, color = 3)"},{label:"print",type:"function",apply:"print(",detail:"(x, y, text, color = 3)"},{label:"textfont",type:"function",apply:"textfont(",detail:"(fontName)",info:"default font: 'sans-serif'"},{label:"textsize",type:"function",apply:"textsize(",detail:"(size)",info:"default font size: 32"},{label:"textalign",type:"function",apply:"textalign(",detail:"(align, baseline)"},{label:"textstyle",type:"function",apply:"textstyle(",detail:"(style)"},{label:"textmetrics",type:"function",apply:"textmetrics(",detail:"(text, [size])"},{label:"image",type:"function",apply:"image(",detail:"(x, y, image)"},{label:"paint",type:"function",apply:"paint(",detail:"(width, height, callback|array, options)",info:"Creates a offscreen canvas to draw on it"},{label:"transform",type:"function",apply:"transform(",detail:"(a, b, c, d, e, f, reset = true)"},{label:"translate",type:"function",apply:"translate(",detail:"(x, y)"},{label:"scale",type:"function",apply:"scale(",detail:"(x, y)"},{label:"rotate",type:"function",apply:"rotate(",detail:"(radians)"},{label:"blendmode",type:"function",apply:"blendmode(",detail:"(mode)",info:"sets the type of compositing operation to apply when drawing new shapes"},{label:"filter",type:"function",apply:"filter(",detail:"(effect)"},{label:"push",type:"function",apply:"push()",detail:"",info:"save the rendering context"},{label:"pop",type:"function",apply:"pop()",detail:"",info:"restore the rendering context"},{label:"ctx",type:"function",apply:"ctx()"},{label:"cliprect",type:"function",apply:"cliprect(",detail:"(x, y, width, height)",info:"create a rectagular clipping region"},{label:"clipcirc",type:"function",apply:"clipcirc(",detail:"(x, y, radius)",info:"create a circular clipping region"},{label:"sfx",type:"function",apply:"sfx(0)",detail:"(sound:number|Array, volume = 1, pitch = 0, randomness = 0)",info:"play a sound"},{label:"rand",type:"function",apply:"rand()",detail:"(min = 0.0, max = 1.0)",info:"get a pseudo-random float between min (inclusive) and max (exclusive)"},{label:"randi",type:"function",apply:"randi()",detail:"(min = 0, max = 1)",info:"get a pseudo-random integer between min (inclusive) and max (inclusive)"},{label:"map",type:"function",apply:"map(",detail:"(val, l1, h1, l2, h2, withinBounds=false)"},{label:"norm",type:"function",apply:"norm(",detail:"(val, start, stop)"},{label:"diff",type:"function",apply:"diff(",detail:"(a, b)"},{label:"clamp",type:"function",apply:"clamp(",detail:"(value, min, max)"},{label:"lerp",type:"function",apply:"lerp(",detail:"(start, end, t)",info:"linear interpolation from `start` to `end` over `t`%."},{label:"chance",type:"function",apply:"chance(",detail:"(p)"},{label:"deg2rad",type:"function",apply:"deg2rad(",detail:"(degrees)"},{label:"rad2deg",type:"function",apply:"rad2deg(",detail:"(radians)"},{label:"sin",type:"function",apply:"sin(",detail:"(radians)"},{label:"cos",type:"function",apply:"cos(",detail:"(radians)"},{label:"tan",type:"function",apply:"tan(",detail:"(radians)"},{label:"abs",type:"function",apply:"abs(",detail:"(value)"},{label:"ceil",type:"function",apply:"ceil(",detail:"(value)"},{label:"round",type:"function",apply:"round(",detail:"(value)"},{label:"floor",type:"function",apply:"floor(",detail:"(value)"},{label:"trunc",type:"function",apply:"trunc(",detail:"(value)"},{label:"fract",type:"function",apply:"fract(",detail:"(value)"},{label:"wave",type:"function",apply:"wave(",detail:"(lower, higher, t, fn = math.sin)"},{label:"min",type:"function",apply:"min(",detail:"(...values)"},{label:"max",type:"function",apply:"max(",detail:"(...values)"},{label:"pow",type:"function",apply:"pow(",detail:"(a, b)"},{label:"sqrt",type:"function",apply:"sqrt(",detail:"(value)"},{label:"sign",type:"function",apply:"sign(",detail:"(value)"},{label:"atan2",type:"function",apply:"atan2(",detail:"(y, x)"},{label:"hypot",type:"function",apply:"hypot(",detail:"(...values)"},{label:"exp",type:"function",apply:"exp(",detail:"(x)"},{label:"colrect",type:"function",apply:"colrect(",detail:"(x1, y1, w1, h1, x2, y2, w2, h2)",info:"Check collision between 2 rectangles"},{label:"colcirc",type:"function",apply:"colcirc(",detail:"(x1, y1, r1, x2, y2, r2)",info:"Check collision between 2 circles"},{label:"use",type:"function",apply:"use(",detail:"(callback)",info:"Loads a plugin to extend the litecanvas engine"},{label:"setvar",type:"function",apply:"setvar(",detail:"(name,value)"},{label:"getcolor",type:"function",apply:"getcolor(",detail:"(index)"},{label:"listen",type:"function",apply:"listen(",detail:"(event,callback,[highPriority])"},{label:"resize",type:"function",apply:"resize(",detail:"(width, height)",info:"resizes the game canvas"},{label:"loadScript",type:"function",apply:"loadScript(",detail:"(url, callback)",info:"Load a JavaScript file"},{label:"loadImage",type:"function",apply:"loadImage(",detail:"(url, callback)",info:"Load a image"},{label:"loadFont",type:"function",apply:"loadFont(",detail:"(name, url, callback)",info:"Load a font"},{label:"LOADING",type:"variable",info:"return the amount of assets that are loading"}]}}function MO(r){let e=visualViewport;if(!e)return;let t=u(),s=document.querySelector(".editor .code"),n=0,i=[{name:"indent",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m5.25 4.5 7.5 7.5-7.5 7.5m6-15 7.5 7.5-7.5 7.5" /></svg>',callback:vu},{name:"toggle comment",label:"//",callback:rh},{name:"undo",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9 15 3 9m0 0 6-6M3 9h12a6 6 0 0 1 0 12h-3" /></svg>',callback:mu},{name:"redo",label:'<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m15 15 6-6m0 0-6-6m6 6H9a6 6 0 0 0 0 12h3" /></svg>',callback:Co}],a=document.createElement("div");a.classList.add("mobile-buttons"),a.style.display="none";for(let h of i){let f=document.createElement("button"),d=h.focus==null?!0:h.focus;f.innerHTML=h.label,f.setAttribute("title",h.name),f.setAttribute("aria-label",h.name),f.setAttribute("data-focus",d?"true":"false"),f.addEventListener("click",m=>{m.preventDefault(),h.callback(r),d&&r.contentDOM.focus()}),a.appendChild(f)}s.appendChild(a),requestAnimationFrame(o);function l(){n&&cancelAnimationFrame(n),n=requestAnimationFrame(o)}e.addEventListener("resize",l),e.addEventListener("scroll",l);function o(){n=!1;let h=a.getBoundingClientRect(),f=e.offsetLeft,d=e.height+e.offsetTop-h.height;a.style.transform=`translate(${f}px, ${d}px)`,console.log(~~e.height),console.log(~~t.height),console.log(Math.abs(~~e.height-~~t.height)),Math.abs(e.height-t.height)>100?p():c()}r.contentDOM.addEventListener("click",()=>{p()}),r.contentDOM.addEventListener("focus",()=>{p()});function u(){return{width:document.documentElement.clientWidth,height:document.documentElement.clientHeight}}function c(){console.log("hide"),a.style.display="none"}function p(){console.log("show"),a.style.display=""}}var Sa={autosave:!0,autosaveInterval:5e3,codeChanged:!1},wc=new URL(location.href);wc.searchParams.get("reset")!==null&&(hX(),window.location=location.origin);var iX=wc.searchParams.get("autoplay")!=0,Go=wc.searchParams.get("c");Go!==null&&(Go=fX(Go),Go&&(Sa.autosave=!1,Xn("#changing-shared-code").style.display=""));document.addEventListener("visibilitychange",function(){document.visibilityState==="hidden"&&Sa.autosave&&vN()});window.addEventListener("beforeunload",r=>{Sa.autosave||(r.preventDefault(),r.returnValue=!0)});var mN=[],gN=Xn(".code"),qO=Xn(".game"),Ec=Xn("#play"),QO=Xn("#stop"),aX=Xn("#share"),oX=Xn("#copy"),yN=Xn("#frame"),UO=innerWidth<1024,lX=navigator.userAgent.match(/android|iphone|ipad/i)!==null,jO=null;fetch("litecanvas.js").then(r=>r.text()).then(r=>{jO=r,UO?(xa(Ec),Oa(qO)):iX&&Cc()});Ec.addEventListener("click",()=>{Oa(gN),xa(qO),Oa(Ec),xa(QO),Cc()});QO.addEventListener("click",bN);document.addEventListener("backbutton",bN);function bN(r){r.preventDefault(),xa(gN),Oa(qO),xa(Ec),Oa(QO),yN.srcdoc=""}aX.addEventListener("click",r=>{if(!navigator.clipboard)return alert("Your browser not support this feature. Consider installing Firefox or Chrome.");let e=codeEditor.state.doc.toString(),t=location.origin+"?c="+encodeURIComponent(cX(e));if(t.length>2048)return alert("Code too long to encode in URL");navigator.clipboard.writeText(t).then(()=>{alert("Your shareable url was copied to clipboard!")},s=>{alert("Error: Unable to generate your shareable url!"),console.error("Error on copying text to clipboard:",s)})});oX.addEventListener("click",r=>{if(!navigator.clipboard)return alert("Your browser not support this feature. Consider installing Firefox or Chrome.");let e=codeEditor.state.doc.toString();navigator.clipboard.writeText(e).then(()=>{},t=>{alert("Error: Unable to generate your shareable url!"),console.error("Error on copying text to clipboard:",t)})});function Cc(){if(!jO)return alert("The library  was not loaded. Try reloading the page.");let r=codeEditor.state.doc.toString();yN.srcdoc=LO(jO,r)}if(!UO){let t=function(s){s.docChanged&&(r&&(clearTimeout(r),r=0),r=setTimeout(Cc,e))},r=0,e=1e3;mN.push(at.updateListener.of(t))}var uX=Ut.create({doc:Go||pX()||dN(),extensions:[hN(),As.of([GC,{key:"Ctrl-s",run(){return Cc(),!0}}]),pA,iA(),$k(),Ik(aA(new pN,{languageOptions:{ecmaVersion:"latest",sourceType:"script"},rules:{}})),Vn.data.of({autocomplete:$O}),at.theme({"&":{height:"100%",fontSize:UO?"16px":"18px"},".cm-scroller":{overflow:"auto"}}),at.lineWrapping,at.updateListener.of(r=>{r.docChanged&&(Sa.codeChanged=!0)}),...mN]});window.codeEditor=new at({state:uX,parent:Xn(".code .cm-container")});function cX(r){return btoa(String.fromCharCode.apply(null,Array.from(sf.deflate(r))))}function fX(r){let e=null,t=0;for(;t<2;)try{t===1&&(r=decodeURIComponent(r),r=r.replace(/ /g,"+")),e=sf.inflate(new Uint8Array(atob(r).split("").map(s=>s.charCodeAt(0))),{to:"string"}),console.log("Playground url decoded successfully!");break}catch(s){console.error(`Failed decode the playground url (${t+1}/2). Error:`,s),console.log("Trying to decode again (fixing some characters)..."),e=null,t++}return e||alert("Invalid playground url."),e}Sa.autosave&&setInterval(()=>{document.visibilityState==="visible"&&vN()},Sa.autosaveInterval);function vN(){localStorage.setItem("litecanvas_code",codeEditor.state.doc.toString())}function pX(){return localStorage.getItem("litecanvas_code")}function hX(){localStorage.clear()}lX&&MO(codeEditor);window.isUpdateAvailable=new Promise(function(r){("serviceWorker"in navigator&&location.hostname.indexOf("127.0.0")===-1||wc.searchParams.get("test_service_worker")==="on")&&(navigator.serviceWorker.register("sw.js").then(e=>{e.onupdatefound=()=>{let t=e.installing;t.onstatechange=()=>{switch(t.state){case"installed":navigator.serviceWorker.controller?r(!0):r(!1);break}}}}).catch(e=>console.error("[SW ERROR]",e)),navigator.serviceWorker.ready.then(e=>{e.active.postMessage({type:"GET_VERSION"})}),navigator.serviceWorker.addEventListener("message",e=>{e.data.type==="GET_VERSION"&&console.log("litecanvas playground version:",e.data.res)}))});window.isUpdateAvailable.then(r=>{r&&alert("New Update available! Reload the webapp to see the latest changes.")});})();
 /*! Bundled license information:
 
 pako/dist/pako.esm.mjs:
diff --git a/public/litecanvas.js b/public/litecanvas.js
index cfa4262..6fdc1c0 100644
--- a/public/litecanvas.js
+++ b/public/litecanvas.js
@@ -492,10 +492,9 @@
           let x = 0, y = 0;
           _ctx.imageSmoothingEnabled = false;
           for (const str of draw) {
-            for (const color of str.split("")) {
+            for (const color of str) {
               if (" " !== color && "." !== color) {
-                const colorIndex = ~~parseInt(color, 16);
-                instance.rectfill(x, y, 1, 1, colorIndex);
+                instance.rectfill(x, y, 1, 1, parseInt(color, 16));
               }
               x++;
             }
@@ -725,6 +724,17 @@
         if (settings.global) {
           root[key] = value;
         }
+      },
+      /**
+       * Resizes the game canvas
+       *
+       * @param {number} width
+       * @param {number} height
+       */
+      resize(width, height) {
+        instance.setvar("WIDTH", _canvas.width = ~~width);
+        instance.setvar("HEIGHT", _canvas.height = ~~(height || width));
+        pageResized();
       }
     };
     Object.assign(instance, {
@@ -770,6 +780,8 @@
         };
         on(instance.CANVAS, _eventTapStart, function(ev) {
           ev.preventDefault();
+          if (!_rafid)
+            _resume();
           on(body, _eventTapMove, _tappingHandler);
           const [x, y] = [_tapStartX, _tapStartY] = _getXY(ev);
           updateTapping(true, x, y);
@@ -784,11 +796,13 @@
         });
       }
       on(root, "focus", () => {
-        if (!_rafid) {
-          _lastFrame = time();
-          _rafid = requestAnimationFrame(frame);
-        }
+        if (!_rafid)
+          _resume();
       });
+      function _resume() {
+        _lastFrame = time();
+        _rafid = requestAnimationFrame(frame);
+      }
       on(root, "blur", () => {
         cancelAnimationFrame(_rafid);
         _rafid = 0;
@@ -847,11 +861,11 @@
     function setupCanvas() {
       _canvas = "string" === typeof _canvas ? document.querySelector(_canvas) : _canvas;
       instance.setvar("CANVAS", _canvas);
+      _ctx = _canvas.getContext("2d");
       if (instance.WIDTH > 0)
         _fullscreen = false;
       _canvas.width = instance.WIDTH;
       _canvas.height = instance.HEIGHT || instance.WIDTH;
-      _ctx = _canvas.getContext("2d");
       if (!_canvas.parentNode)
         body.appendChild(_canvas);
       if (!settings.antialias || settings.pixelart) {
@@ -867,21 +881,19 @@
       }
     }
     function pageResized() {
-      if (_autoscale || _fullscreen) {
-        if (_fullscreen) {
-          _canvas.width = innerWidth;
-          _canvas.height = innerHeight;
-          instance.setvar("WIDTH", innerWidth);
-          instance.setvar("HEIGHT", innerHeight);
-        } else if (_autoscale) {
-          _scale = math.min(
-            innerWidth / instance.WIDTH,
-            innerHeight / instance.HEIGHT
-          );
-          _scale = settings.pixelart ? math.floor(_scale) : _scale;
-          _canvas.style.width = instance.WIDTH * _scale + "px";
-          _canvas.style.height = instance.HEIGHT * _scale + "px";
-        }
+      if (_fullscreen) {
+        _canvas.width = innerWidth;
+        _canvas.height = innerHeight;
+        instance.setvar("WIDTH", innerWidth);
+        instance.setvar("HEIGHT", innerHeight);
+      } else if (_autoscale) {
+        _scale = math.min(
+          innerWidth / instance.WIDTH,
+          innerHeight / instance.HEIGHT
+        );
+        _scale = settings.pixelart ? math.floor(_scale) : _scale;
+        _canvas.style.width = instance.WIDTH * _scale + "px";
+        _canvas.style.height = instance.HEIGHT * _scale + "px";
       }
       instance.setvar("CENTERX", instance.WIDTH / 2);
       instance.setvar("CENTERY", instance.HEIGHT / 2);
@@ -931,7 +943,7 @@
   }
   window.litecanvas = litecanvas;
 })();
-/*! litecanvas v0.29.0 | https://github.com/litecanvas/game-engine */
+/*! litecanvas v0.30.0 | https://github.com/litecanvas/game-engine */
 
 (()=>{var s=getScriptLoader=t=>(o,r)=>{t.setvar("LOADING",t.LOADING+1),script=document.createElement("script"),script.onload=()=>{r&&r(script),t.setvar("LOADING",t.LOADING-1)},script.onerror=()=>{r&&r(null)},script.src=o,document.head.appendChild(script)};var L=getImageLoader=t=>(o,r)=>{t.setvar("LOADING",t.LOADING+1);let d=new Image;d.onload=()=>{r&&r(d),t.setvar("LOADING",t.LOADING-1)},d.onerror=function(){r&&r(null)},d.src=o};var p=getFontLoader=t=>async(o,r,d)=>{let e=new FontFace(o,`url(${r})`);t.setvar("LOADING",t.LOADING+1),document.fonts.add(e),e.load().then(a=>{d&&d(a),t.setvar("LOADING",t.LOADING-1)}).catch(()=>{d&&d(null)})};window.pluginAssetLoader=u;function u(t,o){return t.setvar("LOADING",0),{loadScript:s(t,o),loadImage:L(t,o),loadFont:p(t,o)}}})();
 /*! Asset Loader plugin for litecanvas v0.4.2 by Luiz Bills | MIT Licensed */
diff --git a/public/sw.js b/public/sw.js
index 19f9238..c6f735c 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -1,5 +1,5 @@
 const cacheName = "luizbills.litecanvas-editor-v1";
-const version = "1.45.0";
+const version = "1.46.0";
 
 const precacheResources = [
   "/",
diff --git a/src/completions.js b/src/completions.js
index 249096e..56f8810 100644
--- a/src/completions.js
+++ b/src/completions.js
@@ -458,6 +458,13 @@ export default function customCompletions(context) {
         apply: "listen(",
         detail: "(event,callback,[highPriority])",
       },
+      {
+        label: "resize",
+        type: "function",
+        apply: "resize(",
+        detail: "(width, height)",
+        info: "resizes the game canvas",
+      },
 
       // asset loader plugin
       {