🔥 ✨ Add AssetHandler to cache various assets

- Add resource classes for Audio, Fonts and Textures,
- Remove old resource classes.

index.html

@@ -11,7 +11,6 @@
     <!--******************************
       p5Js Modules
     *******************************-->
-    <!-- Core -->
     <script src="libraries/p5.min.js"></script>
     <script src="libraries/p5.sound.min.js"></script>
     <script src="libraries/p5.dom.min.js"></script>
@@ -36,9 +35,12 @@
 
     <!-- Handlers -->
     <script src="pandora/handlers/GameHandler.js"></script>
+    <script src="pandora/handlers/AssetHandler.js"></script>
 
     <!-- Resources -->
-    <script src="pandora/resources/Texture.js"></script>
+    <script src="pandora/resources/AudioRes.js"></script>
+    <script src="pandora/resources/FontRes.js"></script>
+    <script src="pandora/resources/TextureRes.js"></script>
     
     <!-- Singletons -->
     <script src="pandora/Enums.js"></script>

pandora/game_objects/2d_objects/Sprite2D.js

@@ -4,8 +4,7 @@ class Sprite2D extends Object2D
     {
         super(name);
 
-        if (p5Image)
-            this.texture = new Texture(p5Image, p5Image.width, p5Image.height);
+        this.P5Image = p5Image;
     }
 
     draw(delta)
@@ -15,7 +14,7 @@ class Sprite2D extends Object2D
         rotate(this.rotationDegrees);
         scale(this.scale.x, this.scale.y);
 
-        image(this.texture.image, this.position.x, this.position.y, this.texture.width, this.texture.height);
+        image(this.P5Image, this.position.x, this.position.y, this.P5Image.width, this.P5Image.height);
 
         this._draw(delta);
 

pandora/handlers/AssetHandler.js

@@ -0,0 +1,106 @@
+class AssetHandler
+{
+    static cachedTextures = [];
+
+    static loadTexture(name, link)
+    {
+        let textRes = new TextureRes(name, null);
+        this.cachedTextures.push(textRes);
+        loadImage(link, img =>
+        {
+            textRes.P5Image = img;
+        });
+    }
+
+    static getTextureByName(name)
+    {
+        for (let i = 0; i < this.cachedTextures.length; i++)
+        {
+            if (this.cachedTextures[i].name == name)
+            {
+                return this.cachedTextures[i];
+            }
+        }
+        return null;
+    }
+
+    static getP5ImageByName(name)
+    {
+        for (let i = 0; i < this.cachedTextures.length; i++)
+        {
+            if (this.cachedTextures[i].name == name)
+            {
+                return this.cachedTextures[i].P5Image;
+            }
+        }
+        return null;
+    }
+
+    static cachedAudio = [];
+
+    static loadAudio(name, link)
+    {
+        let audio = createAudio(link);
+        this.cachedAudio.push(new AudioRes(name, audio));
+    }
+
+    static getAudioByName(name)
+    {
+        for (let i = 0; i < this.cachedAudio.length; i++)
+        {
+            if (this.cachedAudio[i].name == name)
+            {
+                return this.cachedAudio[i];
+            }
+        }
+        return null;
+    }
+
+    static getP5AudioByName(name)
+    {
+        for (let i = 0; i < this.cachedAudio.length; i++)
+        {
+            if (this.cachedAudio[i].name == name)
+            {
+                return this.cachedAudio[i].P5Audio;
+            }
+        }
+        return null;
+    }
+
+    static cachedFonts = [];
+    
+    static loadFont(name, link)
+    {
+        let fontRes = new FontRes(name, null);
+        this.cachedFonts.push(fontRes);
+        loadFont(link, font =>
+        {
+            fontRes.P5Font = font;
+        })
+    }
+
+    static getFontByName(name)
+    {
+        for (let i = 0; i < this.cachedFonts.length; i++)
+        {
+            if (this.cachedFonts[i].name == name)
+            {
+                return this.cachedFonts[i];
+            }
+        }
+        return null;
+    }
+
+    static getP5FontByName(name)
+    {
+        for (let i = 0; i < this.cachedFonts.length; i++)
+        {
+            if (this.cachedFonts[i].name == name)
+            {
+                return this.cachedFonts[i].P5Font;
+            }
+        }
+        return null;
+    }
+}

pandora/resources/AudioRes.js

@@ -0,0 +1,8 @@
+class AudioRes
+{
+    constructor(name = "", p5Audio = null)
+    {
+        this.name = name;
+        this.P5Audio = p5Audio;
+    }
+}

pandora/resources/FontRes.js

@@ -0,0 +1,8 @@
+class FontRes
+{
+    constructor(name = "", p5Font = null)
+    {
+        this.name = name;
+        this.P5Font = p5Font;
+    }
+}

pandora/resources/Texture.js

@@ -1,9 +0,0 @@
-class Texture
-{
-    constructor(image = null, width = 0, height = 0)
-    {
-        this.image = image;
-        this.width = width;
-        this.height = height;
-    }
-}

pandora/resources/TextureRes.js

@@ -0,0 +1,8 @@
+class TextureRes
+{
+    constructor(name = "", p5Image = null)
+    {
+        this.name = name;
+        this.P5Image = p5Image;
+    }
+}

src/sketch.js

@@ -1,38 +1,10 @@
-class TestObject extends Button
-{
-    // constructor(name)
-    // {
-    //     super(name);
-    // }
-
-    _update(delta)
-    {
-
-    }
-
-    _draw(delta)
-    {
-
-    }
-
-    _onMousePressed() {
-        print("Hello")
-    }
-
-    _onMouseOver() {
-        print("over")
-    }
-}
-
 let test, test2;
-let testImg;
-let testFont;
-let testButton, testSlider;
 
 function preload()
 {
-    testImg = loadImage("/assets/textures/monke.png");
-    testFont = loadFont("/assets/fonts/Lato-Regular.ttf");
+    AssetHandler.loadTexture("monke", "/assets/textures/monke.png");
+    AssetHandler.loadFont("Lato", "/assets/fonts/Lato-Regular.ttf");
+    AssetHandler.loadAudio("bonk", "/assets/audio/thonk.wav");
 }
 
 function setup()
@@ -40,14 +12,10 @@ function setup()
     GameHandler.drawDebugFPS(true);
     GameHandler.setRenderMode(RENDER_MODES.WEBGL);
     GameHandler.init();
-    textFont(testFont);
+    textFont(AssetHandler.getP5FontByName("Lato"));
 
-    test = new TestObject("myTest");
+    test = new Sprite2D("mySprite", AssetHandler.getP5ImageByName("monke"));
     GameHandler.addRootObject(test);
-    test.setLabel("hello");
-
-    test2 = new TestObject("myTest2");
-    test.addChild(test2);
 }
 
 function draw()