Creating your mod: Scripting

Depending on what your mod aims to do, scripting will likely be required. You can see the entirety of the Bonds's codebase in the js/plugins/ folder. You will need to look at the base game's files to understand how to modify content.

Environment

Note: The following are details about the frameworks involved in the game, it is not very meaningful for people with little JavaScript experience

Bonds 2.0.0 was made with RPG Maker MZ. However, RPG Maker MZ is barely used by the game, and what matters are the frameworks RPG Maker MZ comes with.

RPG Maker MZ uses NW.js to make games run, NW.js is a framework built on top of Chromium that bundles Node.js into its fork of Chromium. It is a framework for building apps with web technologies, similar to the more well-known Electron framework (which powers Discord, amongst many other apps)

RPG Maker MZ also uses the Pixi.js framework for graphics rendering. Bonds tend to ignore RPG Maker's layer and interact directly with Pixi.

The current build of Bonds ships with the following versions:

NW.js: 0.48.4

Chromium: v85

Node.js: 14.12.0

Pixi.js: 5.3.12

Adding scripts to your mod

Making the game load your mod's scripts is straightforward: Simply put your .js files in under a js folder at the root of your mod. They will then be loaded after the base game's scripts (and after mods above yours in the load order).

If you need your scripts to be loaded in a specific order, use your mod descriptor's scriptsLoadOrder property (see Creating your mod 1): The mod descriptor)

Modifying Bonds's code

To modify Bonds's code, your mod needs to override it. You can see a live example with the example mod:

mods/Example mod/js/core.js

class ExampleModCore {
    static init() {
        this._overrides = {};
    }

    /**
     * 
     * @returns {LoadedMod}
     */
    static mod() {
        return BondsModManager.getMod("example")[0];
    }
}

ExampleModCore.init();

ExampleModCore._overrides.BondsVersioning_Version = BondsVersioning.version;
BondsVersioning.version = function(...args) {
    return ExampleModCore._overrides.BondsVersioning_Version.call(this, ...args) + ` [${ExampleModCore.mod().id}]`;
}

Here, the example mod does the following:

• [line 1-14] It declares an ExampleModCore static class to serve as namespaced global variable storage for the mod and to give utility functions to the mod

  • mod() is such an utility function, it is a shortcut function that calls Bonds's BondsModManager class in order to get the example mod's descriptor

• [line 16] It initializes the ExampleModCore class

• [line 18-20] It overrides Bonds's BondsVersioning#version() function by:

  • [line 18] Storing the original function within ExampleModCore#_overrides's object variable.

  • [line 19-20] Replacing BondsVersioning#version() with a new function that calls the original function in order to return the text returned by the original + the mod's version after it

On lines 19-20, you may notice the usage of ...args, this is a destructuring assignment, a potent JavaScript tool that we use here to transmit all arguments passed to our new function to the original function without having to know what they are.

Making use of this anytime you override a function (as long as you still use the original function and do not replace it entirely) is a great way to make your mod more future-proof and improve compatibility with other mods