As discussed previously, I need an automated way to put
clickable (i.e., client-side image-mapped) images on wiki
pages. Jan Steinman showed me a cute way to do this (see
below), using raw HTML. Although I've gotten it to work
for me, I've found some oddities in the way that addresses
(e.g., file names, URLs) get interpreted.
What I'm hoping for is a way to use some relatively short
and simple addresses for the images and associated pages.
Ideally, I'd be able to get to uploaded images, using a
name such as 'Image:Segwayabbeyroad.jpg', rather than
having to use my own directory or reverse engineer path
names such as 'images/3/3a/Segwayabbeyroad.jpg'.
I realize that I'm off in an unsupported area, but perhaps
some of you have had (and resolved) similar issues. Any
helpful advice will be greatly appreciated.
I have two copies of the image, located at:
images/3/3a/Segwayabbeyroad.jpg
images_raw/Segwayabbeyroad.jpg
The saved page can be viewed at
http://www.cfcl.com/rdm/MW/index.php/IM_X1
Here's the code for the page:
=============================
This image shows up.
[[Image:Segwayabbeyroad.jpg]]
<RawHtml>
<p> These two images, not surprisingly, don't show up at all.
<p>A <img src='Image:Segwayabbeyroad.jpg'
usemap='#foo'>
<p>B <img
src='http://www.cfcl.com/rdm/mediawiki/index.php?title=Image:Segwayabbe…
usemap='#foo'>
<p> These two images only show up in preview mode.
<p>C <img src='images/3/3a/Segwayabbeyroad.jpg'
usemap='#foo'>
<p>D <img src='images_raw/Segwayabbeyroad.jpg'
usemap='#foo'>
<p> These two images show up in both preview and save mode.
<p>E <img
src='http://www.cfcl.com/rdm/mediawiki/images_raw/Segwayabbeyroad.jpg…
usemap='#foo'>
<p>F <img src='/rdm/mediawiki/images_raw/Segwayabbeyroad.jpg'
usemap='#foo'>
<p> The left-most image-map links (George, Paul) work in preview mode,
but not after a "Save page". The other two work in both modes.
<map name="foo">
<area coords=" 0, 0, 83, 199"
href="?title=George">
<area coords=" 84, 0,167, 199"
href="./index.php?title=Paul">
<area coords="168, 0,251, 199"
href="/rdm/mediawiki/index.php?title=Ringo">
<area coords="252, 0,332, 199"
href="/rdm/mediawiki/index.php?title=John">
</map>
</RawHtml>
=============================
Finally, here's RawHtml.php:
=============================
<?php
# RawHtml.php - raw HTML extension
#
# Defines the tag pair <RawHtml></RawHtml>.
# Sends the content out without any processing.
#
# To use, include this file into your LocalSettings.php
# To configure, set members of $wgRawHtml after the inclusion.
#
# include 'RawHtml.php';
#
# $wgRawHtml = array('JoeUser', 'JoeUserBot')
#
# Adapted from code by Jan Steinman <Jan(a)Bytesmiths.com>
class raw_html_settings { };
$wgRawHtml = new raw_html_settings;
$wgExtensionFunctions[] = 'wf_raw_html_ext';
function wf_raw_html_ext() {
global $wgParser;
$wgParser->setHook('RawHtml', 'render_raw_html');
}
function render_raw_html($raw_html_src, $style='') {
return $raw_html_src;
}
?>
=============================
--
http://www.cfcl.com/rdm Rich Morin
http://www.cfcl.com/rdm/resume rdm(a)cfcl.com
http://www.cfcl.com/rdm/weblog +1 650-873-7841
Technical editing and writing, programming, and web development