Re: [xwiki-devs] Adding a customer plugin to the wysiwyg editor

Hi Josef, On Fri, Aug 30, 2013 at 4:13 PM, jhaimerl <Josef.Haimerl(a)de-gmbh.com> wrote: I'm not sure the editor should be responsible for fetching the JavaScript code of its custom plugins. I think I prefer the custom plugins to be loaded outside of the editor (Java) code and thus the editor just needs to be able to detect their presence. Something like: $xwiki.jsx.use('Space.SomeCustomPlugin') $xwiki.jsfx.use('uicomponets/wysiwyg/anotherCustomPlugin.js') ... $xwiki.jsfx.use('js/xwiki/wysiwyg/xwe/XWikiWysiwyg.js', true) Of course, hard-coding the custom plugin includes is not an option and your idea of defining the custom plugins in wiki pages is great. So the above code could be written instead as: ## Load the custom plugins. #foreach ($pluginName in $configuredListOfPlugins) #set ($pluginDocumentReference = $services.model.resolveDocument($pluginName)) #if ($xwiki.exists($pluginDocumentReference)) $xwiki.jsx.use($pluginDocumentReference) #end #end ## Load the editor code. $xwiki.jsfx.use('js/xwiki/wysiwyg/xwe/XWikiWysiwyg.js', true) Of course, the condition that checks if a plugin is a custom (wiki) plugin can be refined, but you get the idea. Now, as for how a custom plugin is defined, I think we should reuse the JSX mechanism. A plugin document could have one or more JSX objects for holding the JavaScript code of the plugin and one special object to mark the fact that the document is a WYSIWYG editor plugin. I would use the document name as the plugin name, the document title as the plugin pretty name and the document content as the description. And since the JavaScript code would be stored in a JSX object, the WysiwygPluginClass doesn't have any property left, but we still need it as a marker. We can't have empty classes so we could just add a placeholder property in the WysiwygPluginClass for now. Next, the WYSIWYG editor needs to detect the available custom plugin factories and initialize the plugins. The simplest solution is to use a global variable, e.g. window.wysiwygEditorPlugins.foo where foo is one of the plugin factories. JavaScriptPluginFactory#registerPlugins() from your proposal would iterate over the properties of window.wysiwygEditorPlugins and create a plugin factory that wraps the JavaScript object (e.g. 'foo'). Finally you need to define the "interface" for the JavaScript plugins. I'll come back on this in the following days. Hope this helps, Marius