<?xml version="1.0" ?>
<?xml-stylesheet type="text/xsl" href="slides.xsl"?>
<?xml-stylesheet type="text/css" href="../css/slides.css"?>

<!DOCTYPE slides[
<!ENTITY yen    "&#165;" >   
]>


<slides name="XML-getting-started" size="5" colour="#000000" 
xmlns:html="http://www.w3.org/1999/xhtml"
       xmlns:xlink="http://www.w3.org/1999/xlink"
        xmlns="http://www.hoise.com/vmp/manual/1.0">

<title>XML getting started </title>

<!--================================================================-->
<slide>
<title>XML - Getting started
 </title>
  <content>
<p align="center">
Ad Emmen<br/>
Genias  Benelux<br/> 
James Stewartstraat 24 <br/> 
NL-1325 JN Almere<br/> 
The Netherlands<br/> <br/>
emmen@genias.nl<br/> 
http://www.genias.nl//<br/> 

</p>
<p>This is not an introduction into XML, but gives some directions how
to start running XML-applications and the exercises used in an XML training 
course.</p>
<p align="center">November   2001<br />
Almere<br />
</p>
  </content>
</slide>

<!--================================================================-->




<slide>
 <title>
  What do you need?
 </title>
  <content>
    <ul>
      <li>A text-editor
       <ul>
      <li>Any text editor is OK</li>
      <li>Should have line and column numbering</li>
      <li>Save texts as text-only (plain ASCII or UTF-8)</li>
      <li>Standard .xml is used as file extension</li>
    </ul>
     </li>
      <li>An XML-parser
      <ul>
      <li>For instance use MS-Explorer version 5.0 or higher, Netscape 6, or Opera</li>
      <li>Use stand-alone parser like Xerces, or XP</li>
      <li>If you want to validate documents you need a validating parser like Xerces</li>
      <li>Start with a non-validating</li>
     </ul>
     </li>
      <li>Write your XML-document in the editor, the parse it</li>
      <li>There are also special XML-editors, but that is for later</li>
     </ul>

  </content>
</slide>
<!--================================================================-->



<slide>
 <title>
 Exercise 1.
 </title>
  <content>
    <ul>
      <li>Create an XML-document</li>
      <li>Also include attributes and children</li>
      <li>See what is happening when you:
      <ul>
      <li>Do no start with the &lt;?xml instruction</li>
      <li>Have more that one document-element</li>
      <li>Do not close tags and attributes</li>
      <li>Use the same attribute twice</li>
      <li>Include special characters</li> 
    </ul>

      </li>
      
    </ul>

  </content>
</slide>
<!--================================================================-->




<slide>
 <title>
  When are XML-documents well-formed
 </title>
  <content>
    <ul>The most important rules are:
      <li>All tags are opened and closed</li>
      <li>Close empty tags with /&gt;</li>
      <li>There is one unique root element</li>
      <li>Elements may not overlap</li>
      <li>Attribute values are between quotes</li> 
        <li>The characters &lt; and &amp; are  only used to start elements and entities</li>
      <li>Use only the five predifined entities</li>
      <li>Tag names are case sensitive</li>
    </ul>

  </content>
</slide>

<!--================================================================-->



<slide>
 <title>
  Using a parser that checks for well-formedness
 </title>
  <content>
    <ul>
      <li>Create an xml-document</li>
      <li>Open it from within MS-Explorer 5.0 or higher</li>
      <li>Errormessage: An error occured passing the XML file</li>
      <li>Info on line and column number of the error</li>
      <li>Or open it in Netscape 6.0</li>
        <li>XML parser error: not well-formed</li>
    </ul>

  </content>
</slide>
<!--================================================================-->



<slide>
 <title>
  When are XML-documents valid?
 </title>
  <content>
    <ul>An XML-document is valid when it:
      <li>Is well-formed</li>
      <li>Has a DTD (Document Type Definition)</li>
      <li>Complies with the constraints in the DTD</li>
     </ul>
 <ul>An XML-document is schema-valid when it:
      <li>Is well-formed</li>
      <li>Has a Schema</li>
      <li>Complies with the constraints in the Schema</li>
     </ul>

  </content>
</slide>
<!--================================================================-->



<slide>
 <title>
  Using a validating parser
 </title>
  <content>
    <ul>
       <li>For instance Xerces in command-line mode on a Unix system:</li>
       <li>#java dom.DOMCount -v database/xml-slides.xml</li>
      <li>Result:
      <pre>
      [Error] xml-slides.xml:2:59: Element type "slides" must be declared.
      [Error] xml-slides.xml:2:59: Attribute "name" must be declared for element type "slides".
      [Error] xml-slides.xml:2:59: Attribute "size" must be declared for element type "slides".
      database/xml-slides.xml: 3577 ms (552 elems, 6 attrs, 0 spaces, 18611 chars)
      </pre>
      </li>
      <li>On Windows use java, jview or jre and reverse the slash</li>
      <li>On Macintosh: use Jbindery from MRJ SDK tools</li> 
    </ul>

  </content>
</slide>

<!--================================================================-->



<slide>
 <title>
  A complete XLM-document
 </title>
  <content>
  <pre>
&lt;?xml version="1.0" ?&gt;
&lt;?xml-stylesheet type="text/css" href="../css/plain.css"?&gt;
&lt;!DOCTYPE slides SYSTEM "slides.dtd&gt;

&lt;slides name="XML-getting-started" size="5" colour="#000000"&gt;
&lt;title&gt;XML getting started &lt;/title&gt;

&lt;!--  This is a comment --&gt;

&lt;slide&gt;
&lt;title&gt;XML - Getting started&lt;/title&gt;
&lt;content&gt;
  &lt;p align="center"&gt;
  Ad Emmen&lt;br/&gt;
  Genias Benelux&lt;br/&gt; 
   &lt;/p&gt;
  &lt;p align="center"&gt;January  2001&lt;br /&gt;
  Almere&lt;br /&gt;
 &lt;/p&gt;
&lt;/content&gt;
&lt;/slide&gt;

&lt;/slides&gt;
</pre>
  </content>
</slide>
<!--================================================================-->



<slide>
 <title>
  XML processing instruction
 </title>
  <content>
   <pre>
 &lt;?xml version="1.0" encoding="UTF-8" standalone="yes"?&gt;
 </pre>

    <ul>
      <li>Must be included and must be the first line in an XML-document</li>
      <li>Version number must be included and always be "1"</li>
      <li>Encoding attribute is optional. Defines character-set</li>
      <li>Standalone attribute is optional. Defines whether the document needs a DTD to be checked</li>
    </ul>

  </content>
</slide>
<!--================================================================-->



<slide>
 <title>Linking to a stylesheet
  </title>
  <content>
  <pre>
 &lt;?xml-stylesheet type="text/css" href="../css/plain.css"?&gt;
 &lt;?xml-stylesheet type="text/xsl" href="../xsl/plain.xsl"?&gt;
 
 </pre>
    <ul>
      <li>Optional processing instruction</li>
      <li>Used in combination with a web browser</li>
      <li>CSS2 with Netscape 6 or Opera</li>
      <li>XSL with Explorer 5</li>
      <li>In standard Explorer 5 an old version of XSLT is supported. Dowload a new DLL (not the complete browser!)</li> 
    </ul>

  </content>
</slide>
<!--================================================================-->




<slide>
 <title> Identifying the DTD: DOCTYPE 
 </title>
  <content>
 <pre>
  &lt;!DOCTYPE slides SYSTEM "slides.dtd"&gt;
