CCM NG: Integration of ccm-editor with Bebop
git-svn-id: https://svn.libreccm.org/ccm/ccm_ng@5204 8810af33-2d31-482b-a856-94f89814c4dfccm-docs
parent
f99fbf108d
commit
831e4ce400
|
|
@ -1,8 +1,8 @@
|
|||
requirejs(["./ccm-editor",
|
||||
"../node_modules/requirejs-domready/domReady!"],
|
||||
"../webjars/requirejs-domready/2.0.1/domReady!"],
|
||||
function(editor, doc) {
|
||||
|
||||
editor.addEditor(".editor", {
|
||||
editor.addEditor(".editor-textarea", {
|
||||
"actionGroups": [
|
||||
{
|
||||
"name": "blocks",
|
||||
|
|
@ -40,6 +40,8 @@ requirejs(["./ccm-editor",
|
|||
}
|
||||
],
|
||||
"settings": {
|
||||
"ccm-editor-css.path": "/libreccm/ccm-editor/ccm-editor.css",
|
||||
"font-awesome.path": "/libreccm/webjars/font-awesome/4.7.0/css/font-awesome.min.css",
|
||||
"formatBlock.blocks": [
|
||||
{
|
||||
"element": "h3",
|
||||
|
|
|
|||
|
|
@ -23,7 +23,6 @@ import com.arsdigita.bebop.parameters.ParameterModel;
|
|||
import com.arsdigita.bebop.parameters.StringParameter;
|
||||
|
||||
import org.arsdigita.cms.CMSConfig;
|
||||
import org.librecms.contentsection.ContentSection;
|
||||
|
||||
/**
|
||||
*
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ public class CMSConfig {
|
|||
*/
|
||||
@Setting
|
||||
private List<String> dhtmlEditorConfig = Arrays.asList(new String[]{
|
||||
"Xinha.Config", "/assets/xinha/CCMcmsCinhaConfig.js"});
|
||||
"ccm-editor.loader", "/ccm-editor/ccm-editor-loader.js"});
|
||||
|
||||
/**
|
||||
* Defines which plugins to use, e.g.TableOperations,CSS Format:
|
||||
|
|
|
|||
|
|
@ -70,13 +70,14 @@ public final class BebopConfig {
|
|||
private Set<String> dhtmlEditors = new HashSet<>(
|
||||
Arrays.asList(new String[]{BebopConstants.BEBOP_XINHAEDITOR,
|
||||
BebopConstants.BEBOP_FCKEDITOR,
|
||||
BebopConstants.BEBOP_DHTMLEDITOR}));
|
||||
BebopConstants.BEBOP_DHTMLEDITOR,
|
||||
BebopConstants.BEBOP_CCMEDITOR}));
|
||||
|
||||
@Setting
|
||||
private String defaultDhtmlEditor = BebopConstants.BEBOP_XINHAEDITOR;
|
||||
private String defaultDhtmlEditor = BebopConstants.BEBOP_CCMEDITOR;
|
||||
|
||||
@Setting
|
||||
private String dhtmlEditorSrcFile = "/assets/xinha/XinhaLoader.js";
|
||||
private String dhtmlEditorSrcFile = "/ccm-editor/ccm-editor-loader.js";
|
||||
|
||||
@Setting
|
||||
private Boolean showClassName = false;
|
||||
|
|
|
|||
|
|
@ -30,24 +30,29 @@ import com.arsdigita.web.Web;
|
|||
import com.arsdigita.xml.Element;
|
||||
|
||||
/**
|
||||
* Displays and manages a WYSIWYG HTML editor that takes advantage of DHTML scripting features. This
|
||||
* class can use: - <a href="http://www.xinha.org>Xinha</a>
|
||||
* - <a href="http://www.fckeditor.net">FCKeditor</a>
|
||||
* - HTMLarea for backwards compatibility, development discontinued Editor is choosen based on the
|
||||
* config parameter waf.bebop.dhtml_editor, default is "Xinha", which is the successor of HTMLarea
|
||||
* Displays and manages a WYSIWYG HTML editor that takes advantage of DHTML
|
||||
* scripting features. This class can use:
|
||||
* <ul>
|
||||
* <li>CCM Editor, a new editor using HTML5 features.</li>
|
||||
* <li><a href="http://www.xinha.org">Xinha</a></li>
|
||||
* <li><a href="http://www.fckeditor.net">FCKeditor</a></li>
|
||||
* <li>HTMLarea for backwards compatibility, development discontinued</li>
|
||||
* </ul>
|
||||
* Editor is chosen based on the configuration parameter
|
||||
* {@code waf.bebop.dhtml_editor} default is {@code ccm-editor}.
|
||||
*
|
||||
* @author Jim Parsons
|
||||
* @author Richard Li
|
||||
* @author Chris Burnett
|
||||
* @author Alan Pevec
|
||||
* @author <a href="mailto:jens.pelzetter@googlemail.com">Jens Pelzetter</a>
|
||||
*
|
||||
* @version $Id$
|
||||
*/
|
||||
public class DHTMLEditor extends TextArea {
|
||||
|
||||
/**
|
||||
* Constant for specifying <tt>OFF</tt> value for the <tt>WRAP</tt> attribute of this image
|
||||
* input.
|
||||
* Constant for specifying <tt>OFF</tt> value for the <tt>WRAP</tt>
|
||||
* attribute of this image input.
|
||||
*
|
||||
* See <a href="http:
|
||||
* //developer.netscape.com/docs/manuals/htmlguid/tags10.htm#1340340">here</a>
|
||||
|
|
@ -56,8 +61,8 @@ public class DHTMLEditor extends TextArea {
|
|||
public static final int OFF = 0;
|
||||
|
||||
/**
|
||||
* Constant for specifying <tt>HARD</tt> value for the <tt>WRAP</tt> attribute of this image
|
||||
* input.
|
||||
* Constant for specifying <tt>HARD</tt> value for the <tt>WRAP</tt>
|
||||
* attribute of this image input.
|
||||
*
|
||||
* See <a href="http://
|
||||
* developer.netscape.com/docs/manuals/htmlguid/tags10.htm#1340340">here</a>
|
||||
|
|
@ -66,8 +71,8 @@ public class DHTMLEditor extends TextArea {
|
|||
public static final int HARD = 1;
|
||||
|
||||
/**
|
||||
* Constant for specifying <tt>SOFT</tt> value for the <tt>WRAP</tt> attribute of this image
|
||||
* input. See <a href="http://
|
||||
* Constant for specifying <tt>SOFT</tt> value for the <tt>WRAP</tt>
|
||||
* attribute of this image input. See <a href="http://
|
||||
* developer.netscape.com/docs/manuals/htmlguid/tags10.htm#1340340">here</a>
|
||||
* for a description of what this attribute does.
|
||||
*/
|
||||
|
|
@ -80,22 +85,31 @@ public class DHTMLEditor extends TextArea {
|
|||
|
||||
// WARNING: Processing of these default values by CMSConfig does NOT
|
||||
// work correctly because of deviciencies in unmarshal method there.
|
||||
public static final Config STANDARD = new Config("Xinha.Config",
|
||||
"/assets/xinha/CCMcoreXinhaConfig.js");
|
||||
public static final Config XINHA_STANDARD = new Config("Xinha.Config",
|
||||
"/assets/xinha/CCMcoreXinhaConfig.js");
|
||||
|
||||
/**
|
||||
* Example FCKEditor configuration.
|
||||
*/
|
||||
public static final Config FCK_STANDARD = new Config("FCKEditor.Config.StyleDefault",
|
||||
"/assets/fckeditor/config/fckconfigstyledefault.js");
|
||||
public static final Config FCK_STANDARD = new Config(
|
||||
"FCKEditor.Config.StyleDefault",
|
||||
"/assets/fckeditor/config/fckconfigstyledefault.js");
|
||||
|
||||
public static final Config FCK_CMSADMIN = new Config("FCKEditor.Config.StyleCMSAdmin",
|
||||
"/assets/fckeditor/config/fckconfigstylecmsadmin.js");
|
||||
public static final Config FCK_CMSADMIN = new Config(
|
||||
"FCKEditor.Config.StyleCMSAdmin",
|
||||
"/assets/fckeditor/config/fckconfigstylecmsadmin.js");
|
||||
|
||||
/**
|
||||
* Example old HTMLarea configuration.
|
||||
*/
|
||||
public static final Config HTMLAREA = new Config("HTMLArea.Config", null);
|
||||
public static final Config HTMLAREA
|
||||
= new Config("HTMLArea.Config", null);
|
||||
|
||||
/**
|
||||
* Example of configuration for ccm-editor
|
||||
*/
|
||||
public static final Config STANDARD = new Config("ccm-editor.loader",
|
||||
"/ccm-editor/ccm-editor-loader.js");
|
||||
|
||||
private String m_name;
|
||||
private String m_path;
|
||||
|
|
@ -183,7 +197,7 @@ public class DHTMLEditor extends TextArea {
|
|||
|
||||
public String getEditorURL() {
|
||||
return BebopConfig.getConfig().getDhtmlEditorSrcFile().substring(
|
||||
0,
|
||||
0,
|
||||
BebopConfig.getConfig().getDhtmlEditorSrcFile().lastIndexOf("/") + 1);
|
||||
}
|
||||
|
||||
|
|
@ -211,7 +225,8 @@ public class DHTMLEditor extends TextArea {
|
|||
/**
|
||||
* Prevent the specified button from being displayed in the editor toolbar.
|
||||
*
|
||||
* @param name name of the button, as specified in the btnList of the htmlarea.js file
|
||||
* @param name name of the button, as specified in the btnList of the
|
||||
* htmlarea.js file
|
||||
*
|
||||
*/
|
||||
public void hideButton(String name) {
|
||||
|
|
@ -261,7 +276,8 @@ public class DHTMLEditor extends TextArea {
|
|||
/**
|
||||
* The XML tag.
|
||||
*
|
||||
* @return The tag to be used for the top level DOM element generated for this type of Widget.
|
||||
* @return The tag to be used for the top level DOM element generated for
|
||||
* this type of Widget.
|
||||
*/
|
||||
@Override
|
||||
protected String getElementTag() {
|
||||
|
|
@ -284,9 +300,12 @@ public class DHTMLEditor extends TextArea {
|
|||
editor.addAttribute("name", getName());
|
||||
generateDescriptionXML(state, editor);
|
||||
|
||||
// Set the needed config params so they don't have to be hardcoded in the theme
|
||||
editor.addAttribute("editor_url", Web.getWebappContextPath().concat(getEditorURL()));
|
||||
editor.addAttribute("editor_src", Web.getWebappContextPath().concat(getEditorSrc()));
|
||||
// Set the needed config params so they don't have to be hardcoded in
|
||||
//the theme
|
||||
editor.addAttribute("editor_url",
|
||||
Web.getWebappContextPath().concat(getEditorURL()));
|
||||
editor.addAttribute("editor_src",
|
||||
Web.getWebappContextPath().concat(getEditorSrc()));
|
||||
|
||||
if (value != null) {
|
||||
editor.setText(value);
|
||||
|
|
@ -297,7 +316,8 @@ public class DHTMLEditor extends TextArea {
|
|||
Element config = editor.newChildElement("bebop:config", BEBOP_XML_NS);
|
||||
config.addAttribute("name", m_config.getName());
|
||||
if (m_config.getPath() != null) {
|
||||
config.addAttribute("path", Web.getWebappContextPath().concat(m_config.getPath()));
|
||||
config.addAttribute("path", Web.getWebappContextPath().concat(
|
||||
m_config.getPath()));
|
||||
}
|
||||
if (m_hiddenButtons.size() > 0) {
|
||||
|
||||
|
|
@ -314,7 +334,8 @@ public class DHTMLEditor extends TextArea {
|
|||
Iterator plugins = m_plugins.iterator();
|
||||
while (plugins.hasNext()) {
|
||||
String name = (String) plugins.next();
|
||||
Element plugin = editor.newChildElement("bebop:plugin", BEBOP_XML_NS);
|
||||
Element plugin = editor
|
||||
.newChildElement("bebop:plugin", BEBOP_XML_NS);
|
||||
plugin.addAttribute("name", name);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,9 +19,8 @@
|
|||
package com.arsdigita.bebop.util;
|
||||
|
||||
/**
|
||||
* An interface that contains all the Bebop
|
||||
* constants that are used by Bebop components in generating the
|
||||
* output XML.
|
||||
* An interface that contains all the Bebop constants that are used by Bebop
|
||||
* components in generating the output XML.
|
||||
*
|
||||
* @author Jim Parsons
|
||||
* @version $Id: BebopConstants.java 1224 2006-06-18 22:28:30Z apevec $
|
||||
|
|
@ -29,38 +28,39 @@ package com.arsdigita.bebop.util;
|
|||
public interface BebopConstants {
|
||||
|
||||
String BEBOP_CHECKBOXGROUP = "bebop:checkboxGroup";
|
||||
String BEBOP_CHECKBOX = "bebop:checkbox";
|
||||
String BEBOP_DATE = "bebop:date";
|
||||
String BEBOP_DATETIME = "bebop:datetime";
|
||||
String BEBOP_TIME = "bebop:time";
|
||||
String BEBOP_MULTISELECT = "bebop:multiSelect";
|
||||
String BEBOP_OPTION = "bebop:option";
|
||||
String BEBOP_RADIOGROUP = "bebop:radioGroup";
|
||||
String BEBOP_RADIO = "bebop:radio";
|
||||
String BEBOP_SELECT = "bebop:select";
|
||||
String BEBOP_TEXTAREA = "bebop:textarea";
|
||||
String BEBOP_DHTMLEDITOR = "bebop:dhtmleditor";
|
||||
String BEBOP_FCKEDITOR = "bebop:fckeditor";
|
||||
String BEBOP_XINHAEDITOR = "bebop:xinha";
|
||||
String BEBOP_FORMWIDGET = "bebop:formWidget";
|
||||
String BEBOP_FORMERRORS = "bebop:formErrors";
|
||||
String BEBOP_PORTAL = "bebop:portal";
|
||||
String BEBOP_PORTLET = "bebop:portlet";
|
||||
String BEBOP_BOXPANEL = "bebop:boxPanel";
|
||||
String BEBOP_CELL = "bebop:cell";
|
||||
String BEBOP_COLUMNPANEL = "bebop:columnPanel";
|
||||
String BEBOP_GRIDPANEL = "bebop:gridPanel";
|
||||
String BEBOP_BORDER = "bebop:cell";
|
||||
String BEBOP_PAD = "bebop:pad";
|
||||
String BEBOP_PADFRAME = "bebop:padFrame";
|
||||
String BEBOP_PANELROW = "bebop:panelRow";
|
||||
String BEBOP_LIST = "bebop:list";
|
||||
String BEBOP_TABLE = "bebop:table";
|
||||
String BEBOP_TABLEBODY = "bebop:tbody";
|
||||
String BEBOP_TABLEROW = "bebop:trow";
|
||||
String BEBOP_SEG_PANEL = "bebop:segmentedPanel";
|
||||
String BEBOP_SEGMENT = "bebop:segment";
|
||||
String BEBOP_SEG_BODY = "bebop:segmentBody";
|
||||
String BEBOP_SEG_HEADER = "bebop:segmentHeader";
|
||||
String BEBOP_CHECKBOX = "bebop:checkbox";
|
||||
String BEBOP_DATE = "bebop:date";
|
||||
String BEBOP_DATETIME = "bebop:datetime";
|
||||
String BEBOP_TIME = "bebop:time";
|
||||
String BEBOP_MULTISELECT = "bebop:multiSelect";
|
||||
String BEBOP_OPTION = "bebop:option";
|
||||
String BEBOP_RADIOGROUP = "bebop:radioGroup";
|
||||
String BEBOP_RADIO = "bebop:radio";
|
||||
String BEBOP_SELECT = "bebop:select";
|
||||
String BEBOP_TEXTAREA = "bebop:textarea";
|
||||
String BEBOP_DHTMLEDITOR = "bebop:dhtmleditor";
|
||||
String BEBOP_FCKEDITOR = "bebop:fckeditor";
|
||||
String BEBOP_XINHAEDITOR = "bebop:xinha";
|
||||
String BEBOP_CCMEDITOR = "bebop:ccmeditor";
|
||||
String BEBOP_FORMWIDGET = "bebop:formWidget";
|
||||
String BEBOP_FORMERRORS = "bebop:formErrors";
|
||||
String BEBOP_PORTAL = "bebop:portal";
|
||||
String BEBOP_PORTLET = "bebop:portlet";
|
||||
String BEBOP_BOXPANEL = "bebop:boxPanel";
|
||||
String BEBOP_CELL = "bebop:cell";
|
||||
String BEBOP_COLUMNPANEL = "bebop:columnPanel";
|
||||
String BEBOP_GRIDPANEL = "bebop:gridPanel";
|
||||
String BEBOP_BORDER = "bebop:cell";
|
||||
String BEBOP_PAD = "bebop:pad";
|
||||
String BEBOP_PADFRAME = "bebop:padFrame";
|
||||
String BEBOP_PANELROW = "bebop:panelRow";
|
||||
String BEBOP_LIST = "bebop:list";
|
||||
String BEBOP_TABLE = "bebop:table";
|
||||
String BEBOP_TABLEBODY = "bebop:tbody";
|
||||
String BEBOP_TABLEROW = "bebop:trow";
|
||||
String BEBOP_SEG_PANEL = "bebop:segmentedPanel";
|
||||
String BEBOP_SEGMENT = "bebop:segment";
|
||||
String BEBOP_SEG_BODY = "bebop:segmentBody";
|
||||
String BEBOP_SEG_HEADER = "bebop:segmentHeader";
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -145,7 +145,13 @@ export class CCMEditor {
|
|||
const headElem: Element = document.getElementsByTagName("head").item(0);
|
||||
const styleElem: Element = document.createElement("link");
|
||||
styleElem.setAttribute("rel", "stylesheet");
|
||||
styleElem.setAttribute("href", "libreccm-editor.css");
|
||||
if ("ccm-editor-css.path" in this.configuration.settings) {
|
||||
styleElem
|
||||
.setAttribute("href",
|
||||
this.configuration.settings["ccm-editor-css.path"]);
|
||||
} else {
|
||||
styleElem.setAttribute("href", "ccm-editor.css");
|
||||
}
|
||||
headElem.appendChild(styleElem);
|
||||
|
||||
//Check if Fontawesome is already loaded. If not add it
|
||||
|
|
@ -153,7 +159,15 @@ export class CCMEditor {
|
|||
|
||||
const fontawesomeElem: Element = document.createElement("link");
|
||||
fontawesomeElem.setAttribute("rel", "stylesheet");
|
||||
fontawesomeElem.setAttribute("href", "node_modules/font-awesome/css/font-awesome.min.css");
|
||||
if ("font-awesome.path" in this.configuration.settings) {
|
||||
fontawesomeElem
|
||||
.setAttribute("href",
|
||||
this.configuration.settings["font-awesome.path"]);
|
||||
} else {
|
||||
fontawesomeElem
|
||||
.setAttribute("href",
|
||||
"node_modules/font-awesome/css/font-awesome.min.css");
|
||||
}
|
||||
headElem.appendChild(fontawesomeElem);
|
||||
}
|
||||
|
||||
|
|
@ -186,7 +200,7 @@ export class CCMEditor {
|
|||
console.log("Selection changed.");
|
||||
const selection: Selection = document.getSelection();
|
||||
for(const key in this.actions) {
|
||||
|
||||
|
||||
this.actions[key].selectionChanged(selection);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
<xsl:variable name="first-match">
|
||||
<xsl:value-of select="//bebop:dhtmleditor/@name"/>
|
||||
</xsl:variable>
|
||||
<xsl:if test="@name=$first-match">
|
||||
<xsl:if test="@name=$first-match">
|
||||
|
||||
<script type="text/javascript">
|
||||
_editor_url = "/assets/htmlarea/";
|
||||
|
|
@ -267,7 +267,7 @@
|
|||
<xsl:value-of select="//bebop:xinha/@name"/>
|
||||
</xsl:variable>
|
||||
|
||||
<xsl:if test="@name=$first-match">
|
||||
<xsl:if test="@name=$first-match">
|
||||
|
||||
<script type="text/javascript">
|
||||
_editor_url = "<xsl:value-of select="@editor_url"/>";
|
||||
|
|
@ -320,4 +320,21 @@
|
|||
<xsl:value-of disable-output-escaping="no" select="text()"/>
|
||||
</textarea>
|
||||
</xsl:template>
|
||||
|
||||
<xsl:template match="bebop:ccmeditor">
|
||||
|
||||
<script data-main="{@editor_src}"
|
||||
src="{$context-prefix}/webjars/requirejs/2.3.5/require.min.js" />
|
||||
<textarea id="ta_{@name}"
|
||||
name="{@name}"
|
||||
class="editor-textarea"
|
||||
rows="{@rows}"
|
||||
cols="{@cols}"
|
||||
wrap="{@wrap}">
|
||||
<xsl:value-of disable-output-escaping="no"
|
||||
select="text()" />
|
||||
</textarea>
|
||||
|
||||
</xsl:template>
|
||||
|
||||
</xsl:stylesheet>
|
||||
|
|
|
|||
Loading…
Reference in New Issue