I am building a custom TinyMCE plugin, which adds a button to the rich text editor. On click of the button, we open a form that allows the user to search and select a search result. On the callback from selecting a result, the markup in the rich text editor is updated to insert some special markup.

This works using a "popup" by invoking tinymce.activeEditor.windowManager.open, however, that doesn't feel very "Umbraco".

It would be much nicer if I could define an infinite editor for the search and results interface, but I can't figure out how to piece those together.

The tinymce plugin code sits in wwwroot/umbraco/lib/tinymce/plugins/[myplugin]/plugin.min.js and uses plain js with a tinymce.PluginManager.add directive. I don't think I can get to the Umbraco editorService from here to open the infinite editor?

I had a look at the Umbraco source code to see how the media picker button etc work. This all appears to be happening within the umbraco.services.tinyMceService and within that in the initializeEditor method.

I was thinking my code should go into App_Plugins instead so I can create an AngularJS controller that inherits editorService (and possibly tinyMceService), but then how would that even get added to the rich text editor?

I also started looking into using directives to extend the default implementation (https://umbraco.com/blog/beyond-umbraco-hooking-angularjs/), but this seems like a bit of a black box and I haven't found what directive I would extend for the RTE.

Any ideas how I can do either of the following?

1. Get the editorService in my TinyMCE plugin (pure JS)
2. Put AngularJS code in App_Plugins that would allow me to add the button to the RTE

Thanks