Tinymce 4.x extends plugin

Question

I am looking for some examples of how to extend an existing tinymce (4.x) plugin, for example. plugin "link".

The link plugin opens a dialog ... what I would like to do is add an event when the dialog opens and change the body (add additional HTML code with click events).

It seems that it is problematic to make it beautiful ... I want to avoid some "top" code, such as $('#mce_13').click(...); , and rather use something like

 editor.on('DialogOpen', function(e) { // if link dialog then $(e.body).append('<div>My HTML</div>'); }); 

However, there are no events like onDialogOpen ... is there any best practice to achieve this?

Answer 1

I managed to do this for modal windows (I need callbacks to open / close), maybe you could build on it to also determine what type of window opens:

 tinymce.init({ //... code and setup here setup: function(editor) { editor.on('init',function(e) { setModalEvents(editor); }); }, //... and more here perhaps }); 

and then the function itself:

 // override modal methods to insert events function setModalEvents(editor) { editor.windowManager.oldOpen = editor.windowManager.open; // save for later editor.windowManager.open = function(t,r) { // replace with our own function alert("modal window opened, insert callback here"); var modal = this.oldOpen.apply(this, [t,r]); // call original modal.on('close', function() { // set event for close alert("modal window closed, insert callback here"); }); return modal; // Template plugin is dependent on this return value }; } 

you could do similar overrides of other things in the tinymce core, so maybe this could be useful.