Extension:FCKeditor (by Mafs)/HTML::WikiConverter

From MediaWiki.org

Manual on MediaWiki Extensions
List of MediaWiki Extensions

FCKeditor (HTML::WikiConverter) Release status: unknown
Implementation	Page action
Description	using the FCKeditor for editing wiki pages
Author(s)	Christian (cneubauerTalk)
MediaWiki	1.5.8
License	No license specified
Download	See below

Using HTML::WikiConverter, we can get around some of the problems discussed in FCKeditor, namely, storing HTML in the database instead of wikitext. There might still be problems with this method...

Contents 1 Requirements 2 Installation 3 MediaWiki Code Changes 3.1 EditPage.php 3.2 Parser.php 4 FCKeditor Code Changes 5 Related links

[edit] Requirements

1. FCKeditor
2. Perl
3. HTML::WikiConverter
4. The PHP Perl extension - For more info, see [1]. If you are using something like XAMPP, you probably already have the extension and just need to uncomment it in your php.ini file.

[edit] Installation

1. Install perl.
   • If you are using Windows try ActivePerl. It should be pretty straightforward. Double click to install.
   • If you are using Linux/Unix, there is a good chance you already have perl. If not, you can get ActivePerl for your system or try compiling from source. Thats about the best I can do.
2. Install WikiConverter from CPAN or whereever. (How would you do this on a windows machine? Wonderfullyrich 16:50, 17 April 2007 (UTC))
   • If you have the CPAN package manager (you should) run perl -MCPAN -e 'install Bundle::HTMLWikiConverter'. If you are behind a proxy or firewall or something you are going to have to get more advanced help, here for exemple.
   • If you don't have CPAN, you can download the WikiConverter source and compile if yourself. See [2] for more info.
   • Alternately, you might be able to install the .pm file (which is in the source package) directly if you can figure out which directory to put it in (maybe C:\Perl\lib\HTML).
3. Install the php perl extension.
   • For Windows, download the file from [3] and copy it to your php extensions directory. There is a good chance its already there especially if you are using a package like XAMPP.
   • Find your php.ini file (for xampp its in xampp/apache/bin) and add an include line to your php.ini file. It should look like

     extension=php_perl.dll
     

   • In case are using ActiveState's ActivePerl, copy the perl##.dll (where ## is the version number) from the perl bin directory to some php reachable directory (apache's main dir, or php's main one should work).
4. Unzip FCKeditor to a directory on your web server.
   • I use htdocs/fckeditor. Once you have this unzipped, you have to point your editor.BasePath at it. See below.

Hope that helps.

[edit] MediaWiki Code Changes

[edit] EditPage.php

In EditPage.php->importFormData() (line 218 in 1.5.8) add:

  $perl = new Perl();
  ob_start(); 
  $perl->eval('use HTML::WikiConverter;'.
              'my $wc = new HTML::WikiConverter( dialect => \'MediaWiki\', wiki_uri => \'PATHTOYOURWIKI\' );'.
              'my $html = "' . str_replace( '"','\"', $this->textbox1 ) . '";'. 
              'print $wc->html2wiki( $html );'); 
  $this->textbox1 = ob_get_contents();
  ob_end_clean();

Make sure to change PATHTOYOURWIKI to the correct value. This will make internal wiki links work correctly. (Note: I use the relative path /wiki/index.php. Using an absolute path like localhost/wiki/index.php didn't work for me.)

Next, down where the form is added (line ~716 in 1.5.8 after the above text is added) replace:

$wgOut->addHTML( <<<END
{$toolbar}
<form id="editform" name="editform" method="post" action="$action"
enctype="multipart/form-data">
{$commentsubject}
<textarea tabindex='1' accesskey="," name="wpTextbox1" rows='{$rows}'
cols='{$cols}'{$ew}>
END
. htmlspecialchars( $this->safeUnicodeOutput( $this->textbox1 ) ) .
"

with:

  $text = str_replace("\n",'',str_replace('"','\"',$this->safeUnicodeOutput( $wgOut->parse( "__NOHEADERANCHORS__\n__NOEDITSECTION__\n__NOTOC__" . $this->textbox1 ) ) ) );
  $wgOut->addHTML("<form id=\"editform\" name=\"editform\" method=\"post\" action=\"$action\" enctype=\"multipart/form-data\">\r\n".
    "<script type=\"text/javascript\" src=\"/fckeditor/fckeditor.js\"></script> \r\n".
    "<script type=\"text/javascript\" src=\"/fckeditor/fckconfig.js\"></script> \r\n".
    "<script type=\"text/javascript\"> \r\n".
    "  var editor = new FCKeditor( 'wpTextbox1' ); \r\n".
    "  editor.BasePath	= '/fckeditor/'; \r\n".
    "  editor.Height	= 300; \r\n".
    "  editor.Value = \"{$text}\"; \r\n".
    "  editor.ToolbarSet = 'Wiki'; \r\n". 
    "  editor.Create(); \r\n".
    "</script> \r\n" . "

Note: You have to add in the noeditsection and notoc magic words or the TOC and section links will show up in FCKeditor.

[edit] Parser.php

In Parser, you can add a new magic word to prevent automatic anchor creation in rendered text. This will prevent them from showing up in the FCKeditor which you don't want. Add the following around line 2479 (line 3028 for v.1.6.3):

  /* add the new __NOHEADERANCHORS__ magic word */
  define('MAG_NOHEADERANCHORS', 100);
  global $wgVariableIDs, $wgMagicWordsEn;
  $wgVariableIDs[] = MAG_NOHEADERANCHORS;
  $wgMagicWordsEn[MAG_NOHEADERANCHORS] = array( 0, '__NOHEADERANCHORS__');

  /* if the magic word is present then set the variable */
  $doMakeHeaderAnchors = true;
  $mw =& MagicWord::get( MAG_NOHEADERANCHORS );
  if( $mw->matchAndRemove( $text ) ) {
    $doMakeHeaderAnchors = false;
  }

Note: Alternately, the new magic word code can be put in your Language.php and MagicWord.php files where it really belongs. Its included here so that you don't have to modify as many files.

Later around line 2666 (v.1.6.3 line 3228) (after you've added the above code), change:

  @$head[$headlineCount] .= "<a name=\"$anchor\"></a><h".$level.$matches[2][$headlineCount] .$headline.'</h'.$level.'>';

to:

  if($doMakeHeaderAnchors) {
    @$head[$headlineCount] .= "<a name=\"$anchor\"></a>";
  }
  # give headline the correct <h#> tag
  @$head[$headlineCount] .= '<h'.$level.$matches[2][$headlineCount] .$headline.'</h'.$level.'>';

[edit] FCKeditor Code Changes

The FCKeditor standard toolbar set has some features that can't be used in the wiki like forms and flash objects. You will probably also want to add a new toolset to FCKeditor config file, fckconfig.js. Something like:

FCKConfig.ToolbarSets["Wiki"] = [
        ['Source','DocProps','-','Save','-','Templates'],
        ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
        ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
        ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
        ['OrderedList','UnorderedList','-','Outdent','Indent'],
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
        ['Link','Unlink'],
        ['Table','Rule','SpecialChar','UniversalKey'],
        '/',
        ['Style','FontFormat','FontName','FontSize'],
        ['TextColor','BGColor'],
        ['About']
] ;

Note: The 'UniversayKey' generated an Error for me

          Unknown toolbar item "UniversalKey"

just remove it from the list

[edit] Related links

wclEditor - An implementation that also stores data as wikitext instead of html but also supports run-time switching between wikitext and visual editing without reloading a page. Beta version.