draw.io Plugins - Loading and usage & trees plugin

[AlexD]

This isn't so much a question but rather a place to write down missing documentation about the useful trees.js plugin.

Original blog post announcing the plugin, with behavior and keyboard shortcuts: https://about.draw.io/organization-charts-and-mind-maps-in-draw-io/ (June 1st, 2017)

How I ended up figuring plugins and specifically the trees.js plugin (before I found this place): draw.io - Tree diagrams in draw.io no longer behaves as a tree diagram (webapps stackexchange)

Temporarily load a plugin

Add ?p=xxxx in the URL, where xxxx is the plugin ID (see below). Here is an example: https://www.draw.io/?p=trees

Load multiple plugins temporarily by seperating with ; like so: ?p=ex;sql. For example: https://www.draw.io/?p=replay;trees

This URL parameter must be entered before the file ID (which starts with #). For example: https://www.draw.io/?p=trees#G1WGGWe70PYSlCpaqmp2PqaEM7D1izVHSZ

Permanently load plugins

Go under Extras->Plugins, Add... and enter the path of the plugin in the form of /plugins/foo.js (except for trees.js, which is /plugins/trees/trees.js).

This will load the plugin for every draw.io file you use. Will result in a prompt at every page load. Only works for your current browser.

Plugin list and IDs

See help article What Plugins are available? for a list of plugin except for trees.js which is not listed. Use ID trees for temporarily loading or path /plugins/trees/trees.js for permanently adding. 

[Marco Azzalini]

Hi AlexD, I am using draw.io in embedded mode and I'm trying to have my custom plugins loaded automatically (permanently) without any end-user interaction,  I mean without config via Extras->Plugins... dialog.  

I tried to use the configure=1 URL's parameter and specify my plugins through json object but without any result. Following is my config object:

config: {"plugins":["/plugins/MyCustomPlugin.js"],....}

Do you think is this possible to achieve?

thanks

Marco

[Gaudenz Alder]

Hi Marco

Currently it's only possible to use "known" plugins with no warning dialog in embed mode. We're open to removing that warning in embed mode though.

Thanks,

Gaudenz

[Marco Azzalini]

Hi Gaudenz, sorry for the delay. If it would possible, in embed mode, remove the pop warning also for custom plugins it would be very nice!

When do you think this feature will be released?

regards,

Marco

[Gaudenz Alder]

We had another meeting and decided against removing the dialog for security concerns running our trusted app in an embedded context.

[Marco Azzalini]

I understand the security reasons for which the warning is there but I think that, in all scenarios where draw.io is deployed in the same server where the main application lives and used as an embedded editor, that warning is unnecessary and somewhat boring for the end user, don't you think so? Unless I'm ignoring or underestimating some aspect...

Marco

[David Benson]

Certainly, but in that case you can build draw.io with the warning off and deploy that. We'd need some kind of configuration file, otherwise, and we don't have that.

[Gaudenz Alder]

What is your specific use case for a custom plugin in embed mode?

[Marco Azzalini]

Il giorno lunedì 3 dicembre 2018 22:59:59 UTC+1, David Benson ha scritto:

Certainly, but in that case you can build draw.io with the warning off and deploy that. We'd need some kind of configuration file, otherwise, and we don't have that.

Hi David, after a long, long delay I managed to be back on this problem :-)   I made some experiments and in the App.js I added my two custom plugins at the array of the official ones:

App.pluginRegistry = {'4xAKTrabTpTzahoLthkwPNUn': '/plugins/explore.js',
'ex': '/plugins/explore.js', 'p1': '/plugins/p1.js',
'ac': '/plugins/connect.js', 'acj': '/plugins/connectJira.js',
'ac148': '/plugins/cConf-1-4-8.js', 'voice': '/plugins/voice.js',
'tips': '/plugins/tooltips.js', 'svgdata': '/plugins/svgdata.js',
'doors': '/plugins/doors.js', 'electron': 'plugins/electron.js',
'number': '/plugins/number.js', 'sql': '/plugins/sql.js',
'props': '/plugins/props.js', 'text': '/plugins/text.js',
'anim': '/plugins/animation.js', 'update': '/plugins/update.js',
'trees': '/plugins/trees/trees.js', 'import': '/plugins/import.js',
'replay': '/plugins/replay.js', 'anon': '/plugins/anonymize.js',
'tr': '/plugins/trello.js', 'f5': '/plugins/rackF5.js',
'tickets': '/plugins/tickets.js', 'flow': '/plugins/flow.js',
'webcola': '/plugins/webcola/webcola.js',
'multilanglabels': '/plugins/MultilanguageLabels.js',
'procinterlink': '/plugins/ProcessInterlink.js'};

I also added the p parameter to the url used to start draw.io in the embedd mode:   &p=procinterlink

Is this the right approach or am I walking on the path that lead to the dark side of the Force?  

The problem now is how to regenerate the app.min.js library... can you give me some hints on this? 

thanks, 

Marco