Markup Editor Contrib Package

Add some helper functionality to the edit textarea (auto-indent, some markup). This is not a Wysiwyg-Editor it just helps with typing markup. Have a look at the demo to see the difference.

Summary of Contents

This little javascript extension adds a editor toolbar to the edit textarea and will auto-indent code typed in the area on a return. The auto-indent comes in especially handy when you have a ul or ol list that is nested to depth 4 or 5 and you are getting tired to hitting space 12 or 15 times.

At the moment the toolbar supports: H1, H2, H3, B, I, OL, UL, increasing the indentation of the selected lines, unindenting the selected lines, HR, link and table.

The javascript is based on WackoWiki's WikiEdit by Roman Ivanov.

It has been tested on Opera 8.52, IE6 and Firefox 1.5. Bug reports are welcome on MarkupEditorContribDev.

Installation Instructions

• Download the ZIP file from the Plugin web (see below)
• Unzip MarkupEditorContrib.zip in your twiki installation directory.
• Make sure that all files are readable by the web server user
• Modify the edit-template of the skin you want to use (e.g. edit.pattern.tmpl) by adding (the templatescript TMPL:DEF is already partially there):

%TMPL:DEF{"templatescript"}%
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/TWikiJavascripts/twiki_edit.js"></script>

<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/protoedit.js"></script>
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/wikiedit2.js"></script>
        
<script type="text/javascript">       
addLoadEvent(function() {
   wE = new WikiEdit(); 
   wE.init('topic','','edname', '%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/');
})      
</script>
%TMPL:END%

%TMPL:DEF{"templatejavascript"}%
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/TWikiJavascripts/twiki_edit.js"></script>
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/protoedit.js"></script>
<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/wikiedit2.js"></script>
        
<script type="text/javascript">       
addLoadEvent(function() {
   wE = new WikiEdit(); 
   wE.init('topic','','edname', '%PUBURLPATH%/%TWIKIWEB%/MarkupEditorContrib/');
})      
</script>

Settings

• One line description:
  • Set SHORTDESCRIPTION = Add some helper functionality to the edit textarea (auto-indent, some markup).

• Name of the perl package
  • Set STUB = TWiki::Contrib::MarkupEditorContrib

Contrib Info

-- TWiki:Main/ChristopherOezbek - 01 Mar 2006

Added a Demo-URL and a new version that fixes some keyboard shortcuts, cleans up the About & Help screen and links directly to the Dev-topic to discuss bugs.

-- TWiki:Main/ChristopherOezbek - 07 Mar 2006

Removed keyboard shortcuts as they give problems with different browsers and keysettings (thanks to TWiki:Main/JohnFitzpatrick for reporting the issue). Changed TMPL:DEF entry to have more robust loading behavior (thanks to TWiki:Main/RyanKnoll for reporting this).

-- TWiki:Main/ChristopherOezbek - 09 Mar 2006