It is simple to swap in TinyMCE in the place of HTMLArea as a WYSIWYG editor in HyperContent 2.0; simply replace the file in the bootstrap repository at
/screens/modal-xml.xsl
with the attached version.
This can be also be done on a per-project basis. Just create a screens resource-directory in the project-definitions file as follows:
<resource-directory label="Screens XSL" path="/screens/*.xsl" publish="false"> <editor key="upload"/> <editor key="text"/> <content type="application/xml+xslt"/> </resource-directory>
Then upload the attached modal-xml.xsl and it will override the bootstrap version.
Please note that this change has not been thoroughly tested, but anecdotal reports indicates it works smoothly.
One of the really nice features of TinyMCE is the ability to apply stylesheets to content rather than use bold, italic, h1, etc tags. Unfortunately, do so requires a small patch to the server side code. Currently the NekoHtml parser is configured such that it doesn't pass through class, style, or id attributes. In order to apply css styles to text using TinyMCE you need to do the following. I haven't fully tested these changes, and not at all if the server side changes are made while using the original (htmlarea) editor. I recommend trying it out with a modal-xml.xsl file set up on a test project first.
In the tinyMCE.init section of the modified modal-xml.xsl file you need to include a content_css property. Ad the end of the cleanup_callback : "HCCleanup" line add a comma then a line something like the following:
content_css : "<xsl:value-of select="$rel-project-base"/>/stylesheets/uportal.css"});
Change /stylesheets/uportal.css to the actual stylesheet you want to use.
Next you need to make a modification to the org.hypercontent.xml.DocumentFactory class. At
about line 346 an ElementRemover object is instantiated. This object describes what elements and attributes
to accept or remove. Replace all the lines which begin with remover.acceptElement with the following:
remover.acceptElement("a",new String[]{"href","target","name","rel","shape","coords","title","id","class","style"}); remover.acceptElement("area",new String[]{"alt","coords","href","nohref","shape","target","id","class","style"}); remover.acceptElement("b",new String[]{"id","class","style"}); remover.acceptElement("big",new String[]{"id","class","style"}); remover.acceptElement("blockquote",new String[]{"cite","id","class","style"}); remover.acceptElement("br",new String[]{"id","class","style"}); remover.acceptElement("caption",new String[]{"id","class","style"}); remover.acceptElement("center",new String[]{"id","class","style"}); remover.acceptElement("code",new String[]{"id","class","style"}); remover.acceptElement("div",new String[]{"align","id","class","style"}); remover.acceptElement("em",new String[]{"id","class","style"}); remover.acceptElement("form",new String[]{"action","enctype","method","type","target","onsubmit","id","class","style"}); remover.acceptElement("h1",new String[]{"id","class","style"}); remover.acceptElement("h2",new String[]{"id","class","style"}); remover.acceptElement("h3",new String[]{"id","class","style"}); remover.acceptElement("h4",new String[]{"id","class","style"}); remover.acceptElement("h5",new String[]{"id","class","style"}); remover.acceptElement("h6",new String[]{"id","class","style"}); remover.acceptElement("hr",new String[]{"id","class","style"}); remover.acceptElement("i",new String[]{"id","class","style"}); remover.acceptElement("img",new String[]{"src","width","height","border","vspace","hspace","alt","title","align","ismap","usemap","id","class","style"}); remover.acceptElement("input",new String[]{"alt","align","checked","disabled","maxlength","name","readonly","src","size","type","value","id","class","style"}); remover.acceptElement("li",new String[]{"type","value","id","class","style"}); remover.acceptElement("map",new String[]{"id","name","id","class","style"}); remover.acceptElement("ol",new String[]{"compact","start","type","id","class","style"}); remover.acceptElement("option",new String[]{"disabled","label","selected","value","id","class","style"}); remover.acceptElement("p",new String[]{"align","id","class","style"}); remover.acceptElement("pre",new String[]{"width","id","class","style"}); remover.acceptElement("s",new String[]{"id","class","style"}); remover.acceptElement("select",new String[]{"disabled","multiple","name","size","id","class","style"}); remover.acceptElement("small",new String[]{"id","class","style"}); remover.acceptElement("span",new String[]{"id","class","style"}); remover.acceptElement("strike",new String[]{"id","class","style"}); remover.acceptElement("strong",new String[]{"id","class","style"}); remover.acceptElement("sub",new String[]{"id","class","style"}); remover.acceptElement("sup",new String[]{"id","class","style"}); remover.acceptElement("table",new String[]{"align","border","cellpadding","cellspacing","summary","width","id","class","style"}); remover.acceptElement("td",new String[]{"abbr","align","colspan","height","nowrap","rowspan","valign","width","id","class","style"}); remover.acceptElement("textarea",new String[]{"cols","rows","disabled","readonly","name","id","class","style"}); remover.acceptElement("th",new String[]{"abbr","align","colspan","height","nowrap","rowspan","valign","width","id","class","style"}); remover.acceptElement("tr",new String[]{"align","valign","id","class","style"}); remover.acceptElement("tt",new String[]{"id","class","style"}); remover.acceptElement("u",new String[]{"id","class","style"}); remover.acceptElement("ul",new String[]{"compact","type","id","class","style"}); remover.acceptElement("var",new String[]{"id","class","style"});
