Extension:Fotonotes

Overview
I (Dallan) have modified Fotonotes to work with MediaWiki. Fotonotes provides a really cool way to annotate images online. With this extension, you can add annotations when editing an Image: page, and they will show up when displaying the Image: page. The annotations are stored inside a tag in the edit box.

Installing this extension requires making some (simple) changes to the MediaWiki source files, so I'm not sure if this should be categorized as a hack, an extension, or what. Also, I've never posted an extension before, so if I'm doing something wrong, please let me know.

I've tested this with MediaWiki 1.7.1 but it hasn't been tested extensively so let me know if you find any bugs. Also, I don't consider myself a javascript expert or a php expert so let me know if you see anything that could be improved.

You can see an example of a slightly-modified version of this extension/hack at:

Installation
To install this hack/extension, here's what you need to do:

$wgOut->addHTML( ' ' . $anchoropen . 			  "getVal( 'image' ) ).'" />' . $anchorclose . ' ' );
 * Download the fotonotes script and untar it somewhere. This extension is based upon FNClient-0.6.0.
 * Create a new "fotonotes" directory under "skins/common/images" in your MediaWiki installation, and copy the files from "fnclient-0.6.0/fnclientlib/styles/artwork" into the new "fotonotes" directory.
 * Append the style directives from this css file to the end of "skins/monobook/main.css". I've only tested this with the monobook skin.
 * Copy the files Fotonotes.php and FotonotesExt.php to your extensions directory.
 * Edit your LocalSettings.php file to require the FotonotesExt.php file.
 * Copy the file fnclientwiki.js to whatever directory your $wgScriptPath points to.
 * You need to make the following change to the openShowImage function in ImagePage.php: Just after the addHTML call,
 * add the lines:

global $wgScriptPath; $wgOut->addHTML(" ");
 * This hack/extension needs to show the image when the page is being edited. Therefore, you'll need to make the following changes near the bottom of function showEditForm in EditPage.php:
 * Remove "{$toolbar}" from the line

$wgOut->addHTML( << END );
 * Add a new runhook about 10 lines later (after the hidden input fields), and add "{$toolbar}" to the existing addHTML call just below it:

wfRunHooks('ArticleEditShow', array(&$this));

$wgOut->addHTML( << END . htmlspecialchars( $this->safeUnicodeOutput( $this->textbox1 ) ) . " " );

Further Changes for PHP 4
To get this extension working under PHP4 you need to change Fotonotes.php
 * Change private $img; to var $img;
 * Remove the private or public declarations from the front of all the functions.
 * Change the declaration for function __construct($title) to function Fotonotes($title)

As part of my effort to integrate this into our Intranet Wiki I made some changes that allow you to use wiki tags within your notes and have them rendered, e.g. an internal link to a page is displayed properly. Modified PHP4 versions of the scripts are available here: FotonotesExt-v1.1-PHP4.php, Fotonotes-v1.1-PHP4.php. Save them as FotonotesExt.php and Fotonotes.php rather than using the naming convention I've used here.

Licensing
The fnclientwiki.js extends the original fnclient.js file found in Fotonotes and is therefore relased under the same license that Fotonotes is released under: Open Source License v2.1 or later. The Fotonotes.php and FotonotesExt.php files are released under the GPL. The fnclient.js (and also fnclientwiki.js) files include the DragResize script, which is copyright 2005-2006 Angus Turnbull TwinHelix Designs and is licensed under the GNU LGPL, version 2.1 or later.