Tech:FCKEditor Integration

ktip.png This page (and all pages in the Tech: namespace) is a developer discussion about a feature that is either proposed for inclusion in JAMWiki or one that has already been implemented. This page is NOT documentation of JAMWiki functionality - for a list of documentation, see Category:JAMWiki.
Status of this feature: NOT IMPLEMENTED. Some code has been written, but due to technical issues this feature is proving extremely difficult to implement fully. See below for discussion.
Contents

[Edit]Description

MediaWiki+FCKEditor is a Javascript-based GUI editor that offers an interface suitable for rich editing. Integrating this editor as an option for JAMWiki would provide a much simpler interface for new users to use when creating and editing wiki pages.

Extension:FCKeditor (Official) looks much better then MediaWiki+FCKEditor. —The preceding comment was added by 80.156.24.165 (comments • contribs) .
Thanks! -- Ryan • (comments) • 24-Aug-2010 07:50 PDT

[Edit]Author(s)

[Edit]Status

[Edit]Initial version

Initial code committed on /branches/ronin.

[Edit]Update 26-June-2010

I've gotten a proof-of-concept version that uses MediaWiki+FCKEditor with minimal configuration changes working locally. It appears that the toughest part of this work will be integrating the Mediawiki extension with JAMWiki in a non-obtrusive way:

  • This editor needs to be optional.
  • It shouldn't affect core JAMWiki code in any way.
  • I don't want to modify the Mediawiki plugin - it's much easier to allow that project to be maintained completely separately.
  • It should be simple to install and configure for users who want it.
  • Mediawiki functionality that isn't supported or needed needs to be removed.

I suspect that this is something that will actually be done for JAMWiki 1.0.0 (finally!) but it may take some time to think through all of the issues and actually get this implemented. -- Ryan • (comments) • 26-Jun-2010 10:02 PDT

[Edit]Update 30-October-2010

I've started committing code for this integration in revision 3257. The integration will be using elements of the pre-built implementation from the CKEditor project. A few comments on that decision:

This integration may be a bit rockier initially than I'd like - much of the Mediawiki plugin has PHP dependencies that obviously won't be useful in a Java-based wiki like JAMWiki, so things like templates and image uploads probably won't be supported initially, if ever. I'm still in the process of building out a working integration, so it's possible that an unforeseen problem might cause the whole integration to be scrapped. That said, it looks like it should be possible to create at least a basic integration, making JAMWiki much more accessible to non-technical editors than it was previously. -- Ryan • (comments) • 30-Oct-2010 12:27 PDT

[Edit]Update 13-November-2010

I've gotten a bit further, but have hit a significant snag - the FCKEditor integration does not seem to handle metadata like __NOTOC__, HTML comments or categories. I'm sure there will be other deficiencies, but this is a major one. One workaround would be to add something like a "WYSIWYG" mode to the parser, but I definitely don't like the idea of changing core parser code to support an editor. I'll give this more attention, but it's possible that this issue could lead to a JAMWiki 1.0.0 release that still does not include a WYSIWYG editor. -- Ryan • (comments) • 13-Nov-2010 12:19 PST

[Edit]Comments

A few quick review comments:

  • jamwiki-core shouldn't have a dependency on bliki, if possible. The jamwiki-core package is used outside of JAMWiki by projects that simply want a Mediawiki parser, so I'd like to minimize dependencies as much as possible. Ideally it would be nice to create the FCKEditor integration as an addon, but that can be cleaned up later if needed.
  • JAMWiki 0.7.0 added the ability for users to choose different editors, so edit.jsp can still specify the toolbar, and simply add an addition option for FCK. To do so modify /jamwiki-war/src/main/resources/jamwiki-configuration.xml to add another editor, and that editor can then be selected as the "preferred editor" from Special:Account. Admins can also specify it as the "default editor" from Special:Admin.
  • It would be nice to refactor the EditServlet changes in a way so that they are configurable, based on the editor being used - for example, I prefer to edit directly by entering wiki syntax, and I'm sure others would probably prefer not to be forced to use a GUI editor.

