add loadSprite

src/gamelib.js

@@ -132,57 +132,42 @@ export class Gamelib {
         ev.preventDefault();
     }
 
-    #loadSprite(width, height, name) {
+    loadSprite(name, width, height) {
-        const spriteId = `${name}_${width}x${height}`;
+        return new Promise((resolve) => {
-        if (this.spriteCache.has(spriteId)) {
-            return this.spriteCache.get(spriteId);
-        }
-
-        // start by caching an empty canvas
             const sprite = new OffscreenCanvas(width, height);
-        this.spriteCache.set(spriteId, sprite);
 
             const image = new Image();
             image.src = this.assetProvider.url(name);
             image.onload = () => {
-            const sprite = this.spriteCache.get(spriteId);
                 const spriteCx = sprite.getContext("2d");
                 spriteCx.imageSmoothingEnabled = false;
                 spriteCx.drawImage(image, 0, 0, width, height);
 
-            const invalidatedKeys = this.spriteCache.keys()
+                resolve(sprite);
-                .filter((key) => key.startsWith(`${spriteId}r`));
-            for (const key of invalidatedKeys) {
-                this.spriteCache.delete(key);
-            }
             };
-
+        });
-        return sprite;
     }
 
-    drawSprite(x, y, width, height, name) {
+    drawSprite(x, y, sprite) {
         const cx = this.cx;
 
-        const sprite = this.#loadSprite(width, height, name);
         cx.drawImage(sprite, x, y);
     }
 
-    drawSpriteRotated(x, y, width, height, name, angle) {
+    drawSpriteRotated(x, y, sprite, angle) {
         const cx = this.cx;
 
         const angleIncrement = Math.PI * 2 / 360;
         const angleNormalized = Math.floor((angle % (Math.PI * 2)) / angleIncrement) *
             angleIncrement;
 
-        const rotatedSpriteId = `${name}_${width}x${height}r${angleNormalized}`;
+        const rotatedSpriteId = `${sprite.url}_${sprite.width}x${sprite.height}r${angleNormalized}`;
         if (this.spriteCache.has(rotatedSpriteId)) {
             const sprite = this.spriteCache.get(rotatedSpriteId);
             cx.drawImage(sprite, x, y);
             return;
         }
 
-        const sprite = this.#loadSprite(width, height, name);
-
         const maxSize = Math.max(sprite.width, sprite.height);
         const newSprite = new OffscreenCanvas(maxSize, maxSize);
         const newSpriteCx = newSprite.getContext("2d");
@@ -354,12 +339,16 @@ export class GamelibAdapter {
         this.gamelib.mouseUpHandlers.set(button, handlerFunction);
     }
 
-    drawSprite(x, y, width, height, name) {
+    loadSprite(name, width, height) {
-        this.gamelib.drawSprite(x, y, width, height, name);
+        return this.gamelib.loadSprite(name, width, height);
     }
 
-    drawSpriteRotated(x, y, width, height, name, angle) {
+    drawSprite(x, y, sprite) {
-        this.gamelib.drawSpriteRotated(x, y, width, height, name, angle);
+        this.gamelib.drawSprite(x, y, sprite);
+    }
+
+    drawSpriteRotated(x, y, sprite, angle) {
+        this.gamelib.drawSpriteRotated(x, y, sprite, angle);
     }
 
     rgb(red, green, blue) {

src/project_save_handler.js

@@ -62,7 +62,7 @@ export class ProjectSaveHandler {
         const code = items.find((x) => x.tag === "code");
         delete code.tag;
 
-        this.assetEditor.importAssets(
+        await this.assetEditor.importAssets(
             assets.map(({ name, mime, content }) => {
                 const file = new File([content], name, { type: mime });