Orbeon Forms community mailing list

Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Modifying the YUI Rich Text Editor buttons

Posted by Alessandro Vernet on
URL: https://discuss.orbeon.com/Modifying-the-YUI-Rich-Text-Editor-buttons-tp998305p1016412.html

Ethan,

Got it. One thing that puzzle me though: you might get the YUI RTE to generate non-HTML tags, but then the RTE will feed those to the browser for display, and I am not sure what browsers will do. Some browsers might just strip them, and even if they don't, they most likely won't render the  as bold. You don't think that would be a problem?

Alex


On Jan 15, 2010, at 6:30 AM, Ethan Gruber <[hidden email]> wrote:

No, it's not valid HTML, so I added it to the permissible elements in clean-html.xsl.  I'm trying to overhaul the editor to allow an XML standard other than HTML.  There may be a validation function in the yuiRTE that prevents non-HTML elements, so I created a thread on the yahoo developer forums to get more info.  I'll report back here with anything useful.

Ethan

On Thu, Jan 14, 2010 at 10:57 PM, Alessandro Vernet <[hidden email]> wrote:
Ethan,

The HTML coming from the client gets cleaned-up to avoid code injections as soon as it arrives on the server. See:


The tag emph is not valid, isn't it? Did you want to generate the em tag instead?

Alex



On Jan 12, 2010, at 2:03 PM, Ethan Gruber <[hidden email]> wrote:

Thanks.  I have added a very simple custom button based on the example on the yuiRTE documentation website.  I tested the button to insert the html <b>This is text</b> into the editor.  That worked.  Then I changed it to <emph>This is text</emph>.  I added the emph element into the list of allowable elements in clean-html.xsl.  After clicking the button to insert <emph>This is text</emph>, the instance inspector shows that it stripped out the tags.  I'm trying to figure out at this point whether this is happening on the yui javascript side or on the Orbeon side.

Has anyone else on the list customized the RTE to add buttons to insert unique non-HTML elements?

Ethan

On Tue, Jan 12, 2010 at 3:20 PM, Dave McIntyre <[hidden email][hidden email]> wrote:
What we did was replace the toolbar with a reduced set of buttons, and change some of the labels of the buttons: nothing fancy at all.

YUI_RTE_CUSTOM_CONFIG = {
    height: '300px',
    width: '100%',
    autoHeight: false,
    html: '<html><head><title>{TITLE}</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />'
         + '<link rel="stylesheet" type="text/css" href="' + window.location.href.split(window.location.pathname)[0] + '/forms/renderer/css/editor.css">'
         + '<style>{CSS}</style><style>{HIDDEN_CSS}</style><style>{EXTRA_CSS}</style></head><body onload="document.body._rteLoaded = true;">{CONTENT}</body></html>',
    toolbar: {
        collapse: true,
        buttonType: 'basic',
        buttons: [
            { group: 'parastyle', label: 'Paragraph Style',
                buttons: [
                { type: 'select', label: 'Normal', value: 'heading',
                    menu: [
                        { text: 'Normal', value: 'p', checked: true },
                        { text: 'Section', value: 'h2' },
                        { text: 'Subsection', value: 'h3' }
                    ]
                }
                ]
            },
            { type: 'separator' },
            { group: 'textstyle', label: 'Font Style',
                buttons: [
                    { type: 'push', label: 'Bold CTRL + SHIFT + B', value: 'bold' },
                    { type: 'push', label: 'Italic CTRL + SHIFT + I', value: 'italic' },
                    { type: 'push', label: 'Underline CTRL + SHIFT + U', value: 'underline' }
                ]
            },
            { type: 'separator' },
            { group: 'indentlist', label: 'Lists',
                buttons: [
                    { type: 'push', label: 'Create an Unordered List', value: 'insertunorderedlist' },
                    { type: 'push', label: 'Create an Ordered List', value: 'insertorderedlist' }
                ]
            }
        ]
    }
};

Ethan Gruber wrote:
Hi Dave, can you tell me if the buttons you added/modified were for HTML, or did you change the syntax to some non-HTML XML schema.

Thanks,
Ethan

On Wed, Jan 6, 2010 at 7:09 PM, Alessandro Vernet <[hidden email][hidden email]> wrote:
Ethan,

It would be good to figure out why. The nightly builds are quite stable now, and we're getting very close to cutting a release from a nightly build (yes, yes, I know you heard that before!). I'd be interested to know more about the problem, if you get a chance to investigate this further.

Alex



On Jan 6, 2010, at 3:47 PM, Ethan Gruber <[hidden email][hidden email]> wrote:

I've tried the nightly build, but my application doesn't work at all in the nightly build.  I don't even get a descriptive error.

On Wed, Jan 6, 2010 at 6:28 PM, Alessandro Vernet <[hidden email][hidden email]> wrote:
Ethan,

rteConfig is there in the latest code (nightly builds).

Alex



On Jan 6, 2010, at 1:39 PM, Ethan Gruber <[hidden email][hidden email]> wrote:

Thanks for the replies.  To clarify, this is the xforms.js in Orbeon 3.7.1?  I followed the directions for extracting the ops folder from the jar into WEB-INF/resources, but the string "rteConfig" is not in the file anywhere.  I do find where the toolbar is defined in xforms.js, but I'm not quite sure where the button functions are defined.  The function that defines what the "Bold" button does is not in this file, it seems.  I'd like to get the hang of the yuiRTE by first changing bold and italic from <b> and <i> to the syntax that I require--<emph render="bold"> and <emph render="italic">.  After adapting the current buttons to the new syntax, then I will understand how to add new ones.

Thanks,
Ethan

On Tue, Jan 5, 2010 at 9:31 PM, Dave McIntyre <[hidden email][hidden email]> wrote:
I made a change along these lines a while ago.  In xforms.js, replace the declaration of yuiRTE with something like

            // Create RTE object, using a default config unless YUI_RTE_CUSTOM_CONFIG is defined
            var config = {
                // Don't set width/height (done in CSS)
            };
            var yui_config_type_check = typeof YUI_RTE_CUSTOM_CONFIG;
            if (yui_config_type_check != 'undefined') {
                config = YUI_RTE_CUSTOM_CONFIG;
            }
           
            var yuiRTE = new YAHOO.widget.Editor(control, config);

and then include some suitable javascript declaration of the variable YUI_RTE_CUSTOM_CONFIG.  However, I seem to recall that this involved some other tweaks to arrange that xforms.js gets loaded with defer="defer" so that the variable is available to be checked.



Alessandro Vernet wrote: 
Ethan,

For this, you will only need to change the code in xforms.js. Like you
said, that file is in a jar file, so you'll want to extract it, and
put the extracted file, which you will modify, in your resources,
under the same path, so it overrides the one in the jar file. You'll
find more on JavaScript development for Orbeon Forms here:

http://wiki.orbeon.com/forms/doc/contributor-guide/javascript-development

Then in xforms.js search for rteConfig, and you'll find the place
where the RTE toolbar is initialized. As you'll see, this has not been
designed for extensibility ;), so let us know if you have suggestions
on how to make the RTE more easily configurable.

Alex

On Monday, January 4, 2010, Ethan Gruber [hidden email][hidden email][hidden email]> wrote:
  
Hello,

I'd like to modify the YUI RTE code to add plugins for a new set of buttons, which should be possible according to here: http://developer.yahoo.com/yui/editor/#toolbar .  Has anyone sucessfully done this before?  Where do I get started?  I assume the js is contained in a jar file.

Thanks,
Ethan

--

Dave McIntyre Development Team Lead
[hidden email][hidden email]
P: +64 9 638 0600
M: +64 21 212 8087
F: +64 9 638 0699
S: <a href="callto:dave.mcintyre" target="_blank">dave.mcintyre
www.orionhealth.com


This e-mail and any attachments are intended only for the person to whom it is addressed and may contain privileged, proprietary, or other data protected from disclosure under applicable law. If you are not the addressee or the person responsible for delivering this to the addressee you are hereby notified that reading, copying or distributing this transmission is prohibited. If you have received this e-mail in error, please telephone us immediately and remove all copies of it from your system. Thank you for your co-operation.


__________ Information from ESET NOD32 Antivirus, version of virus signature database 4746 (20100105) __________

The message was checked by ESET NOD32 Antivirus.

http://www.eset.com


--
You receive this message as a subscriber of the [hidden email][hidden email] mailing list.
To unsubscribe: [hidden email][hidden email]
For general help: [hidden email][hidden email]
OW2 mailing lists service home page: http://www.ow2.org/wws


--
You receive this message as a subscriber of the [hidden email][hidden email] mailing list.
To unsubscribe: mailto:[hidden email][hidden email]
For general help: mailto:[hidden email][hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws



--
You receive this message as a subscriber of the [hidden email][hidden email] mailing list.
To unsubscribe: [hidden email][hidden email]
For general help: [hidden email][hidden email]
OW2 mailing lists service home page: http://www.ow2.org/wws


--
You receive this message as a subscriber of the [hidden email][hidden email] mailing list.
To unsubscribe: mailto:[hidden email][hidden email]
For general help: mailto:[hidden email][hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws



--

Dave McIntyre Development Team Lead
[hidden email][hidden email]
P: +64 9 638 0600
M: +64 21 212 8087
F: +64 9 638 0699
S: <a href="callto:dave.mcintyre" target="_blank">dave.mcintyre
www.orionhealth.com


This e-mail and any attachments are intended only for the person to whom it is addressed and may contain privileged, proprietary, or other data protected from disclosure under applicable law. If you are not the addressee or the person responsible for delivering this to the addressee you are hereby notified that reading, copying or distributing this transmission is prohibited. If you have received this e-mail in error, please telephone us immediately and remove all copies of it from your system. Thank you for your co-operation.


__________ Information from ESET NOD32 Antivirus, version of virus signature database 4765 (20100112) __________


The message was checked by ESET NOD32 Antivirus.

http://www.eset.com


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email][hidden email]
For general help: [hidden email][hidden email]
OW2 mailing lists service home page: http://www.ow2.org/wws


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email]
For general help: [hidden email]
OW2 mailing lists service home page: http://www.ow2.org/wws





--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Free forum by Nabble Edit this page