I suspect you've already thought through some of these items, so please ignore anything that's not relevant. I didn't want to change anything on your branch, but if you want me to jump in and make a few updates to allow easier configuration or anything like that let me know - it's definitely cool to see this proceeding. -- Ryan • (comments) • 25-Mar-2009 20:01 PDT

I worked originally on 0.6.7 which has no editor preferences, and I didn't get time to look through new features. I'll be happy to let you make changes in my branch. Please go ahead.--ronin
I've looked at tinyMCE - http://tinymce.moxiecode.com too. once we can close FCKeditor, I'll work on tinyMCE integration.--ronin 28-Mar-2009 01:48 PDT.
The FCKeditor-2.3.jar referenced in branch is generated from recompiled FCKeditor.java 2.3 source with patch - http://dev.fckeditor.net/attachment/ticket/1552/1552.patch) to detect webkit and opera correctly.--ronin
I should have some time this afternoon to go through the code and make a few updates to get it in sync with the latest 0.7.0 developments - sorry it's taken so long! -- Ryan • (comments) • 29-Mar-2009 07:27 PDT
I get Unable to load tag handler class "com.fredck.FCKeditor.tags.FCKeditorTag" for tag "fck:editor" when I try to run this code. I tried adding the FCK java-core to the POM (see below), but the taglib TLD is referencing classes that aren't in the java-core-2.4.1.jar file. Is there a config missing or am I doing something wrong? -- Ryan • (comments) • 29-Mar-2009 19:34 PDT
	<dependency>
		<groupId>net.fckeditor</groupId>
		<artifactId>java-core</artifactId>
		<version>2.4.1</version>
	</dependency>
could you resolve it yet? I don't think there is any need for java-core. I've already included FCKeditor-2.3.jar in /jamwiki-war/src/main/webapp/WEB-INF/lib/ with no dependency other than commons-fileupload. it builds for me alright.--ronin 30-Mar-2009 14:39 PDT
FCKeditor-2.3.jar doesn't end up in the WAR file that is generated when I build your branch - I'll try to investigate this tomorrow, but if you have any ideas please feel free to commit whatever changes you feel are needed. Sorry this is taking a bit long, but life has gotten crazy since I've returned from vacation... -- Ryan • (comments) • 30-Mar-2009 22:36 PDT
I spent fifteen minutes looking at this again last night - I'm trying to figure out if there's a Maven repository that can be added to the pom.xml file to include the necessary JAR file in the JAMWiki WAR, but haven't had any luck thus far. If anyone else can get this working I'd be grateful, otherwise I guess we can manually include the needed JAR file in the SVN repository. -- Ryan • (comments) • 01-Apr-2009 07:58 PDT
Ryan, I do maintain the FCKeditor.Java code. Scanning through your post I don't understand the problem. You simply have to declare the dependency and define the taglib in the JSP. Please check out the demo war file I have provided and the official site (java.fckeditor.net). My account 'mosipov' does not seem to be accessible :-( Mike
Ryan, there are 2 reasons I didn't go by maven repo route. 1) I'm using an old version 2.3 of FCKeditor.Java code 2) I had to recompile it for webkit/opera fix. If you can checkout branch code and have a look at build.sh in branch root, which I use to build and deploy code. It copies /jamwiki-war/src/main/webapp/WEB-INF/lib/FCKeditor-2.3.jar to final war file. I'm not sure how you are building the code.--ronin 01-Apr-2009 19:40 PDT
That explains it - I wasn't getting any FCKEditor java files in the final build, but I was using the standard Maven build commands. Thanks for the clarification; I'll take a closer look and get it working locally. -- Ryan • (comments) • 01-Apr-2009 20:01 PDT
Hi Ronin - first, I'm really, really sorry I've been so slow with feedback. I checked my local copy of your branch and I don't see a FCKeditor-2.3.jar file in it. Should I be obtaining that file from some other source? Where do I download it from? I looked at the build.sh and Quickbuild.sh files but both reference local sources. You had indicated that you were using a customized version with a patch for webkit/opera, so I assume it's not the standard version available from fckeditor.net. Sorry for the confusion and the slow feedback. -- Ryan • (comments) • 02-Apr-2009 21:04 PDT
Hi Ryan, I forgot to commit lib folder as it didn't show up as uncommited folder in subclipse(WEB-INF/lib is in svn:ignore). I apologize for wasting so much of your time. It should work now ---ronin 03-Apr-2009 12:48 PDT