</pre>
    <ul>
      <li>Defines the DTD for the XML document</li>
      <li>Optional</li>
      <li>The name "slides" in this case much match the root element name</li>
      <li>After the SYSTEM parameter the location of the DTD can be given</li>
      <li>You can also include definitions locally in the DOCTYPE definition</li> 
    </ul>

  </content>
</slide>
<!--================================================================-->



<slide>
 <title>
    Element
 </title>
  <content>
 <pre>
  &lt;slides&gt; ... &lt;/slides&gt;
 </pre>
    <ul>
      <li>An element is the basic unit of XML-documents</li>
      <li>All elements have a start-tag and a closing tag</li>
      <li>Everything between the tags is called the element-content</li>
      <li>An element can contain other elements, comments, and text</li>
      <li>The start tag can have attributes</li> 
      <li>There must be one and only one element that encloses all others: the root element</li>
    </ul>

  </content>
</slide>

<!--================================================================-->




<slide>
 <title>
   Empty element

 </title>
  <content>
 <pre>
  &lt;br&gt; &lt;/br&gt;
  &lt;br /&gt;
</pre>
    <ul>
      <li>Elements with no content are called empty elements</li>
      <li>The closing tag can than be abbreviated to slash in the opening tag</li>
      <li>An empty element can have attributes though</li>
    </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Attributes
 </title>
  <content>
  <pre>
  &lt;slides name="XML-getting-started" size="5" colour="#000000"&gt;
</pre>
    <ul>
      <li>Attributes have a identifying name and a value</li>
      <li>Unlike in HTML, attributes must have a value </li>
      <li>Value must be within single or double quotes</li>
      <li>Attributes on the same element must have a different name</li>
    </ul>

  </content>
</slide>

<!--================================================================-->



<slide>
 <title>
 Comments
 </title>
  <content>
 <pre>
 <![CDATA[
<!--  This is a comment -->]]>
 </pre>
    <ul>
      <li>Comments can be used to clarify the content of  XML-documents</li>
      <li>Only intended for human readers</li>
      <li>Comments cannot be embedded in other comments</li>
     </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Entities
 </title>
  <content>
 <pre>
  &amp;gt;
 </pre>
    <ul>
      <li> Use  &amp;gt; when &gt; is needed
      </li>
      <li>There are only five predifined entities in XML
      <ul>
      <li>&amp;: &amp;amp; </li>
      <li>&lt;: &amp;lt; </li>
      <li>&gt;: &amp;gt; </li>
      <li>&quot;: &amp;quot; </li>
      <li>&apos;: &amp;apos; </li>
      </ul></li>
    </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Exercise 2
 </title>
  <content>
    <ul>
      <li>Create a well-formed XML-document</li>
      <li>Use CSS to display it in a browser</li>      
    </ul>

  </content>
</slide>

<!--================================================================-->

