swordmaster by swordmaster May 30, 2017
Tutorial

Code Summary

In RPGWizard an "asset" refers to any sound or image files that are required by a program. These files must be available in the Sounds and Graphics folder of your project which is where the engine looks for them by default. Assets are loaded asynchronously meaning they cannot be used until the engine has loaded them. Once an asset has been loaded it will be available in the engine to programs until it is explictly removed, this means you can load up common assets on game startup and access them anytime without needing to wait for them again.

Before we can tell the engine to load assets we must first define an assets object that contains the type and name of each asset. The asset object can contain two properties audio and images, only one is ever required. If you only wanted to load an audio file you can leave the image section empty and vice versa:

// An example of an assets object
var assets = {
    "audio": {
        // Audio assets are stored using key and value pairs
        "intro": "intro.mp3"
    },
    "images": [
        // Images are stored in an array
        "block.png",
        "mwin_small.png",
        "sword_profile_1_small.png",
        "startscreen.png"
    ]
};
                                

When you've defined your assets object you can pass it to the engine by calling the loadAssets function that is a part of the RPGcode API. This API is simply a collection of functions that allows you to do fun and interesting things with your game, and it is available to all programs running in the engine. The rpgcode.loadAssets function takes two parameters, the first being the assets we want to load, and the second a callback function. A callback is simply a function containing a block of code we want to execute once the assets are ready to use:

// Load up the assets we need.
rpgcode.loadAssets(assets, function() {
   // They are ready, so do some stuff here...
   
   // VERY IMPORTANT!
   // We are finished, tell the engine that this program has ended.
   rpgcode.endProgram();
});
                                

The Biggest Gotcha

The last line in the callback function "rpgcode.endProgram()" is very important. JavaScript's asynchronous nature makes it impossible for the engine to reliably say when a program has ended, so you must explictly tell it when you are done!

Complete Code

/*
 * Example of how to load up sound and images files for use in the engine. 
 */

// Game assets used in this program.
var assets = {
    "audio": {
        "intro": "intro.mp3"
    },
    "images": [
        "block.png",
        "mwin_small.png",
        "sword_profile_1_small.png",
        "startscreen.png"
    ]
};

// Load up the assets we need.
rpgcode.loadAssets(assets, function() {
   // They are ready, so do some stuff here...

   // Now unlaod the assets we don't need to save memory.
   rpgcode.removeAssets({
      "audio": {
         "intro": "intro.mp3"
      },
      "images": [
         "startscreen.png"
      ]
   });
   
   rpgcode.endProgram();
});