If Fckeditor isn't working out - how about TinyMCE?

Thanks for the pointer - I'm hoping to revisit the GUI editor integration in the next 1-2 months and will definitely look at any alternative options that people can suggest. I don't personally use GUI editors for wiki editing, but I know this is a major issue for many installations and want to put something in place as soon as possible. -- Ryan • (comments) • 13-Dec-2009 18:48 PST

No worries. Another option that could be better is to GWTify your app. http://gwt.google.com/samples/Showcase/Showcase.html#!CwRichText It's maybe not as sexy as FCKEditor or TinyMCE but it's java (kind of) and it's rock solid. Integration should be a snap.

Any chance the GWT RTE could make it into 0.9? Signed --Forever grateful.

At this point the 0.9.0 cycle is winding down, so it's looking pretty unlikely that I'll personally get around to integrating a GUI editor for 0.9.0. As a result I suspect that this may slip yet again unless someone else can come up with a way to do the integration without breaking existing code or introducing significant complexity, be it with GWT or some other solution. A GUI editor that submits content in Mediawiki syntax has proven surprisingly difficult, although as always if another developer wants to take this and run with it they're welcome to do so, let's just make sure we discuss the approach first to ensure that it meets the "no significant complexity" and "don't break existing code" guidelines noted previously. -- Ryan • (comments) • 27-Mar-2010 20:43 PDT

[Edit]Simple way to add fckeditor as Jamwiki editor

Simple way to add fckeditor as Jamwiki editor , You don't need to recomplie any code.

[Edit]modify WEB-INF\jsp\edit.jsp

you are needs to add some code like this:

...
<c:choose>
           <c:when test="${editor == 'toolbar'}">
                     <%@ include file="editor-toolbar-include.jsp" %>
           </c:when>
           <c:when test="${editor == 'fckeditor'}">
                     <%@ include file="editor-fckeditor-include.jsp" %>
           </c:when>
</c:choose>
   <c:choose>
              <c:when test="${editor == 'toolbar'}">
  <p>
<textarea id="topicContents" name="contents" rows="25" cols="80" accesskey=",">
<c:out value="${contents}" escapeXml="true" /></textarea>
 </p>
     </c:when>
   </c:choose>
...

[Edit]create WEB-INF\jsp\editor-fckeditor-include.jsp

<%@ taglib uri="http://java.fckeditor.net" prefix="FCK" %>

<script type="text/javascript">

                                function FCKeditor_OnComplete(editorInstance) {

                                           window.status = editorInstance.Description;

                                }

                     </script>

<FCK:editor instanceName="contents">

<jsp:attribute name="value">${contents}</jsp:attribute>

</FCK:editor>

[Edit]modify WEB-INF\classes\jamwiki-configuration.xml

...
<editors>
           <editor>
                     <name>None</name>
                     <key>none</key>
           </editor>
           <editor>
                     <name>Toolbar</name>
                     <key>toolbar</key>
           </editor>
           <editor>
                     <name>FCKEditor</name>
                     <key>fckeditor</key>
           </editor>
</editors>
...

[Edit]add fckeditor-java files

  1. unzip fckeditor-java-demo-2.6.war
  2. copy WEB-INF\lib and WEB-INF\classes folder to jamwiki \WEB-INF folder
  3. copy fckeditor folder to jamwiki \ folder\
  4. it will looks like this
jamwiki\
        +->fckeditor
        +->WEB-INF\
                  +->lib\
                        \commons-fileupload-1.2.1.jar
                        \commons-io-1.3.2.jar
                        \imageinfo-1.9.jar
                        \java-core-2.6.jar
                        \slf4j-api-1.5.8.jar
                        \slf4j-simple-1.5.8.jar
                  +->classes\
                            \fckeditor.properties

