Plugin Authoring

[alijaya]

Hello, thank you for making Tweakpane. I like to use it :D.
But when I want to try to create my own plugin, I'm stumped... there's the plugin template but it seems pretty complicated without documentation. Because it seems I need to understand first how tweakpane works and the architecture of it, and there's no documentation about that except dive down to the source code itself.

Anyone could give me direction where I should start?

[cocopon]

First of all, there are three types of blades. What is your choice?

• Input bindings
  User can change the value with your blade
• Monitor bindings
  User can monitor value change with your blade, but cannot change the bound value
• Misc
  Just provides a UI without binding

[alijaya]

so to recap:
reader needs to return a function that convert user value to internal value
and
writer needs to return a function that convert internal value to user value and set it to the BindingTarget?

[cocopon]

Right!

[alijaya]

I see... more or less, I think I understand about it...
Now about controller, what is it? how it works?

[cocopon]

Tweakpane adopts good old MVC architecture. controller function creates a controller and a view for user input.

args.value is a model that wraps an internal value created by binding.reader.
https://github.com/tweakpane/plugin-template/blob/a21333f2defd12e6cdc2a749c5e792fcad57f6d3/src/plugin.ts#L107

What you should do here is creating a controller for this model.

In this template plugin, controller creates a view, binds it to the model,
https://github.com/tweakpane/plugin-template/blob/a21333f2defd12e6cdc2a749c5e792fcad57f6d3/src/controller.ts#L37-L40

...handle UI events and apply it to the model.
https://github.com/tweakpane/plugin-template/blob/a21333f2defd12e6cdc2a749c5e792fcad57f6d3/src/controller.ts#L59

BTW are you using TypeScript for development? Type annotation can be helpful for code reading.

[alijaya]

Hmmm... I see... I guess I need to tinker and experiment it by myself...
Yes I'm using Typescript for development :D

[cocopon]

Created a guide for plugin development.
https://tweakpane.github.io/docs/plugins/dev/

Hope it helps...

[alijaya]

Hey thanks! That's looking good 😁