blurymind / YarnClassic

A tool for writing interactive dialogue in games!
MIT License
519 stars 51 forks source link

feature: ability to write yarn editor plugins inside yarn editor - Yarn Playground? #328

Open blurymind opened 4 months ago

blurymind commented 4 months ago

Yarn editor uses ace-editor, which can pretty easily be enabled to edit javascript syntax files. Plugins can now be hosted on a gist, so in theory they can also be edited while hosted on that gist (we have the mechanism to load files from gists already)

The dream is to have a new settings button that lets you open the editor in js mode and edit the plugins. Then the process is to apply changes and hot reload.

The goal is to enable quick dev iteration directly in the browser - to add and remove custom features to yarn editor

Edit: This is now implemented, but there is more.. things done:

some things to improve

all demos so far are stored at: https://gist.github.com/blurymind/2ff124dc94f936e8f7d96632f559aecb a work in progress demo of this in action - loading pixijs and passing to it the data from yarn https://blurymind.github.io/YarnClassic/?gistPlugins=2ff124dc94f936e8f7d96632f559aecb&pluginFile=yarn-output-pixi-bunnies.js&mode=test

blurymind commented 4 months ago

would be good if the user can write plugins even if they dont have a github account - the plugin code would be stored locally on their computer and be exportable somehow

blurymind commented 3 months ago

a work in progress demo of this in action - loading pixijs and passing to it the data from yarn https://blurymind.github.io/YarnClassic/?gistPlugins=2ff124dc94f936e8f7d96632f559aecb&pluginFile=yarn-output-pixi-bunnies.js&mode=test

blurymind commented 2 months ago

We now have a plugin system set in place that allows creating them directly inside yarn and persisting them on the gist and local memory. You can even see a diff of your changes before committing them.

You can use the plugin api to output a game in a single html file that has bondagejs or inkjs, the yarn editor story data and whatever external module you want to use to render it.

You can also use it to alter yarn editor itself. Attach new buttons or render custom html straight inside yarn (need reloading it in the browser). I am thinking of allowing editor plugins only when in dev mode for now. You might potentially break yarn by writing bad javascript and will have to clear its local data to unbreak it. I tried to make hard to break, it needs to be stress tested more

blurymind commented 1 month ago

Now testing a shareable link that also loads image resources from the gist where the yarn file is stored https://blurymind.github.io/YarnClassic/?gist=1252aaa8f74a394b3ac5695107f16e51&fileName=yarnExample.json&gistPlugins=2ff124dc94f936e8f7d96632f559aecb&pluginFile=yarn-output-pixi-bunnies.js&mode=test

I still need to make this work properly, it doesnt.

When a gist url is passed, yarn needs to use it instead of the local cache to load any resources. if no resources are found - yarn needs to notify the user and instead load the local cached resources