[Edit]restart your app server

(If you install Jamwiki on Tomcat)

  1. shutdown your tomcat
  2. startup your tomcat

[Edit]select your default editor

  1. click the page Special:Account at your jamwiki
  2. select your Preferred editor
you can select the option - FCKEditor
then click "Save" button

[Edit]finish to add editor to jamwiki

  • Now you can create new page to edit it then save it , you can see its work.
  • If you don't like FCKEditor , your can go back to Special:Account at your jamwiki
    reselect your Preferred editor like "Toolbar"

[Edit]some issue

  • ISSUE-01: If you edit some page use wiki notation , then use FCKEditor to edit it ,
    FCKEditor will broke it
  • ISSUE-02: FCKEditor provide its file upload method , but if you use it to upload image file , image file will upload to the wiki server , but you can't use it in your wiki.
    Because jamwiki disallow use <img src...> notation.

[Edit]Sorry for my poor english

Sorry Again.

[Edit]Comments

Thanks for this! I'll take a closer look over the coming days. My only concern would be whether or not the fckeditor-java-demo-2.6.war package is generating HTML or wiki markup, since if it generates HTML then some features (like categories and wikilinks) would then be unavailable. However, the integration with the MediaWiki+FCKEditor package is very similar to what you've described, and that package generates wiki markup using FCKEditor, so it should be just as easy to include. Thanks again for the suggestions! -- Ryan • (comments) • 01-Jul-2010 08:54 PDT


This MediaWiki+FCKEditor package , I found it was be modified to support wiki syntax , you can see it has a button (Wiki Text) , but needs to modify fckeditor source code. -- nobody ; 02-Jul-2010 09:07


Had a look at FCKEditor, and it's successor CKEditor. It seems like there isn't much activity + alot of bugs in that project. So I thought I'd point out a few other links / alternatives: wikis in gwt and wave rich text editor.

Here is another link: round trip render engine

Thanks for the links. I looked at a few of them, but am leaning towards the Mediawiki+FCKEditor implementation mentioned above simply because the work for it is already done - all that would need to be done to integrate that with JAMWiki would be to deploy it as an add-on and customize the configuration. That said, if I've overlooked something and one of these other solutions would be easier to implement please follow-up. -- Ryan • (comments) • 25-Jul-2010 08:59 PDT

I had a look at the Xwiki editor and it's a huge thing dependencies so I think staying away from that is definitely a good choice. I did find a few other things: gwt-html-editor wysiwyg js-wiki-framework. If you are willing to remove wikitext markup from jamwiki entirely, I could probably join the project and build you something alot better than gwt-html-editor but keeping that (wikitext) in and trying to roundtrip between them (esp in the browser) seems like alot of complexity, though wikiwyg could be decent... The demo it ships with seems to work ok.

The markup is actually very, very important - without it there is no way to implement templates, references, wikilinks, categories, custom tags, etc. As a result a WYSIWYG editor implementation becomes significantly more complex, although Mediawiki+FCKEditor seems to do a good job of converting between the two syntaxes. -- Ryan • (comments) • 30-Jul-2010 06:07 PDT

Touche. Thanks for the feedback.

[Edit]Wikia WYSIWYG editor

Archived from the Feedback page:

I haven't had any time to play around with trying to integrate a WYSIWYG editor into JAMWiki but I thought it might be worthwhile to note that Wikia's use of their editor (I don't know which one they use) seems to be pretty sophisticated and they appear to have worked out or be in the process of working out accomodations with some of the higher-level MediaWiki functionality like templates and image embedding. --Floating World 01-Feb-2010 08:37 PST

Thanks! Every time I look at the work required to implement a WYSIWYG editor properly it's been daunting, so I'll take a look at what Wikia has done in the hopes that it can be re-used. -- Ryan • (comments) • 01-Feb-2010 11:41 PST