Plugin Development Assistance

Hello all,

I would like to develop a plugin for the modeler.
Since I do not have experience on programming, I would like to pose a set of questions so as to help me understand how can I develop my own plugin. Until now, I have created a plugin and I made it available on modeler, but this plugin does not have any script behind it so it does nothing at the moment.

I have seen also the topics on GitHub about plugin development, but since I am not programmer, as I mentioned, I feel really confused.

My questions are the following:

  1. Can I only with JavaScript develop my own plugin?
  2. How can I refer to elements of a model? For example, in case of adding a new task in my model, how can I fetch this task in my script? Is there any method to do so?
  3. How can I make my script run every time that there is a change in the model? For example, if I add a new task, the element variable is 1. Then, if I add another task, the element variable is 2. So, the script is triggered on every change in the model.

Your assistance would be so valuable for me. In case you could provide me a block of code that answers my questions, i would be so grateful and thankful for it.

Thank you all in advance.

Kind regards,
Nikos.

Great to hear you want to create a plugin :+1: We will of course try to help you. If I understand your questions correctly, than:

Can I only with JavaScript develop my own plugin?

Yes indeed.

How can I refer to elements of a model? For example, in case of adding a new task in my model, how can I fetch this task in my script? Is there any method to do so?

What do you mean by adding a new task? Do you want to listen, when a new task was created inside your Modeler? Then the EventBus is probably what you’re looking for.

How can I make my script run every time that there is a change in the model? For example, if I add a new task, the element variable is 1. Then, if I add another task, the element variable is 2. So, the script is triggered on every change in the model.

You could try out so listen for the element.changed event.

2 Likes

@Niklas_Kiefer Thank you so much for your answer, your willingness to help me and your kindness to provide me a JavaScript code example.

I will test it on weekend and I will be back with an update.

Thank you again for your time.

1 Like

@Niklas_Kiefer
Hello Niklas, as I said I tried to test out the code that you provided to me. Eventbus is exactly what I want.I am just confused how to couple my plugin to the modeler (so to make the connection of my code and the Camunda modeler).

If you (or any other community member) could assist me on that I would be so grateful!

So, let’s take it from start.
I created my plugin entry point, namely a file (index.js)
index.js

I don’t understand what I need to paste on script.js from the code that you provided. Do I need to paste everything from your file, namely the index.js file that you shared with me ? I need actually in my script file the eventBus as you said.
script.js

You also provided a diagram.bpmn file and an index.html file. How can the plugin read the current bpmn model that a modeler is creating? Do I also need an html file inside the plugin file?

Your code was really helpful to understand how my code can be connected with a bpmn model, but the most difficult part for me is to actually make my plugin available to the modeler.

Sorry for my questions, they might be “silly”, but it’s my first experience with plugin development and scripting :frowning: .

Again your assistance would be really valuable for me, as I am looking for a starting point, since I couldn’t understand some instructions on github about the plugin development.

Thank you in advance.

Regards,
Nick.

So your goal is to create a Camunda Modeler plugin, not only to create a bpmn-js extension? So this was an understanding mistake from my side, sorry for that!

Once you create a bpmn-js extension, you can easily hook it into a plugin for the Camunda Modeler. For example, see this example. This shows how to create an extension, use the eventBus inside and then wrap it inside a plugin for the Modeler.