The object of this assignment is to write an XSLT stylesheet that will transform the catalog from assignment 3 to an XHTML file.
The XML file you should use is a very slightly modified version of the XML file from assignment 3. Here it is.
Your final layout should look like the following. Text that is underlined should be replaced by data from the XML file.
manufacturer
item name $price units |
<summary> or <description> |
|
||||||||
item name $price |
<summary> or <description> | SKU: sku |
Please put this line right after your
<xsl:stylesheet>
starting tag:
<xsl:output method="html" indent="yes"/>
It will ensure that you generate HTML instead of XML, and will put output elements on new lines so that you can read your output file more easily if you need to look at it.
You should create one table for each
<department>
in the catalog.
If an item has a <color>
or
<color-list>
, you should display color
swatches as shown in the right column of the first row of the
table. Don't use styles to create the color swatches; it makes
the problem far more difficult. Instead, use a
nested table with a cell that looks like this (for an item
that is pastel yellow with a hex value of #ffffcc):
<td bgcolor="#ffffcc" width="30"> <br/> </td>
Notice that you must put a border around the color
swatch if the hex value is #ffffff
, since white
on white is invisible. You will need a style to do this.
If an item has no <color>
nor
<color-list>
element, then show the
<sku>
in the right column of the table.
The first cell in the second row of the table shows the
output for an item
without a listed manufacturer and without
but with a units
attribute on the price.
The center cell shows the long <description>
of an item if it exists. If an item has no
<description>
, then show the required
<summary>
instead.
You want to take the embedded XHTML in summaries and descriptions, which has a namespace prefix, and transfer it to the output document. Here's the code for that template.
<!-- set up the name space for HTML in the root element --> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" xmlns:h="http://www.w3.org/1999/xhtml"> <!-- rest of your stylesheet goes here --> <!-- this transfers the HTML without the prefix --> <xsl:template match="h:ul|h:li|h:p|h:em|h:strong"> <xsl:element name="{local-name()}"> <xsl:apply-templates/> </xsl:element> </xsl:template>
You may use stylesheets or the XHTML <big>
and <small>
elements to change the size of the items
in the table. You may also use heading elements such as
<h1>
, <h2>
,
<h3>
, etc. If you use headings, you may have to use
styles to adjust the spacing.
The <title>
element of your output document
must be: <title>company name Catalog</title>
The main heading and the department headings must use heading
elements such as <h1>
, <h2>
,
<h3>
, etc. That's because they aren't just large
text; they're truly headings.
Feel free to adjust the font family and font sizes to produce output that is visually pleasing to you.