Re: [xwiki-users] How to Add WYSIWIG toolbar button

2015-04-28 Thread Mahomed Hussein
Hi Marius

Thank you very much for this info. It is very helpful. Unfortunately I may take 
me a bit of time to assimilate and understand it all :-) But I will certainly 
give it a try in the next few weeks. I'll do my best to remember to post my 
results.


Kind regards,

Mahomed




-Original Message-
From: users [mailto:users-boun...@xwiki.org] On Behalf Of Marius Dumitru Florea
Sent: 27 April 2015 19:18
To: XWiki Users
Subject: Re: [xwiki-users] How to Add WYSIWIG toolbar button

On Fri, Apr 24, 2015 at 7:27 PM, Mahomed Hussein
maho...@custodiandc.com wrote:
 Hi

 I have a problem where users want to highlight text in the WYSIWIG editor and 
 press a button on the toolbar to automatically add the {{code}}, {{warning}} 
 etc. start and end tags to the text. I know how to add a macro button and to 
 style it. But the problem with the macro is that it pops up a form with a 
 text area that you then need to fill in with text you want to put inside the 
 tags. The behaviour I am looking for is similar to highlighting text and then 
 pressing the Bold button on the toolbar.

 I have done some digging/searching/googling and found the simpledittoolbar.vm 
 and I’ve customised this and added the copy to my skin. I have added the 
 following code in the relevant sections and it works perfectly when I click 
 EditWiki but it doesn’t show on the toolbar when I click EditWYSIWIG. I am 
 running XWiki 7.0

simpledittoolbar.vm affects only the wiki editor.


 #set($discard = $syntax10Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))
 #set($discard = $syntax20Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))
 #set($discard = $confluence10Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))


 So any idea how I can make the button show on the WYSIWIG toolbar? 
 Alternatively how do I make the macro execute on the highlighted text?

It's not simple. You have two options:

(1) Put a button on the toolbar with something like
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HAdjusttheeditorUIfromaJavaScriptExtension
then listen on click and use
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HWysiwygEditor
#getSelectionRange() to access the selected text and then
#getCommandManager() to
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HCommandManager
#execute the 'macroInsert' command. The complex part is to understand
the format of the command parameter. You can check
https://github.com/xwiki/xwiki-platform/blob/master/xwiki-platform-core/xwiki-platform-wysiwyg/xwiki-platform-wysiwyg-client/src/main/java/org/xwiki/gwt/wysiwyg/client/plugin/macro/MacroCall.java
.

(2) Write a plugin for the WYSIWYG editor from Java, but for this
you'll have to recompile the editor and thus you'll end up with a
custom editor, which is harder to maintain over time and may cause
upgrade headaches.

Hope this helps,
Marius


 Thanks in advance.


 Kind regards,

 Mahomed






 ___
 users mailing list
 users@xwiki.org
 http://lists.xwiki.org/mailman/listinfo/users
___
users mailing list
users@xwiki.org
http://lists.xwiki.org/mailman/listinfo/users
___
users mailing list
users@xwiki.org
http://lists.xwiki.org/mailman/listinfo/users


Re: [xwiki-users] How to Add WYSIWIG toolbar button

2015-04-27 Thread Marius Dumitru Florea
On Fri, Apr 24, 2015 at 7:27 PM, Mahomed Hussein
maho...@custodiandc.com wrote:
 Hi

 I have a problem where users want to highlight text in the WYSIWIG editor and 
 press a button on the toolbar to automatically add the {{code}}, {{warning}} 
 etc. start and end tags to the text. I know how to add a macro button and to 
 style it. But the problem with the macro is that it pops up a form with a 
 text area that you then need to fill in with text you want to put inside the 
 tags. The behaviour I am looking for is similar to highlighting text and then 
 pressing the Bold button on the toolbar.

 I have done some digging/searching/googling and found the simpledittoolbar.vm 
 and I’ve customised this and added the copy to my skin. I have added the 
 following code in the relevant sections and it works perfectly when I click 
 EditWiki but it doesn’t show on the toolbar when I click EditWYSIWIG. I am 
 running XWiki 7.0

simpledittoolbar.vm affects only the wiki editor.


 #set($discard = $syntax10Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))
 #set($discard = $syntax20Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))
 #set($discard = $confluence10Elements.add(['code', '{{code}}', '{{/code}}', 
 'page_code']))


 So any idea how I can make the button show on the WYSIWIG toolbar? 
 Alternatively how do I make the macro execute on the highlighted text?

It's not simple. You have two options:

(1) Put a button on the toolbar with something like
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HAdjusttheeditorUIfromaJavaScriptExtension
then listen on click and use
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HWysiwygEditor
#getSelectionRange() to access the selected text and then
#getCommandManager() to
http://extensions.xwiki.org/xwiki/bin/view/Extension/WYSIWYG+Editor+Module#HCommandManager
#execute the 'macroInsert' command. The complex part is to understand
the format of the command parameter. You can check
https://github.com/xwiki/xwiki-platform/blob/master/xwiki-platform-core/xwiki-platform-wysiwyg/xwiki-platform-wysiwyg-client/src/main/java/org/xwiki/gwt/wysiwyg/client/plugin/macro/MacroCall.java
.

(2) Write a plugin for the WYSIWYG editor from Java, but for this
you'll have to recompile the editor and thus you'll end up with a
custom editor, which is harder to maintain over time and may cause
upgrade headaches.

Hope this helps,
Marius


 Thanks in advance.


 Kind regards,

 Mahomed






 ___
 users mailing list
 users@xwiki.org
 http://lists.xwiki.org/mailman/listinfo/users
___
users mailing list
users@xwiki.org
http://lists.xwiki.org/mailman/listinfo/users