This plugin interfaces the narrat game engine with the bitsy game engine
The plugin adds the show_bitsy
and hide_bitsy
narrat script functions to interface with bitsy.
There is an example index.html
in the demo/public folder which contains a placeholder narrat game using the plugin. This file uses the standard bitsy setup but also adds a custom bitsy hack which adds a new instruction to bitsy: narrat
.
Syntax: (narrat "narratLabel")
The custom bitsy narrat
tag allows bitsy dialogue to trigger a narrat label. For example (as seen in the demo):
DLG 0
"""
Hello World.
Jumping to narrat label "bitsyTest":
(narrat "bitsyTest")
"""
NAME cat dialog
Import and register the plugin before calling startApp
in your game's index.ts
(see src/index.ts
in the demo for an example):
import { registerPlugin, startApp } from 'narrat';
import { BitsyPlugin } from './index'; // imports the bitsy plugin
window.addEventListener('load', () => {
registerPlugin(new BitsyPlugin()); // Enables the bitsy plugin
startApp(
{
charactersPath: 'data/characters.json',
configPath: 'data/config.json',
},
{
logging: false,
debug: true,
},
);
});
Bitsy generally exports a single index.html
file as its output. In this file there is:
- An HTML skeleton
- Some script tags with the engine
- A script type containing the game's data
To make a narrat game work with Bitsy, the best way is to take the index.html
file in the demo and simply replace the bitsy game data as desired. Bitsy hacks can also be added to the HTML file.
To set up an existing narrat game to work with Bitsy or if starting from scratch:
- Copy paste the necessary bitsy script tags in the
<head>
tag of theindex.html
file of the game. Those script tags can be found in the bitsy game download html file, or copy pasted from the example index.html provided in this repo. - Add the narrat bitsy hack to the
index.html
file (this hack can be found in the demoindex.html
in this repo. It is the last script tag in the file, after the font. - Add the script tag with the bitsy game data for the desired bitsy game that should run. The game data is the only part of the
index.html
code that needs to be modified when updating the bitsy game.
Simply use show_bitsy
or hide_bitsy
in your game script:
main:
"Hello world"
show_bitsy
- node.js (16 and above should work)
Install dependencies:
npm install
Running:
npm start
npm run build
Update the plugin's version (the command will also build):
npm version [major | minor | patch]
Releasing on npm (can only be done by npm package owner):
npm publish