wysiwyg wiki editor

[mlichman@…]

Allow users to switch between wiki markup edit mode and a wysiwyg editor such as fckeditor ala seedwiki (​http://www.seedwiki.com/wiki/online_teaching_and_learning_issues/online_teaching_and_learning_issues.cfm?wpid=&edit=yes&editorchoice=3)

[mgood]

This is an interesting idea, though it's a bit complicated since the WYSIWYG editors produce HTML output which would need translated back to Trac's Wiki syntax.

See the mailing list thread about this starting here: ​http://lists.edgewall.com/archive/trac/2005-June/003465.html

[mgood]

In #2212 the reporter mentioned ​Wikiwyg which is a Javascript library that handles the WYSIWYG editing and translation of the editor contents to Wiki markup. It looks like it allows overriding of the markup rules for the Wiki syntax.

Wikiwyg is licensed under the LGPL, so some care would need to be taken in how it was integrated since the core of Trac is BSD licensed.

[barry.scott@…]

The translation from HTML to Wiki has obviously been solved in the moin moin code.

[soloturn]

added WysiWyg page to discuss implementation possibilities.

[soloturn]

a first prototype to review the concept. save not implemented, convert to wiki not yet correct, seems not yet working in internet explorer

[soloturn]

i added an attachment to show how it could look like. its not a plugin (don't know how to do that). its a svn diff against trunk, revision 3136.

[soloturn]

i forgot to mention that the edit-button is not overwritten. the wikiwyg edit only comes up if you double click on a wiki page.

[cboos]

The patch you provided is a bit broken, as the added binary files are not in.
I'd suggest that instead, you should:

• provide a link to or attach a well identified wikiwyg release
• provide a patch against the above if you modify/add something to wikiwyg
• finally provide a patch against Trac with your 3 templates/*.cs files

Then, when the above is done, you're not far away to the point you could
package that in a plugin.

From a superficial look in the .cs, only the addition of the id="wikipage"
seems to require core Trac changes. If I understand correctly, this means
that there can be only one wikiwyg per page, which seems a bit limitative
(think Ticket edition, you have the comment and description textareas...).

That was for the form, then for the content. Well, I'm a bit afraid that
the Wiki formatter has grown a bit too complex to be adapted by just
filling the markupRules. This will certainly require a lot of work.

[soloturn]

the id="wikipage" is just an artificial restriction, because i just tried to extract a div tag which might be useful.

maybe you could take a look into ​mediawiki.js, functions media_wiki_init and klass.setup_wikiwyg_section? mediawiki has section edit and therefor must have solved this problem by default.

currently i just took trunk from ​http://svn.wikiwyg.net/code/trunk/wikiwyg/, r23, and flattened the lib,images, and css directories into the wikiwyg directory of the patch. but now that you say i think that was medium brilliant ;)

[mgood]

You don't need to add an id to the tag in order to get the DOM node. ​cssQuery is a convenient way to look up nodes using CSS-style selectors. You should be able to get the wiki editing fields like:

var wiki_editors = cssQuery("textarea.wikitext");

[anonymous]

the current approach is to double click on some text, and then you are able to edit it (if you are allowed to). then save, and you are done.

but class "wikitext" is on the textarea, AFTER somebody decided to edit (i.e. after clicking the edit button)?

[soloturn]

traciwyg (wikiwyg) plugin integration example

[anonymous]

thanks to alec i found now where to put the integration stuff. installation:

1. put the plugin in a trac instance plugin dir
2. apply the patch to trac-trunk
3. restart trac

useage: double click on wiki text, e.g. double click into the main page.

i uploaded the integration demo plugin. wikiwyg-0.5.zip should be removed. integration is done via:

$ svk diff //trac-trunk //mirror/trac-trunk
=== templates/wiki.cs
==================================================================
--- templates/wiki.cs   (/trac-trunk)   (revision 53)
+++ templates/wiki.cs   (/mirror/trac-trunk)    (revision 53)
@@ -197,7 +197,7 @@
     if wiki.action == "preview" ?>
      <fieldset id="preview">
       <legend>Preview (<a href="#edit">skip</a>)</legend>
-      <div id="wikipage" class="wikipage"><?cs var:wiki.page_html ?></div>
+      <div class="wikipage"><?cs var:wiki.page_html ?></div>
      </fieldset><?cs
      elif wiki.action =="collision"?>
      <div class="system-message">
@@ -273,7 +273,7 @@
    </form>
   <?cs /if ?>
   <?cs if wiki.action == "view" ?>
-   <div id="wikipage" class="wikipage">
+   <div class="wikipage">
     <div id="searchable"><?cs var:wiki.page_html ?></div>
    </div>
    <?cs if:len(wiki.attachments) ?>

the following things are not solved:

• save (not at all)
• html - wiki convert (just partially)
• image links for the buttons (are broken)

[soloturn]

uhm ... sorry. i did the diff in the wrong direction. the id=wikipage is the addition.

[ThurnerRupert]

see also ​th:WikiWygPlugin

[cboos]

Leaving this open in order to document what should be improved in the WikiEngine so that interoperability with Trac plugins can be improved.

[anonymous]

I wanted to note that there is working plugin called ​TinyMceWikiPlugin. I managed to get it working on 0.9.3 (pay close attention to the included README, for it includes one critical instruction not found at the above link!), and it is usable. However it does more-or-less permanently mangle the clean wikitext of any page it edits, so may not be workable for some uses.

However my efforts to get ​TinyMceWikiPlugin working on 0.10.x failed. Apparently a patch is needed, and one has been built, but as documented ​here, all links to it seem to be empty.

C'est la vie. The ​WikiWygPlugin approach would be far better (it emits true wiki text), but it's still in the over, and probably won't finish baking for several months at least.

[ellis@…]

Just wanted to CC myself, adding this comment to avoid spam detection.

[ThurnerRupert]

works now nearly flawless with ​th:TracWysiwygPlugin. thanks to japanese jun66j5 quality :)

[spstarr]

I would rather this not be closed unless this is an official merge into Trac?

Can someone confirm this is part of trac now or it will remain a trac-hack component?

[Drop_s@…]

Nice plugin! Thank author for the really good job.
We have started to use this plugin in our work. Before this plugin I tried to create some process specification using "plain" Wiki syntax. This was like in hell and we returned to MS Word.
I will add my review notes after full testing of the plugin functionality.

I am interesting, do you plan support of color text button?

[rblank]

Please move this discussion over to trac-hacks, close to the plugin itself. And to reply to comment:33, no this functionality will remain as a plugin.

[franz.mayer@…]

see also ​CkEditorPlugin, which is a Wysiwyg wiki editor plugin using the open-source ​CKEditor