[xwiki-devs] How to load GWT application on Xwiki pages?
Hi Everyone! I have read this document "Writing GWT applications in XWiki" ( http://dev.xwiki.org/xwiki/bin/view/Drafts/WritingGWTApplicationsInXWiki) And I know how to develop GWT module for xwiki now. I also have read the document "WYSIWYG Editor Module" ( http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule). I followed the instruction which tried to integrate the WYSIWYG editor(GWT application) in wiki pages, and I put the following code in my wiki editor: "{{html}} <script type="text/javascript" src="XWikiWysiwyg.js"> alert('WYSIWYG code is loaded!'); </script> <textarea id="demo"></textarea> <script type="text/javascript"> Wysiwyg.onModuleLoad(function() { new WysiwygEditor({hookId:'demo'}); alert('WYSIWYG code is loaded!'); }); Wysiwyg.onModuleLoad(function() { editor = new WysiwygEditor({hookId: 'demo'}); }); }); </script> {{/html}}" After saved, it only display a blank text area without any sign of WYSIWYG editor, also there is no alart 'WYSIWYG code is loaded!' popup. Can you help me figure it out what is wrong with it? I am planing to develop a tree view using GWT to display Design Rationale Element. Could you give me some ideas of after my development, how can I embeded the GWT application into Xwiki pages and interact with the GWT application? Thank you very much! Leon
You might want to try {{html clean="false"}} as otherwise some stuff might get filtered out. Marius should be able to help more Ludovic Leon Wang wrote:
Hi Everyone! I have read this document "Writing GWT applications in XWiki" ( http://dev.xwiki.org/xwiki/bin/view/Drafts/WritingGWTApplicationsInXWiki) And I know how to develop GWT module for xwiki now. I also have read the document "WYSIWYG Editor Module" ( http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule). I followed the instruction which tried to integrate the WYSIWYG editor(GWT application) in wiki pages, and I put the following code in my wiki editor: "{{html}} <script type="text/javascript" src="XWikiWysiwyg.js"> alert('WYSIWYG code is loaded!'); </script> <textarea id="demo"></textarea> <script type="text/javascript"> Wysiwyg.onModuleLoad(function() { new WysiwygEditor({hookId:'demo'}); alert('WYSIWYG code is loaded!'); }); Wysiwyg.onModuleLoad(function() { editor = new WysiwygEditor({hookId: 'demo'}); }); }); </script> {{/html}}"
After saved, it only display a blank text area without any sign of WYSIWYG editor, also there is no alart 'WYSIWYG code is loaded!' popup. Can you help me figure it out what is wrong with it?
I am planing to develop a tree view using GWT to display Design Rationale Element. Could you give me some ideas of after my development, how can I embeded the GWT application into Xwiki pages and interact with the GWT application?
Thank you very much!
Leon _______________________________________________ devs mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/devs
-- Ludovic Dubost Blog: http://blog.ludovic.org/ XWiki: http://www.xwiki.com Skype: ldubost GTalk: ldubost
On Mon, Oct 5, 2009 at 00:50, Leon Wang <[email protected]> wrote:
Hi Everyone! I have read this document "Writing GWT applications in XWiki" ( http://dev.xwiki.org/xwiki/bin/view/Drafts/WritingGWTApplicationsInXWiki) And I know how to develop GWT module for xwiki now. I also have read the document "WYSIWYG Editor Module" ( http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule). I followed the instruction which tried to integrate the WYSIWYG editor(GWT application) in wiki pages, and I put the following code in my wiki editor: "{{html}} <script type="text/javascript" src="XWikiWysiwyg.js"> alert('WYSIWYG code is loaded!'); </script> <textarea id="demo"></textarea> <script type="text/javascript"> Wysiwyg.onModuleLoad(function() { new WysiwygEditor({hookId:'demo'}); alert('WYSIWYG code is loaded!'); }); Wysiwyg.onModuleLoad(function() { editor = new WysiwygEditor({hookId: 'demo'}); }); }); </script> {{/html}}"
After saved, it only display a blank text area without any sign of WYSIWYG editor, also there is no alart 'WYSIWYG code is loaded!' popup. Can you help me figure it out what is wrong with it?
Note that it's generally better to put javascript part in a XWiki.JavaScriptExtension object and include it in the page. See http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial
I am planing to develop a tree view using GWT to display Design Rationale Element. Could you give me some ideas of after my development, how can I embeded the GWT application into Xwiki pages and interact with the GWT application?
Thank you very much!
Leon _______________________________________________ devs mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/devs
-- Thomas Mortagne
Hi Leon, Leon Wang wrote:
Hi Everyone! I have read this document "Writing GWT applications in XWiki" ( http://dev.xwiki.org/xwiki/bin/view/Drafts/WritingGWTApplicationsInXWiki) And I know how to develop GWT module for xwiki now. I also have read the document "WYSIWYG Editor Module" ( http://code.xwiki.org/xwiki/bin/view/Modules/WysiwygEditorModule). I followed the instruction which tried to integrate the WYSIWYG editor(GWT application) in wiki pages, and I put the following code in my wiki editor:
"{{html}} <script type="text/javascript" src="XWikiWysiwyg.js"> alert('WYSIWYG code is loaded!'); </script> <textarea id="demo"></textarea> <script type="text/javascript"> Wysiwyg.onModuleLoad(function() { new WysiwygEditor({hookId:'demo'}); alert('WYSIWYG code is loaded!'); }); Wysiwyg.onModuleLoad(function() { editor = new WysiwygEditor({hookId: 'demo'}); }); }); </script> {{/html}}"
I updated the WysiwygEditorModule page and I also added a full example at the end. Please take a look.
After saved, it only display a blank text area without any sign of WYSIWYG editor, also there is no alart 'WYSIWYG code is loaded!' popup. Can you help me figure it out what is wrong with it?
First of all, you should install Firebug Firefox extension. It is very useful for detecting JavaScript exceptions. Your code snipped doesn't work mainly because the path to XWikiWysiwyg.js isn't specified. See the updated WysiwygEditorModule page. Then you'll have to clean your code a bit since the editor is loaded twice and there is a closing '});' at the end without any opening '({'. See the example I added at the bottom of the WysiwygEditorModule page.
I am planing to develop a tree view using GWT to display Design Rationale Element. Could you give me some ideas of after my development, how can I embeded the GWT application into Xwiki pages and interact with the GWT application?
First you have to include the JavaScript file generated by GWT for your application: {{velocity}} $xwiki.jsfx.use("path/to/YourModuleName.nocache.js") {{/velocity}} I created a special bootstrapper for the WYSIWYG editor that allows me to load it on demand. You might not need this. In case you do, see http://tinyurl.com/yan4433 . Then, if your GWT application has a service servlet you'll have to register it in the WEB-INF/web.xml file. By default, GWT applications load when the host HTML page loads and you don't have access from JavaScript to the GWT-compiled code (which is most of the time obfuscated). In order to create your tree widget from JavaScript on demand you'll have to expose a JavaScript API from GWT. Take a look at http://tinyurl.com/yaqdkqg to see how I did it. So instead of loading the application on ModuleName.onModuleLoad() I just publish the JavaScript API which allows me to instantiate the editor later (see http://tinyurl.com/y896uag ). Of course you can keep it simple and load your tree when the page loads. In the first versions of the GWT-based WYSIWYG editor the Wysiwyg.onModuleLoad method was creating an editor instance for each 'window.WysiwygXXX' JavaScript object found. These objects contained the editor configuration. You could so something similar. Hope this helps, Marius
Thank you very much!
Leon _______________________________________________ devs mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/devs
Hi Marius, I am also interested in embedding a GWT application into a xwiki page. Unfortunately the tiny URL in your post do no longer work. Can you please update the URLs. Thank in advance. Richard -- View this message in context: http://xwiki.475771.n2.nabble.com/How-to-load-GWT-application-on-Xwiki-pages... Sent from the XWiki- Dev mailing list archive at Nabble.com.
On 11/24/2011 02:38 PM, rhierlmeier wrote:
Hi Marius,
I am also interested in embedding a GWT application into a xwiki page. Unfortunately the tiny URL in your post do no longer work. Can you please update the URLs.
The code repository has been moved to github, so the old SVN paths are no longer valid. http://tinyurl.com/yan4433 => https://github.com/xwiki/xwiki-platform/blob/master/xwiki-platform-core/xwik... http://tinyurl.com/yaqdkqg => https://github.com/xwiki/xwiki-platform/blob/master/xwiki-platform-core/xwik... http://tinyurl.com/y896uag => https://github.com/xwiki/xwiki-platform/blob/master/xwiki-platform-core/xwik... -- Sergiu Dumitriu http://purl.org/net/sergiu/
participants (6)
-
Leon Wang -
Ludovic Dubost -
Marius Dumitru Florea -
rhierlmeier -
Sergiu Dumitriu -
Thomas Mortagne