# RPG Maker

Deploy RPG Maker MZ projects with the built-in Web browsers exporter.

Source: https://docs.wavedash.com/engines/rpgmaker

<GithubLink href="https://github.com/wvdsh/examples/tree/main/example-rpgmaker" />
<PlaytestLink href="https://wavedash.com/playtest/rpg-maker-example/69071a51-3d37-44b6-a2f5-8269d54d885c" />

<Note>
This guide covers **RPG Maker MZ**. The UI paths and plugin APIs differ in earlier versions (MV, VX Ace, etc.) — the plugin code below is specific to MZ's JavaScript runtime.
</Note>

[RPG Maker MZ](https://www.rpgmakerweb.com/products/rpg-maker-mz) ships with a built-in Web deployment that outputs a folder of HTML, JS, and asset directories runnable directly in a browser. Wire up the Wavedash SDK through a plugin so it survives every re-deployment.

## Export your game

1. **File → Deployment**
2. Platform: **Web browsers / Android / iOS**
3. Output Path: a temp folder (you'll copy the result into the upload directory next)
4. Click **OK**

RPG Maker MZ writes a `<YourProject>/` folder inside the output path. That inner folder contains `index.html`, `js/`, `data/`, `audio/`, `img/`, `effects/`, `fonts/`, and `css/`. Copy or move it into `build/` alongside your `wavedash.toml`.

## SDK integration

Create a plugin at `js/plugins/Wavedash.js` inside your RPG Maker MZ project:

<Urgent>
**Calling `Wavedash.init()` is required.** Your game stays hidden behind the Wavedash loading screen until you do. Call it once your game is ready to play.
</Urgent>

```javascript
//=============================================================================
// Wavedash SDK
//=============================================================================
/*:
 * @target MZ
 * @plugindesc Initializes the Wavedash SDK, exposes name-keyed score/achievement helpers,
 *             and enables canvas stretch-to-fit in web browsers.
 * @author Wavedash
 */
(() => {
    // RPG Maker MZ only stretches the canvas for mobile or nwjs by default,
    // leaving desktop-web builds locked at the native 816x624 resolution.
    // Override _defaultStretchMode so the canvas scales to the viewport.
    Graphics._defaultStretchMode = function () {
        return true;
    };

    const _Scene_Boot_start = Scene_Boot.prototype.start;
    Scene_Boot.prototype.start = function () {
        window.Wavedash.updateLoadProgressZeroToOne(0.5);  // engine scripts loaded
        _Scene_Boot_start.call(this);
        try {
            window.Wavedash.updateLoadProgressZeroToOne(1);
            window.Wavedash.init({ debug: true });
        } catch (e) {
            console.warn("[wavedash] init failed:", e);
        }
    };

    const leaderboardIds = new Map();
    async function getLeaderboardId(name) {
        if (leaderboardIds.has(name)) return leaderboardIds.get(name);
        const res = await window.Wavedash.getLeaderboard(name);
        if (!res.success) throw new Error(`[wavedash] leaderboard "${name}" missing`);
        leaderboardIds.set(name, res.data.id);
        return res.data.id;
    }

    window.wavedashSubmitScore = async function (name, score) {
        const id = await getLeaderboardId(name);
        return window.Wavedash.uploadLeaderboardScore(id, score, true);
    };
    window.wavedashUnlockAchievement = function (id) {
        return window.Wavedash.setAchievement(id, true);
    };
})();
```

Then enable it: **Tools → Plugin Manager** → pick an empty row → **Name: Wavedash** → **Status: ON** → **OK**. RPG Maker MZ will include the plugin in every future Web deployment.

<Warning>
Without the `Graphics._defaultStretchMode` override, RPG Maker MZ's desktop-web builds don't resize with the browser window — the canvas stays pinned at 816x624 pixels. This one-line flip is the standard community workaround.
</Warning>

### Calling the SDK from game events

The plugin exposes two `window.` helpers so a **Script** event command stays a one-liner:

```javascript
wavedashUnlockAchievement("first_clear");

// Submit the value in variable slot 1 to the "high-scores" leaderboard
wavedashSubmitScore("high-scores", $gameVariables.value(1));
```

## wavedash.toml

```toml
game_id = "YOUR_GAME_ID_HERE"
upload_dir = "./build"
entrypoint = "index.html"
```

<Note>
The `build/` directory is an RPG Maker MZ deployment output. Re-deploy (File → Deployment) after editing the project in the MZ editor, then replace `build/` with the new output.
</Note>