Adding plugins to Joplin Desktop

Development
1

Hello everyone,

I’m a fairly experienced developer in other languages, but a neophyte when it comes to JS/TS world. I’d like to see if I can take a crack at adding support for wavedrom. I’m not asking for someone else to do it - I’d like to try myself, but would need a bit of guidance on how to get started. The more specific the better.

Would anyone be able to help me do that? I’m fairly self-sufficient and work hard at trying to figure out things on my own, so I’m hoping any burden I create would be offset by having someone else willing to contribute to the project.

1 Like
2

That’s a great introduction. Although, which kind of plugins you want to add to the Desktop app. Can you be more specific about the project instead?

3

Sure. If I’ve not answered the actual question you asked, please let me know.

In my day job, I work on software for embedded systems. I have experimented with a few different note taking applications, and have been enjoying Joplin. Sometimes, I need to describe digital timing diagrams.

When I was experimenting with asciidoctor, there was a plug-in that takes a textual description in JSON and renders it using Wavedrom (https://wavedrom.com/), which I found nice. For now, I’m just using images that come out of the wavedrom rendering engine, so, this is by no means a “must have”. But if I can make it work in Joplin, I’d learn something new in the process.

Right now, though, I don’t even have a good mental model of how the application (or Electron-based applications, or for that matter other javascript applications). I’m up for learning, but to reduce my flailing around in the interweb, some technical guidance and direction from those more experience would help a lot.

1 Like
4

Hey @mwilbur, I looked into what wavedrom does and to my understanding, it takes in JSON data and outputs an SVG, for you to implement this feature you need to create a markdown-it-plugin (you can look at a list of all the markdown-it-plugins in Joplin-renderer/MdToHtml/rules, you can look at the katex rule in there for reference, plus besides that, you need to create a custom delimiter to tell the renderer that you want to type wavedrom code because just enclosing JSON data in {} would cause a lot of conflict, @laurent can guide you further with that,

you can read how to create markdown-it-plugins here

as a matter of fact, if @laurent approves of this I can help you make this plugin

Do let me know if you require any other help or clarification.

1 Like
5

You can take a look at this page for an example of how the syntax for this would look.

2 Likes
6

Amazing. Time to get learning!

7

I think rules/fountain.js is a good example for this kind of plugin.

1 Like
8

@mwilbur Have you made any progress on a Wavedrom plugin? I've been considering writing one as well and would rather not duplicate effort.

1 Like