Extension:KidsEditor

From MediaWiki.org

Jump to: navigation, search
Manual on MediaWiki Extensions
List of MediaWiki Extensions
KidsEditor

Release status: unknown
Implementation Page action
Description  ?
Author(s) Mihu
Version  ? (Feb. 09, 2007)
MediaWiki  ?
Download  ?


Contents

[edit] Idea

To allow user edit w/ a Wysiwyg editor, in our case "FCKeditor".

  1. User clicked "edit" button
  2. Convert wikitext to HTML
  3. Load FCKeditor with converted HTML content
  4. User edited and clicked "save" button
  5. Convert HTML to wikitext and then save


[edit] Announce

I will ask author to see if they allow me to post the modified code. Please post in discussion page if you did actually try it. I will try to help, but maybe not how to install HTML::WikiConverter, which I am not sure how to do so and someone help me.


[edit] Progress

The idea is actually working but it's heavily depend on other application.

I will clean up my code and posted it asap.

If you get any questions or suggestions, please feel free to post in "discussion" place.


[edit] Test on

  • 1.9
  • 1.8.2


[edit] Requirements

This are the requirements to make everything work, but each of them may have their own requirement, such as HTML::WikiConverter might require php perl extension.

Please make sure each of the following item work before you go futhers.

  1. InstaView [ cur version ] [ dev version ]
  2. FCKeditor
  3. HTML::WikiConverter
  4. Perl required for HTML::WikiConverter
  5. PHP Perl Extension required for HTML::WikiConverter


[edit] Steps

  • Install FCKeditor by following the instructions.
  • Save the javascript source code from link as instaview.js in the "extensions" folder.

(skip ... just install those items mentioned above)


[edit] InstaView Part

  • To remove the original function of instaview by comment the following part
var oldPreview = document.getElementById('wpPreview');
... ( skip ) ...
oldPreview.value = 'Classic Preview';
  • and add the following code right after to the comment part
document.getElementById('editpage-copywarn').innerHTML += 
    '<div style="display: none; margin: 5px 0 5px 0; padding: 5px; border: 2px solid orange;" id="InstaViewDump"></div>';
  • To fix FCKeditor image display problem, you need to fix the path of image. In instaview.js file, find "InstaView.conf=" and add the path to image inside the quote of images:
  • and also comment the following code inside of "with(InstaView.conf)"
paths.images = 'http://upload.wikimedia.org/wikipedia/' + wiki.lang + '/'
  • find the following code inside of the function "make_image"
return f("<a class='image' ? href='?'>?</a>", (caption!='')? "title='" + caption + "'" : '', 
         InstaView.conf.paths.articles + InstaView.conf.locale.image + ':' + filename, img);
  • replace with the following code
return f("?", img);


[edit] FCKeditor Part

  • To add InstaView into FCKeditor, you need to find the following code within FCKeditor.php
$wgOut->addScript( "<script type=\"text/javascript\" src=\"$wgScriptPath/$wgFCKEditorDir/fckeditor.js\"></script>\n" )

and add the following code

$wgOut->addScript("<script type=\"text/javascript\" src=\"extensions/instaview.js\"></script>");
  • and add the following code to the function "onLoadFCK" which just just below the previous section
InstaView.dump('wpTextbox1', 'InstaViewDump'); 
document.getElementById(\"wpTextbox1\").value = document.getElementById(\"InstaViewDump\").innerHTML;


[edit] HTML::WikiConverter part

  • (WARNING) You need to touch the core file in order to make this whole thing works.
  • modify includes/EditPage.php file and find the following code inside of importFormData function
$this->textbox1 = $this->safeUnicodeInput( $request, 'wpTextbox1' );
  • and add the following code (WARNING) You should have perl php extension and HTML:WiKiConverter installed.
dl('perl.so');
        
$perl = new Perl();
ob_start(); 
        
$perl->eval('use HTML::WikiConverter;'.
            'my $wc = new HTML::WikiConverter( dialect => \'MediaWiki\', wiki_uri => \'/wiki/index.php\' );'.
            'my $html = "' . str_replace( '"','\"', $this->textbox1 ) . '";'. 
            'print $wc->html2wiki( $html );'); 

$this->textbox1 = ob_get_contents();

ob_end_clean();
Retrieved from "http://www.mediawiki.org/wiki/Extension:KidsEditor"
Personal tools