Target format HTML

Figure 747. Format conversion problem

Problem regarding Figure 664, “Single source publishing ”:

<book version="5.1" ...>
  ...
  <chapter>
    <title>Introduction</title>
    <para>First section.</para>
  </chapter> ...
</book>

<html>
  <head>...</head>
  <body>
     <h1>Introduction</h1>
     <p>First section.</p> ...
  </body>
</html>

Figure 748. XSL template rules

<xsl:template match="/book">
  <html>
    <head> ... </head>
    <body>
      <h1>
        <xsl:value-of select="title"/>
      </h1>
    </body>
  </html>
</xsl:template>

Figure 749. Example: Formatting <title> elements

`<xsl:template match="title"> <h1> <xsl:value-of select="."/> </h1> </xsl:template>`	`<title>Some content</title>`
	gets converted to:
	`<h1>Some content</h1>`

exercise No. 6

Formatting `<book>` instances

In Inventing a <book> grammar you developed a grammar being capable to describe XML document instances. This exercise aims at transforming arbitrary instances into HTML.

Start by reading the beginning of the XSLT Tutorial and follow the subsequent steps:

Provide a reasonable instance example like:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-model href="mybook.rng" type="application/xml" schematypens="http://relaxng.org/ns/structure/1.0"?>
<book>
    <title>Introducing Java</title>
    <chapter>
        <title>General</title>
        <paragraph>Java is a programming language offering:</paragraph>
        <itemizedlist>

            <listitem>
                <paragraph>Procedural elements</paragraph>
                <itemizedlist>
                    <listitem>
                        <paragraph>Control structures: if/else, switch</paragraph>
                    </listitem>
                    <listitem>
                        <paragraph>Loops: while, do ... while, for</paragraph>
                    </listitem>
                    <listitem>
                        <paragraph>prcedures (static methods)</paragraph>
                    </listitem>
                </itemizedlist>
            </listitem>
            <listitem>
                <paragraph>OO support albeit limited (no multiple inheritance implementation support)</paragraph>
            </listitem>
            <listitem>
                <paragraph>Functional elements</paragraph>
            </listitem>

        </itemizedlist>
    </chapter>
    <chapter>
        <title>JDK</title>
        <paragraph>The Java developers kit (JDK) provides both a runtime environment
             and a compiler.</paragraph>
    </chapter>
</book>

Create a XML Transformation with XSLT starting from the following skeleton:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xs="http://www.w3.org/2001/XMLSchema"
    exclude-result-prefixes="xs"
    version="2.0">

    <xsl:output method="xml" indent="yes"/>
    <xsl:template match="/book">
        <html>
            <head>
                <title>
                    <xsl:value-of select="title"/>
                </title>
            </head>
            <body>
                <h1>
                    <xsl:value-of select="title"/>
                </h1>
                <!-- See match="chapter" template below -->
                <xsl:apply-templates select="chapter"/>
            </body>
        </html>
    </xsl:template>

    <xsl:template match="chapter">
        <!-- TODO: Implement me! -->
    </xsl:template>


    <!-- TODO: More templates have to be defined
               addressing <title>, <paragraph>, ...
    -->


    <!-- Protecting against missing template definitions -->
    <xsl:template match="*">
        <p style="color:red;">
            <xsl:text>No template defined for element '</xsl:text>
            <xsl:value-of select="name(.)"/>
            <xsl:text>'</xsl:text>
        </p>
    </xsl:template>

</xsl:stylesheet>

Test your transformation. The output should be quite limited containing only your document's title string:
```
<html>
   <head>
      <title>Introducing Java</title>
   </head>
   <body>
      <h1>Introducing Java</h1>
    </body>
</html>
```

Extend the XSL stylesheet in a step- by- step fashion until finally producing:

<?xml version="1.0" encoding="UTF-8"?>
<html>
   <head>
      <title>Introducing Java</title>
   </head>
   <body>
      <h1>Introducing Java</h1>
        <h2>General</h2>
        <p>Java is a programming language offering:</p>
        <ul>

            <li>
                <p>Procedural elements</p>
                <ul>
                    <li>
                        <p>Control structures: if/else, switch</p>
                    </li>
                    <li>
                        <p>Loops: while, do ... while, for</p>
                    </li>
                    <li>
                        <p>prcedures (static methods)</p>
                    </li>
                </ul>
            </li>
            <li>
                <p>OO Support albeit limited (no multiple inheritance implementation support)</p>
            </li>
            <li>
                <p>Functional elements</p>
            </li>

        </ul>

        <h2>JDK</h2>
        <p>The Java developers kit (JDK) provides both a runtime environment
             and a compiler.</p>
    </body>
</html>

Tip

Follow the embedded comment hints provided inside the XSL skeleton. You'll have to define more <xsl:template match="..."> rules and <xsl:apply-templates ...> calls at appropriate places.

exercise No. 7

Providing red background indicating foreign phrases

Extend the previous exercise by providing highlighting to indicate uses of foreign languages. Let's consider:

<paragraph>I am normal</paragraph> <!-- Default language -->
<paragraph lang="fr">Je suis Français</paragraph> <!-- Non-default language -->

The intended output being:

<p>I am normal</p>
<p style="background-color: red;">Je suis Français</p>

Tip

You may want to define two templates like:

<!-- Default language -->
<xsl:template match="paragraph">
        ...
</xsl:template>

<!-- Non-default language -->
<xsl:template match="paragraph[@lang]">
        ...
</xsl:template>

Read the documentation regarding the paragraph[@lang] XPath syntax.

exercise No. 8

Splitting your document into chunks

Larger documents have to be split up into separate chunks avoiding too big single page HTML output. In our current example each <chapter> shall be written to an individual file chunkXY.html.

Each chunk will then need a navigation header linking it to its successor and predecessor. In addition you'll need an overall index.html file containing a table of contents referencing your chunks.

Tip

Splitting documents into chunks is your friend.

Prev	Up	Next
Transforming documents	Home	Target format print

Transforming documents