<slide>
 <title>
 Excercise 3 - This is  to be done  at home after the first part  of the training course  
 </title>
  <content>
    <ul>
      <li>Create a well-formed XML-document representing your music collection</li>
      <li>Include CD's, MP3, or whatever else you have</li>
      <li>Include information on each track, artist, etc</li>
      <li>Include information on running-time, location of a picture of the box, etc.</li>
      <li>Define your own elements and attributes</li> 
      <li>Do not use any element you know from HTML!</li>
    </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Getting started with CSS
 </title>
  <content>
    <ul>
      <li>First step instructions in <a href="../CSS-presentation/index.html" >CSS-presentation</a></li>
      <li>Create a wellformed XML-document include the xml-stylesheet processing instruction</li>
      <li>Create a CSS stylesheet</li>
      <li>Open the XML-document in a XML browser with CSS support</li>
    </ul>
  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Getting started with XSLT
 </title>
  <content>
    <ul>
      <li>Download an XSLT processor, for instance XT</li>
      <li>On Windows (command-mode): xt xml-file xsl-file  result-file</li>
      <li>On Unix: first set the classpath to include xt.jar, xp.jar and sax.jar</li>
      <li>Then: java -cp xt.jar:xp.jar:sax.jar com.jclark.xsl.sax.Driver xml-file xsl-file  result-file</li>
      <li>on MacOs-9: Use Jbindery</li>
      <li>You can pass additional parameters to xsl:variable elements at the top-level in the stylesheet</li> 
      <li>xt xml-file xsl-file  result-file parameter1=value1 parameter2=value2</li>
    </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
  Processing XSLT
 </title>
  <content>
    <ul>
      <li>The XSLT processor first calls a parser to check the xml and xslt files</li>
      <li>Then it performs the transformation on the xml-file using the stylesheet in the xsl-file and producing the result-file</li>
      <li>Mind using the right name-space parameter on the stylesheet, otherwise nothing seems to happen</li>
      </ul>
  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Excercise 4 - This is  to be done  at home after the second  part of the training course  
 </title>
  <content>
    <ul>
      <li>Write a transformation stylesheet that creates an HTML file displaying your music-collection </li>
      <li>Give it a nice lay-out</li>
      <li>Calculate total collection duration</li>
      <li>Make selections on artist, song title, etc.</li>
      <li>Create some working links to sites</li> 
    </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
   Excercise 5  - This is  to be done  at home after the third  part of the training course  

 </title>
  <content>
    <ul>
      <li>Write a transformation stylesheet that transforms your description of a music-collection into the 'standard one'</li>
      <li>Convert your time duration to MPEG7-style</li>
      <li>Check that your description can use the 'standard' stylesheet to be displayed</li>
     </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
  Excercise 6
 </title>
  <content>
    <ul>
      <li>Improve your music collection description</li>
      <li>Put a version of the XML-file on your web site that is general accessible</li>
     </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
 Excercise 7 - Create a iiepster application
 </title>
  <content>
    <ul>
      <li>With iiepster you access information about the music collections of anyone who has registered </li>
      <li>Structure:   <ul>
      <li>Put a file with your music collection in standard description on your web site (everyone)</li>
      <li>Register it in a iiepster.xml file</li>
      <li>Run <code>xt iiepster.xml iiepster.xsl iiepster.html</code> and get a listing of all music collection</li>
      <li>Run <code>xt iiepster.xml search-iiepster.xsl iiepster-search.html familyname="rose" title="De"</code> and watch the search-results</li>
      <li>All the necessary files are in the iiepster and music directories</li> 
     <li>You can also search on songtext</li>
    </ul>
</li>
      <li>Modify the iiepster.xsl stylesheet so that it counts all tracks and calculates the complete duration of the complete iiepster collection</li> 
        <li>Modify the search-iiepster.xsl stylesheet so that you can also search on the Genre of the Album</li>  
        </ul>

  </content>
</slide>

<!--================================================================-->


<slide>
 <title>
  Excercise 8 -  Create a SMIL application
 </title>
  <content>
    <ul>
      <li>A number of files/examples are in the directory <code>jelle</code></li>
      <li>Check whether you can read the jelle.smil file. If not search for another player</li>
      <li>jelle.xml is an excerpt from an standard music file</li>
      <li>jelle.xsl converst this to jelle.smil use:</li>
      <li>xt jelle.xml jelle.xsl jelle.smil</li>
      <li>MP3 and JPG files are added in jelle.xsl</li> 
     <li>
     <ul>Now try:
      <li>Check whether the .smil file works</li>  
      <li>Download a SMIL tutorial</li>  
      <li>Produce an own songtext file</li>  
      <li>Collect images and sound</li> 
      <li>Modify the .xsl file to include your multimedia material</li> 
      <li>Run the stylesheet (with xt) and view the smil output</li>
       </ul>
     </li> 
    </ul>

  </content>
</slide>
<!--================================================================


<slide>
 <title>
 
 </title>
  <content>
    <ul>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li> 
    </ul>

  </content>
</slide>


-->
</slides> 

