[projectaon] Re: LW refresh - including illustrations!
- From: Jonathan Blake <blake.jon@xxxxxxxxx>
- To: projectaon@xxxxxxxxxxxxx
- Date: Thu, 5 Jan 2006 09:44:45 -0800
On 1/4/06, Ingo Kloecker <projectaon@xxxxxxxxxxxxxxxx> wrote:
> On Sunday 01 January 2006 21:57, Thomas Wolmer wrote:
> > Another illustration improvement is the clickable RNT Ingo made:
> >
> > http://www.projectaon.org/staff/ingo/imagemap/random.html
> >
> > I haven't figured out how to do this in the XML/XSL though. Jon, you
> > had some idea...?
>
> I'm wondering whether it wouldn't be easier to simple use a simple
> <table> for the RNT where all numbers are on an image with transparent
> background (or two images with the two different backgrounds) of there
> own. This way the RNT for the different books would be much easier to
> create. Something (in HTML) like
>
> <table>
> <tr>
> <td><a href="1.html"><img src="1grey.jpg" /></a></td>
> <td><a href="5.html"><img src="5white.jpg" /></a></td>
> <td><a href="7.html"><img src="7grey.jpg" /></a></td>
> <td><a href="3.html"><img src="3white.jpg" /></a></td>
> [...]
>
> Alternatively, we could completely omit any images and simply write the
> numbers as text.
Your comments got me thinking. We could put the burden of making the
image map solely on the XSL by simply making a table representation of
the image like so:
<section id="random">
<meta>...</meta>
<data>
<illustration ...>
<meta>...</meta>
<instance ... class="xhtml" .../>
<instance ... class="text" ...>
<table>
<tr><td>0</td><td>...</td></tr>
...
</table>
</instance>
</illustration>
</section>
<xsl:when test="$document-type='random'">
...
<xsl:for-each select="data/illustration">
<xsl:variable name="illustration-width"
select="instance[@class='html']/@width" />
<xsl:variable name="map-rect-width">
<xsl:number value="$illustration-width div 10"/>
</xsl:variable>
<xsl:variable name="illustration-height"
select="instance[@class='html']/@height" />
<xsl:variable name="map-rect-height">
<xsl:number value="$illustration-height div 10"/>
</xsl:variable>
...
<image ... usemap="randommap" .../>
<map name="randommap">
<xsl:for-each select="instance[@class='text']/table/tr">
<xsl:variable name="table-row" select="position()"/>
<xsl:for-each select="td">
<xsl:variable name="table-column" select="position()"/>
<area>
<xsl:attribute name="shape"><xsl:text>rect</xsl:text></xsl:attribute>
<xsl:attribute name="coords">
<xsl:number value="$table-column * $map-rect-width"/>
<xsl:text>,</xsl:text>
<xsl:number value="$table-row * $map-rect-height"/>
<xsl:text>,</xsl:text>
<xsl:number value="($table-column + 1) * $map-rect-width"/>
<xsl:text>,</xsl:text>
<xsl:number value="($table-row + 1) * $map-rect-height"/>
</xsl:attribute>
<xsl:attribute name="href">
<xsl:value-of select="."/>
<xsl:text>.htm</xsl:text>
</xsl:attribute>
</area>
</xsl:for-each>
</xsl:for-each>
</map>
</xsl:for-each>
</xsl:when>
[more XSL to generate results pages]
Of course I haven't tested this, but that's the idea: use the text
representation of the RNT to generate an imagemap element.
--
Jon
Other related posts:
