Extension:ImageMapConversion

MediaWiki extensions manual - list

Image Map Conversion Release status: stable
Implementation	Special page
Description	This special page converts HTML image maps to inline-format image maps
Author(s)	Michael Daly
Last version	1.3 (2009-03-15)
MediaWiki	1.13 or newer
License	GPLv2
Download	See Download section
Check usage and version matrix

The Image Map Conversion Special Page is used to convert HTML format image map information into inline Imagemap format. The input to this utility can be:

• HTML code containing image map information
• Files created by image map utilities (listed below) containing image map HTML code
• Files compatible for input to file-based image maps or to Shannon McNaught's <imagemap> extension

The output can be used in the official Wikipedia ImageMap extension.

This Special Page can make it easy to convert your wiki from McNaught's <imagemap> extension to the inline <imagemap> extension. It also allows you to use many different HTML utilities to generate the image map data from an image.

This extension will not convert server-side imagemap data such as MAP-CERN, MAP-NSCA and SIP formats.

Latest version

Version 1.3, released on 2009-03-15, fixes a couple of bugs discussed on this extension's talk page.

• URLs that include a section reference following a # (e.g. http://example.com/wiki/Mypage#section_foo) are no longer mangled.
• Non-conforming map files created by products such as MS Visio will no longer pass through "polygon" instead of "poly". Now, if a shape looks more or less like the one required, it will be converted to the correct spelling as required by Imagemap. For example, polygon will be converted to poly, rectangle to rect, def to default and so on.
• A default area with nohref will no longer produce an error. The line will simply be ignored. It will not be commented out and passed through.
• A problem with handling some HTML comments (that I thought was included in the last revision) is now in this revision.

Usage

When you open the page, you will see a text input line for a local file under the header Source filename:. Input a valid path and file name for a local file containing image map HTML statements. Alternatively, click the Browse button and use the local computer's file dialog to select a local file.

If the file contains both <area> and <a> HTML statements, you can select Allow mixed <A> and <AREA> tags to be converted if you wish both sets to be converted. If you do not select this option, area statements will be ignored and only <a> statements will be converted (as per W3 standards).

When you have input the required file path and name and checked or unchecked the selection, click on Submit. The text area below the input area will display either an error message or the converted output.

In order to use the output, mark the converted text and copy the content. Paste the content onto the page you are creating and add the remaining <imagemap> information.

Note:

• By local file, this means a file contained on the file system local to the computer. That is any file accessible by the local computer's operating system in a directory on the computer or mapped to the computer (such as a file on a server directly accessible to the computer). It is not a URL to a file on a remote computer. If a URL works, it is not by intention but by luck. YMMV.
• This extension assumes the file supplied by the user contains valid, functioning HTML. This extension does not validate or correct the HTML. If the HTML contains errors. the resulting output cannot be assured to be any good.
• You can specify an entire web page HTML file. Only the first set of map statements will be processed. If more than one set of map statements exist and you wish to convert them all, you will have to split the file into parts with one set of map statements in each.
• All statements outside of <map> and </map> are ignored.
• All statements between <map> and </map> that are not map related statements will be converted to comments preceded by a #.
• Links in an HTML file are either relative or absolute URLs. You will likely have to change these to either local page links or to absolute URLs to be used in the imagemap extension.
• Due to security provisions in HTML, it is not possible to keep the path and filename the user inputs displayed in the input field after the page is submitted. For this reason, the input path and filename is copied to another text field below the Submit button. This will allow the user to copy this string back into the input field rather than having to work though the client's operating system file dialogs.

Installation

1. Download the extension files, Create a directory titled ImageMapConversion under the /extensions/ directory, and place all the downloaded files in the ImageMapConversion folder.

Changes to LocalSettings.php

Add the following to the end of the LocalSettings.php file:

require_once( "$IP/extensions/ImageMapConversion/SpecialImageMapConversion.php" );

Download

Please download the files from:

my SVN site

Upgrading from the beta version

The current version no longer requires JavaScript in MediaWiki:Common.js. If you are replacing the beta version with the current one, delete the JavaScript from MediaWiki:Common.js.

The code to delete from MediaWiki:Common.js is:

/* START of javascript for the ImageMapConversion extension  */<br>
function imagemapGetFilePathAndName()<br>
{<br>
document.getElementById('localfile').value = document.getElementById('inputHtml').value;<br>
return;<br>
}<br>
/* END of javascript for the ImageMapConversion extension  */<br>

If you are using an older version of MediaWiki (prior to 1.9) you will have put this JavaScript in MediaWiki:Monobook.js.

See also

This special page prepares input for ImageMap as used on Wikipedia.

HTML Image Map Generators

There are utilities available that will generate the client-side map and area statements with the coordinate data. You can specify the image and select points on the image to define a shape. The utility will calculate the coordinates of these points and write out the appropriate HTML statements. This makes it easy to generate the map files. Here are a few examples - none of these are specifically sanctioned and are only offered as suggestions. You can use a search engine to find others.

• Clickable Image Map Maker. This web page allows the user to select an image file on his own local hard drive, then creates a second page using that image, and allows the user to very quickly generate the HTML code for an imagemap to be used in his own files. It also offers some handy pop-up menus to speed the process of coding the actual href. Complicated maps can be created in less than a minute (no kidding). Requires a Javascript and frames capable browser, designed and tested on a Mac using Netscape Navigator.
• Mapedit is a WYSIWYG editor for imagemaps, available for Microsoft Windows and the X Window System. Use Mapedit to generate, or convert to, NCSA, CERN, or client-side map files.
• Meracl ImageMap Generator is a free map Imagemap generator.
• GIMP - The GNU Image Manipulation Program