Diapositives, primera entrada
authorviric@mandarina
Sun, 14 Dec 2008 20:00:34 +0000
changeset 252 d3a405d0742f
parent 251 4aa28098b2c2
child 253 e3aa70211aee
Diapositives, primera entrada
diapositives/Slidy/Overview.html
diapositives/Slidy/bullet-fold-dim.gif
diapositives/Slidy/bullet-fold.gif
diapositives/Slidy/bullet-nofold-dim.gif
diapositives/Slidy/bullet-nofold.gif
diapositives/Slidy/bullet-unfold-dim.gif
diapositives/Slidy/bullet-unfold.gif
diapositives/Slidy/example.svg
diapositives/Slidy/face1.gif
diapositives/Slidy/face2.gif
diapositives/Slidy/face3.gif
diapositives/Slidy/face4.gif
diapositives/Slidy/fold-bright.gif
diapositives/Slidy/fold-dim.bmp
diapositives/Slidy/fold-dim.gif
diapositives/Slidy/fold.bmp
diapositives/Slidy/help.html
diapositives/Slidy/nofold-dim.bmp
diapositives/Slidy/nofold.bmp
diapositives/Slidy/slidy.css
diapositives/Slidy/slidy.js
diapositives/Slidy/slidy.js.gz
diapositives/Slidy/template.html
diapositives/Slidy/unfold-bright.gif
diapositives/Slidy/unfold-dim.bmp
diapositives/Slidy/unfold-dim.gif
diapositives/Slidy/unfold.bmp
diapositives/Slidy/w3c-ac.css
diapositives/Slidy/w3c-blue.css
diapositives/Slidy/w3c-blue2.css
diapositives/Slidy/w3c-logo-blue.gif
diapositives/Slidy/w3c-logo-blue.svg
diapositives/qjpegrest.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/Overview.html	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,794 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-US">
+<head>
+<meta name="generator" content=
+"HTML Tidy for Linux/x86 (vers 1st November 2003), see www.w3.org" />
+<title>HTML Slidy</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<meta name="copyright" content=
+"Copyright &#169; 2005 W3C (MIT, ERCIM, Keio)" />
+<meta name="font-size-adjustment" content="-2" />
+<link rel="stylesheet" href="slidy.css" type="text/css"
+media="screen, projection, print" />
+<link rel="stylesheet" href="w3c-blue.css" type="text/css"
+media="screen, projection, print" />
+<script src="slidy.js" type="text/javascript">
+</script>
+</head>
+<body>
+<div class="background"><img alt="" id="head-icon"
+src="icon-blue.png" /><object id="head-logo"
+data="w3c-logo-blue.svg" type="image/svg+xml"
+title="W3C logo"><a href="http://www.w3.org/"><img
+alt="W3C logo" id="head-logo-fallback"
+src="w3c-logo-blue.gif" /></a></object></div>
+
+<div class="background slanty">
+<img src="w3c-logo-slanted.jpg" alt="slanted W3C logo" />
+</div>
+<div class="slide cover title">
+  <!-- hidden style graphics to ensure they are saved with other content -->
+  <img class="hidden" src="../Slidy/bullet.png" alt="" />
+  <img class="hidden" src="../Slidy/fold.gif" alt="" />
+  <img class="hidden" src="../Slidy/unfold.gif" alt="" />
+  <img class="hidden" src="../Slidy/fold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/nofold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/unfold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-fold.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-unfold.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-fold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-nofold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-unfold-dim.gif" alt="" />
+
+<img src="keys.jpg" alt=
+"Cover page images (keys)" class="cover" /><br clear="all" />
+<h1>HTML Slidy: Slide Shows in XHTML</h1>
+
+<p><a href="http://www.w3.org/People/Raggett/">Dave Raggett</a>,
+&lt;<a href="mailto:dsr@w3.org">dsr@w3.org</a>&gt;<br />
+<br />
+<br />
+<br />
+<br /><em>Hit the space bar for next slide</em></p>
+</div>
+
+<div class="slide">
+<h1>Slide Shows in XHTML</h1>
+
+<ul>
+<li>You can now create accessible slide shows with ease</li>
+
+<li>Works across browsers and is operated like PowerPoint
+
+<ul>
+<li>Advance to next slide with mouse click or space bar</li>
+
+<li>Move forward/backward between slides with Cursor Left,
+Cursor Right, <strong>Pg Up</strong> and <strong>Pg Dn</strong>
+keys</li>
+
+<li><strong>Home</strong> key for first slide, <strong>End</strong>
+ key for last slide</li>
+
+<li>The "<strong>C</strong>" key for an automatically generated
+table of contents (or click on "contents" on the toolbar)</li>
+
+<li>Function <strong>F11</strong> to go full screen and back</li>
+
+<li>The "<strong>F</strong>" key toggles the display of the footer</li>
+
+<li>The "<strong>A</strong>" key toggles display of current vs all slides
+
+<ul>
+<li>Use the "A" key when you want to view or print all slides</li>
+
+<li>Try it now to see how to include notes for handouts (this is
+explained in the notes following this slide)</li>
+</ul>
+</li>
+
+<li>Font sizes automatically adapt to browser window size
+
+<ul>
+<li>use <strong>S</strong> and <strong>B</strong> keys for
+manual control (or &lt; and &gt;, or the <strong>-</strong> and
+<strong>+</strong> keys on the number pad</li>
+<li>See also the <a href="#(13)">use of the meta element for
+adjusting the default Slidy behavior</a></li>
+</ul>
+</li>
+
+<li>Switching off JavaScript reveals all slides</li>
+</ul>
+</li>
+
+<li><em>Now move to next slide to see how it works</em></li>
+</ul>
+
+<p class="copyright"><a rel="Copyright" href=
+"http://www.w3.org/Consortium/Legal/ipr-notice#Copyright" shape=
+"rect">Copyright</a> &copy; 2005-2006 <a href="/"><acronym title=
+"World Wide Web Consortium">W3C</acronym></a> <sup>&reg;</sup>
+(<a href="http://www.csail.mit.edu/"><acronym title=
+"Massachusetts Institute of Technology">MIT</acronym></a>, <a href=
+"http://www.ercim.org/"><acronym title=
+"European Research Consortium for Informatics and Mathematics">ERCIM</acronym></a>,
+<a href="http://www.keio.ac.jp/">Keio</a>), All Rights
+Reserved.</p>
+</div>
+
+<div class="handout">
+<p>For handouts, its often useful to include extra notes using a
+div element with class="handout" following each slide, as in:</p>
+
+<pre>
+&lt;div class="slide"&gt; 
+ <em>... your slide content ...</em>
+&lt;/div&gt;
+
+&lt;div class="handout"&gt;
+ <em>... stuff that only appears in the handouts ...</em>
+&lt;/div&gt;
+</pre>
+</div>
+
+<div class="slide">
+<h1>What you need to do</h1>
+
+<ul>
+<li>Each presentation is a single XHTML file</li>
+
+<li>Each slide is enclosed in <em>&lt;div class="slide"&gt; ...
+&lt;/div&gt;</em>
+
+<ul>
+<li>The div element will be created automatically for h1
+elements that are direct children of the body element.</li>
+</ul>
+
+</li>
+
+<li>Use regular markup within each slide</li>
+
+<li>The document head includes two links:
+<ul>
+<li>The slide show style sheet:
+<a href=
+"http://www.w3.org/Talks/Tools/Slidy/slidy.css">http://www.w3.org/Talks/Tools/Slidy/slidy.css</a></li>
+
+<li>The slide show script: <a href=
+"http://www.w3.org/Talks/Tools/Slidy/slidy.js">http://www.w3.org/Talks/Tools/Slidy/slidy.js</a></li>
+
+<li>Or you can link to the compressed version of the script which is about
+one seventh the size, see <a href=
+"http://www.w3.org/Talks/Tools/Slidy/slidy.js.gz">http://www.w3.org/Talks/Tools/Slidy/slidy.js.gz</a></li>
+<li>If you are using XHTML, remember to use &lt;/script&gt; and
+&lt;/style&gt; as per <a
+href="http://www.w3.org/TR/xhtml1/#C_3">Appendix C.3</a></li>
+</ul>
+</li>
+</ul>
+
+<pre>
+&lt;?xml version="1.0" encoding="utf-8"?&gt;
+&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
+&lt;html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"&gt; 
+&lt;head&gt; 
+  &lt;title&gt;Slide Shows in XHTML&lt;/title&gt; 
+  &lt;meta name="copyright" 
+   content="Copyright &amp;#169; 2005 your copyright notice" /&gt; 
+  &lt;link rel="stylesheet" type="text/css" media="screen, projection, print" 
+   href="http://www.w3.org/Talks/Tools/Slidy/slidy.css" /&gt; 
+  &lt;script src="http://www.w3.org/Talks/Tools/Slidy/slidy.js" 
+   type="text/javascript"&gt;&lt;/script&gt; 
+  &lt;style type="text/css"&gt; 
+    &lt;!-- your custom style rules --&gt; 
+  &lt;/style&gt; 
+&lt;/head&gt;
+&lt;body&gt;
+   ... your slides marked up in XHTML ...
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<div class="slide">
+<h1>To get the W3C Blue Style</h1>
+
+<p>The head element should include the following link to the style
+sheet:</p>
+
+<pre>
+&lt;link rel="stylesheet" type="text/css" media="screen, projection, print"
+ href="http://www.w3.org/Talks/Tools/Slidy/w3c-blue.css" /&gt; 
+</pre>
+
+<p>The body element's content should start with the following
+markup:</p>
+
+<pre>
+&lt;div class="background"&gt; 
+  &lt;img id="head-icon" alt="graphic with four colored squares"
+    src="http://www.w3.org/Talks/Tools/Slidy/icon-blue.png" /&gt; 
+  &lt;object id="head-logo" title="W3C logo" type="image/svg+xml"
+    data="http://www.w3.org/Talks/Tools/Slidy/w3c-logo-blue.svg"&gt;&lt;img
+   src="http://www.w3.org/Talks/Tools/Slidy/w3c-logo-blue.gif" 
+   alt="W3C logo" id="head-logo-fallback" /&gt;&lt;/object&gt;
+&lt;/div&gt; 
+</pre>
+
+<p>This adds the logos on the top left and right corners of the
+slide.</p>
+
+<p>You are of course welcome to create your own slide designs.
+You can provide different styles and backgrounds for
+different slides (more details later).</p>
+
+<p>Use the <em>meta element</em> with <em>name="copyright"</em>
+for use in the slide show footer:</p>
+
+<pre>
+&lt;meta name="copyright" 
+content="Copyright &amp;#169; 2005 W3C (MIT, ERCIM, Keio)" /&gt; 
+</pre>
+</div>
+
+<div class="slide">
+<h1>To use it off-line</h1>
+
+<ul>
+<li>You can download <a href="slidy.zip">slidy.zip</a> and unzip
+it to create a Slidy directory on your machine</li>
+
+<li>If you have cvs access to the W3C site you can check out the Slidy
+directory</li>
+
+<li>Remember to periodically check for updates</li>
+
+<li>You then have two choices:
+
+<ol>
+<li>Use relative URIs depending on your local setup to access the
+appropriate files. Use the same directory structure as on the W3C
+server, ie, ".../2005/Talks/...".</li>
+
+<li>Run a Web server on your machine so that the directory above
+can be accessed via <code>http://localhost/Talks/Tools/Slidy</code>
+and use the URIs of the form "/Talks/Tools/Slidy/slidy.css",
+"/Talks/Tools/Slidy/slidy.js".</li>
+</ol></li>
+
+<li>In both cases you can then publish your files on the W3C server
+unchanged.</li>
+
+<li><strong>NOTE</strong> Internet Explorer on Windows XP now disables
+scripting for web pages loaded directly from the local file system,
+a work around is to use another browser, e.g. Firefox or Opera</li>
+
+<li>Please feel free to create your own designs, and help us to build
+a gallery of Slidy styles.</li>
+
+<li>Here is a <a href="template.html">variant</a>
+on the W3C Blue style.</li>
+
+<li>My <a href="/2006/02/woa/">Google TechTalk</a> (1st Feb 2006)
+uses a notebook themed style</li>
+</ul>
+</div>
+
+<div class="slide slanty">
+<h1>Generate a Title Page</h1>
+
+<p>If you want a separate title page with the W3C blue style, the
+first slide should be as follows:</p>
+
+<pre>
+&lt;div class="slide cover"&gt; 
+ &lt;img src="http://www.w3.org/Talks/Tools/Slidy/keys.jpg" 
+  alt="Cover page images (keys)" class="cover" /&gt; 
+ &lt;br clear="all" /&gt;            
+ &lt;h1&gt;HTML Slidy: Slide Shows in XHTML&lt;/h1&gt; 
+ &lt;p&gt;&lt;a href="http://www.w3.org/People/Raggett/"&gt;Dave Raggett,&lt;/a&gt; 
+ &lt;a href="mailto:dsr@w3.org"&gt;dsr@w3.org&lt;/a&gt;&lt;/p&gt; 
+&lt;/div&gt; 
+</pre>
+
+<p>The <a 
+href="http://www.w3.org/Talks/Tools/Slidy/w3c-blue.css">w3c-blue.css</a> 
+style sheet looks for the classes "slide" and "cover" on div
+and img elements using the CSS selector <em>div.slide.cover</em></p>
+
+<p>This technique can be used to assign your slides to different
+classes with a different appearence for each such class.</p>
+
+<p>Slidy also allows you to use different background markup for
+different slides, based upon shared class names, as in "foo" below.
+Backgrounds without additional class names are always shown except
+when the slide isn't transparent. You may need to tweak your
+custom style sheet.</p>
+
+<pre>
+&lt;div class="background foo"&gt;
+   ... background content ...
+&lt;div&gt;
+
+...
+
+&lt;div class="slide foo"&gt;
+   ... slide content ...
+&lt;div&gt;
+</pre>
+</div>
+
+<div class="slide">
+<h1>Incremental display of slide contents</h1>
+
+<p>For incremental display, use class="incremental", for
+instance:</p>
+
+<ul class="incremental">
+<li>First bullet point</li>
+
+<li>Second bullet point</li>
+
+<li>Third bullet point</li>
+</ul>
+
+<p class="incremental">which is marked up as follows:</p>
+
+<pre class="incremental">
+&lt;ul class="incremental"&gt; 
+  &lt;li&gt;First bullet point&lt;/li&gt; 
+  &lt;li&gt;Second bullet point&lt;/li&gt; 
+  &lt;li&gt;Third bullet point&lt;/li&gt; 
+&lt;/ul&gt; 
+ 
+&lt;p class="incremental"&gt;which is marked up as follows:&lt;/p&gt; 
+ 
+&lt;pre class="incremental"&gt; 
+ ... 
+&lt;/pre&gt; 
+</pre>
+
+<div class="footnote">
+<p>An element is incrementally revealed if its parent element has
+class="incremental" or if itself has that attribute. Text nodes are
+not elements and are revealed when their parent element is revealed.
+You can use class="incremental" on any element except for &lt;br /&gt;.
+Use class="non-incremental" to override the effect of setting the
+parent element's class to incremental.</p>
+
+<p>Note: you will see a red asterisk on the left of the toolbar
+when there is still something more to reveal.</p>
+</div>
+</div>
+
+<div class="slide">
+<h1>Create outline lists with hidden content</h1>
+
+<p>You can make your bullet points or numbered list items
+into outlines that you can expand or collapse</p>
+
+<ul class="outline">
+<li>Just add <em>class="outline"</em> to the ul or ol
+element. Click on this list item for more details.
+
+<ul>
+<li>The Slidy script will then treat the list
+as an outline list.</li>
+<li>Clicking on outline list items will expand/collapse
+block-level elements within that list item.</li>
+<li>Click on the above to make this list item
+collapse again.</li>
+</ul>
+</li>
+<li>Users will then see expand/collapse icons as appropriate
+and may click anywhere on the list item to change its state.
+This particular list item can't be expanded or collapsed.</li>
+<li class="expand">Add class="expand" to any li elements that
+you want to start in an expanded state.
+
+<ul>
+<li>By default Slidy hides all the block level elements within the
+outline list items unless you have specified class="expand".</li>
+<li>Such pre-expanded items can be collapsed by clicking on them.</li>
+</ul>
+</li>
+<li>Note expand/collapse icon highlighting requires browser
+support for :hover which isn't supported by IE6.
+
+<ul>
+<li>Microsoft says it will be supported by IE7 along with 
+many fixes for other CSS woes in IE6.</li>
+</ul>
+</li>
+</ul>
+
+<pre>
+&lt;ol class='outline'&gt;
+  &lt;!-- topic 1 starts collapsed --&gt;
+  &lt;li&gt;Topic 1
+    &lt;ol&gt;
+        &lt;li&gt;subtopic a&lt;/li&gt;
+        &lt;li&gt;subtopic b&lt;/li&gt;
+    &lt;/ol&gt;
+  &lt;/li&gt;
+  &lt;!-- topic 2 starts expanded --&gt;
+  &lt;li class="expand"&gt;Topic 2
+    &lt;ol&gt;
+        &lt;li&gt;subtopic c&lt;/li&gt;
+        &lt;li&gt;subtopic d&lt;/li&gt;
+    &lt;/ol&gt;
+  &lt;/li&gt;
+&lt;/ol&gt;
+</pre>
+</div>
+
+<!-- useful info at http://www.howtocreate.co.uk/wrongWithIE/ -->
+<div class="slide">
+<h1>Make your images scale with the browser window size</h1>
+
+<p>For adaptive layout, use percentage widths on images, together
+with CSS positioning:</p>
+
+<ul>
+<li>CSS positioning is simpler and more reliable than using
+tables</li>
+</ul>
+
+<pre>
+&lt;div class="slide"&gt; 
+  &lt;h1&gt;Analysts - "Open standards programming will become 
+  mainstream, focused around VoiceXML"&lt;/h1&gt; 
+  &lt;!-- use CSS positioning and scaling for adaptive layout --&gt; 
+  &lt;img src="trends.png" width="50%" style="float:left" 
+   alt="projected growth of VoiceXML" /&gt; 
+
+  &lt;blockquote style="float:right;width: 35%"&gt; 
+    VoiceXML will dominate the voice environment, due to its 
+    flexibility and eventual multimodal capabilities 
+  &lt;/blockquote&gt;&lt;br clear="all" /&gt; 
+ 
+  &lt;p style="text-align:center"&gt;Source Data Monitor, March 
+  2004&lt;/p&gt; 
+&lt;/div&gt; 
+</pre>
+
+<p>To work around a CSS rendering bug in IE relating
+to margins, you can set display:inline on floated elements.</p>
+</div>
+
+<div class="slide">
+<h1>Incremental display of layered images</h1>
+
+<p>These can be marked up using CSS relative positioning, e.g.</p>
+
+<pre>
+&lt;div class="incremental" 
+ style="margin-left: 4em; position: relative"&gt; 
+  &lt;img src="face1.gif" alt="face" 
+   style="position: static; vertical-align: bottom"/&gt; 
+  &lt;img src="face2.gif" alt="eyes" 
+    style="position: absolute; left: 0; top: 0" /&gt; 
+  &lt;img src="face3.gif" alt="nose" 
+    style="position: absolute; left: 0; top: 0" /&gt; 
+  &lt;img src="face4.gif" alt="mouth" 
+    style="position: absolute; left: 0; top: 0" /&gt; 
+&lt;/div&gt; 
+</pre>
+
+<p style="font-size: smaller;">You should also use transparent GIF
+images to avoid the IE/Win bug for alpha channel in PNG. A fix is
+expected in IE 7. A <a href=
+"http://www.skyzyx.com/scripts/sleight.php">work around</a> is
+available on skyzyx.com. My thanks to <a href=
+"http://www.webstandards.org/act/acid2/">ACID2</a> for the
+graphics.</p>
+
+<div class="incremental" style=
+"margin-left: 4em; position: relative;"><img src="face1.gif" alt=
+"face" style="position: static; vertical-align: bottom;" />
+<img src="face2.gif" alt="eyes" style=
+"position: absolute; left: 0pt; top: 0pt;" /> <img src="face3.gif"
+alt="nose" style="position: absolute; left: 0pt; top: 0pt;" />
+<img src="face4.gif" alt="mouth" style=
+"position: absolute; left: 0pt; top: 0pt;" /></div>
+</div>
+
+<div class="slide">
+<h1>Include SVG Content</h1>
+
+<p>Inclusion of SVG content can be done using the object element,
+for example:</p>
+
+<div style="text-align: center;"><object data="example.svg" type=
+"image/svg+xml" title="Indian Office logo" height="10%" width=
+"50%"><img src="example.png" alt="Indian Office logo" width=
+"50%" /></object></div>
+
+<p>has been achieved by:</p>
+
+<pre>
+&lt;object data="example.svg" type="image/svg+xml" 
+  width="50%" height="10%" title="Indian Office logo"&gt; 
+    &lt;img src="example.png" width="50%" 
+          alt="Indian Office logo" /&gt; 
+&lt;/object&gt; 
+</pre>
+
+<p>This ensures that the enclosed png is displayed when the browser
+has no plugin installed or can't display SVG directly. Providing
+such a fall back is very important! Don't forget the alt text for
+people who can't see the image.</p>
+
+<p>However, there are caveats, see the next slide!</p>
+</div>
+
+<div class="slide">
+<h1>Caveats with SVG+object</h1>
+
+<p>Adobe has recently withdrawn support for its SVG Viewer, so you are
+recommended to consider <a
+href="http://wiki.svg.org/Viewer_Implementations">alternatives</a>.
+If you still using the Adobe SVG viewer you should be aware of bugs
+when using the it with IE, Namely:</p>
+
+<ul>
+<li>Recent patches to Internet Explorer mean that the Adobe SVG Viewer
+version 3.03 no longer works with IE6. You are therefore recommended
+to uninstall version 3.03 and instead install <a
+href="http://www.adobe.com/svg/viewer/install/beta.html">Adobe SVG Viewer
+6.0 preview</a> if this is available to to you.</li>
+
+<li>IE6 makes a <em>copy</em> of the SVG file on the local disc
+when displaying it; but doesn't pass the original URI to the plugin</li>
+
+<li>As a result relative references from within the SVG to external
+resources (scripts, CSS, images, other SVG) will break.</li>
+
+<li>The work around is to use absolute references within your SVG.</li>
+
+<li>This problem doesn't effect Mozilla/Firefox. I don't know if
+this was fixed for IE7.</li>
+
+<li>On Windows, the Adobe SVG plugin doesn't respect the CSS z-index
+property, and if used on backgrounds will always show through other
+content</li>
+</ul>
+
+<p>Recent versions of Firefox include native support for SVG, but there
+is a bug with Firefox in which the wrong SVG image will sometimes be
+shown when the page is reloaded. This is due to be fixed in Firefox 3.0.</p>
+
+<p>Some browsers (e.g. Opera 8) only support SVG Tiny, which doesn't
+support external style sheets or style elements within SVG. The work
+around is to set the properties via style attributes on the
+corresponding elements. In principle, browsers should honor the
+version attribute and fall back to the alternative within the object
+element if they don't support the version used by a given SVG file.</p>
+
+<p><em>Are there any tools for downgrading SVG to SVG Tiny?</em></p>
+</div>
+
+<div class="slide">
+<h1>Additional Remarks</h1>
+
+<ul>
+<li>Slides are auto-numbered on the slide show footer</li>
+
+<li>You can link into the <a href="#(2)">middle</a> of a slide
+show:
+
+<ul>
+<li>It works out which slide you want and hides the rest</li>
+
+<li>You can even link between slides in the same slide show</li>
+
+<li>Individual sides can be addressed with the syntax #(<em>slide
+number</em>),<br />
+e.g. slide 3 of this presentation is: <a href=
+"#(3)">http://www.w3.org/Talks/Tools/Slidy#(3)</a>
+<ul>
+<li>Previous versions of Slidy used square brackets, which will
+also work.</li>
+</ul></li>
+<li>Note that the browser's back/forward buttons may not work as
+you might expect due to browser problems.</li>
+</ul>
+</li>
+
+<li>Adding "title" to the list of classes for div elements that serve
+as title pages will render the corresponding entry in the table of
+contents in bold italic text (press "C" now for an example)</li>
+
+<li>If your slides have more content than normal, use a <em>meta
+element</em> to request a smaller font
+
+<ul>
+<li>the following requests fonts to be one step smaller than
+the Slidy default for the current window width, and positive
+integers will make the fonts correspondingly larger</li>
+</ul>
+
+<pre>
+&lt;meta name="font-size-adjustment" content="-1" /&gt; 
+</pre>
+
+<ul>
+<li>Slidy uses JavaScript to dynamically set the font size on the
+body element, but it is okay to specify relative font changes on
+other elements within your own style sheet.</li>
+</ul>
+</li>
+
+<li>You are encouraged to ensure your markup is valid. <a href=
+"http://www.w3.org/People/Raggett/tidy/">HTML Tidy</a> can be used
+to find and correct common markup problems</li>
+
+<li>The slide show script and style sheet can be used freely under
+W3C's <a href=
+"http://www.w3.org/Consortium/Legal/copyright-software">software
+licensing</a> and <a href=
+"http://www.w3.org/Consortium/Legal/copyright-documents">document
+use</a> policies</li>
+<li>At <a href="http://xtech06.usefulinc.com/">XTech2006</a>
+I gave this <a href="http://www.w3.org/2006/05/Slidy-XTech/">presentation</a>
+on Slidy
+(<a href="http://www.w3.org/2006/05/Slidy-XTech/slidy-xtech06-dsr.pdf">Paper</a>).</li>
+</ul>
+</div>
+
+<div class="slide">
+<h1>Localization</h1>
+
+<p>Slidy now includes support for localization</p>
+
+<ul>
+<li>The tool bar is localized according to the language of the presentation</li>
+<li>This is taken from the xml:lang or lang attributes on the html element</li>
+<li>The <a href="http://www.w3.org/Talks/Tools/Slidy/help.html">help file</a> is
+selected based upon your browser's language preferences</li>
+<li>As of 17th March 2006, the languages supported are: English, Spanish and
+Dutch</li>
+<li>If you would like to contribute localizations for other languages, please
+get in touch with Dave Raggett &lt;dsr@w3.org&gt;</li>
+<li>The following illustrates what was used for Spanish</li>
+</ul>
+<pre>
+// for each language there is an associative array
+var strings_es = {
+  "slide":"pág.",
+  "help?":"Ayuda",
+  "contents?":"Índice",
+  "table of contents":"tabla de contenidos",
+  "Table of Contents":"Tabla de Contenidos",
+  "restart presentation":"Reiniciar presentación",
+  "restart?":"Inicio"
+   };
+strings_es[helpText] =
+    "Utilice el ratón, barra espaciadora, teclas Izda/Dhca, " +
+    "o Re pág y Av pág. Use S y B para cambiar el tamaño de fuente.";
+</pre>
+</div>
+
+<div class="slide">
+<h1>Future Plans</h1>
+
+<p>Recent additions have included a table of contents, and a way to
+hide and reveal content in the spirit of outline lists. Further
+work is anticipated on the following:</p>
+
+<ul>
+<li>Collecting a gallery of good looking slide themes
+<ul>
+<li>Opportunities for graphics designers!</li>
+</ul>
+</li>
+<li>Getting SVG Tiny to work on IE without need for SVG plugin
+<ul>
+<li>Using scripts to dynamically convert SVG Tiny to VML</li>
+</ul>
+</li>
+<li>Alpha version of wysiwyg slide editor (see <a
+href="editor/editor-screenshot1.png">screenshot</a>)
+<ul>
+<li>Using contentEditable when available, otherwise
+falling back to textarea and plain text conventions</li>
+<li>Using XMLHttpRequest to dynamically reflect changes to server</li>
+</ul>
+</li>
+<li>Mechanism for remotely driving Slidy as part of distributed meetings
+<ul>
+<li>Using XMLHttpRequest to listen for navigation commands</li>
+<li>Using VoIP for accompanying audio and teleconferencing</li>
+<li>Synchronizing recorded spoken presentation with currently viewed slide</li>
+</ul>
+</li>
+<li>Filters from PowerPoint and Open Office
+<ul>
+<li>and export to PDF via <a href="http://www.princexml.com/">PrinceXML</a></li>
+</ul>
+</li>
+</ul>
+
+<p>If you have comments, suggestions for improvements, or would
+like to volunteer your help with further work on Slidy,
+please contact <a href=
+"http://www.w3.org/People/Raggett/">Dave Raggett</a> &lt;<a href=
+"mailto:dsr@w3.org">dsr@w3.org</a>&gt;</p>
+</div>
+
+<div class="slide">
+<h1>Acknowledgements</h1>
+
+<ul>
+<li>My thanks to everyone who sent in bug reports and feature
+requests</li>
+<li>Opera Software for implementing CSS @media projection and
+promoting the idea of using the Web for presentations with
+<a href="http://www.opera.com/support/tutorials/operashow/">Opera
+Show</a></li>
+<li><a href="http://tantek.com/">Tantek &Ccedil;elik</a> for his
+pioneering work on applying JavaScript for slide presentations on
+other browsers</li>
+<li>Eric Meyer for taking this further with the excellent <a
+href="http://www.meyerweb.com/eric/tools/s5/s5-intro.html">S5</a></li>
+<li>W3C's <a href="http://dev.w3.org/cvsweb/slidemaker/">slidemaker
+tool</a>, which uses a perl script to split an html file up into
+one file per slide with navigation buttons</li>
+<li>Early versions of <a href="http://www.w3.org/People/Raggett/tidy/">HTML
+Tidy</a> which supported a means to create presentations via splitting
+html files on h2 elements</li>
+<li>Many sites with advice on JavaScript work arounds for browser
+variations</li>
+<li>Microsoft for pioneering contentEditable and XMLHTTP which
+both provide tremendous opportunities for Web applications</li>
+<li>Microsoft Office which provided the impetus for creating
+Slidy as a Web-based alternative to the ubiquitous use of PowerPoint</li>
+</ul>
+
+<p class="smaller"><strong>Note</strong> that while Slidy and
+S5 were developed independently, both support the use of the
+class values "slide" and "handout" for div elements. Slidy doesn't
+support the "layout" class featured in S5 and Opera Show, but
+instead provides a more flexible alternative with the "background"
+class, which enables different backgrounds on different slides.</p>
+</div>
+
+<div class="slide">
+<h1>Acknowledgements</h1>
+
+<p>The following people have contributed localizations:</p>
+
+<ul>
+<li>Emmanuelle Gutiérrez y Restrepo, Spanish</li>
+<li>Ruud Steltenpool, Dutch</li>
+<li>Beat Vontobel, German</li>
+<li>Krzysztof Kotowicz, Polish</li>
+<li>Tamas Horvath, Hungarian</li>
+<li>Creso Moraes, Brazilian Portuguese</li>
+<li>Giuseppe Scollo, Italian</li>
+<li>Konstantinos Koukopoulos, Greek</li>
+<li>Yoshikazu Sawa (澤 義和), Japanese</li>
+</ul>
+
+<p>The following people have contributed bug reports:</p>
+
+<ul>
+<li>Ivan Herman</li>
+<li>Steve Bratt</li>
+<li>Peter Patel-Schneider</li>
+<li>Matthew Coller</li>
+<li>Rune Heggtveit</li>
+<li>Gopal Venkatesan</li>
+</ul>
+
+<p>Douglas Crockford for <a 
+href="http://www.crockford.com/javascript/jsmin.html">jsmin</a>
+which was used to minify the script before compressing it with gzip.</p>
+</div>
+</body>
+</html>
Binary file diapositives/Slidy/bullet-fold-dim.gif has changed
Binary file diapositives/Slidy/bullet-fold.gif has changed
Binary file diapositives/Slidy/bullet-nofold-dim.gif has changed
Binary file diapositives/Slidy/bullet-nofold.gif has changed
Binary file diapositives/Slidy/bullet-unfold-dim.gif has changed
Binary file diapositives/Slidy/bullet-unfold.gif has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/example.svg	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,223 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 11.0, SVG Export Plug-In  -->
+<svg  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
+	 viewBox="-0.724 -0.46 279 52" xml:space="preserve">
+        <desc>W3C Indian Office logo</desc>
+	<defs>
+	</defs>
+	<g>
+		<rect x="107.669" y="15.986" style="fill:#0C479D" width="163.338" height="13.73"/> 
+		<path style="fill:#FFFFFF" d="M117.042,25.062c-0.6,0.853-1.279,1.812-2.692,1.812c-0.879,0-1.985-0.574-1.985-2.052
+			c0-2.039,1.919-4.277,3.758-4.277c1.053,0,1.532,0.586,1.532,1.172c0,0.6-0.333,0.96-0.839,0.96c-0.36,0-0.759-0.239-0.759-0.693
+			c0-0.372,0.28-0.586,0.28-0.772c0-0.174-0.187-0.227-0.307-0.227c-1.16,0-1.959,2.799-1.959,3.745
+			c0,1.065,0.587,1.293,0.973,1.293c0.6,0,1.093-0.428,1.626-1.201L117.042,25.062z"/>
+		<path style="fill:#FFFFFF" d="M134.227,22.596c0,1.985-1.652,4.278-3.784,4.278c-1.093,0-2.132-0.705-2.132-1.986
+			c0-2.053,1.719-4.344,3.825-4.344C132.641,20.544,134.227,20.81,134.227,22.596z M129.896,25.554c0,0.268,0,0.934,0.693,0.934
+			c1.279,0,2.052-3.705,2.052-4.705c0-0.666-0.293-0.852-0.64-0.852C130.562,20.931,129.896,24.702,129.896,25.554z"/>
+		<path style="fill:#FFFFFF" d="M151.587,25.076c-0.426,0.718-1.053,1.746-2.092,1.746c-0.213,0-0.934,0-0.934-0.867
+			c0-0.946,1.174-3.864,1.174-4.157c0-0.161-0.16-0.294-0.334-0.294c-0.333,0-1.679,0.666-2.852,5.197h-1.612
+			c0.679-2.544,1.359-4.744,1.359-5.077c0-0.347-0.36-0.347-0.72-0.347v-0.36c0.293,0,1.612-0.119,2.665-0.359l-0.8,2.479
+			l0.04,0.027c0.96-1.412,1.679-2.519,2.839-2.519c0.32,0,1.013,0.025,1.013,1.052c0,0.866-1.159,3.692-1.159,4.079
+			c0,0.119,0.053,0.24,0.199,0.24c0.268,0,0.574-0.48,0.92-1.013L151.587,25.076z"/>
+		<path style="fill:#FFFFFF" d="M166.562,22.596l-0.36-0.026c-0.106-0.666-0.387-1.586-1.173-1.586c-0.706,0-0.706,0.652-0.706,0.72
+			c0,0.839,1.825,2.013,1.825,3.385c0,1.292-1.146,1.786-1.998,1.786c-0.587,0-0.92-0.266-1.227-0.266
+			c-0.053,0-0.32,0.039-0.387,0.266h-0.359l0.293-2.211l0.36,0.039c0.199,1.772,1.159,1.772,1.278,1.772
+			c0.507,0,0.76-0.398,0.76-0.732c0-0.346-0.319-0.879-0.746-1.373c-0.693-0.799-1.066-1.346-1.066-2.158
+			c0-1.187,0.92-1.666,1.786-1.666c0.666,0,0.826,0.293,1.267,0.293c0.199,0,0.239-0.054,0.373-0.28h0.386L166.562,22.596z"/>
+		<path style="fill:#FFFFFF" d="M183.493,22.596c0,1.985-1.653,4.278-3.785,4.278c-1.093,0-2.132-0.705-2.132-1.986
+			c0-2.053,1.719-4.344,3.824-4.344C181.907,20.544,183.493,20.81,183.493,22.596z M179.161,25.554c0,0.268,0,0.934,0.694,0.934
+			c1.278,0,2.052-3.705,2.052-4.705c0-0.666-0.293-0.852-0.64-0.852C179.828,20.931,179.161,24.702,179.161,25.554z"/>
+		<path style="fill:#FFFFFF" d="M194.643,20.917c1.359-0.119,1.772-0.146,2.665-0.372l-0.746,2.372l0.066,0.026
+			c0.4-0.8,1.188-2.398,2.066-2.398c0.053,0,0.772,0,0.772,0.879c0,0.613-0.373,0.973-0.786,0.973c-0.466,0-0.613-0.506-0.8-0.506
+			c-0.373,0-1.065,1.333-1.359,2.039c-0.347,0.893-0.479,1.532-0.906,2.771h-1.612c0.707-2.398,1.359-4.636,1.359-5.064
+			c0-0.333-0.24-0.346-0.72-0.359V20.917z"/>
+		<path style="fill:#FFFFFF" d="M213.214,21.277h-1.105c-0.44,1.626-1.16,3.958-1.16,4.412c0,0.16,0.187,0.199,0.2,0.199
+			c0.333,0,0.853-0.786,1.026-1.066l0.293,0.187c-0.494,0.774-1.146,1.813-2.187,1.813c-0.959,0-0.959-0.799-0.959-0.893
+			c0-0.547,0.64-2.546,1.227-4.652h-0.681V20.81c0.521-0.199,1.533-0.612,2.439-2.024h0.467l-0.52,1.932h0.959V21.277z"/>
+		<path style="fill:#FFFFFF" d="M226.346,25.008c-0.68,1.04-1.239,1.813-2.226,1.813c-0.773,0-0.92-0.574-0.92-0.893
+			c0-0.586,1.04-3.918,1.04-4.225c0-0.427-0.4-0.439-0.787-0.427v-0.36c0.534-0.039,1.786-0.159,2.692-0.372
+			c-0.52,1.905-1.333,4.717-1.333,5.144c0,0.133,0.121,0.199,0.201,0.199c0.319,0,0.771-0.666,1.039-1.066L226.346,25.008z
+			 M225.759,17.585c0.507,0,0.92,0.413,0.92,0.906c0,0.479-0.399,0.88-0.92,0.88c-0.626,0-0.879-0.56-0.879-0.906
+			C224.88,18.145,225.159,17.585,225.759,17.585z"/>
+		<path style="fill:#FFFFFF" d="M243.436,25.102c-0.254,0.452-0.999,1.719-2.119,1.719c-0.2,0-0.893,0-0.893-0.746
+			c0-0.574,0.16-1.027,0.293-1.427l-0.026-0.013c-1.014,1.413-1.572,2.186-2.586,2.186c-1.025,0-1.025-0.732-1.025-1.039
+			c0-0.92,0.999-3.345,0.999-4.119c0-0.347-0.293-0.36-0.746-0.387v-0.36c1.186-0.053,2.599-0.359,2.785-0.372l-1.253,4.104
+			c-0.16,0.507-0.199,0.654-0.199,0.894c0,0.252,0.133,0.318,0.307,0.318c0.532,0,1.345-1.265,1.519-1.584
+			c0.6-1.08,0.906-2.133,1.319-3.559h1.573c-0.268,0.934-1.374,4.518-1.374,4.944c0,0.227,0.134,0.254,0.2,0.254
+			c0.32,0,0.826-0.8,0.946-0.987L243.436,25.102z"/>
+		<path style="fill:#FFFFFF" d="M254.745,20.917c1.412-0.119,1.745-0.146,2.665-0.359l-0.8,2.479l0.04,0.027
+			c0.772-1.187,1.64-2.519,2.825-2.519c0.066,0,0.879,0,0.879,0.893c0,0.52-0.187,0.973-0.307,1.279l0.014,0.027
+			c0.68-1.08,1.466-2.199,2.559-2.199c0.733,0,1.054,0.466,1.054,1.052c0,0.88-1.187,3.599-1.187,4.118
+			c0,0.16,0.146,0.201,0.227,0.201c0.254,0,0.68-0.667,0.906-1.013l0.293,0.174c-0.413,0.707-1.026,1.746-2.092,1.746
+			c-0.227,0-0.934,0-0.934-0.867c0-0.972,1.173-3.811,1.173-4.13c0-0.16-0.106-0.307-0.319-0.307c-0.561,0-1.266,1.159-1.479,1.546
+			c-0.493,0.853-0.68,1.453-1.346,3.637h-1.6c1.026-3.318,1.466-4.49,1.466-4.864c0-0.253-0.159-0.319-0.253-0.319
+			c-0.093,0-1.572,0.333-2.812,5.183h-1.612c0.759-2.785,1.359-4.636,1.359-5.077c0-0.386-0.521-0.359-0.72-0.347V20.917z"/>
+		<path d="M123.286,1.771h2.012l-4.572,15.43h-0.206l-2.858-9.555l-2.857,9.555h-0.183l-4.572-15.43h2.012l2.743,9.396l1.874-6.332
+			l-0.914-3.063h2.012l2.743,9.396L123.286,1.771z"/>
+		<path d="M189.955,1.453h2.012l-4.572,15.43h-0.206l-2.856-9.555l-2.857,9.555h-0.184l-4.572-15.43h2.013l2.743,9.396l1.874-6.333
+			l-0.914-3.063h2.012l2.742,9.396L189.955,1.453z"/>
+		<path d="M244.878,1.453h2.012l-4.572,15.43h-0.205l-2.858-9.555l-2.857,9.555h-0.183l-4.572-15.43h2.012l2.743,9.396l1.874-6.333
+			l-0.914-3.063h2.012l2.744,9.396L244.878,1.453z"/>
+		<path d="M248.27,3.238h6.096v2.024h-4.048v2.438h4.048v2.048h-4.048v3.658h4.048v2.024h-6.096V3.238z"/>
+		<path d="M257.815,3.238h4.268c1.805,0,3.268,1.463,3.268,3.243c0,0.829-0.268,1.463-0.707,2.024
+			c0.927,0.707,1.512,1.731,1.512,3.072c0,2.122-1.73,3.853-3.853,3.853c-0.22,0-4.487,0-4.487,0V3.238z M259.863,7.701h2.22
+			c0.683,0,1.219-0.537,1.219-1.22c0-0.658-0.536-1.219-1.219-1.219c-0.171,0-2.22,0-2.22,0V7.701z M259.863,13.407h2.439
+			c0.999,0,1.829-0.829,1.829-1.829c0-1.024-0.83-1.829-1.829-1.829c-0.391,0-2.439,0-2.439,0V13.407z"/>
+		<path d="M130.116,3.042c2.756,0,4.268,2.829,4.268,6.292s-1.512,6.291-4.268,6.291c-2.731,0-4.268-2.828-4.268-6.291
+			S127.385,3.042,130.116,3.042z M130.116,13.602c1.17,0,2.122-1.926,2.122-4.267c0-2.341-0.951-4.268-2.122-4.268
+			c-1.146,0-2.122,1.926-2.122,4.268C127.994,11.675,128.97,13.602,130.116,13.602z"/>
+		<path d="M146.575,15.431h-2.487l-2.927-4.072c-0.487,0-1.487,0-1.487,0v4.072h-2.049V3.238h3.878c2.219,0,4.048,1.829,4.048,4.072
+			c0,1.561-0.878,2.926-2.194,3.609L146.575,15.431z M143.526,7.31c0-1.122-0.902-2.048-2.023-2.048c-0.22,0-1.829,0-1.829,0v4.072
+			h1.829C142.624,9.334,143.526,8.407,143.526,7.31z"/>
+		<path d="M151.256,13.407h4.048v2.024h-6.096V3.238h2.048V13.407z"/>
+		<path d="M156.724,3.238h2.853c3.024,0,5.487,2.731,5.487,6.097c0,3.365-2.463,6.096-5.487,6.096c-0.269,0-2.853,0-2.853,0V3.238z
+			 M158.771,13.407h0.805c1.78,0,3.243-1.829,3.243-4.072c0-2.244-1.463-4.072-3.243-4.072c-0.316,0-0.805,0-0.805,0V13.407z"/>
+		<path d="M200.331,3.238h2.854c3.023,0,5.487,2.731,5.487,6.097c0,3.365-2.464,6.096-5.487,6.096c-0.269,0-2.854,0-2.854,0V3.238z
+			 M202.38,13.407h0.805c1.78,0,3.243-1.829,3.243-4.072c0-2.244-1.463-4.072-3.243-4.072c-0.316,0-0.805,0-0.805,0V13.407z"/>
+		<path d="M211.913,3.238h6.097v2.024h-4.048v2.438h4.048v2.048h-4.048v3.658h4.048v2.024h-6.097V3.238z"/>
+		<rect x="194.518" y="3.188" width="1.786" height="12.203"/> 
+		<path style="fill-rule:evenodd;clip-rule:evenodd" d="M274.845,25.169c-0.659,0-1.251,0.238-1.699,0.693c-0.477,0.482-0.741,1.109-0.741,1.754
+			c0,0.646,0.252,1.244,0.714,1.713c0.469,0.477,1.074,0.734,1.727,0.734c0.639,0,1.258-0.258,1.74-0.729
+			c0.463-0.447,0.714-1.045,0.714-1.719c0-0.652-0.259-1.264-0.707-1.719C276.122,25.42,275.511,25.169,274.845,25.169z
+			 M276.973,27.638c0,0.564-0.218,1.086-0.619,1.475c-0.421,0.408-0.944,0.625-1.522,0.625c-0.544,0-1.081-0.225-1.481-0.633
+			c-0.401-0.408-0.626-0.932-0.626-1.488s0.231-1.102,0.646-1.521c0.389-0.395,0.911-0.606,1.482-0.606
+			c0.585,0,1.107,0.217,1.517,0.633C276.762,26.515,276.973,27.046,276.973,27.638z M274.913,26.183h-1.047v2.773h0.522v-1.184
+			h0.518l0.563,1.184h0.585l-0.618-1.264c0.4-0.082,0.632-0.355,0.632-0.75C276.068,26.44,275.688,26.183,274.913,26.183z
+			 M274.817,26.522c0.49,0,0.713,0.135,0.713,0.475c0,0.326-0.223,0.443-0.699,0.443h-0.442v-0.918H274.817z"/>
+		<path d="M93.451,0l1.056,6.42l-3.738,7.152c0,0-1.436-3.034-3.82-4.714c-2.009-1.416-3.318-1.723-5.364-1.301
+			c-2.628,0.542-5.608,3.685-6.908,7.559c-1.556,4.636-1.571,6.879-1.625,8.94c-0.087,3.304,0.434,5.256,0.434,5.256
+			s-2.27-4.199-2.249-10.349c0.015-4.389,0.704-8.371,2.736-12.299c1.787-3.454,4.443-5.526,6.8-5.77
+			c2.437-0.252,4.363,0.923,5.852,2.194c1.562,1.334,3.143,4.253,3.143,4.253L93.451,0z"/>
+		<path d="M93.911,36.329c0,0-1.653,2.953-2.682,4.091c-1.03,1.138-2.872,3.143-5.147,4.146c-2.275,1.001-3.468,1.191-5.716,0.975
+			c-2.246-0.216-4.334-1.517-5.066-2.06c-0.731-0.541-2.601-2.14-3.657-3.629c-1.057-1.49-2.709-4.471-2.709-4.471
+			s0.921,2.986,1.497,4.254c0.332,0.729,1.351,2.96,2.797,4.902c1.349,1.813,3.969,4.932,7.951,5.635
+			c3.982,0.705,6.719-1.083,7.396-1.517c0.677-0.433,2.104-1.628,3.007-2.594c0.943-1.009,1.835-2.296,2.33-3.067
+			c0.361-0.564,0.948-1.707,0.948-1.707L93.911,36.329z"/>
+		<path style="fill:#0C479D" d="M25.146,0.284l9.003,30.611l9.003-30.611h6.519L34.771,50.576h-0.621l-9.313-31.168l-9.314,31.168h-0.621
+			L0,0.284h6.519l9.003,30.611l6.085-20.614l-2.98-9.997H25.146z"/>
+		<path style="fill:#0C479D" d="M68.184,34.434c0,4.554-1.211,8.383-3.632,11.487c-2.422,3.104-5.558,4.655-9.407,4.655
+			c-2.898,0-5.423-0.921-7.576-2.763c-2.152-1.842-3.746-4.335-4.781-7.481l5.091-2.11c0.746,1.904,1.729,3.405,2.95,4.501
+			c1.221,1.097,2.659,1.645,4.315,1.645c1.738,0,3.208-0.972,4.409-2.917s1.801-4.284,1.801-7.017c0-3.022-0.642-5.36-1.925-7.017
+			c-1.491-1.945-3.83-2.918-7.017-2.918h-2.483v-2.98l8.693-15.026H48.128l-2.918,4.967h-1.862V0.284h24.215v3.042l-9.19,15.833
+			c3.229,1.036,5.671,2.919,7.326,5.652C67.354,27.542,68.184,30.749,68.184,34.434z"/>
+		<g>
+			<g>
+				<g>
+					<path d="M135.359,42.137h-4.523v1.736c0.018,0.145,0.018,0.249,0,0.313c-0.075,0.21-0.261,0.314-0.558,0.314
+						c-0.299,0-0.909-0.407-1.831-1.219c-0.922-0.814-1.382-1.357-1.382-1.631c0-0.146,0.093-0.272,0.278-0.385
+						c0.186-0.113,0.324-0.17,0.418-0.17h1.671v-3.802c0-0.337-0.105-0.602-0.318-0.794c-0.212-0.192-0.567-0.29-1.064-0.29
+						c-0.388,0-0.692,0.104-0.914,0.313s-0.332,0.503-0.332,0.886c0,0.271,0.067,0.552,0.202,0.838
+						c0.039,0.095,0.115,0.217,0.231,0.361h-1.27c-0.094-0.163-0.16-0.293-0.197-0.389c-0.151-0.323-0.226-0.59-0.226-0.799
+						c0-0.728,0.246-1.267,0.738-1.621c0.491-0.355,1.118-0.534,1.879-0.534c0.743,0,1.375,0.194,1.894,0.582
+						c0.52,0.387,0.78,0.887,0.78,1.499v3.75h4.523V42.137z M133.104,36.527h-1.116v-0.945h1.116V36.527z"/>
+				</g>
+				<g>
+					<path d="M139.753,36.527h-3.214v11.124h-1.404V36.527h-2.376v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M145.448,36.527h-3.215v11.124h-1.403V36.527h-2.376v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M156.204,36.527h-3.776v3.074c0,0.388-0.101,0.75-0.303,1.09c-0.205,0.34-0.556,0.614-1.056,0.822
+						c-0.259,0.114-0.514,0.198-0.763,0.253c-0.25,0.058-0.522,0.088-0.819,0.088c-0.352,0-0.646-0.042-0.888-0.128
+						c0.166,0.211,0.296,0.381,0.388,0.509c0.59,0.774,1.097,1.413,1.521,1.913c0.369,0.403,0.94,0.977,1.714,1.719
+						c0.24,0.227,0.572,0.541,0.996,0.945l-1.01,0.849c-0.628-0.6-1.307-1.285-2.036-2.061c-0.729-0.776-1.399-1.535-2.008-2.28
+						c-0.776-0.984-1.451-1.904-2.023-2.763c-0.203-0.289-0.434-0.653-0.692-1.092l1.082-0.701l1.082,1.649
+						c0.092,0.145,0.287,0.273,0.583,0.388c0.295,0.112,0.619,0.17,0.971,0.17c0.61,0,1.072-0.138,1.388-0.412
+						c0.313-0.273,0.471-0.634,0.471-1.087v-2.945h-6.875v-0.945h12.055V36.527z"/>
+				</g>
+				<g>
+					<path d="M163.116,36.527h-7.771v-0.945h7.771V36.527z M165.354,40.09h-5.216c-0.663,0-1.141,0.116-1.436,0.348
+						c-0.295,0.234-0.441,0.552-0.441,0.954c0,1.125,0.615,2.34,1.848,3.643c0.401,0.434,1.028,0.98,1.873,1.64l-0.886,0.796
+						c-0.939-0.708-1.642-1.304-2.101-1.789c-1.401-1.464-2.102-2.857-2.102-4.179c0-0.742,0.233-1.309,0.705-1.705
+						c0.47-0.393,1.092-0.592,1.866-0.592h5.889V40.09z"/>
+				</g>
+				<g>
+					<path d="M169.777,36.527h-3.214v11.124h-1.404V36.527h-2.377v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M175.486,36.527h-3.192v11.124h-1.404V36.527h-2.411v-0.945h2.391c-0.35-0.916-0.671-1.6-0.964-2.049
+						c-0.921-1.365-2.052-2.05-3.395-2.05c-0.625,0-1.09,0.17-1.393,0.507c-0.304,0.337-0.456,0.785-0.456,1.347
+						c0,0.546,0.145,1.099,0.432,1.66c0.091,0.177,0.235,0.4,0.433,0.674h-1.267c-0.221-0.291-0.378-0.533-0.47-0.727
+						c-0.33-0.612-0.495-1.154-0.495-1.622c0-0.921,0.284-1.613,0.856-2.08c0.571-0.468,1.345-0.704,2.321-0.704
+						c1.825,0,3.32,0.841,4.479,2.522c0.369,0.549,0.765,1.389,1.19,2.521h3.344V36.527z"/>
+				</g>
+				<g>
+					<path d="M184.403,44.03c-0.333,0.241-0.628,0.419-0.885,0.533c-0.776,0.357-1.635,0.537-2.574,0.537
+						c-1.551,0-2.755-0.447-3.613-1.342c-0.857-0.895-1.287-1.896-1.287-3.008c0.075,0.029,0.133,0.045,0.171,0.045
+						c0.316,0.074,0.57,0.112,0.758,0.112c0.729,0,1.29-0.145,1.684-0.438c0.466-0.337,0.701-0.861,0.701-1.571
+						c0-0.485-0.223-1.025-0.669-1.621c-0.148-0.194-0.371-0.444-0.669-0.751h-3.846v-0.945h8.172v0.945h-2.672
+						c0.242,0.322,0.419,0.589,0.531,0.798c0.371,0.646,0.555,1.196,0.555,1.646c0,1.066-0.514,1.856-1.545,2.372
+						c-0.334,0.161-0.858,0.322-1.577,0.484c0.185,0.531,0.378,0.926,0.579,1.182c0.627,0.806,1.539,1.208,2.737,1.208
+						c0.755,0,1.444-0.18,2.07-0.534c0.753-0.436,1.212-0.864,1.379-1.284V44.03z"/>
+				</g>
+				<g>
+					<path d="M188.993,36.527h-3.216v11.124h-1.404V36.527h-2.375v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M215.396,36.527h-8.921v3.529c0.221-0.279,0.424-0.483,0.607-0.614c0.57-0.41,1.252-0.614,2.041-0.614
+						c1.087,0,1.96,0.281,2.622,0.847c0.662,0.566,0.994,1.285,0.994,2.155c0,0.791-0.451,1.729-1.352,2.81
+						c-0.293,0.356-0.753,0.824-1.379,1.405l-1.158-0.73c0.549-0.468,0.95-0.858,1.206-1.166c0.804-0.924,1.207-1.742,1.207-2.456
+						c0-0.582-0.171-1.049-0.509-1.397c-0.341-0.349-0.831-0.521-1.473-0.521c-0.753,0-1.408,0.324-1.967,0.972
+						c-0.562,0.649-0.841,1.249-0.841,1.801v5.105h-1.403v-3.497c-0.238,0.191-0.442,0.333-0.605,0.429
+						c-0.57,0.303-1.179,0.453-1.818,0.453c-1.049,0-1.944-0.318-2.688-0.956c-0.744-0.634-1.115-1.405-1.115-2.308
+						s0.361-1.654,1.083-2.259c0.724-0.604,1.597-0.905,2.622-0.905c0.273,0,0.566,0.034,0.878,0.109
+						c0.092,0.015,0.22,0.051,0.385,0.11v1.07c-0.129-0.07-0.231-0.123-0.305-0.159c-0.294-0.124-0.57-0.187-0.829-0.187
+						c-0.664,0-1.232,0.21-1.713,0.632c-0.479,0.421-0.718,0.93-0.718,1.527c0,0.648,0.213,1.206,0.637,1.674
+						c0.426,0.472,0.98,0.704,1.665,0.704c0.628,0,1.164-0.168,1.606-0.507c0.61-0.469,0.916-0.886,0.916-1.259v-5.797h-8.172
+						v-0.945h18.496V36.527z"/>
+				</g>
+				<g>
+					<path d="M220.87,36.527h-3.216v11.124h-1.404V36.527h-2.375v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M229.798,44.03c-0.33,0.241-0.626,0.419-0.885,0.533c-0.773,0.357-1.633,0.537-2.572,0.537
+						c-1.551,0-2.755-0.447-3.611-1.342c-0.858-0.895-1.287-1.896-1.287-3.008c0.075,0.029,0.13,0.045,0.167,0.045
+						c0.32,0.074,0.572,0.112,0.76,0.112c0.729,0,1.29-0.145,1.684-0.438c0.468-0.337,0.701-0.861,0.701-1.571
+						c0-0.485-0.223-1.025-0.669-1.621c-0.15-0.194-0.371-0.444-0.668-0.751h-3.847v-0.945h8.172v0.945h-2.67
+						c0.242,0.322,0.417,0.589,0.527,0.798c0.371,0.646,0.559,1.196,0.559,1.646c0,1.066-0.518,1.856-1.549,2.372
+						c-0.33,0.161-0.856,0.322-1.577,0.484c0.186,0.531,0.378,0.926,0.583,1.182c0.626,0.806,1.539,1.208,2.735,1.208
+						c0.755,0,1.444-0.18,2.068-0.534c0.756-0.436,1.216-0.864,1.379-1.284V44.03z"/>
+				</g>
+				<g>
+					<path d="M234.388,36.527h-3.214v11.124h-1.404V36.527h-2.375v-0.945h6.993V36.527z"/>
+				</g>
+				<g>
+					<path d="M240.085,36.527h-3.216v11.124h-1.405V36.527h-2.375v-0.945h6.996V36.527z"/>
+				</g>
+				<g>
+					<path d="M238.137,31.033c-0.146-0.065-0.275-0.104-0.386-0.122c-0.331-0.081-0.68-0.119-1.048-0.119
+						c-0.514,0-0.931,0.135-1.253,0.402c-0.321,0.268-0.483,0.671-0.483,1.208c0,0.668,0.307,1.418,0.916,2.246
+						c0.203,0.263,0.508,0.604,0.913,1.028h-1.078c-0.148-0.05-0.497-0.455-1.051-1.215c-0.664-0.925-0.994-1.742-0.994-2.454
+						c0-0.794,0.304-1.368,0.909-1.727c0.496-0.291,1.158-0.436,1.983-0.436c0.403,0,0.79,0.046,1.156,0.141
+						c0.112,0.034,0.248,0.08,0.415,0.145V31.033z"/>
+				</g>
+				<g>
+					<path d="M251.558,36.527H239.78v-0.945h11.777V36.527z M252.608,40.539c-0.313,0.048-0.572,0.097-0.773,0.146
+						c-0.593,0.176-1.104,0.457-1.537,0.844c-0.435,0.384-0.807,0.842-1.122,1.37c-0.238,0.403-0.367,0.684-0.385,0.844
+						l-1.164-0.533l0.395-0.896l0.508-0.752c-0.13-0.274-0.518-0.572-1.161-0.897c-0.518-0.258-1.053-0.388-1.605-0.388
+						c-0.756,0-1.378,0.206-1.866,0.619c-0.488,0.411-0.733,0.965-0.733,1.659c0,1.099,0.756,2.115,2.263,3.052
+						c0.495,0.307,1.249,0.662,2.261,1.067l-0.664,1.04c-0.867,0-2.065-0.692-3.594-2.08c-1.09-0.984-1.633-2.033-1.633-3.146
+						c0-1.017,0.349-1.808,1.05-2.371c0.702-0.565,1.658-0.847,2.878-0.847c0.699,0,1.389,0.157,2.073,0.474
+						c0.681,0.319,1.171,0.665,1.466,1.037c0.184-0.145,0.332-0.25,0.44-0.313c0.37-0.243,0.664-0.411,0.886-0.51
+						c0.388-0.161,0.839-0.289,1.355-0.388c0.167-0.031,0.388-0.063,0.664-0.096V40.539z"/>
+				</g>
+				<g>
+					<path d="M257.114,36.527h-3.216v11.124h-1.402V36.527h-2.377v-0.945h6.995V36.527z"/>
+				</g>
+				<g>
+					<path d="M266.044,44.03c-0.332,0.241-0.627,0.419-0.886,0.533c-0.774,0.357-1.634,0.537-2.573,0.537
+						c-1.55,0-2.755-0.447-3.611-1.342c-0.858-0.895-1.287-1.896-1.287-3.008c0.075,0.029,0.131,0.045,0.169,0.045
+						c0.318,0.074,0.571,0.112,0.759,0.112c0.729,0,1.291-0.145,1.683-0.438c0.468-0.337,0.701-0.861,0.701-1.571
+						c0-0.485-0.222-1.025-0.668-1.621c-0.149-0.194-0.371-0.444-0.669-0.751h-3.846v-0.945h8.172v0.945h-2.669
+						c0.239,0.322,0.417,0.589,0.527,0.798c0.371,0.646,0.559,1.196,0.559,1.646c0,1.066-0.518,1.856-1.55,2.372
+						c-0.332,0.161-0.857,0.322-1.576,0.484c0.184,0.531,0.378,0.926,0.58,1.182c0.629,0.806,1.539,1.208,2.736,1.208
+						c0.756,0,1.443-0.18,2.07-0.534c0.754-0.436,1.214-0.864,1.379-1.284V44.03z"/>
+				</g>
+				<g>
+					<path d="M270.634,36.527h-3.214v11.124h-1.405V36.527h-2.376v-0.945h6.995V36.527z"/>
+				</g>
+			</g>
+		</g>
+	</g>
+</svg>
Binary file diapositives/Slidy/face1.gif has changed
Binary file diapositives/Slidy/face2.gif has changed
Binary file diapositives/Slidy/face3.gif has changed
Binary file diapositives/Slidy/face4.gif has changed
Binary file diapositives/Slidy/fold-bright.gif has changed
Binary file diapositives/Slidy/fold-dim.bmp has changed
Binary file diapositives/Slidy/fold-dim.gif has changed
Binary file diapositives/Slidy/fold.bmp has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/help.html	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,79 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>
+  
+  <title>Slide Show Help</title><style type="text/css">
+     body {
+        font-family: sans-serif;
+        margin: 10%;
+     }
+     .copyright { font-size: smaller }
+  </style>
+  <script type="text/javascript">
+    window.onload = load;
+    function load()
+    {
+      var back = document.getElementById("back");
+      back.focus();
+    }
+  </script>
+</head>
+<body>
+<h1>Slide Show Help</h1>
+
+<p>This slide show can be driven in the same way as Power Point.
+To advance to the next slide click anywhere on the page with the
+mouse, or press the space bar. You can move forwards or backwards
+through the slides with the Cursor left, Cursor right, Pg Up and
+Pg Dn keys. The font size is automatically adjusted to match the
+browser's window width, but you can also adjust it manually using
+the "S"  key for smaller and the "B" key for bigger. You can also
+use the "&lt;" and "&gt;" keys. Before printing, use the "A" key
+to toggle between current slide and all slides. Use the "F" key to
+switch off/on the bottom status line. The "K" key toggles the use
+of mouse click to advance to the next slide. You can use "C" to
+show the table of contents and any other key to hide it. Use the
+"F11" key to toggle the browser's full screen mode. Note that not
+all keys are supported in all browsers, as browsers may reserve
+some keys for browser control and this varies from one browser to
+the next.</p>
+
+<p>Firefox users may want the <a
+href="http://extensionroom.mozdev.org/more-info/autohide">autohide</a>
+extension to hide the toolbars when entering full screen with F11.
+Newer versions of Firefox have built-in support for SVG, but on older
+versions for Microsoft Widows, you should consider installing the <a
+href="http://plugindoc.mozdev.org/windows.html">Adobe SVG Viewer
+6.0</a>.</p>
+
+<p>If you would like to see how Slidy works, use View Source to view
+the XHTML markup, or see this <a
+href="http://www.w3.org/Talks/Tools/Slidy/">longer explanation</a>,
+which also explains additional features. Each slide is marked up as
+a div element with class="slide". CSS positioning and percentage
+widths on images can be used to ensure your image rich slides scale
+to match the window size. Content to be revealed incrementally can
+be marked up with class="incremental". The linked style sheet and
+scripts were developed as a Web-based alternative to proprietary
+presentation tools and have been tested on a variety of recent
+browsers. Integrated editing support is under development. Please
+send your comments to <a href="http://www.w3.org/People/Raggett/">Dave
+Raggett</a> &lt;<a href="mailto:dsr@w3.org">dsr@w3.org</a>&gt;.</p>
+
+<p><em>You are welcome to make use of the slide show style sheets,
+scripts and help file under W3C's <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a>
+and <a href="http://www.w3.org/Consortium/Legal/copyright-software">software
+licensing</a> rules.</em></p>
+
+<button id="back" onclick="history.go(-1)">Return to slide show</button>
+
+<hr>
+
+<p class="copyright"><a rel="Copyright" href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a>  2005
+<a href="/" shape="rect"><acronym title="World Wide Web Consortium">W3C</acronym></a><sup></sup> (<a href="http://www.csail.mit.edu/"><acronym title="Massachusetts Institute of Technology">MIT</acronym></a>,
+<a href="http://www.ercim.org/"><acronym title="European Research Consortium for Informatics and Mathematics">ERCIM</acronym></a>,
+<a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C
+<a href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
+<a href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>,
+<a rel="Copyright" href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> and <a rel="Copyright" href="http://www.w3.org/Consortium/Legal/copyright-software">software
+licensing</a> rules apply.</p>
+</body></html>
Binary file diapositives/Slidy/nofold-dim.bmp has changed
Binary file diapositives/Slidy/nofold.bmp has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/slidy.css	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,316 @@
+/* slidy.css
+
+   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
+   W3C liability, trademark, document use and software licensing
+   rules apply, see:
+
+   http://www.w3.org/Consortium/Legal/copyright-documents
+   http://www.w3.org/Consortium/Legal/copyright-software
+*/
+body
+{
+  margin: 0 0 0 0;
+  padding: 0 0 0 0;
+  width: 100%;
+  height: 100%;
+  color: black;
+  background-color: white;
+  font-family: "Gill Sans MT", "Gill Sans", GillSans, sans-serif;
+  font-size: 14pt;
+}
+
+.hidden { display: none; visibility: hidden }
+
+div.toolbar {
+  position: fixed; z-index: 200;
+  top: auto; bottom: 0; left: 0; right: 0;
+  height: 1.2em; text-align: right;
+  padding-left: 1em;
+  padding-right: 1em; 
+  font-size: 60%;
+  color: red; background: rgb(240,240,240);
+}
+
+div.background {
+  display: none;
+}
+
+div.handout {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+div.slide.titlepage {
+  text-align: center;
+}
+
+div.slide.titlepage.h1 {
+  padding-top: 40%;
+}
+
+div.slide {
+  z-index: 20;
+  margin: 0 0 0 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  padding-left: 20px;
+  padding-right: 20px;
+  border-width: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  line-height: 120%;
+  background-color: transparent;
+}
+
+/* this rule is hidden from IE 6 and below which don't support + selector */
+div.slide + div[class].slide { page-break-before: always;}
+
+div.slide h1 {
+  padding-left: 0;
+  padding-right: 20pt;
+  padding-top: 4pt;
+  padding-bottom: 4pt;
+  margin-top: 0;
+  margin-left: 0;
+  margin-right: 60pt;
+  margin-bottom: 0.5em;
+  display: block; 
+  font-size: 160%;
+  line-height: 1.2em;
+  background: transparent;
+}
+
+div.toc {
+  position: absolute;
+  top: auto;
+  bottom: 4em;
+  left: 4em;
+  right: auto;
+  width: 60%;
+  max-width: 30em;
+  height: 30em;
+  border: solid thin black;
+  padding: 1em;
+  background: rgb(240,240,240);
+  color: black;
+  z-index: 300;
+  overflow: auto;
+  display: block;
+  visibility: visible;
+}
+
+div.toc-heading {
+  width: 100%;
+  border-bottom: solid 1px rgb(180,180,180);
+  margin-bottom: 1em;
+  text-align: center;
+}
+
+pre {
+ font-size: 80%;
+ font-weight: bold;
+ line-height: 120%;
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+ padding-left: 1em;
+ padding-right: 1em;
+ border-style: solid;
+ border-left-width: 1em;
+ border-top-width: thin;
+ border-right-width: thin;
+ border-bottom-width: thin;
+ border-color: #95ABD0;
+ color: #00428C;
+ background-color: #E4E5E7;
+}
+
+li pre { margin-left: 0; }
+
+@media print {
+  div.slide {
+     display: block;
+     visibility: visible;
+     position: relative;
+     border-top-style: solid;
+     border-top-width: thin;
+     border-top-color: black;
+  }
+  div.slide pre { font-size: 60%; padding-left: 0.5em; }
+  div.handout { display: block; visibility: visible; }
+}
+
+blockquote { font-style: italic }
+
+img { background-color: transparent }
+
+p.copyright { font-size: smaller }
+
+.center { text-align: center }
+.footnote { font-size: smaller; margin-left: 2em; }
+
+a img { border-width: 0; border-style: none }
+
+a:visited { color: navy }
+a:link { color: navy }
+a:hover { color: red; text-decoration: underline }
+a:active { color: red; text-decoration: underline }
+
+a {text-decoration: none}
+.navbar a:link {color: white}
+.navbar a:visited {color: yellow}
+.navbar a:active {color: red}
+.navbar a:hover {color: red}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+li { margin-left: 0.5em; margin-top: 0.5em; }
+li li { font-size: 85%; font-style: italic }
+li li li { font-size: 85%; font-style: normal }
+
+div dt
+{
+  margin-left: 0;
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+  font-weight: bold;
+}
+div dd
+{
+  margin-left: 2em;
+  margin-bottom: 0.5em;
+}
+
+
+p,pre,ul,ol,blockquote,h2,h3,h4,h5,h6,dl,table {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+
+p.subhead { font-weight: bold; margin-top: 2em; }
+
+p.smaller { font-size: smaller }
+
+td,th { padding: 0.2em }
+
+ul {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ol {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+
+ul li { 
+  list-style: square;
+  margin: 0.1em 0em 0.6em 0;
+  padding: 0 0 0 0;
+  line-height: 140%;
+}
+
+ol li { 
+  margin: 0.1em 0em 0.6em 1.5em;
+  padding: 0 0 0 0px;
+  line-height: 140%;
+  list-style-type: decimal;
+}
+
+li ul li { 
+  font-size: 85%; 
+  font-style: italic;
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li ul li { 
+  font-size: 85%; 
+  font-style: normal;
+  list-style-type: circle;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li ul li {
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+
+li ol li {
+  list-style-type: decimal;
+}
+
+
+li li ol li {
+  list-style-type: decimal;
+}
+
+/*
+ setting class="outline on ol or ul makes it behave as an
+ ouline list where blocklevel content in li elements is
+ hidden by default and can be expanded or collapsed with
+ mouse click. Set class="expand" on li to override default
+*/
+
+ol.outline li:hover { cursor: pointer }
+ol.outline li.nofold:hover { cursor: default }
+
+ul.outline li:hover { cursor: pointer }
+ul.outline li.nofold:hover { cursor: default }
+
+ol.outline { list-style:decimal; }
+ol.outline ol { list-style-type:lower-alpha }
+
+ol.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.gif) no-repeat 0px 0.5em;
+}
+
+ul.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.gif) no-repeat 0px 0.5em;
+}
+ul.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.gif) no-repeat 0px 0.5em;
+}
+ul.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.gif) no-repeat 0px 0.5em;
+}
+ul.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.gif) no-repeat 0px 0.5em;
+}
+ul.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.gif) no-repeat 0px 0.5em;
+}
+
+/* for slides with class "title" in table of contents */
+a.titleslide { font-weight: bold; font-style: italic }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/slidy.js	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,2789 @@
+/* slidy.js
+
+   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
+   W3C liability, trademark, document use and software licensing
+   rules apply, see:
+
+   http://www.w3.org/Consortium/Legal/copyright-documents
+   http://www.w3.org/Consortium/Legal/copyright-software
+*/
+
+var ns_pos = (typeof window.pageYOffset!='undefined');
+var khtml = ((navigator.userAgent).indexOf("KHTML") >= 0 ? true : false);
+var opera = ((navigator.userAgent).indexOf("Opera") >= 0 ? true : false);
+var ie7 = (!ns_pos && navigator.userAgent.indexOf("MSIE 7") != -1);
+
+window.onload = startup; // equivalent to onload on body element
+
+// IE only event handlers to ensure all slides are printed
+// I don't yet know how to emulate these for other browsers
+window.onbeforeprint = beforePrint;
+window.onafterprint = afterPrint;
+
+// hack to hide slides while loading
+setTimeout(hideAll, 50);
+
+function hideAll()
+{
+  if (document.body)
+    document.body.style.visibility = "hidden";
+  else
+    setTimeout(hideAll, 50);
+}
+
+var slidenum = 0;     // integer slide count: 0, 1, 2, ...
+var slides;           // set to array of slide div's
+var slideNumElement;  // element containing slide number
+var notes;            // set to array of handout div's
+var backgrounds;      // set to array of background div's
+var toolbar;          // element containing toolbar
+var title;            // document title
+var lastShown = null; // last incrementally shown item
+var eos = null;       // span element for end of slide indicator
+var toc = null;       // table of contents
+var outline = null;   // outline element with the focus
+var selectedTextLen;  // length of drag selection on document
+
+var viewAll = 0;      // 1 to view all slides + handouts
+var wantToolbar = 1;   // 0 if toolbar isn't wanted
+var mouseClickEnabled = true;  // enables left click for next slide
+var scrollhack = 0;   // IE work around for position: fixed
+
+var helpAnchor;  // used for keyboard focus hack in showToolbar()
+var helpPage = "http://www.w3.org/Talks/Tools/Slidy/help.html";
+var helpText = "Navigate with mouse click, space bar, Cursor Left/Right, " +
+               "or Pg Up and Pg Dn. Use S and B to change font size.";
+
+var sizeIndex = 0;
+var sizeAdjustment = 0;
+var sizes = new Array("10pt", "12pt", "14pt", "16pt", "18pt", "20pt",
+                      "22pt", "24pt", "26pt", "28pt", "30pt", "32pt");
+
+var okayForIncremental = incrementalElementList();
+
+// needed for efficient resizing
+var lastWidth = 0;
+var lastHeight = 0;
+
+// Needed for cross browser support for relative width/height on
+// object elements. The work around is to save width/height attributes
+// and then to recompute absolute width/height dimensions on resizing
+var objects;
+
+// updated to language specified by html file
+var lang = "en";
+
+//var localize = {};
+
+// for each language there is an associative array
+var strings_es = {
+  "slide":"pág.",
+  "help?":"Ayuda",
+  "contents?":"Índice",
+  "table of contents":"tabla de contenidos",
+  "Table of Contents":"Tabla de Contenidos",
+  "restart presentation":"Reiniciar presentación",
+  "restart?":"Inicio"
+   };
+
+strings_es[helpText] =
+    "Utilice el ratón, barra espaciadora, teclas Izda/Dcha, " +
+    "o Re pág y Av pág. Use S y B para cambiar el tamaño de fuente.";
+
+var strings_ca = {
+ "slide":"pàg..",
+ "help?":"Ajuda",
+ "contents?":"Índex",
+ "table of contents":"taula de continguts",
+ "Table of Contents":"Taula de Continguts",
+ "restart presentation":"Reiniciar presentació",
+ "restart?":"Inici"
+  };
+
+strings_ca[helpText] =
+   "Utilitzi el ratolí, barra espaiadora, tecles Esq./Dta. " +
+   "o Re pàg y Av pàg. Usi S i B per canviar grandària de font.";
+
+var strings_nl = {
+  "slide":"pagina",
+  "help?":"Help?",
+  "contents?":"Inhoud?",
+  "table of contents":"inhoudsopgave",
+  "Table of Contents":"Inhoudsopgave",
+  "restart presentation":"herstart presentatie",
+  "restart?":"Herstart?"
+   };
+
+strings_nl[helpText] =
+    "Navigeer d.m.v. het muis, spatiebar, Links/Rechts toetsen, " +
+    "of PgUp en PgDn. Gebruik S en B om de karaktergrootte te veranderen.";
+
+var strings_de = {
+  "slide":"Seite",
+  "help?":"Hilfe",
+  "contents?":"Übersicht",
+  "table of contents":"Inhaltsverzeichnis",
+  "Table of Contents":"Inhaltsverzeichnis",
+  "restart presentation":"Präsentation neu starten",
+  "restart?":"Neustart"
+   };
+
+strings_de[helpText] =
+    "Benutzen Sie die Maus, Leerschlag, die Cursortasten links/rechts oder " +
+    "Page up/Page Down zum Wechseln der Seiten und S und B für die Schriftgrösse.";
+
+var strings_pl = {
+  "slide":"slajd",
+  "help?":"pomoc?",
+  "contents?":"spis treści?",
+  "table of contents":"spis treści",
+  "Table of Contents":"Spis Treści",
+  "restart presentation":"Restartuj prezentację",
+  "restart?":"restart?"
+   };
+
+strings_pl[helpText] =
+    "Zmieniaj slajdy klikając myszą, naciskając spację, strzałki lewo/prawo" +
+    "lub PgUp / PgDn. Użyj klawiszy S i B, aby zmienić rozmiar czczionki.";
+
+var strings_fr = {
+  "slide":"page",
+  "help?":"Aide",
+  "contents?":"Index",
+  "table of contents":"table des matières",
+  "Table of Contents":"Table des matières",
+  "restart presentation":"Recommencer l'exposé",
+  "restart?":"Début"
+  };
+
+strings_fr[helpText] =
+    "Naviguez avec la souris, la barre d'espace, les flèches " +
+    "gauche/droite ou les touches Pg Up, Pg Dn. Utilisez " +
+    "les touches S et B pour modifier la taille de la police.";
+
+var strings_hu = {
+  "slide":"oldal",
+  "help?":"segítség",
+  "contents?":"tartalom",
+  "table of contents":"tartalomjegyzék",
+  "Table of Contents":"Tartalomjegyzék",
+  "restart presentation":"bemutató újraindítása",
+  "restart?":"újraindítás"
+   };
+
+strings_hu[helpText] =
+    "Az oldalak közti lépkedéshez kattintson az egérrel, vagy " +
+    "használja a szóköz, a bal, vagy a jobb nyíl, illetve a Page Down, " +
+    "Page Up billentyűket. Az S és a B billentyűkkel változtathatja " +
+    "a szöveg méretét.";
+
+var strings_it = {
+  "slide":"pag.",
+  "help?":"Aiuto",
+  "contents?":"Indice",
+  "table of contents":"indice",
+  "Table of Contents":"Indice",
+  "restart presentation":"Ricominciare la presentazione",
+  "restart?":"Inizio"
+   };
+
+strings_it[helpText] =
+    "Navigare con mouse, barra spazio, frecce sinistra/destra o " +
+    "PgUp e PgDn. Usare S e B per cambiare la dimensione dei caratteri.";
+
+var strings_el = {
+  "slide":"σελίδα",
+  "help?":"βοήθεια;",
+  "contents?":"περιεχόμενα;",
+  "table of contents":"πίνακας περιεχομένων",
+  "Table of Contents":"Πίνακας Περιεχομένων",
+  "restart presentation":"επανεκκίνηση παρουσίασης",
+  "restart?":"επανεκκίνηση;"
+   };
+
+strings_el[helpText] =
+  "Πλοηγηθείτε με το κλίκ του ποντικιού, το space, τα βέλη αριστερά/δεξιά, " +
+  "ή Page Up και Page Down. Χρησιμοποιήστε τα πλήκτρα S και B για να αλλάξετε " +
+  "το μέγεθος της γραμματοσειράς.";
+
+var strings_ja = {
+  "slide":"スライド",
+  "help?":"ヘルプ",
+  "contents?":"目次",
+  "table of contents":"目次を表示",
+  "Table of Contents":"目次",
+  "restart presentation":"最初から再生",
+  "restart?":"最初から"
+};
+
+strings_ja[helpText] =
+    "マウス左クリック ・ スペース ・ 左右キー " +
+    "または Page Up ・ Page Downで操作, S ・ Bでフォントサイズ変更";
+
+
+// each such language array is declared in the localize array
+// used indirectly as in help.innerHTML = "help".localize();
+var localize = {
+     "es":strings_es,
+     "ca":strings_ca,
+     "nl":strings_nl,
+     "de":strings_de,
+     "pl":strings_pl,
+     "fr":strings_fr,
+     "hu":strings_hu,
+     "it":strings_it,
+     "el":strings_el,
+     "jp":strings_ja
+   };
+
+/* general initialization */
+function startup()
+{
+   // find human language from html element
+   // for use in localizing strings
+   lang = document.body.parentNode.getAttribute("lang");
+
+   if (!lang)
+     lang = document.body.parentNode.getAttribute("xml:lang");
+
+   if (!lang)
+     lang = "en";
+
+   document.body.style.visibility = "visible";
+   title = document.title;
+   toolbar = addToolbar();
+   wrapImplicitSlides();
+   slides = collectSlides();
+   notes = collectNotes();
+   objects = document.body.getElementsByTagName("object");
+   backgrounds = collectBackgrounds();
+   patchAnchors();
+
+   slidenum = findSlideNumber(location.href);
+   window.offscreenbuffering = true;
+   sizeAdjustment = findSizeAdjust();
+   hideImageToolbar();  // suppress IE image toolbar popup
+   initOutliner();  // activate fold/unfold support
+
+   if (slides.length > 0)
+   {
+      var slide = slides[slidenum];
+      slide.style.position = "absolute";
+   
+      if (slidenum > 0)
+      {
+         setVisibilityAllIncremental("visible");
+         lastShown = previousIncrementalItem(null);
+         setEosStatus(true);
+      }
+      else
+      {
+         lastShown = null;
+         setVisibilityAllIncremental("hidden");
+         setEosStatus(!nextIncrementalItem(lastShown));
+      }
+
+      setLocation();
+   }
+
+   toc = tableOfContents();
+   hideTableOfContents();
+
+   // bind event handlers
+   document.onclick = mouseButtonClick;
+   document.onmouseup = mouseButtonUp;
+   document.onkeydown = keyDown;
+   window.onresize  = resized;
+   window.onscroll = scrolled;
+   singleSlideView();
+
+   setLocation();
+   resized();
+
+   if (ie7)
+     setTimeout("ieHack()", 100);
+
+   showToolbar();
+}
+
+// add localize method to all strings for use
+// as in help.innerHTML = "help".localize();
+String.prototype.localize = function()
+{
+  if (this == "")
+    return this;
+
+  // try full language code, e.g. en-US
+  var s, lookup = localize[lang];
+
+  if (lookup)
+  {
+    s = lookup[this];
+
+    if (s)
+      return s;
+  }
+
+  // try en if undefined for en-US
+  var lg = lang.split("-");
+
+  if (lg.length > 1)
+  {
+    lookup = localize[lg[0]];
+
+    if (lookup)
+    {
+      s = lookup[this];
+
+      if (s)
+        return s;
+    }
+  }
+
+  // otherwise string as is
+  return this;
+}
+
+// suppress IE's image toolbar pop up
+function hideImageToolbar()
+{
+  if (!ns_pos)
+  {
+    var images = document.getElementsByTagName("IMG");
+
+    for (var i = 0; i < images.length; ++i)
+      images[i].setAttribute("galleryimg", "no");
+  }
+}
+
+// hack to persuade IE to compute correct document height
+// as needed for simulating fixed positioning of toolbar
+function ieHack()
+{
+   window.resizeBy(0,-1);
+   window.resizeBy(0, 1);
+}
+
+// Firefox reload SVG bug work around
+function reload(e)
+{
+   if (!e)
+      var e = window.event;
+
+   hideBackgrounds();
+   setTimeout("document.reload();", 100);
+
+   stopPropagation(e);
+   e.cancel = true;
+   e.returnValue = false;
+
+   return false;
+}
+
+// Safari and Konqueror don't yet support getComputedStyle()
+// and they always reload page when location.href is updated
+function isKHTML()
+{
+   var agent = navigator.userAgent;
+   return (agent.indexOf("KHTML") >= 0 ? true : false);
+}
+
+function resized()
+{
+   var width = 0;
+
+   if ( typeof( window.innerWidth ) == 'number' )
+      width = window.innerWidth;  // Non IE browser
+   else if (document.documentElement && document.documentElement.clientWidth)
+      width = document.documentElement.clientWidth;  // IE6
+   else if (document.body && document.body.clientWidth)
+      width = document.body.clientWidth; // IE4
+
+   var height = 0;
+
+   if ( typeof( window.innerHeight ) == 'number' )
+      height = window.innerHeight;  // Non IE browser
+   else if (document.documentElement && document.documentElement.clientHeight)
+      height = document.documentElement.clientHeight;  // IE6
+   else if (document.body && document.body.clientHeight)
+      height = document.body.clientHeight; // IE4
+
+   if (height && (width/height > 1.05*1024/768))
+   {
+     width = height * 1024.0/768;
+   }
+
+   // IE fires onresize even when only font size is changed!
+   // so we do a check to avoid blocking < and > actions
+   if (width != lastWidth || height != lastHeight)
+   {
+      if (width >= 1100)
+         sizeIndex = 5;    // 4
+      else if (width >= 1000)
+         sizeIndex = 4;    // 3
+      else if (width >= 800)
+         sizeIndex = 3;    // 2
+      else if (width >= 600)
+         sizeIndex = 2;    // 1
+      else if (width)
+         sizeIndex = 0;
+
+      // add in font size adjustment from meta element e.g.
+      // <meta name="font-size-adjustment" content="-2" />
+      // useful when slides have too much content ;-)
+
+      if (0 <= sizeIndex + sizeAdjustment &&
+             sizeIndex + sizeAdjustment < sizes.length)
+        sizeIndex = sizeIndex + sizeAdjustment;
+
+      // enables cross browser use of relative width/height
+      // on object elements for use with SVG and Flash media
+      adjustObjectDimensions(width, height);
+
+      document.body.style.fontSize = sizes[sizeIndex];
+
+      lastWidth = width;
+      lastHeight = height;
+
+      // force reflow to work around Mozilla bug
+      //if (ns_pos)
+      {
+         var slide = slides[slidenum];
+         hideSlide(slide);
+         showSlide(slide);
+      }
+
+      // force correct positioning of toolbar
+      refreshToolbar(200);
+   }
+}
+
+function scrolled()
+{
+   if (toolbar && !ns_pos && !ie7)
+   {
+      hackoffset = scrollXOffset();
+      // hide toolbar
+      toolbar.style.display = "none";
+
+      // make it reappear later
+      if (scrollhack == 0 && !viewAll)
+      {
+         setTimeout(showToolbar, 1000);
+         scrollhack = 1;
+      }
+   }
+}
+
+// used to ensure IE refreshes toolbar in correct position
+function refreshToolbar(interval)
+{
+   if (!ns_pos && !ie7)
+   {
+     hideToolbar();
+     setTimeout(showToolbar, interval);
+   }
+}
+
+// restores toolbar after short delay
+function showToolbar()
+{
+   if (wantToolbar)
+   {
+      if (!ns_pos)
+      {
+         // adjust position to allow for scrolling
+         var xoffset = scrollXOffset();
+         toolbar.style.left = xoffset;
+         toolbar.style.right = xoffset;
+
+         // determine vertical scroll offset
+         //var yoffset = scrollYOffset();
+
+         // bottom is doc height - window height - scroll offset
+         //var bottom = documentHeight() - lastHeight - yoffset
+
+         //if (yoffset > 0 || documentHeight() > lastHeight)
+         //   bottom += 16;  // allow for height of scrollbar
+
+         toolbar.style.bottom = 0; //bottom;
+      }
+
+      toolbar.style.display = "block";
+      toolbar.style.visibility = "visible";
+   }
+
+   scrollhack = 0;
+
+
+   // set the keyboard focus to the help link on the
+   // toolbar to ensure that document has the focus
+   // IE doesn't always work with window.focus()
+   // and this hack has benefit of Enter for help
+
+   try
+   {
+     if (!opera)
+       helpAnchor.focus();
+   }
+   catch (e)
+   {
+   }
+}
+
+function test()
+{
+   var s = "docH: " + documentHeight() +
+       " winH: " + lastHeight +
+       " yoffset: " + scrollYOffset() +
+       " toolbot: " + (documentHeight() - lastHeight - scrollYOffset());
+
+   //alert(s);
+
+   var slide = slides[slidenum];
+   // IE getAttribute requires "class" to be "className"
+   var name = ns_pos ? "class" : "className";
+   var style = (slide.currentStyle ? slide.currentStyle["backgroundColor"] :
+       document.defaultView.getComputedStyle(slide, '').getPropertyValue("background-color"));
+   alert("class='" + slide.getAttribute(name) + "' backgroundColor: " + style);
+}
+
+function hideToolbar()
+{
+   toolbar.style.display = "none";
+   toolbar.style.visibility = "hidden";
+   window.focus();
+}
+
+// invoked via F key
+function toggleToolbar()
+{
+   if (!viewAll)
+   {
+      if (toolbar.style.display == "none")
+      {
+         toolbar.style.display = "block";
+         toolbar.style.visibility = "visible";
+         wantToolbar = 1;
+      }
+      else
+      {
+         toolbar.style.display = "none";
+         toolbar.style.visibility = "hidden";
+         wantToolbar = 0;
+      }
+   }
+}
+
+function scrollXOffset()
+{
+   if (window.pageXOffset)
+      return self.pageXOffset;
+
+   if (document.documentElement && 
+             document.documentElement.scrollLeft)
+      return document.documentElement.scrollLeft;
+
+   if (document.body)
+      return document.body.scrollLeft;
+
+    return 0;
+}
+
+
+function scrollYOffset()
+{
+   if (window.pageYOffset)
+      return self.pageYOffset;
+
+   if (document.documentElement && 
+             document.documentElement.scrollTop)
+      return document.documentElement.scrollTop;
+
+   if (document.body)
+      return document.body.scrollTop;
+
+    return 0;
+}
+
+// looking for a way to determine height of slide content
+// the slide itself is set to the height of the window
+function optimizeFontSize()
+{
+   var slide = slides[slidenum];
+
+   //var dh = documentHeight(); //getDocHeight(document);
+   var dh = slide.scrollHeight;
+   var wh = getWindowHeight();
+   var u = 100 * dh / wh;
+
+   alert("window utilization = " + u + "% (doc "
+      + dh + " win " + wh + ")");
+}
+
+function getDocHeight(doc) // from document object
+{
+  if (!doc)
+    doc = document;
+
+  if (doc && doc.body && doc.body.offsetHeight)
+    return doc.body.offsetHeight;  // ns/gecko syntax
+
+  if (doc && doc.body && doc.body.scrollHeight)
+    return doc.body.scrollHeight;
+
+  alert("couldn't determine document height");
+}
+
+function getWindowHeight()
+{
+  if ( typeof( window.innerHeight ) == 'number' )
+    return window.innerHeight;  // Non IE browser
+
+  if (document.documentElement && document.documentElement.clientHeight)
+    return document.documentElement.clientHeight;  // IE6
+
+  if (document.body && document.body.clientHeight)
+    return document.body.clientHeight; // IE4
+}
+
+
+
+function documentHeight()
+{
+   var sh, oh;
+
+   sh = document.body.scrollHeight;
+   oh = document.body.offsetHeight;
+
+   if (sh && oh)
+   {
+      return (sh > oh ? sh : oh);
+   }
+
+   // no idea!
+   return 0;
+}
+
+function smaller()
+{
+   if (sizeIndex > 0)
+   {
+      --sizeIndex;
+   }
+
+   toolbar.style.display = "none";
+   document.body.style.fontSize = sizes[sizeIndex];
+   var slide = slides[slidenum];
+   hideSlide(slide);
+   showSlide(slide);
+   setTimeout(showToolbar, 300);
+}
+
+function bigger()
+{
+   if (sizeIndex < sizes.length - 1)
+   {
+      ++sizeIndex;
+   }
+
+   toolbar.style.display = "none";
+   document.body.style.fontSize = sizes[sizeIndex];
+   var slide = slides[slidenum];
+   hideSlide(slide);
+   showSlide(slide);
+   setTimeout(showToolbar, 300);
+}
+
+// enables cross browser use of relative width/height
+// on object elements for use with SVG and Flash media
+// with thanks to Ivan Herman for the suggestion
+function adjustObjectDimensions(width, height)
+{
+   for( var i = 0; i < objects.length; i++ )
+   {
+      var obj = objects[i];
+      var mimeType = obj.getAttribute("type");
+
+      if (mimeType == "image/svg+xml" || mimeType == "application/x-shockwave-flash")
+      {
+         if ( !obj.initialWidth ) 
+            obj.initialWidth = obj.getAttribute("width");
+
+         if ( !obj.initialHeight ) 
+            obj.initialHeight = obj.getAttribute("height");
+
+         if ( obj.initialWidth && obj.initialWidth.charAt(obj.initialWidth.length-1) == "%" )
+         {
+            var w = parseInt(obj.initialWidth.slice(0, obj.initialWidth.length-1));
+            var newW = width * (w/100.0);
+            obj.setAttribute("width",newW);
+         }
+
+         if ( obj.initialHeight && obj.initialHeight.charAt(obj.initialHeight.length-1) == "%" )
+         {
+            var h = parseInt(obj.initialHeight.slice(0, obj.initialHeight.length-1));
+            var newH = height * (h/100.0);
+            obj.setAttribute("height", newH);
+         }
+      }
+   }
+}
+
+function cancel(event)
+{
+  if (event)
+  {
+     event.cancel = true;
+     event.returnValue = false;
+
+    if (event.preventDefault)
+      event.preventDefault();
+  }
+
+  return false;
+}
+
+//  See e.g. http://www.quirksmode.org/js/events/keys.html for keycodes
+function keyDown(event)
+{
+    var key;
+
+    if (!event)
+      var event = window.event;
+
+    // kludge around NS/IE differences 
+    if (window.event)
+       key = window.event.keyCode;
+    else if (event.which)
+       key = event.which;
+    else
+       return true; // Yikes! unknown browser
+
+    // ignore event if key value is zero
+    // as for alt on Opera and Konqueror
+    if (!key)
+       return true;
+
+    // check for concurrent control/command/alt key
+    // but are these only present on mouse events?
+
+    if (event.ctrlKey || event.altKey || event.metaKey)
+       return true;
+
+    // dismiss table of contents if visible
+    if (isShownToc() && key != 9 && key != 16 && key != 38 && key != 40)
+    {
+      hideTableOfContents();
+
+      if (key == 27 || key == 84 || key == 67)
+        return cancel(event);
+    }
+
+    if (key == 34) // Page Down
+    {
+       nextSlide(false);
+       return cancel(event);
+    }
+    else if (key == 33) // Page Up
+    {
+       previousSlide(false);
+       return cancel(event);
+    }
+    else if (key == 32) // space bar
+    {
+       nextSlide(true);
+       return cancel(event);
+    }
+    else if (key == 37) // Left arrow
+    {
+       previousSlide(!event.shiftKey);
+       return cancel(event);
+    }
+    else if (key == 36) // Home
+    {
+       firstSlide();
+       return cancel(event);
+    }
+    else if (key == 35) // End
+    {
+       lastSlide();
+       return cancel(event);
+    }
+    else if (key == 39) // Right arrow
+    {
+       nextSlide(!event.shiftKey);
+       return cancel(event);
+    }
+    else if (key == 13) // Enter
+    {
+       if (outline)
+       {
+          if (outline.visible)
+            fold(outline);
+          else
+            unfold(outline);
+          
+         return cancel(event);
+       }
+    }
+    else if (key == 188)  // < for smaller fonts
+    {
+       smaller();
+       return cancel(event);
+    }
+    else if (key == 190)  // > for larger fonts
+    {
+       bigger();
+       return cancel(event);
+    }
+    else if (key == 189 || key == 109)  // - for smaller fonts
+    {
+       smaller();
+       return cancel(event);
+    }
+    else if (key == 187 || key == 191 || key == 107)  // = +  for larger fonts
+    {
+       bigger();
+       return cancel(event);
+    }
+    else if (key == 83)  // S for smaller fonts
+    {
+       smaller();
+       return cancel(event);
+    }
+    else if (key == 66)  // B for larger fonts
+    {
+       bigger();
+       return cancel(event);
+    }
+    else if (key == 90)  // Z for last slide
+    {
+       lastSlide();
+       return cancel(event);
+    }
+    else if (key == 70)  // F for toggle toolbar
+    {
+       toggleToolbar();
+       return cancel(event);
+    }
+    else if (key == 65)  // A for toggle view single/all slides
+    {
+       toggleView();
+       return cancel(event);
+    }
+    else if (key == 75)  // toggle action of left click for next page
+    {
+       mouseClickEnabled = !mouseClickEnabled;
+       alert((mouseClickEnabled ? "enabled" : "disabled") +  " mouse click advance");
+       return cancel(event);
+    }
+    else if (key == 84 || key == 67)  // T or C for table of contents
+    {
+       if (toc)
+         showTableOfContents();
+
+       return cancel(event);
+    }
+    else if (key == 72) // H for help
+    {
+       window.location = helpPage;
+       return cancel(event);
+    }
+
+    //else if (key == 93) // Windows menu key
+      //alert("lastShown is " + lastShown);
+    //else alert("key code is "+ key);
+
+
+    return true;
+}
+
+// make note of length of selected text
+// as this evaluates to zero in click event
+function mouseButtonUp(e)
+{
+  selectedTextLen = getSelectedText().length;
+}
+
+// right mouse button click is reserved for context menus
+// it is more reliable to detect rightclick than leftclick
+function mouseButtonClick(e)
+{
+   var rightclick = false;
+   var leftclick = false;
+   var middleclick = false;
+   var target;
+
+   if (!e)
+      var e = window.event;
+
+   if (e.target)
+      target = e.target;
+   else if (e.srcElement)
+      target = e.srcElement;
+
+   // work around Safari bug
+   if (target.nodeType == 3)
+      target = target.parentNode;
+
+   if (e.which) // all browsers except IE
+   {
+      leftclick = (e.which == 1);
+      middleclick = (e.which == 2);
+      rightclick = (e.which == 3);
+   }
+   else if (e.button)
+   {
+      // Konqueror gives 1 for left, 4 for middle
+      // IE6 gives 0 for left and not 1 as I expected
+
+      if (e.button == 4)
+        middleclick = true;
+
+      // all browsers agree on 2 for right button
+      rightclick = (e.button == 2);
+   }
+   else leftclick = true;
+
+   // dismiss table of contents
+   hideTableOfContents();
+
+   if (selectedTextLen > 0)
+   {
+      stopPropagation(e);
+      e.cancel = true;
+      e.returnValue = false;
+      return false;
+   }
+
+   // check if target is something that probably want's clicks
+   // e.g. embed, object, input, textarea, select, option
+
+   if (mouseClickEnabled && leftclick &&
+        target.nodeName != "EMBED" &&
+        target.nodeName != "OBJECT" &&
+        target.nodeName != "INPUT" &&
+        target.nodeName != "TEXTAREA" &&
+        target.nodeName != "SELECT" &&
+        target.nodeName != "OPTION")
+   {
+      nextSlide(true);
+      stopPropagation(e);
+      e.cancel = true;
+      e.returnValue = false;
+   }
+}
+
+function previousSlide(incremental)
+{
+   if (!viewAll)
+   {
+      var slide;
+
+      if ((incremental || slidenum == 0) && lastShown != null)
+      {
+         lastShown = hidePreviousItem(lastShown);
+         setEosStatus(false);
+      }
+      else if (slidenum > 0)
+      {
+         slide = slides[slidenum];
+         hideSlide(slide);
+
+         slidenum = slidenum - 1;
+         slide = slides[slidenum];
+         setVisibilityAllIncremental("visible");
+         lastShown = previousIncrementalItem(null);
+         setEosStatus(true);
+         showSlide(slide);
+      }
+
+      setLocation();
+
+      if (!ns_pos)
+         refreshToolbar(200);
+   }
+}
+
+function nextSlide(incremental)
+{
+   if (!viewAll)
+   {
+      var slide, last = lastShown;
+
+      if (incremental || slidenum == slides.length - 1)
+         lastShown = revealNextItem(lastShown);
+
+      if ((!incremental || lastShown == null) && slidenum < slides.length - 1)
+      {
+         slide = slides[slidenum];
+         hideSlide(slide);
+
+         slidenum = slidenum + 1;
+         slide = slides[slidenum];
+         lastShown = null;
+         setVisibilityAllIncremental("hidden");
+         showSlide(slide);
+      }
+      else if (!lastShown)
+      {
+         if (last && incremental)
+           lastShown = last;
+      }
+
+      setLocation();
+
+      setEosStatus(!nextIncrementalItem(lastShown));
+
+      if (!ns_pos)
+         refreshToolbar(200);
+   }
+}
+
+// to first slide with nothing revealed
+// i.e. state at start of presentation
+function firstSlide()
+{
+   if (!viewAll)
+   {
+      var slide;
+
+      if (slidenum != 0)
+      {
+         slide = slides[slidenum];
+         hideSlide(slide);
+
+         slidenum = 0;
+         slide = slides[slidenum];
+         lastShown = null;
+         setVisibilityAllIncremental("hidden");
+         showSlide(slide);
+      }
+
+      setEosStatus(!nextIncrementalItem(lastShown));
+      setLocation();
+   }
+}
+
+
+// to last slide with everything revealed
+// i.e. state at end of presentation
+function lastSlide()
+{
+   if (!viewAll)
+   {
+      var slide;
+
+      lastShown = null; //revealNextItem(lastShown);
+
+      if (lastShown == null && slidenum < slides.length - 1)
+      {
+         slide = slides[slidenum];
+         hideSlide(slide);
+         slidenum = slides.length - 1;
+         slide = slides[slidenum];
+         setVisibilityAllIncremental("visible");
+         lastShown = previousIncrementalItem(null);
+
+         showSlide(slide);
+      }
+      else
+      {
+         setVisibilityAllIncremental("visible");
+         lastShown = previousIncrementalItem(null);
+      }
+
+      setEosStatus(true);
+      setLocation();
+   }
+}
+
+function setEosStatus(state)
+{
+   if (eos)
+      eos.style.color = (state ? "rgb(240,240,240)" : "red");
+}
+
+function showSlide(slide)
+{
+   syncBackground(slide);
+   window.scrollTo(0,0);
+   slide.style.visibility = "visible";
+   slide.style.display = "block";
+}
+
+function hideSlide(slide)
+{
+   slide.style.visibility = "hidden";
+   slide.style.display = "none";
+}
+
+function beforePrint()
+{
+   showAllSlides();
+   hideToolbar();
+}
+
+function afterPrint()
+{
+   if (!viewAll)
+   {
+      singleSlideView();
+      showToolbar();
+   }
+}
+
+function printSlides()
+{
+  beforePrint();
+  window.print();
+  afterPrint();
+}
+
+function toggleView()
+{
+   if (viewAll)
+   {
+      singleSlideView();
+      showToolbar();
+      viewAll = 0;
+   }
+   else
+   {
+      showAllSlides();
+      hideToolbar();
+      viewAll = 1;
+   }
+}
+
+// prepare for printing
+function showAllSlides()
+{
+   var slide;
+
+   for (var i = 0; i < slides.length; ++i)
+   {
+      slide = slides[i];
+
+      slide.style.position = "relative";
+      slide.style.borderTopStyle = "solid";
+      slide.style.borderTopWidth = "thin";
+      slide.style.borderTopColor = "black";
+
+      try {
+        if (i == 0)
+          slide.style.pageBreakBefore = "avoid";
+        else
+          slide.style.pageBreakBefore = "always";
+      }
+      catch (e)
+      {
+        //do nothing
+      }
+
+      setVisibilityAllIncremental("visible");
+      showSlide(slide);
+   }
+
+   var note;
+
+   for (var i = 0; i < notes.length; ++i)
+   {
+      showSlide(notes[i]);
+   }
+
+   // no easy way to render background under each slide
+   // without duplicating the background divs for each slide
+   // therefore hide backgrounds to avoid messing up slides
+   hideBackgrounds();
+}
+
+// restore after printing
+function singleSlideView()
+{
+   var slide;
+
+   for (var i = 0; i < slides.length; ++i)
+   {
+      slide = slides[i];
+
+      slide.style.position = "absolute";
+
+      if (i == slidenum)
+      {
+         slide.style.borderStyle = "none";
+         showSlide(slide);
+      }
+      else
+      {
+         slide.style.borderStyle = "none";
+         hideSlide(slide);
+      }
+   }
+
+   setVisibilityAllIncremental("visible");
+   lastShown = previousIncrementalItem(null);
+
+   var note;
+
+   for (var i = 0; i < notes.length; ++i)
+   {
+      hideSlide(notes[i]);
+   }
+}
+
+// the string str is a whitespace separated list of tokens
+// test if str contains a particular token, e.g. "slide"
+function hasToken(str, token)
+{
+   if (str)
+   {
+      // define pattern as regular expression
+      var pattern = /\w+/g;
+
+      // check for matches
+      // place result in array
+      var result = str.match(pattern);
+
+      // now check if desired token is present
+      for (var i = 0; i < result.length; i++)
+      {
+         if (result[i] == token)
+            return true;
+      }
+   }
+
+   return false;
+}
+
+function getClassList(element)
+{
+  if (typeof window.pageYOffset =='undefined')
+    return element.getAttribute("className");
+
+  return element.getAttribute("class");
+}
+
+function hasClass(element, name)
+{
+  var regexp = new RegExp("(^| )" + name + "\W*");
+
+  if (regexp.test(getClassList(element)))
+    return true;
+
+  return false;
+
+}
+
+function removeClass(element, name)
+{
+  // IE getAttribute requires "class" to be "className"
+  var clsname = ns_pos ? "class" : "className";
+  var clsval = element.getAttribute(clsname);
+
+  var regexp = new RegExp("(^| )" + name + "\W*");
+
+  if (clsval)
+  {
+    clsval = clsval.replace(regexp, "");
+    element.setAttribute(clsname, clsval);
+  }
+}
+
+function addClass(element, name)
+{
+  if (!hasClass(element, name))
+  {
+    // IE getAttribute requires "class" to be "className"
+    var clsname = ns_pos ? "class" : "className";
+    var clsval = element.getAttribute(clsname);
+    element.setAttribute(clsname, (clsval ? clsval + " " + name : name));
+  }
+}
+
+// wysiwyg editors make it hard to use div elements
+// e.g. amaya loses the div when you copy and paste
+// this function wraps div elements around implicit
+// slides which start with an h1 element and continue
+// up to the next heading or div element
+function wrapImplicitSlides()
+{
+   var i, heading, node, next, div;
+   var headings = document.getElementsByTagName("h1");
+
+   if (!headings)
+     return;
+
+   for (i = 0; i < headings.length; ++i)
+   {
+      heading = headings[i];
+
+      if (heading.parentNode != document.body)
+         continue;
+
+      node = heading.nextSibling;
+
+      div = document.createElement("div");
+      div.setAttribute((ns_pos ? "class" : "className"), "slide");
+      document.body.replaceChild(div, heading);
+      div.appendChild(heading);
+
+      while (node)
+      {
+         if (node.nodeType == 1 &&    // an element
+                  (node.nodeName == "H1" ||
+                   node.nodeName == "h1" ||
+                   node.nodeName == "DIV" ||
+                   node.nodeName == "div"))
+            break;
+
+         next = node.nextSibling;
+         node = document.body.removeChild(node);
+         div.appendChild(node);
+         node = next;
+      } 
+   }
+}
+
+// return new array of all slides
+function collectSlides()
+{
+   var slides = new Array();
+   var divs = document.body.getElementsByTagName("div");
+
+   for (var i = 0; i < divs.length; ++i)
+   {
+      div = divs.item(i);
+
+      if (hasClass(div, "slide"))
+      {
+         // add slide to collection
+         slides[slides.length] = div;
+
+         // hide each slide as it is found
+         div.style.display = "none";
+         div.style.visibility = "hidden";
+
+         // add dummy <br/> at end for scrolling hack
+         var node1 = document.createElement("br");
+         div.appendChild(node1);
+         var node2 = document.createElement("br");
+         div.appendChild(node2);
+      }
+      else if (hasClass(div, "background"))
+      {  // work around for Firefox SVG reload bug
+         // which otherwise replaces 1st SVG graphic with 2nd
+         div.style.display = "block";
+      }
+   }
+
+   return slides;
+}
+
+// return new array of all <div class="handout">
+function collectNotes()
+{
+   var notes = new Array();
+   var divs = document.body.getElementsByTagName("div");
+
+   for (var i = 0; i < divs.length; ++i)
+   {
+      div = divs.item(i);
+
+      if (hasClass(div, "handout"))
+      {
+         // add slide to collection
+         notes[notes.length] = div;
+
+         // hide handout notes as they are found
+         div.style.display = "none";
+         div.style.visibility = "hidden";
+      }
+   }
+
+   return notes;
+}
+
+// return new array of all <div class="background">
+// including named backgrounds e.g. class="background titlepage"
+function collectBackgrounds()
+{
+   var backgrounds = new Array();
+   var divs = document.body.getElementsByTagName("div");
+
+   for (var i = 0; i < divs.length; ++i)
+   {
+      div = divs.item(i);
+
+      if (hasClass(div, "background"))
+      {
+         // add slide to collection
+         backgrounds[backgrounds.length] = div;
+
+         // hide named backgrounds as they are found
+         // e.g. class="background epilog"
+         if (getClassList(div) != "background")
+         {
+            div.style.display = "none";
+            div.style.visibility = "hidden";
+         }
+      }
+   }
+
+   return backgrounds;
+}
+
+// show just the backgrounds pertinent to this slide
+function syncBackground(slide)
+{
+   var background;
+   var bgColor;
+
+   if (slide.currentStyle)
+      bgColor = slide.currentStyle["backgroundColor"];
+   else if (document.defaultView)
+   {
+      var styles = document.defaultView.getComputedStyle(slide,null);
+
+      if (styles)
+          bgColor = styles.getPropertyValue("background-color");
+      else // broken implementation probably due Safari or Konqueror
+      {
+          //alert("defective implementation of getComputedStyle()");
+          bgColor = "transparent";
+      }
+   }
+   else
+      bgColor == "transparent";
+
+   if (bgColor == "transparent")
+   {
+      var slideClass = getClassList(slide);
+
+      for (var i = 0; i < backgrounds.length; i++)
+      {
+         background = backgrounds[i];
+
+         var bgClass = getClassList(background);
+
+         if (matchingBackground(slideClass, bgClass))
+         {
+            background.style.display = "block";
+            background.style.visibility = "visible";
+         }
+         else
+         {
+            background.style.display = "none";
+            background.style.visibility = "hidden";
+         }
+      }
+   }
+   else // forcibly hide all backgrounds
+      hideBackgrounds();
+}
+
+function hideBackgrounds()
+{
+   for (var i = 0; i < backgrounds.length; i++)
+   {
+      background = backgrounds[i];
+      background.style.display = "none";
+      background.style.visibility = "hidden";
+   }
+}
+
+// compare classes for slide and background
+function matchingBackground(slideClass, bgClass)
+{
+   if (bgClass == "background")
+      return true;
+
+   // define pattern as regular expression
+   var pattern = /\w+/g;
+
+   // check for matches and place result in array
+   var result = slideClass.match(pattern);
+
+   // now check if desired name is present for background
+   for (var i = 0; i < result.length; i++)
+   {
+      if (hasToken(bgClass, result[i]))
+         return true;
+   }
+
+   return false;
+}
+
+// left to right traversal of root's content
+function nextNode(root, node)
+{
+   if (node == null)
+      return root.firstChild;
+
+   if (node.firstChild)
+      return node.firstChild;
+
+   if (node.nextSibling)
+      return node.nextSibling;
+
+   for (;;)
+   {
+      node = node.parentNode;
+
+      if (!node || node == root)
+         break;
+
+      if (node && node.nextSibling)
+         return node.nextSibling;
+   }
+
+   return null;
+}
+
+// right to left traversal of root's content
+function previousNode(root, node)
+{
+   if (node == null)
+   {
+      node = root.lastChild;
+
+      if (node)
+      {
+         while (node.lastChild)
+            node = node.lastChild;
+      }
+
+      return node;
+   }
+
+   if (node.previousSibling)
+   {
+      node = node.previousSibling;
+
+      while (node.lastChild)
+         node = node.lastChild;
+
+      return node;
+   }
+
+   if (node.parentNode != root)
+      return node.parentNode;
+
+   return null;
+}
+
+// HTML elements that can be used with class="incremental"
+// note that you can also put the class on containers like
+// up, ol, dl, and div to make their contents appear
+// incrementally. Upper case is used since this is what
+// browsers report for HTML node names (text/html).
+function incrementalElementList()
+{
+   var inclist = new Array();
+   inclist["P"] = true;
+   inclist["PRE"] = true;
+   inclist["LI"] = true;
+   inclist["BLOCKQUOTE"] = true;
+   inclist["DT"] = true;
+   inclist["DD"] = true;
+   inclist["H2"] = true;
+   inclist["H3"] = true;
+   inclist["H4"] = true;
+   inclist["H5"] = true;
+   inclist["H6"] = true;
+   inclist["SPAN"] = true;
+   inclist["ADDRESS"] = true;
+   inclist["TABLE"] = true;
+   inclist["TR"] = true;
+   inclist["TH"] = true;
+   inclist["TD"] = true;
+   inclist["IMG"] = true;
+   inclist["OBJECT"] = true;
+   return inclist;
+}
+
+function nextIncrementalItem(node)
+{
+   var slide = slides[slidenum];
+
+   for (;;)
+   {
+      node = nextNode(slide, node);
+
+      if (node == null || node.parentNode == null)
+         break;
+
+      if (node.nodeType == 1)  // ELEMENT
+      {
+         if (node.nodeName == "BR")
+           continue;
+
+         if (hasClass(node, "incremental")
+             && okayForIncremental[node.nodeName])
+            return node;
+
+         if (hasClass(node.parentNode, "incremental")
+             && !hasClass(node, "non-incremental"))
+            return node;
+      }
+   }
+
+   return node;
+}
+
+function previousIncrementalItem(node)
+{
+   var slide = slides[slidenum];
+
+   for (;;)
+   {
+      node = previousNode(slide, node);
+
+      if (node == null || node.parentNode == null)
+         break;
+
+      if (node.nodeType == 1)
+      {
+         if (node.nodeName == "BR")
+           continue;
+
+         if (hasClass(node, "incremental")
+             && okayForIncremental[node.nodeName])
+            return node;
+
+         if (hasClass(node.parentNode, "incremental")
+             && !hasClass(node, "non-incremental"))
+            return node;
+      }
+   }
+
+   return node;
+}
+
+// set visibility for all elements on current slide with
+// a parent element with attribute class="incremental"
+function setVisibilityAllIncremental(value)
+{
+   var node = nextIncrementalItem(null);
+
+   while (node)
+   {
+      node.style.visibility = value;
+      node = nextIncrementalItem(node);
+   }
+}
+
+// reveal the next hidden item on the slide
+// node is null or the node that was last revealed
+function revealNextItem(node)
+{
+   node = nextIncrementalItem(node);
+
+   if (node && node.nodeType == 1)  // an element
+      node.style.visibility = "visible";
+
+   return node;
+}
+
+
+// exact inverse of revealNextItem(node)
+function hidePreviousItem(node)
+{
+   if (node && node.nodeType == 1)  // an element
+      node.style.visibility = "hidden";
+
+   return previousIncrementalItem(node);
+}
+
+
+/* set click handlers on all anchors */
+function patchAnchors()
+{
+   var anchors = document.body.getElementsByTagName("a");
+
+   for (var i = 0; i < anchors.length; ++i)
+   {
+      anchors[i].onclick = clickedAnchor;
+   }
+}
+
+function clickedAnchor(e)
+{
+   if (!e)
+      var e = window.event;
+
+   // compare this.href with location.href
+   // for link to another slide in this doc
+
+   if (pageAddress(this.href) == pageAddress(location.href))
+   {
+      // yes, so find new slide number
+      var newslidenum = findSlideNumber(this.href);
+
+      if (newslidenum != slidenum)
+      {
+         slide = slides[slidenum];
+         hideSlide(slide);
+         slidenum = newslidenum;
+         slide = slides[slidenum];
+         showSlide(slide);
+         setLocation();
+      }
+   }
+   else if (this.target == null)
+      location.href = this.href;
+
+   this.blur();
+   stopPropagation(e);
+}
+
+function pageAddress(uri)
+{
+   var i = uri.indexOf("#");
+
+   // check if anchor is entire page
+
+   if (i < 0)
+      return uri;  // yes
+
+   return uri.substr(0, i);
+}
+
+function showSlideNumber()
+{
+   slideNumElement.innerHTML = "slide".localize() + " " +
+           (slidenum + 1) + "/" + slides.length;
+}
+
+function setLocation()
+{
+   var uri = pageAddress(location.href);
+
+   //if (slidenum > 0)
+      uri = uri + "#(" + (slidenum+1) + ")";
+
+   if (uri != location.href && !khtml)
+      location.href = uri;
+
+   document.title = title + " (" + (slidenum+1) + ")";
+   //document.title = (slidenum+1) + ") " + slideName(slidenum);
+
+   showSlideNumber();
+}
+
+// find current slide based upon location
+// first find target anchor and then look
+// for associated div element enclosing it
+// finally map that to slide number
+function findSlideNumber(uri)
+{
+   // first get anchor from page location
+
+   var i = uri.indexOf("#");
+
+   // check if anchor is entire page
+
+   if (i < 0)
+      return 0;  // yes
+
+   var anchor = unescape(uri.substr(i+1));
+
+   // now use anchor as XML ID to find target
+   var target = document.getElementById(anchor);
+
+   if (!target)
+   {
+      // does anchor look like "(2)" for slide 2 ??
+      // where first slide is (1)
+      var re = /\((\d)+\)/;
+
+      if (anchor.match(re))
+      {
+         var num = parseInt(anchor.substring(1, anchor.length-1));
+
+         if (num > slides.length)
+            num = 1;
+
+         if (--num < 0)
+            num = 0;
+
+         return num;
+      }
+
+      // accept [2] for backwards compatibility
+      re = /\[(\d)+\]/;
+
+      if (anchor.match(re))
+      {
+         var num = parseInt(anchor.substring(1, anchor.length-1));
+
+         if (num > slides.length)
+            num = 1;
+
+         if (--num < 0)
+            num = 0;
+
+         return num;
+      }
+
+      // oh dear unknown anchor
+      return 0;
+   }
+
+   // search for enclosing slide
+
+   while (true)
+   {
+      // browser coerces html elements to uppercase!
+      if (target.nodeName.toLowerCase() == "div" &&
+            hasClass(target, "slide"))
+      {
+         // found the slide element
+         break;
+      }
+
+      // otherwise try parent element if any
+
+      target = target.parentNode;
+
+      if (!target)
+      {
+         return 0;   // no luck!
+      }
+   };
+
+   for (i = 0; i < slides.length; ++i)
+   {
+      if (slides[i] == target)
+         return i;  // success
+   }
+
+   // oh dear still no luck
+   return 0;
+}
+
+// find slide name from first h1 element
+// default to document title + slide number
+function slideName(index)
+{
+   var name = null;
+   var slide = slides[index];
+
+   var heading = findHeading(slide);
+
+   if (heading)
+     name = extractText(heading);
+
+   if (!name)
+     name = title + "(" + (index + 1) + ")";
+
+   name.replace(/\&/g, "&amp;");
+   name.replace(/\</g, "&lt;");
+   name.replace(/\>/g, "&gt;");
+
+   return name;
+}
+
+// find first h1 element in DOM tree
+function findHeading(node)
+{
+  if (!node || node.nodeType != 1)
+    return null;
+
+  if (node.nodeName == "H1" || node.nodeName == "h1")
+    return node;
+
+  var child = node.firstChild;
+
+  while (child)
+  {
+    node = findHeading(child);
+
+    if (node)
+      return node;
+
+    child = child.nextSibling;
+  }
+
+  return null;
+}
+
+// recursively extract text from DOM tree
+function extractText(node)
+{
+  if (!node)
+    return "";
+
+  // text nodes
+  if (node.nodeType == 3)
+    return node.nodeValue;
+
+  // elements
+  if (node.nodeType == 1)
+  {
+    node = node.firstChild;
+    var text = "";
+
+    while (node)
+    {
+      text = text + extractText(node);
+      node = node.nextSibling;
+    }
+
+    return text;
+  }
+
+  return "";
+}
+
+
+// find copyright text from meta element
+function findCopyright()
+{
+   var name, content;
+   var meta = document.getElementsByTagName("meta");
+
+   for (var i = 0; i < meta.length; ++i)
+   {
+      name = meta[i].getAttribute("name");
+      content = meta[i].getAttribute("content");
+
+      if (name == "copyright")
+         return content;
+   }
+
+   return null;
+}
+
+function findSizeAdjust()
+{
+   var name, content, offset;
+   var meta = document.getElementsByTagName("meta");
+
+   for (var i = 0; i < meta.length; ++i)
+   {
+      name = meta[i].getAttribute("name");
+      content = meta[i].getAttribute("content");
+
+      if (name == "font-size-adjustment")
+         return 1 * content;
+   }
+
+   return 0;
+}
+
+function addToolbar()
+{
+   var slideCounter, page;
+
+   var toolbar = createElement("div");
+   toolbar.setAttribute("class", "toolbar");
+
+   if (ns_pos) // a reasonably behaved browser
+   {
+      var right = document.createElement("div");
+      right.setAttribute("style", "float: right; text-align: right");
+
+      slideCounter = document.createElement("div")
+      slideCounter.innerHTML = "slide".localize() + " n/m";
+      right.appendChild(slideCounter);
+      toolbar.appendChild(right);
+
+      var left = document.createElement("div");
+      left.setAttribute("style", "text-align: left");
+
+      // global end of slide indicator
+      eos = document.createElement("span");
+      eos.innerHTML = "* ";
+      left.appendChild(eos);
+
+      var help = document.createElement("a");
+      help.setAttribute("href", helpPage);
+      help.setAttribute("title", helpText.localize());
+      help.innerHTML = "help?".localize();
+      left.appendChild(help);
+      helpAnchor = help;  // save for focus hack
+
+      var gap1 = document.createTextNode(" ");
+      left.appendChild(gap1);
+
+      var contents = document.createElement("a");
+      contents.setAttribute("href", "javascript:toggleTableOfContents()");
+      contents.setAttribute("title", "table of contents".localize());
+      contents.innerHTML = "contents?".localize();
+      left.appendChild(contents);
+
+      var gap2 = document.createTextNode(" ");
+      left.appendChild(gap2);
+
+      var i = location.href.indexOf("#");
+
+      // check if anchor is entire page
+
+      if (i > 0)
+         page = location.href.substr(0, i);
+      else
+         page = location.href;
+
+      var start = document.createElement("a");
+      start.setAttribute("href", page);
+      start.setAttribute("title", "restart presentation".localize());
+      start.innerHTML = "restart?".localize();
+//    start.setAttribute("href", "javascript:printSlides()");
+//    start.setAttribute("title", "print all slides".localize());
+//    start.innerHTML = "print!".localize();
+      left.appendChild(start);
+
+      var copyright = findCopyright();
+
+      if (copyright)
+      {
+         var span = document.createElement("span");
+         span.innerHTML = copyright;
+         span.style.color = "black";
+         span.style.marginLeft = "4em";
+         left.appendChild(span);
+      }
+
+      toolbar.appendChild(left);
+   }
+   else // IE so need to work around its poor CSS support
+   {
+      toolbar.style.position = (ie7 ? "fixed" : "absolute");
+      toolbar.style.zIndex = "200";
+      toolbar.style.width = "99.9%";
+      toolbar.style.height = "1.2em";
+      toolbar.style.top = "auto";
+      toolbar.style.bottom = "0";
+      toolbar.style.left = "0";
+      toolbar.style.right = "0";
+      toolbar.style.textAlign = "left";
+      toolbar.style.fontSize = "60%";
+      toolbar.style.color = "red";
+      toolbar.borderWidth = 0;
+      toolbar.style.background = "rgb(240,240,240)";
+
+      // would like to have help text left aligned
+      // and page counter right aligned, floating
+      // div's don't work, so instead use nested
+      // absolutely positioned div's.
+
+      var sp = document.createElement("span");
+      sp.innerHTML = "&nbsp;&nbsp;*&nbsp;";
+      toolbar.appendChild(sp);
+      eos = sp;  // end of slide indicator
+
+      var help = document.createElement("a");
+      help.setAttribute("href", helpPage);
+      help.setAttribute("title", helpText.localize());
+      help.innerHTML = "help?".localize();
+      toolbar.appendChild(help);
+      helpAnchor = help;  // save for focus hack
+
+      var gap1 = document.createTextNode(" ");
+      toolbar.appendChild(gap1);
+
+      var contents = document.createElement("a");
+      contents.setAttribute("href", "javascript:toggleTableOfContents()");
+      contents.setAttribute("title", "table of contents".localize());
+      contents.innerHTML = "contents?".localize();
+      toolbar.appendChild(contents);
+
+      var gap2 = document.createTextNode(" ");
+      toolbar.appendChild(gap2);
+
+      var i = location.href.indexOf("#");
+
+      // check if anchor is entire page
+
+      if (i > 0)
+         page = location.href.substr(0, i);
+      else
+         page = location.href;
+
+      var start = document.createElement("a");
+      start.setAttribute("href", page);
+      start.setAttribute("title", "restart presentation".localize());
+      start.innerHTML = "restart?".localize();
+//    start.setAttribute("href", "javascript:printSlides()");
+//    start.setAttribute("title", "print all slides".localize());
+//    start.innerHTML = "print!".localize();
+      toolbar.appendChild(start);
+
+      var copyright = findCopyright();
+
+      if (copyright)
+      {
+         var span = document.createElement("span");
+         span.innerHTML = copyright;
+         span.style.color = "black";
+         span.style.marginLeft = "2em";
+         toolbar.appendChild(span);
+      }
+
+      slideCounter = document.createElement("div")
+      slideCounter.style.position = "absolute";
+      slideCounter.style.width = "auto"; //"20%";
+      slideCounter.style.height = "1.2em";
+      slideCounter.style.top = "auto";
+      slideCounter.style.bottom = 0;
+      slideCounter.style.right = "0";
+      slideCounter.style.textAlign = "right";
+      slideCounter.style.color = "red";
+      slideCounter.style.background = "rgb(240,240,240)";
+
+      slideCounter.innerHTML = "slide".localize() + " n/m";
+      toolbar.appendChild(slideCounter);
+   }
+
+   // ensure that click isn't passed through to the page
+   toolbar.onclick = stopPropagation;
+   document.body.appendChild(toolbar);
+   slideNumElement = slideCounter;
+   setEosStatus(false);
+
+   return toolbar;
+}
+
+function isShownToc()
+{
+  if (toc && toc.style.visible == "visible")
+    return true;
+
+  return false;
+}
+
+function showTableOfContents()
+{
+  if (toc)
+  {
+    if (toc.style.visibility != "visible")
+    {
+      toc.style.visibility = "visible";
+      toc.style.display = "block";
+      toc.focus();
+
+      if (ie7 && slidenum == 0)
+        setTimeout("ieHack()", 100);
+    }
+    else
+      hideTableOfContents();
+  }
+}
+
+function hideTableOfContents()
+{
+  if (toc && toc.style.visibility != "hidden")
+  {
+    toc.style.visibility = "hidden";
+    toc.style.display = "none";
+
+    try
+    {
+       if (!opera)
+         helpAnchor.focus();
+    }
+    catch (e)
+    {
+    }
+  }
+}
+
+function toggleTableOfContents()
+{
+  if (toc)
+  {
+     if (toc.style.visible != "visible")
+       showTableOfContents();
+     else
+       hideTableOfContents();
+  }
+}
+
+// called on clicking toc entry
+function gotoEntry(e)
+{
+   var target;
+
+   if (!e)
+      var e = window.event;
+
+   if (e.target)
+      target = e.target;
+   else if (e.srcElement)
+      target = e.srcElement;
+
+   // work around Safari bug
+   if (target.nodeType == 3)
+      target = target.parentNode;
+
+   if (target && target.nodeType == 1)
+   {
+     var uri = target.getAttribute("href");
+
+     if (uri)
+     {
+        //alert("going to " + uri);
+        var slide = slides[slidenum];
+        hideSlide(slide);
+        slidenum = findSlideNumber(uri);
+        slide = slides[slidenum];
+        lastShown = null;
+        setLocation();
+        setVisibilityAllIncremental("hidden");
+        setEosStatus(!nextIncrementalItem(lastShown));
+        showSlide(slide);
+        //target.focus();
+
+        try
+        {
+           if (!opera)
+             helpAnchor.focus();
+        }
+        catch (e)
+        {
+        }
+     }
+   }
+
+   hideTableOfContents(e);
+   if (ie7) ieHack();
+   stopPropagation(e);
+   return cancel(e);
+}
+
+// called onkeydown for toc entry
+function gotoTocEntry(event)
+{
+  var key;
+
+  if (!event)
+    var event = window.event;
+
+  // kludge around NS/IE differences 
+  if (window.event)
+    key = window.event.keyCode;
+  else if (event.which)
+    key = event.which;
+  else
+    return true; // Yikes! unknown browser
+
+  // ignore event if key value is zero
+  // as for alt on Opera and Konqueror
+  if (!key)
+     return true;
+
+  // check for concurrent control/command/alt key
+  // but are these only present on mouse events?
+
+  if (event.ctrlKey || event.altKey)
+     return true;
+
+  if (key == 13)
+  {
+    var uri = this.getAttribute("href");
+
+    if (uri)
+    {
+      //alert("going to " + uri);
+      var slide = slides[slidenum];
+      hideSlide(slide);
+      slidenum = findSlideNumber(uri);
+      slide = slides[slidenum];
+      lastShown = null;
+      setLocation();
+      setVisibilityAllIncremental("hidden");
+      setEosStatus(!nextIncrementalItem(lastShown));
+      showSlide(slide);
+      //target.focus();
+
+      try
+      {
+         if (!opera)
+           helpAnchor.focus();
+      }
+      catch (e)
+      {
+      }
+    }
+
+    hideTableOfContents();
+    if (ie7) ieHack();
+    return cancel(event);
+  }
+
+  if (key == 40 && this.next)
+  {
+    this.next.focus();
+    return cancel(event);
+  }
+
+  if (key == 38 && this.previous)
+  {
+    this.previous.focus();
+    return cancel(event);
+  }
+
+  return true;
+}
+
+function isTitleSlide(slide)
+{
+   return hasClass(slide, "title");
+}
+
+// create div element with links to each slide
+function tableOfContents()
+{
+  var toc = document.createElement("div");
+  addClass(toc, "toc");
+  //toc.setAttribute("tabindex", "0");
+
+  var heading = document.createElement("div");
+  addClass(heading, "toc-heading");
+  heading.innerHTML = "Table of Contents".localize();
+
+  heading.style.textAlign = "center";
+  heading.style.width = "100%";
+  heading.style.margin = "0";
+  heading.style.marginBottom = "1em";
+  heading.style.borderBottomStyle = "solid";
+  heading.style.borderBottomColor = "rgb(180,180,180)";
+  heading.style.borderBottomWidth = "1px";
+
+  toc.appendChild(heading);
+  var previous = null;
+
+  for (var i = 0; i < slides.length; ++i)
+  {
+    var title = hasClass(slides[i], "title");
+    var num = document.createTextNode((i + 1) + ". ");
+
+    toc.appendChild(num);
+
+    var a = document.createElement("a");
+    a.setAttribute("href", "#(" + (i+1) + ")");
+
+    if (title)
+      addClass(a, "titleslide");
+
+    var name = document.createTextNode(slideName(i));
+    a.appendChild(name);
+    a.onclick = gotoEntry;
+    a.onkeydown = gotoTocEntry;
+    a.previous = previous;
+
+    if (previous)
+      previous.next = a;
+
+    toc.appendChild(a);
+
+    if (i == 0)
+      toc.first = a;
+
+    if (i < slides.length - 1)
+    {
+      var br = document.createElement("br");
+      toc.appendChild(br);
+    }
+
+    previous = a;
+  }
+
+  toc.focus = function () {
+    if (this.first)
+      this.first.focus();
+  }
+
+  toc.onclick = function (e) {
+    e||(e=window.event);
+    hideTableOfContents();
+    stopPropagation(e);
+    
+    if (e.cancel != undefined)
+      e.cancel = true;
+      
+    if (e.returnValue != undefined)
+      e.returnValue = false;
+      
+    return false;
+  };
+
+  toc.style.position = "absolute";
+  toc.style.zIndex = "300";
+  toc.style.width = "60%";
+  toc.style.maxWidth = "30em";
+  toc.style.height = "30em";
+  toc.style.overflow = "auto";
+  toc.style.top = "auto";
+  toc.style.right = "auto";
+  toc.style.left = "4em";
+  toc.style.bottom = "4em";
+  toc.style.padding = "1em";
+  toc.style.background = "rgb(240,240,240)";
+  toc.style.borderStyle = "solid";
+  toc.style.borderWidth = "2px";
+  toc.style.fontSize = "60%";
+
+  document.body.insertBefore(toc, document.body.firstChild);
+  return toc;
+}
+
+function replaceByNonBreakingSpace(str)
+{
+   for (var i = 0; i < str.length; ++i)
+      str[i] = 160;
+}
+
+
+function initOutliner()
+{
+  var items = document.getElementsByTagName("LI");
+
+  for (var i = 0; i < items.length; ++i)
+  {
+     var target = items[i];
+
+     if (!hasClass(target.parentNode, "outline"))
+        continue;
+
+     target.onclick = outlineClick;
+
+     if (!ns_pos)
+     {
+        target.onmouseover = hoverOutline;
+        target.onmouseout = unhoverOutline;
+     }
+
+     if (foldable(target))
+     {
+       target.foldable = true;
+       target.onfocus = function () {outline = this;};
+       target.onblur = function () {outline = null;};
+
+       if (!target.getAttribute("tabindex"))
+         target.setAttribute("tabindex", "0");
+
+       if (hasClass(target, "expand"))
+         unfold(target);
+       else
+         fold(target);
+     }
+     else
+     {
+       addClass(target, "nofold");
+       target.visible = true;
+       target.foldable = false;
+     }
+  }
+}
+
+function foldable(item)
+{
+   if (!item || item.nodeType != 1)
+      return false;
+
+   var node = item.firstChild;
+
+   while (node)
+   {
+     if (node.nodeType == 1 && isBlock(node))
+       return true;
+
+      node = node.nextSibling;
+   }
+
+   return false;
+}
+
+function fold(item)
+{
+  if (item)
+  {
+    removeClass(item, "unfolded");
+    addClass(item, "folded");
+  }
+
+  var node = item ? item.firstChild : null;
+
+  while (node)
+  {
+    if (node.nodeType == 1 && isBlock(node)) // element
+    {
+      // note that getElementStyle won't work for Safari 1.3
+      node.display = getElementStyle(node, "display", "display");
+      node.style.display = "none";
+      node.style.visibility = "hidden";
+    }
+
+    node = node.nextSibling;
+  }
+
+  item.visible = false;
+}
+
+function unfold(item)
+{
+   if (item)
+   {
+     addClass(item, "unfolded");
+     removeClass(item, "folded");
+   }
+
+  var node = item ? item.firstChild : null;
+
+  while (node)
+  {
+    if (node.nodeType == 1 && isBlock(node)) // element
+    {
+      // with fallback for Safari, see above
+      node.style.display = (node.display ? node.display : "block");
+      node.style.visibility = "visible";
+    }
+
+    node = node.nextSibling;
+  }
+
+  item.visible = true;
+}
+
+function outlineClick(e)
+{
+   var rightclick = false;
+   var target;
+
+   if (!e)
+      var e = window.event;
+
+   if (e.target)
+      target = e.target;
+   else if (e.srcElement)
+      target = e.srcElement;
+
+   // work around Safari bug
+   if (target.nodeType == 3)
+      target = target.parentNode;
+
+   while (target && target.visible == undefined)
+      target = target.parentNode;
+
+   if (!target)
+      return true;
+
+   if (e.which)
+      rightclick = (e.which == 3);
+   else if (e.button)
+      rightclick = (e.button == 2);
+
+   if (!rightclick && target.visible != undefined)
+   {
+      if (target.foldable)
+      {
+         if (target.visible)
+           fold(target);
+         else
+           unfold(target);
+      }
+
+      stopPropagation(e);
+      e.cancel = true;
+      e.returnValue = false;
+   }
+
+   return false;
+}
+
+function hoverOutline(e)
+{
+   var target;
+
+   if (!e)
+      var e = window.event;
+
+   if (e.target)
+      target = e.target;
+   else if (e.srcElement)
+      target = e.srcElement;
+
+   // work around Safari bug
+   if (target.nodeType == 3)
+      target = target.parentNode;
+
+   while (target && target.visible == undefined)
+      target = target.parentNode;
+
+   if (target && target.foldable)
+      target.style.cursor = "pointer";
+
+   return true;
+}
+
+function unhoverOutline(e)
+{
+   var target;
+
+   if (!e)
+      var e = window.event;
+
+   if (e.target)
+      target = e.target;
+   else if (e.srcElement)
+      target = e.srcElement;
+
+   // work around Safari bug
+   if (target.nodeType == 3)
+      target = target.parentNode;
+
+   while (target && target.visible == undefined)
+      target = target.parentNode;
+
+   if (target)
+     target.style.cursor = "default";
+
+   return true;
+}
+
+
+function stopPropagation(e)
+{
+   if (window.event)
+   {
+      window.event.cancelBubble = true;
+      //window.event.returnValue = false;
+   }
+   else if (e)
+   {
+      e.cancelBubble = true;
+      e.stopPropagation();
+      //e.preventDefault();
+   }
+}
+
+/* can't rely on display since we set that to none to hide things */
+function isBlock(elem)
+{
+   var tag = elem.nodeName;
+
+   return tag == "OL" || tag == "UL" || tag == "P" ||
+          tag == "LI" || tag == "TABLE" || tag == "PRE" ||
+          tag == "H1" || tag == "H2" || tag == "H3" ||
+          tag == "H4" || tag == "H5" || tag == "H6" ||
+          tag == "BLOCKQUOTE" || tag == "ADDRESS"; 
+}
+
+function getElementStyle(elem, IEStyleProp, CSSStyleProp)
+{
+   if (elem.currentStyle)
+   {
+      return elem.currentStyle[IEStyleProp];
+   }
+   else if (window.getComputedStyle)
+   {
+      var compStyle = window.getComputedStyle(elem, "");
+      return compStyle.getPropertyValue(CSSStyleProp);
+   }
+   return "";
+}
+
+// works with text/html and text/xhtml+xml with thanks to Simon Willison
+function createElement(element)
+{
+   if (typeof document.createElementNS != 'undefined')
+   {
+      return document.createElementNS('http://www.w3.org/1999/xhtml', element);
+   }
+
+   if (typeof document.createElement != 'undefined')
+   {
+      return document.createElement(element);
+   }
+
+   return false;
+}
+
+// designed to work with both text/html and text/xhtml+xml
+function getElementsByTagName(name)
+{
+   if (typeof document.getElementsByTagNameNS != 'undefined')
+   {
+      return document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', name);
+   }
+
+   if (typeof document.getElementsByTagName != 'undefined')
+   {
+      return document.getElementsByTagName(name);
+   }
+
+   return null;
+}
+
+/*
+// clean alternative to innerHTML method, but on IE6
+// it doesn't work with named entities like &nbsp;
+// which need to be replaced by numeric entities
+function insertText(element, text)
+{
+   try
+   {
+     element.textContent = text;  // DOM3 only
+   }
+   catch (e)
+   {
+      if (element.firstChild)
+      {
+         // remove current children
+         while (element.firstChild)
+            element.removeChild(element.firstChild);
+      }
+
+      element.appendChild(document.createTextNode(text));
+   }
+}
+
+// as above, but as method of all element nodes
+// doesn't work in IE6 which doesn't allow you to
+// add methods to the HTMLElement prototype
+if (HTMLElement != undefined)
+{
+  HTMLElement.prototype.insertText = function(text) {
+    var element = this;
+
+    try
+    {
+      element.textContent = text;  // DOM3 only
+    }
+    catch (e)
+    {
+      if (element.firstChild)
+      {
+         // remove current children
+         while (element.firstChild)
+           element.removeChild(element.firstChild);
+      }
+
+      element.appendChild(document.createTextNode(text));
+    }
+  };
+}
+*/
+
+function getSelectedText()
+{
+  try
+  {
+    if (window.getSelection)
+      return window.getSelection().toString();
+
+    if (document.getSelection)
+      return document.getSelection().toString();
+
+    if (document.selection)
+      return document.selection.createRange().text;
+  }
+  catch (e)
+  {
+    return "";
+  }
+  return "";
+}
Binary file diapositives/Slidy/slidy.js.gz has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/template.html	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,187 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<title>Slidy template for W3C Blue2 Style</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<meta name="copyright" content="Copyright &#169; 2005 W3C (MIT, ERCIM, Keio)" />
+<meta name="font-size-adjustment" content="-1" />
+<link rel="stylesheet" href="../Slidy/w3c-blue2.css"
+ type="text/css" media="screen, projection, print" />
+<script src="../Slidy/slidy.js" type="text/javascript">
+</script>
+</head>
+<body>
+<!-- this defines the slide background -->
+
+<div class="background">
+  <div class="header">
+  <!-- sized and colored via CSS -->
+  </div>
+  <!-- hidden style graphics to ensure they are saved with other content -->
+  <img class="hidden" src="../Slidy/bullet.png" alt="" />
+  <img class="hidden" src="../Slidy/fold.bmp" alt="" />
+  <img class="hidden" src="../Slidy/unfold.bmp" alt="" />
+  <img class="hidden" src="../Slidy/fold-dim.bmp" alt="" />
+  <img class="hidden" src="../Slidy/nofold-dim.bmp" alt="" />
+  <img class="hidden" src="../Slidy/unfold-dim.bmp" alt="" />
+  <img class="hidden" src="../Slidy/bullet-fold.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-unfold.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-fold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-nofold-dim.gif" alt="" />
+  <img class="hidden" src="../Slidy/bullet-unfold-dim.gif" alt="" />
+
+  <div class="footer">
+  <object id="w3c-logo"
+  data="../Slidy/w3c-logo-blue.svg" type="image/svg+xml"
+  title="W3C logo"><a href="http://www.w3.org/"><img
+  alt="W3C logo" id="w3c-logo-fallback"
+  src="../Slidy/w3c-logo-blue.gif" /></a></object>
+
+  <!-- modify the following text as appropriate -->
+  Presentation Name<br />
+  Event, Location, Month Year
+  </div>
+</div>
+
+<div class="slide cover">
+<div class="header">
+<h1>Slidy template for W3C Blue2 Style</h1>
+<p><a href="http://www.w3.org/People/Raggett/">Dave Raggett</a>,
+&lt;<a href="mailto:dsr@w3.org">dsr@w3.org</a>&gt;</p>
+</div>
+<img src="../Slidy/keys.jpg" class="cover"
+alt="W3C as letters on 3 plastic buttons from a keyboard" />
+<h2>Event, Location, Month Year</h2>
+</div>
+
+<div class="slide">
+<h1>W3C Blue2 Style I - Document Structure</h1>
+
+<p class="subhead">To get the W3C Blue2 Style:</p>
+
+<p>The xhtml file should match the following template, but
+please modify the content of the title element as appropriate
+for your presentation. The relative links below assume
+that your presentation is in a directory like
+/2005/Talks/your-slide-dir and should be modified as needed,
+or you can use absolute links, as generated by comma slidy.</p>
+
+<pre>
+&lt;?xml version="1.0" encoding="utf-8"?&gt;
+&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;
+&lt;head&gt;
+&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
+&lt;title&gt;Slidy template for W3C Meetings&lt;/title>
+&lt;meta name="copyright" content="Copyright &amp;#169; 2005 W3C (MIT, ERCIM, Keio)" /&gt;
+&lt;link rel="stylesheet" href="../Slidy/w3c-blue2.css" type="text/css"
+media="screen, projection, print" /&gt;
+&lt;script src="../Slidy/slidy.js" type="text/javascript"&gt;
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  ... background, cover slide ...
+  &lt;div class="slide"&gt;
+    &lt;h1&gt;Introduction&lt;/h1&gt;
+    ... slide content ...
+  &lt;/div&gt;
+  ... other slides ...
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<div class="slide">
+<h1>W3C Blue2 Style II - Background and Cover</h1>
+
+<p class="subhead">To get the slide background and cover page:</p>
+
+<p>The body element's content should start with the following
+markup, but please modify the heading and contact details
+as appropriate:</p>
+
+<pre>
+&lt;div class="background"&gt;
+  &lt;div class="header"&gt; &lt;/div&gt;
+  &lt;img src="../Slidy/bullet.png" alt="hidden bullet" /&gt;
+  &lt;div class="footer"&gt;
+    &lt;object id="w3c-logo"
+    data="../Slidy/w3c-logo-blue.svg" type="image/svg+xml"
+    title="W3C logo"&gt;&lt;a href="http://www.w3.org/"&gt;&lt;img
+    alt="W3C logo" id="w3c-logo-fallback"
+    src="../Slidy/w3c-logo-blue.gif" /&gt;&lt;/a&gt;&lt;/object&gt;
+    &lt;!-- modify the following text as appropriate --&gt;
+    Presentation Name&lt;br /&gt;
+    Event, Location, Month Year
+  &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;div class="slide cover"&gt;
+  &lt;div class="header"&gt;
+    &lt;h1&gt;Slidy template for W3C Blue2 Style&lt;/h1&gt;
+    &lt;p&gt;&lt;a href="http://www.w3.org/People/Raggett/"&gt;Dave Raggett&lt;/a&gt;,
+    &amp;lt;&lt;a href="mailto:dsr@w3.org"&gt;dsr@w3.org&lt;/a&gt;&amp;gt;&lt;/p&gt;
+  &lt;/div&gt;
+  &lt;img src="../Slidy/keys.jpg" class="cover"
+  alt="W3C as letters on 3 plastic buttons from a keyboard" /&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<div class="slide">
+<h1>Further information</h1>
+
+<ul>
+<li>Avoid placing too much content on each slide, no one will remember
+it all, and it will overflow the slide design.</li>
+<li>For further guidance on slide markup see the <a 
+href="http://www.w3.org/Talks/Tools/Slidy">Slidy pages</a></li>
+<li>If you want to print all the slides, press the "A" key to toggle
+to the "all slides view" then use the browser's print function in the
+normal way.</li>
+<li>The comma slidy tool can be used with all.htm files in the old
+W3C slide format, for example:
+<pre>http://www.w3.org/2005/Talks/0605-sb-acintroduction/all.htm,slidy</pre>
+</li>
+<li>You are advised to save the output from the tool to a different
+location and make it available Public, Members only or Team restricted
+as appropriate.</li>
+<li>If you want to view slides offline, be careful to save the slides
+with all of the content (see browser's <em>Save As</em> function, and
+<em>"Web Page, complete"</em> for the save as type).</li>
+<li>Firefox users may want the <a
+href="http://extensionroom.mozdev.org/more-info/autohide">autohide</a>
+extension to hide the toolbars when entering full screen with F11</li>
+<li>If you get stuck then <a href="http://www.w3.org/Team/Raggett/">Dave
+Raggett</a> should be able to help.</li>
+</ul>
+</div>
+
+<div class="slide">
+<h1>Using SVG for great looking graphics</h1>
+
+<ul>
+<li>If you want to include graphics in SVG, you should stick to SVG
+Tiny to increase the chance of people seeing it on whatever browser
+they are using. Always, provide a fallback as a JPEG, PNG or GIF.</li>
+<li>The use of SVG may result in users being prompted to install
+a plugin. The Adobe SVG plugin is reasonably effective, but an
+alternative may be to switch to a browser with native SVG support.</li>
+<li>Some versions of browsers implement SVG in a brittle way that
+may cause the browser to crash. If this happens to you, please
+consider switching to a different version. Alternatively, you could
+strip out the object tag and just use the img element</li>
+<li>The W3C logo in the footer uses SVG for jaggy free scaling
+via the markup for the slide background, see <a href="#(3)">slide 3</a></li>
+<li>Firefox users on Windows should install the <a
+href="http://plugindoc.mozdev.org/windows.html">Adobe SVG Viewer 6.0</a>,
+or <a href="http://www.mozilla.org/">install Firefox 1.5</a> which
+has native SVG support.</li>
+</ul>
+</div>
+
+</body>
+</html>
Binary file diapositives/Slidy/unfold-bright.gif has changed
Binary file diapositives/Slidy/unfold-dim.bmp has changed
Binary file diapositives/Slidy/unfold-dim.gif has changed
Binary file diapositives/Slidy/unfold.bmp has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/w3c-ac.css	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,418 @@
+/* w3c-ac.css
+
+   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
+   W3C liability, trademark, document use and software licensing
+   rules apply, see:
+
+   http://www.w3.org/Consortium/Legal/copyright-documents
+   http://www.w3.org/Consortium/Legal/copyright-software
+*/
+body
+{
+  margin: 0 0 0 0;
+  padding: 0 0 0 0;
+  width: 100%;
+  height: 100%;
+  color: black;
+  background-color: white;
+  font-family: "Gill Sans MT", "Gill Sans", GillSans, sans-serif;
+  font-size: 14pt;
+}
+
+div.toolbar {
+  position: fixed; z-index: 200;
+  top: auto; bottom: 0; left: 0; right: 0;
+  height: 1.2em; text-align: right;
+  padding-left: 1em;
+  padding-right: 1em; 
+  font-size: 60%;
+  color: red; background: rgb(240,240,240);
+}
+
+div.background {
+  display: none;
+}
+
+div.handout {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+div.slide.titlepage {
+  text-align: center;
+}
+
+div.slide.titlepage.h1 {
+  padding-top: 40%;
+}
+
+div.slide {
+  z-index: 20;
+  margin: 0 0 0 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  padding-left: 20px;
+  padding-right: 20px;
+  border-width: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  line-height: 120%;
+  background-color: transparent;
+}
+
+/* this rule is hidden from IE6 which doesn't support + selector */
+div.slide + div[class].slide { page-break-before: always;}
+
+div.slide h1 {
+  padding-left: 1em;
+  padding-right: 1em;
+  padding-top: 0.3em;
+  padding-bottom: 0.3em;
+  margin-top: 0;
+  margin-left: 0;
+  margin-right: 0;
+  margin-bottom: 0.8em;
+  display: block; 
+  font-size: 140%;
+  line-height: 1.2em;
+  color: white;
+  background-color: #005A9C;
+}
+
+pre {
+ color: rgb(0,128,0); font-size: 80%;
+ font-weight: bold; line-height: 120%;
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+ padding-left: 2em;
+ padding-right: 1em;
+ border-style: solid;
+ border-left-width: 1em;
+ border-top-width: thin;
+ border-right-width: thin;
+ border-bottom-width: thin;
+ border-color: #95ABD0;
+ color: #00428C;
+}
+
+li pre { margin-left: 0; }
+
+@media print { pre { font-size: 60% } }
+
+blockquote { font-style: italic }
+
+img { background-color: transparent }
+
+p.copyright { font-size: smaller }
+
+.center { text-align: center }
+.footnote { font-size: smaller; margin-left: 2em; }
+
+a img { border-width: 0; border-style: none }
+
+a:visited { color: navy }
+a:link { color: navy }
+a:hover { color: red; text-decoration: underline }
+a:active { color: red; text-decoration: underline }
+
+a {text-decoration: none}
+.navbar a:link {color: white}
+.navbar a:visited {color: yellow}
+.navbar a:active {color: red}
+.navbar a:hover {color: red}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+li { margin-left: 0.5em; margin-top: 0.5em; }
+li li { font-size: 85%; font-style: italic }
+li li li { font-size: 85%; font-style: normal }
+
+div dt
+{
+  margin-left: 0;
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+  font-weight: bold;
+}
+div dd
+{
+  margin-left: 2em;
+  margin-bottom: 0.5em;
+}
+
+
+p,pre,ul,ol,blockquote,h2,h3,h4,h5,h6 {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+
+p.subhead { font-weight: bold; margin-top: 2em; }
+
+.smaller { font-size: 80%; }
+
+td,th { padding: 0.2em }
+
+ul {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ol {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+
+ul li { 
+  list-style: none;
+  margin: 0.1em 0em 0.6em 0;
+  padding: 0 0 0 40px;
+  background: transparent url(bullet.png) no-repeat 5px 8px;
+  line-height: 140%;
+}
+
+/* workaround IE's failure to support background on li for print media */
+@media print { ul li { list-style: disc; padding-left: 0; background: none; } }
+
+ol li { 
+  margin: 0.1em 0em 0.6em 1.5em;
+  padding: 0 0 0 0px;
+  line-height: 140%;
+}
+
+li li { 
+  font-size: 85%; 
+  font-style: italic;
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li { 
+  font-size: 85%; 
+  font-style: normal;
+  list-style-type: circle;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li li {
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+
+img.withBorder {
+  border: 2px solid #c60;
+  padding: 4px;
+}
+
+div.header {
+  position: absolute;
+  z-index: 2;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: 2.95em;
+  width: 100%;
+  padding: 0 0 0 0;
+  margin: 0 0 0 0;
+  border-width: 0;
+  border-style: solid;
+  background-color: #005A9C;
+  border-bottom-width: thick;
+  border-bottom-color: #95ABD0;
+}
+
+div.footer {
+  position: absolute;
+  z-index: 80;
+  left: 0;
+  right: 0;
+  top: auto;
+  bottom: 0;
+  height: 3.5em;
+  margin: 0;
+  font-size: 80%;
+  font-weight: bold;
+  padding-left: 1em;
+  padding-right: 0;
+  padding-top: 0.3em;
+  padding-bottom: 0;
+  color: #003366;
+  background-color: #95ABD0;
+}
+
+/* this is a hack to hide property from IE6 and below */
+div[class="footer"] {
+  position: fixed;
+}
+
+#w3c-logo {
+     margin: 0;
+     margin-top: 0.3em;
+     margin-right: 0.75em;
+     padding-top: 0;
+     padding-bottom: 0;
+     padding-left: 0;
+     padding-right: 0;
+     height: 2em;
+     width: 4.1em;
+     float: right;
+     z-index: 3;
+     background: #90A7D0;
+}
+
+#w3c-logo-fallback {
+     margin: 0;
+     margin-top: -0.5em;
+     margin-right: 0.75em;
+     padding-top: 0;
+     padding-bottom: 0;
+     padding-left: 0;
+     padding-right: 0;
+     height: 3em;
+     width: 4.1em;
+     float: right;
+     z-index: 3;
+     background: #90A7D0;
+}
+
+div.cover {
+  margin: 0;
+  padding: 0;
+  background-color: black;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+}
+
+div.cover div.header
+{
+  position: absolute;
+  z-index: 0;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: auto;
+  margin: 0;
+  width: 100%;
+  padding: 0.5em 0.5em 1em 0.5em;
+  color: #FFFFFF;
+  border-width: 0;
+  border-style: solid;
+  background-color: #005A9C;
+  border-bottom-width: thick;
+  border-bottom-color: #95ABD0;
+}
+div.slide.cover h1
+{
+  float: left;
+  margin-bottom: 0;
+  background-color: #005A9C;
+/*  background-color: #00428C; */
+}
+
+div.slide h1 a:link {color: white}
+div.slide h1 a:visited {color: white}
+div.slide h1 a:active {
+  color: red;
+  text-decoration: underline;
+}
+div.slide h1 a:hover {
+  color: yellow;
+  text-decoration: underline;
+}
+
+div.slide h1 a { text-decoration: none }
+div.cover div.header p
+{
+  clear: both;
+  margin-top: 0.5em;
+  margin-left: 1.5em;
+  margin-bottom: 0;
+}
+
+div.header p.explanation {
+  font-style: italic;
+}
+div.cover img
+{
+  width: 100%;
+  margin: 0;
+  padding: 0;
+}
+
+div.slide.cover a {
+  color: white;
+}
+
+div.slide.cover a:hover, div.slide.cover a:active {
+    color: yellow; text-decoration: underline;
+}
+
+/* for Bert as an ardent user of the old W3C slidemaker tool */
+div.comment { display: none; visibility: hidden }
+
+@media print { div.comment { display: block; visibility: visible } }
+
+/* fold/unfold support outer ol, ul needs outline class */
+/* set class="compact" on li to make it compact */
+
+ol.outline { list-style:decimal; }
+ol.outline ol { list-style-type:lower-alpha }
+ol.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li:hover { cursor: pointer }
+ol.outline li.nofold:hover { cursor: default }
+
+ul.outline { list-style:decimal; }
+ul.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.bmp) no-repeat 0px 0.5em;
+}
+ul.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.bmp) no-repeat 0px 0.5em;
+}
+ul.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.bmp) no-repeat 0px 0.5em;
+}
+ul.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.bmp) no-repeat 0px 0.5em;
+}
+ul.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.bmp) no-repeat 0px 0.5em;
+}
+
+ul.outline li:hover { cursor: pointer }
+ul.outline li.nofold:hover { cursor: default }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/w3c-blue.css	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,509 @@
+/* w3c-blue.css
+
+   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
+   W3C liability, trademark, document use and software licensing
+   rules apply, see:
+
+   http://www.w3.org/Consortium/Legal/copyright-documents
+   http://www.w3.org/Consortium/Legal/copyright-software
+*/
+body
+{
+  margin: 0 0 0 0;
+  padding: 0 0 0 0;
+  width: 100%;
+  height: 100%;
+  color: black;
+  background-color: white;
+  font-family: "Gill Sans MT", "Gill Sans", GillSans, sans-serif;
+  font-size: 14pt;
+}
+
+div.toolbar {
+  position: fixed; z-index: 200;
+  top: auto; bottom: 0; left: 0; right: 0;
+  height: 1.2em; text-align: right;
+  padding-left: 1em;
+  padding-right: 1em; 
+  font-size: 60%;
+  color: red; background: rgb(240,240,240);
+}
+
+div.background {
+  display: none;
+}
+
+div.handout {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+div.slide.titlepage {
+  text-align: center;
+}
+
+div.slide.titlepage.h1 {
+  padding-top: 40%;
+}
+
+div.slide {
+  z-index: 20;
+  margin: 0 0 0 0;
+  padding: 0;
+  border-width: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  line-height: 120%;
+  background-color: transparent;
+}
+
+div.background {
+  z-index: 1;
+  position: absolute;
+  vertical-align: bottom;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: 4em;
+  padding: 0 0 0 0.2em;
+  margin: 0 0 0 0;
+  border-width: 0;
+  background-color: #90A7D0;
+}
+
+div.background img {
+  height: 4em;
+}
+
+/* this rule is hidden from IE which doesn't support + selector */
+div.slide + div[class].slide { page-break-before: always;}
+
+div.slide h1 {
+  padding-left: 0.5em;
+  padding-right: 0;
+  padding-top: 0.1em;
+  margin-bottom: 0.8em;
+  margin-top: -0.05em;
+  margin-left: 2.5em;
+  margin-right: 4em;
+  color: white;
+  height: 2.2em;
+  font-size: 160%;
+  line-height: 1.1em;
+  background: #90A7D0;;
+}
+
+div.slide h1 a {
+  color: white;
+  text-decoration: none;
+}
+
+div.slide h1 a:link {
+  color: white;
+  text-decoration: none;
+}
+
+div.slide h1 a:visited {
+  color: white;
+  text-decoration: none;
+}
+
+div.slide h1 a:hover {
+  color: white;
+  text-decoration: underline;
+}
+
+div.slide h1 a:active {
+  color: red;
+  text-decoration: underline;
+}
+
+#head-icon {
+  margin-top: 0;
+  margin-bottom: 0;
+  margin-left: 0;
+  margin-right: 1em;
+  background:  #90A7D0;
+  border-width: 0;
+  z-index: 2;
+  float: left;
+}
+
+#head-logo {
+  margin: 0;
+  margin-top: 0.25em;
+  padding-top: 0.25em;
+  padding-bottom: 0.2em;
+  padding-left: 0;
+  padding-right: 0;
+  height: 3em;
+  width: 6.2em;
+  float: right;
+  z-index: 2;
+  background: #90A7D0;
+}
+
+#head-logo-fallback {
+  margin: 0;
+  padding: 0;
+  margin-top: -0.5em;
+  height: 4em;
+  float: right;
+  z-index: 2;
+}
+
+div.background.slanty {
+  z-index: 2;
+  bottom: 0; 
+  height: 100%;
+  background: transparent;
+}
+
+div.background.slanty img { margin-top: 4em; width: 100%; height: 80% }
+
+/* the following makes the pre background translucent */
+/* opacity is a CSS3 property but supported by Mozilla family */
+/* filter is an IE specific feature that also requires width */
+div.slide.slanty pre {
+  width: 93%;  /* needed for IE filter to work */
+  opacity: .8;
+  filter: alpha(opacity=80);
+}
+
+img.withBorder {
+  border: 2px solid #c60;
+  padding: 4px;
+}
+
+li pre { margin-left: 0; }
+
+@media print { pre { font-size: 60% } }
+
+blockquote { font-style: italic }
+
+img { background-color: transparent }
+
+p.copyright { font-size: smaller }
+
+.center { text-align: center }
+.footnote { font-size: smaller; margin-left: 2em; }
+
+a img { border-width: 0; border-style: none }
+
+a:visited { color: navy }
+a:link { color: navy }
+a:hover { color: red; text-decoration: underline }
+a:active { color: red; text-decoration: underline }
+
+a {text-decoration: none}
+.navbar a:link {color: white}
+.navbar a:visited {color: yellow}
+.navbar a:active {color: red}
+.navbar a:hover {color: red}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+li { margin-left: 0.5em; margin-top: 0.5em; }
+li li { font-size: 85%; font-style: italic }
+li li li { font-size: 85%; font-style: normal }
+
+div dt
+{
+  margin-left: 0;
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+  font-weight: bold;
+}
+div dd
+{
+  margin-left: 2em;
+  margin-bottom: 0.5em;
+}
+
+
+p,pre,ul,ol,blockquote,h2,h3,h4,h5,h6,dl,table {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+
+p.subhead { font-weight: bold; margin-top: 2em; }
+
+div.cover p.explanation {
+  font-style: italic;
+  margin-top: 3em;
+}
+
+
+.smaller { font-size: smaller }
+
+td,th { padding: 0.2em }
+
+ul {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ol {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+li { margin-left: 0.5em; margin-top: 0.5em; }
+li li { font-size: 85%; font-style: italic }
+li li li { font-size: 85%; font-style: normal }
+
+
+ul li { 
+  list-style: none;
+  margin: 0.1em 0em 0.6em 0;
+  padding: 0 0 0 40px;
+  background: transparent url(bullet.png) no-repeat 5px 8px;
+  line-height: 140%;
+}
+
+/* workaround IE's failure to support background on li for print media */
+@media print { ul li { list-style: disc; padding-left: 0; background: none; } }
+
+ol li { 
+  margin: 0.1em 0em 0.6em 1.5em;
+  padding: 0 0 0 0px;
+  line-height: 140%;
+}
+
+li li { 
+  font-size: 85%; 
+  font-style: italic;
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li { 
+  font-size: 85%; 
+  font-style: normal;
+  list-style-type: circle;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li li {
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+
+/* rectangular blue bullet + unfold/nofold/fold widget */
+
+/*
+ setting class="outline on ol or ul makes it behave as an
+ ouline list where blocklevel content in li elements is
+ hidden by default and can be expanded or collapsed with
+ mouse click. Set class="expand" on li to override default
+*/
+
+ol.outline li:hover { cursor: pointer }
+ol.outline li.nofold:hover { cursor: default }
+
+ul.outline li:hover { cursor: pointer }
+ul.outline li.nofold:hover { cursor: default }
+
+ol.outline { list-style:decimal; }
+ol.outline ol { list-style-type:lower-alpha }
+
+ol.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.gif) no-repeat 0px 0.5em;
+}
+ol.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.gif) no-repeat 0px 0.5em;
+}
+
+ul.outline li.nofold {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-nofold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.unfolded {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-fold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.folded {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-unfold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.unfolded:hover {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-fold.gif) no-repeat 5px 8px;
+}
+ul.outline li.folded:hover {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-unfold.gif) no-repeat 5px 8px;
+}
+
+li ul.outline li.nofold {
+  padding: 0 0 0 21px;
+  background: transparent url(nofold-dim.gif) no-repeat 5px 8px;
+}
+li ul.outline li.unfolded {
+  padding: 0 0 0 21px;
+  background: transparent url(fold-dim.gif) no-repeat 5px 8px;
+}
+li ul.outline li.folded {
+  padding: 0 0 0 21px;
+  background: transparent url(unfold-dim.gif) no-repeat 5px 8px;
+}
+li ul.outline li.unfolded:hover {
+  padding: 0 0 0 21px;
+  background: transparent url(fold.gif) no-repeat 5px 8px;
+}
+li ul.outline li.folded:hover {
+  padding: 0 0 0 21px;
+  background: transparent url(unfold.gif) no-repeat 5px 8px;
+}
+
+img.withBorder {
+  border: 2px solid #c60;
+  padding: 4px;
+}
+
+div.header {
+  position: absolute;
+  z-index: 2;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: 2.95em;
+  width: 100%;
+  padding: 0 0 0 0;
+  margin: 0 0 0 0;
+  border-width: 0;
+  border-style: solid;
+  background-color: #005A9C;
+  border-bottom-width: thick;
+  border-bottom-color: #95ABD0;
+}
+
+div.footer {
+  position: absolute;
+  z-index: 80;
+  left: 0;
+  right: 0;
+  top: auto;
+  bottom: 0;
+  height: 3.5em;
+  margin: 0;
+  font-size: 80%;
+  font-weight: bold;
+  padding-left: 1em;
+  padding-right: 0;
+  padding-top: 0.3em;
+  padding-bottom: 0;
+  color: #003366;
+  background-color: #95ABD0;
+}
+
+/* this is a hack to hide property from IE6 and below */
+div[class="footer"] {
+  position: fixed;
+}
+
+#w3c-logo {
+  margin: 0;
+  margin-top: 0.3em;
+  margin-right: 0.75em;
+  padding-top: 0;
+  padding-bottom: 0;
+  padding-left: 0;
+  padding-right: 0;
+  height: 2em;
+  width: 4.1em;
+  float: right;
+  z-index: 3;
+  background: #90A7D0;
+}
+
+#w3c-logo-fallback {
+  margin: 0;
+  margin-top: -0.5em;
+  margin-right: 0.75em;
+  padding-top: 0;
+  padding-bottom: 0;
+  padding-left: 0;
+  padding-right: 0;
+  height: 3em;
+  width: 4.1em;
+  float: right;
+  z-index: 3;
+  background: #90A7D0;
+}
+
+#hidden-bullet {
+  visibility: hidden;
+  display: none;
+}
+
+div.slide.cover {
+  color: white;
+  background-color: #90A7D0;
+  padding-top: 0;
+  padding-right: 0;
+  padding-left: 3em;
+  height: 100%;
+}
+
+div.slide.cover h1 {
+  margin: 0;
+  padding: 0.5em;
+  color: white;
+  height: auto;
+}
+
+div.slide.cover h2 {
+  color: white;
+}
+
+div.slide.cover a {
+  color: white;
+}
+
+div.slide.cover a:hover, div.slide.cover a:active {
+  color: yellow; text-decoration: underline;
+}
+
+div.slide.cover img.cover {
+   margin: 0 0 0 0;
+   float: right;
+   padding-bottom: 4em;
+   width: 50%;
+   overflow: hidden;
+}
+
+div.slide.cover a:hover, div.slide.cover a:active {
+    color: yellow; text-decoration: underline;
+}
+
+/* for Bert as an ardent user of the old W3C slidemaker tool */
+
+div.comment { display: none; visibility: hidden }
+
+@media print { div.comment { display: block; visibility: visible } }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/w3c-blue2.css	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,435 @@
+/* w3c-ac.css
+
+   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
+   W3C liability, trademark, document use and software licensing
+   rules apply, see:
+
+   http://www.w3.org/Consortium/Legal/copyright-documents
+   http://www.w3.org/Consortium/Legal/copyright-software
+*/
+body
+{
+  margin: 0 0 0 0;
+  padding: 0 0 0 0;
+  width: 100%;
+  height: 100%;
+  color: black;
+  background-color: white;
+  font-family: "Gill Sans MT", "Gill Sans", GillSans, sans-serif;
+  font-size: 14pt;
+}
+
+.hidden { display: none; visible: hidden }
+
+div.toolbar {
+  position: fixed; z-index: 200;
+  top: auto; bottom: 0; left: 0; right: 0;
+  height: 1.2em; text-align: right;
+  padding-left: 1em;
+  padding-right: 1em; 
+  font-size: 60%;
+  color: red; background: rgb(240,240,240);
+}
+
+div.background {
+  display: none;
+}
+
+div.handout {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+div.slide.titlepage {
+  text-align: center;
+}
+
+div.slide.titlepage.h1 {
+  padding-top: 40%;
+}
+
+div.slide {
+  z-index: 20;
+  margin: 0 0 0 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  padding-left: 20px;
+  padding-right: 20px;
+  border-width: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  line-height: 120%;
+  background-color: transparent;
+}
+
+/* this rule is hidden from IE6 which doesn't support + selector */
+div.slide + div[class].slide { page-break-before: always;}
+
+div.slide h1 {
+  padding-left: 1em;
+  padding-right: 1em;
+  padding-top: 0.3em;
+  padding-bottom: 0.3em;
+  margin-top: 0;
+  margin-left: 0;
+  margin-right: 0;
+  margin-bottom: 0.8em;
+  display: block; 
+  font-size: 140%;
+  line-height: 1.2em;
+  color: white;
+  background-color: #005A9C;
+}
+
+pre {
+ color: rgb(0,128,0); font-size: 80%;
+ font-weight: bold; line-height: 120%;
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+ padding-left: 2em;
+ padding-right: 1em;
+ border-style: solid;
+ border-left-width: 1em;
+ border-top-width: thin;
+ border-right-width: thin;
+ border-bottom-width: thin;
+ border-color: #95ABD0;
+ color: #00428C;
+}
+
+li pre { margin-left: 0; }
+
+@media print { pre { font-size: 60% } }
+
+blockquote { font-style: italic }
+
+img { background-color: transparent }
+
+p.copyright { font-size: smaller }
+
+.center { text-align: center }
+.footnote { font-size: smaller; margin-left: 2em; }
+
+a img { border-width: 0; border-style: none }
+
+a:visited { color: navy }
+a:link { color: navy }
+a:hover { color: red; text-decoration: underline }
+a:active { color: red; text-decoration: underline }
+
+a {text-decoration: none}
+.navbar a:link {color: white}
+.navbar a:visited {color: yellow}
+.navbar a:active {color: red}
+.navbar a:hover {color: red}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+li { margin-left: 0.5em; margin-top: 0.5em; }
+li li { font-size: 85%; font-style: italic }
+li li li { font-size: 85%; font-style: normal }
+
+div dt
+{
+  margin-left: 0;
+  margin-top: 1em;
+  margin-bottom: 0.5em;
+  font-weight: bold;
+}
+div dd
+{
+  margin-left: 2em;
+  margin-bottom: 0.5em;
+}
+
+
+p,pre,ul,ol,blockquote,h2,h3,h4,h5,h6 {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+
+p.subhead { font-weight: bold; margin-top: 2em; }
+
+.smaller { font-size: 80%; }
+
+td,th { padding: 0.2em }
+
+ul {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ol {
+  margin: 0.5em 1.5em 0.5em 1.5em;
+  padding: 0;
+}
+
+ul { list-style-type: square; }
+ul ul { list-style-type: disc; }
+ul ul ul { list-style-type: circle; }
+ul ul ul ul { list-style-type: disc; }
+
+ul li { 
+  list-style: none;
+  margin: 0.1em 0em 0.6em 0;
+  padding: 0 0 0 40px;
+  background: transparent url(bullet.png) no-repeat 5px 8px;
+  line-height: 140%;
+}
+
+/* workaround IE's failure to support background on li for print media */
+@media print { ul li { list-style: disc; padding-left: 0; background: none; } }
+
+ol li { 
+  margin: 0.1em 0em 0.6em 1.5em;
+  padding: 0 0 0 0px;
+  line-height: 140%;
+}
+
+li li { 
+  font-size: 85%; 
+  font-style: italic;
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li { 
+  font-size: 85%; 
+  font-style: normal;
+  list-style-type: circle;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+li li li li {
+  list-style-type: disc;
+  background: transparent;
+  padding: 0 0 0 0;
+}
+
+img.withBorder {
+  border: 2px solid #c60;
+  padding: 4px;
+}
+
+div.header {
+  position: absolute;
+  z-index: 2;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: 2.95em;
+  width: 100%;
+  padding: 0 0 0 0;
+  margin: 0 0 0 0;
+  border-width: 0;
+  border-style: solid;
+  background-color: #005A9C;
+  border-bottom-width: thick;
+  border-bottom-color: #95ABD0;
+}
+
+div.footer {
+  position: absolute;
+  z-index: 80;
+  left: 0;
+  right: 0;
+  top: auto;
+  bottom: 0;
+  height: 3.5em;
+  margin: 0;
+  font-size: 80%;
+  font-weight: bold;
+  padding-left: 1em;
+  padding-right: 0;
+  padding-top: 0.3em;
+  padding-bottom: 0;
+  color: #003366;
+  background-color: #95ABD0;
+}
+
+/* this is a hack to hide property from IE6 and below */
+div[class="footer"] {
+  position: fixed;
+}
+
+#w3c-logo {
+     margin: 0;
+     margin-top: 0.3em;
+     margin-right: 0.75em;
+     padding-top: 0;
+     padding-bottom: 0;
+     padding-left: 0;
+     padding-right: 0;
+     height: 2em;
+     width: 4.1em;
+     float: right;
+     z-index: 3;
+     background: #90A7D0;
+}
+
+#w3c-logo-fallback {
+     margin: 0;
+     margin-top: -0.5em;
+     margin-right: 0.75em;
+     padding-top: 0;
+     padding-bottom: 0;
+     padding-left: 0;
+     padding-right: 0;
+     height: 3em;
+     width: 4.1em;
+     float: right;
+     z-index: 3;
+     background: #90A7D0;
+}
+
+div.cover {
+  margin: 0;
+  padding: 0;
+  background-color: #90A7D0;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+}
+
+div.cover div.header
+{
+  position: absolute;
+  z-index: 0;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: auto;
+  height: auto;
+  margin: 0;
+  width: 100%;
+  padding: 0.5em 0.5em 1em 0.5em;
+  color: #FFFFFF;
+  border-width: 0;
+  border-style: solid;
+  background-color: #005A9C;
+  border-bottom-width: thick;
+  border-bottom-color: #95ABD0;
+}
+
+div.slide.cover h1
+{
+  margin-bottom: 0;
+  background-color: #005A9C;
+}
+
+div.slide.cover img.cover
+{
+  margin-top: 5em;
+  float: right;
+  width: 60%;
+}
+
+div.slide h1 a:link {color: white}
+div.slide h1 a:visited {color: white}
+div.slide h1 a:active {
+  color: red;
+  text-decoration: underline;
+}
+div.slide h1 a:hover {
+  color: yellow;
+  text-decoration: underline;
+}
+
+div.slide h1 a { text-decoration: none }
+
+div.slide.cover h2 {
+  clear: both;
+  color: white;
+  padding-top: 4em;
+}
+
+div.cover div.header p
+{
+  clear: both;
+  margin-top: 0.5em;
+  margin-left: 1.5em;
+  margin-bottom: 0;
+}
+
+
+div.header p.explanation {
+  font-style: italic;
+}
+
+div.slide.cover a {
+  color: white;
+}
+
+div.slide.cover a:hover, div.slide.cover a:active {
+    color: yellow; text-decoration: underline;
+}
+
+/* for Bert as an ardent user of the old W3C slidemaker tool */
+div.comment { display: none; visibility: hidden }
+
+@media print { div.comment { display: block; visibility: visible } }
+
+/*
+ setting class="outline on ol or ul makes it behave as an
+ ouline list where blocklevel content in li elements is
+ hidden by default and can be expanded or collapsed with
+ mouse click. Set class="expand" on li to override default
+*/
+
+ol.outline li:hover { cursor: pointer }
+ol.outline li.nofold:hover { cursor: default }
+
+ul.outline li:hover { cursor: pointer }
+ul.outline li.nofold:hover { cursor: default }
+
+ol.outline { list-style:decimal; }
+ol.outline ol { list-style-type:lower-alpha }
+
+ol.outline li.nofold {
+  padding: 0 0 0 20px;
+  background: transparent url(nofold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded {
+  padding: 0 0 0 20px;
+  background: transparent url(fold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.folded {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold-dim.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.unfolded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(fold.bmp) no-repeat 0px 0.5em;
+}
+ol.outline li.folded:hover {
+  padding: 0 0 0 20px;
+  background: transparent url(unfold.bmp) no-repeat 0px 0.5em;
+}
+
+/* rectangular blue bullet + unfold/nofold/fold widget */
+
+ul.outline li.nofold {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-nofold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.unfolded {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-fold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.folded {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-unfold-dim.gif) no-repeat 5px 8px;
+}
+ul.outline li.unfolded:hover {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-fold.gif) no-repeat 5px 8px;
+}
+ul.outline li.folded:hover {
+  padding: 0 0 0 52px;
+  background: transparent url(bullet-unfold.gif) no-repeat 5px 8px;
+}
Binary file diapositives/Slidy/w3c-logo-blue.gif has changed
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/Slidy/w3c-logo-blue.svg	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,14 @@
+<svg  xmlns="http://www.w3.org/2000/svg" viewBox="0 0 93 45" xmlns:xlink="http://www.w3.org/1999/xlink">
+      <a xlink:href="http://www.w3.org">
+      <desc>W3C logo</desc>
+          <rect width="103" height="65" fill="#90A7D0" x="-10"  y="-10"/>
+        	<g transform="translate(2,2)">
+        		<path d="M74.5,.2l0.8,5.1l-3,5.6c0,0-1.13-2.39-3-3.7 c-1.6-1.1-2.6-1.4-4.2-1 c-2.1,0.4-4.4,2.9-5.4,5.9 c-1.2,3.6-1.2,5.4-1.3,7c-0.07,2.6,0.3,4.14,0.3,4.1 s-1.8-3.3-1.8-8.1c0.01-3.5,0.6-6.6,2.2-9.7 c1.41-2.7,3.5-4.4,5.4-4.5 c1.9-0.2,3.4,0.7,4.6,1.7 c1.2,1,2.5,3.3,2.5,3.4z"/>
+        		<path d="M74.9,28.8c0,0-1.3,2.3-2.1,3.2c-.8.9-2.3,2.5-4.1,3.3 c-1.8.8-2.7.9-4.5,0.8 c-1.8-.2-3.4-1.2-4-1.6s-2-1.7-2.9-2.9 c-.8-1.2-2.1-3.5-2.1-3.5 s.7,2.4,1.2,3.3c.3.6,1.1,2.3,2.2,3.9c1.1,1.4,3.1,3.9,6.3,4.4 c3.1,.6,5.3-.9,5.8-1.2c.5-.3,1.7-1.3,2.4-2.1 c.7-.8,1.4-1.8,1.8-2.4c.3-.4,0.7-1.3.7-1.3z"/>
+        		<path fill="#0C479D" d="M20.7,0.43l7.1,24.1l7.1-24.1 h5.1l-11.7,39.6h-.5l-7.35-24.5l-7.35,24.5h-.5l-11.7-39.6h5.1l7.1,24.1l4.8-16.2l-2.3-7.9z"/>
+        		<path fill="#0C479D" d="M54.6,27.3c0,3.6-1,6.6-2.9,9 c-1.9,2.4-4.4,3.7-7.4,3.7 c-2.3,0-4.3-0.7-5.9-2.2 c-1.7-1.4-2.9-3.4-3.8-5.9l4-1.7c.6,1.5,1.4,2.7,2.3,3.5 c1,.9,2.1,1.3,3.4,1.3c1.4,0,2.5-.8,3.5-2.3 c.9-1.5,1.4-3.4,1.4-5.5 c0-2.4-.5-4.2-1.5-5.5 c-1.2-1.5-3-2.3-5.5-2.3h-2v-2.3l6.8-11.8h-8.2l-2.3,3.9 h-1.5v-8.7h19.1v2.4l-7.2,12.5c2.5.8,4.5,2.3,5.8,4.4 c1.3,2.1,2,4.7,1.9,7.5z"/>
+        		<text x="78" y="10" font-size="13" font-family="sans-serif">&#174;</text>
+        	</g>
+     </a>
+</svg>
+
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/diapositives/qjpegrest.html	Sun Dec 14 20:00:34 2008 +0000
@@ -0,0 +1,276 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ca" lang="ca-ES">
+<head>
+<meta name="generator" content=
+"HTML Tidy for Linux/x86 (vers 1st November 2003), see www.w3.org" />
+<title>HTML Slidy</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<meta name="copyright" content=
+"Copyright &#169; 2008 Lluís Batlle i Rossell" />
+<meta name="font-size-adjustment" content="+2" />
+<link rel="stylesheet" href="Slidy/slidy.css" type="text/css"
+media="screen, projection, print" />
+<link rel="stylesheet" href="Slidy/w3c-blue.css" type="text/css"
+media="screen, projection, print" />
+<script src="Slidy/slidy.js" type="text/javascript">
+</script>
+</head>
+<body>
+<!--
+<div class="background"><img alt="" id="head-icon"
+src="icon-blue.png" /><object id="head-logo"
+data="w3c-logo-blue.svg" type="image/svg+xml"
+title="W3C logo"><a href="http://www.w3.org/"><img
+alt="W3C logo" id="head-logo-fallback"
+src="w3c-logo-blue.gif" /></a></object></div>-->
+
+<!-- <div class="background slanty">
+<img src="w3c-logo-slanted.jpg" alt="slanted W3C logo" />
+</div>-->
+<div class="slide cover title">
+  <!-- hidden style graphics to ensure they are saved with other content -->
+  <img class="hidden" src="Slidy/bullet.png" alt="" />
+  <img class="hidden" src="Slidy/fold.gif" alt="" />
+  <img class="hidden" src="Slidy/unfold.gif" alt="" />
+  <img class="hidden" src="Slidy/fold-dim.gif" alt="" />
+  <img class="hidden" src="Slidy/nofold-dim.gif" alt="" />
+  <img class="hidden" src="Slidy/unfold-dim.gif" alt="" />
+  <img class="hidden" src="Slidy/bullet-fold.gif" alt="" />
+  <img class="hidden" src="Slidy/bullet-unfold.gif" alt="" />
+  <img class="hidden" src="Slidy/bullet-fold-dim.gif" alt="" />
+  <img class="hidden" src="Slidy/bullet-nofold-dim.gif" alt="" />
+  <img class="hidden" src="Slidy/bullet-unfold-dim.gif" alt="" />
+
+<!--<img src="keys.jpg" alt=
+"Cover page images (keys)" class="cover" /><br clear="all" /> -->
+
+<h1>Restauració d'imatges JPEG</h1>
+
+<p>Autor: <a href="http://vicerveza.homeunix.net/">Lluís Batlle i Rossell</a>,
+&lt;<a href="mailto:viric@vicerveza.homeunix.net">dsr@w3.org</a>&gt;<br />
+<p>Director: <a href="http://www-ma4.upc.edu/~aroca/">Josep Maria Aroca i Farrerons</a>,
+&lt;<a href="mailto:viric@vicerveza.homeunix.net">aroca@ma4.upc.edu</a>&gt;<br />
+</div>
+
+<div class="slide">
+<h1>Estructura</h1>
+<ul>
+<li>Motius
+<li>Pèrdua als JPEG
+<li>Tècniques de recuperació
+<li>Implementació
+</ul>
+</div>
+
+<div class="slide">
+<h1>Motius</h1>
+<ul>
+<li>Popularitat del JPEG
+<ul>
+<li>Pràcticament amb implementacions des de 1992
+<li>Internet
+<li>Càmeres digitals
+</ul>
+<li>Moltes tècniques proposades
+<li>Falta de descodificadors alternatius
+<li>Falta de programari lliure relacionat
+</ul>
+</div>
+
+<div class="slide">
+<h1>Codificació JPEG</h1>
+<ul>
+<li>Canvi de plans de color
+<li>Delmat dels plans de color
+<li>Transformada DCT a cada pla
+<li>Quantització dels coeficients de la DCT
+<li>Compressió sense pèrdues d'aquests coeficients quantitzats
+</ul>
+</div>
+
+<div class="slide">
+<h1>Canvi dels plans de color</h1>
+<h2>RGB a YCbCr</h2>
+<p><img src=""/></p>
+</div>
+
+<div class="slide">
+<h1>Delmat dels plans de color</h1>
+<h2>1x1:2x2:2x2</h2>
+<p><img src=""/></p>
+</div>
+
+<div class="slide">
+<h1>Transformada DCT per pla [1]</h1>
+<ul>
+<li>Divisió en blocs de 8x8 independents
+<li>Enmirallat als blocs incomplets
+<li>Transformació DCT per bloc
+</div>
+
+<div class="slide">
+<h1>Transformada DCT per pla [2]</h1>
+<h2>Exemple de bloc transformat</h2>
+</div>
+
+<div class="slide">
+<h1>Quantització dels coeficients</h1>
+<ul>
+<li>Divisió i arrodoniment
+</ul>
+<h2>Exemple de bloc quantitzat</h2>
+</div>
+
+<div class="slide">
+<h1>Descodificació JPEG</h1>
+<ul>
+<li>Descodificació dels coeficients quantitzats (sense pèrdues)
+<li>Estimació dels coeficients no quantitzats
+<li>Transformada IDCT a cada pla
+<li>Interpolació dels plans de color
+<li>Canvi de plans de color (YCbCr &rarr; RGB)
+</ul>
+</div>
+
+<div class="slide">
+<h1>Descodificació convencional [1]</h1>
+<ul>
+<li>Punt mig de l'interval de quantització
+<li>Independència entre blocs
+<li>Independència entre plans
+<li>Independència del tipus d'imatges
+<li>Simplicitat
+<li>Velocitat
+</ul>
+</div>
+
+<div class="slide">
+<h1>Descodificació convencional [2]</h1>
+<ul>
+<li>Efecte de blocs
+<li>Efecte d'escala
+<li>Efecte d'anells
+<li>Vessament de color
+</ul>
+</div>
+
+<div class="slide">
+<h1>Noves tècniques</h1>
+<ul>
+<li>Suavitzat entre blocs
+<ul>
+<li>Màxim a posteriori
+<li>Projecció sobre conjunts convexos
+<li>Segmentació
+<li>Reaplicació de DCT/Quantització
+</ul>
+<li>Accentuació de cantonades
+<li>Projecció sobre l'espai de quantització
+<li>Influència de l'intensitat de llum als plans de color
+</ul>
+</div>
+
+<div class="slide">
+<h1>Programari</h1>
+<ul>
+<li>Aplicació i combinació de tècniques
+<li>Fàcil variació de les tècniques
+<li>Comparació a ull nu de les tècniques
+<li>Quantificació de la qualitat
+<li>Fidelitat al JPEG original
+<li>Temps de càlcul irrellevant
+</ul>
+</div>
+
+<div class="slide">
+<h1>Cadena de descodificació</h1>
+<img/>
+</div>
+
+<div class="slide">
+<h1>Desquantització i IDCT</h1>
+<ul>
+<li>Convencional: punt mig de l'interval
+<li>Variable aleatòria exponencial
+</ul>
+</div>
+
+<div class="slide">
+<h1>Recuperació de plans</h1>
+<ul>
+<li>Nosratinia
+<li>HP
+<li>Froment
+<li>O'Rourke
+<li>Robertson
+<li>Trianta
+<li>HContrast
+<li>Projecció a l'espai de quantització
+<li>LoadPlane / SavePlane
+</ul>
+</div>
+
+<div class="slide">
+<h1>Escaladors / Plans de color</h1>
+<ul>
+<li>IntScaler
+<li>FancyScaler
+<li>LumScaler
+<li>YCC2RGB
+</ul>
+</div>
+
+<div class="slide">
+<h1>Demostració</h1>
+</div>
+
+<div class="slide">
+<h1>Conclusions</h1>
+<ul>
+<li>És possible obtenir millors descodificacions dels JPEG
+<li>Tècniques a l'abast del públic no acadèmic
+<li>Hem introduït noves tècniques, i n'hem permès la combinació
+<li>Hem recopilat l'estat de l'art de la descodificació
+<li>Permetem la continuitat amb llicències de codi lliure tant al
+programari com a la memòria
+</ul>
+</div>
+
+<div class="slide">
+<h1>Treball futur</h1>
+<ul>
+<li>Fer l'aplicació més còmoda
+<li>Escriure'n un manual d'ús
+<li>Continuar atents a les noves tècniques desenvolupades
+<li>Integrar les implementacions dels algorismes a altres programes
+</ul>
+</div>
+
+<div class="slide">
+<h1>Reconeixement</h1>
+
+<p>Han contribuït a la realització del projecte:</p>
+
+<ul>
+<li>Jacques Froment, Université de Bretagne Sud - LMAM</li>
+<li>Nikhil Hegde, University of Texas, Multimedia Communications Laboratory</li>
+</ul>
+
+<p>Han contribuït especialment a provar el programari i a jutjar imatges:</p>
+
+<ul>
+<li>Olga Txernixova</li>
+<li>Ferriol Macip</li>
+<li>Maixa Teròkhina</li>
+</ul>
+
+<p>Revisió de la realització del projecte:</p>
+<ul>
+<li>Josep Maria Aroca, UPC, Director</li>
+</ul>
+
+</div>
+</body>
+</html>