<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="../xslt/ajax-s-html.xml"?>
<ajax-s>
	<pages>
   
      <page>
         <h2 style="display:none">Intro</h2>
         <p>Step 1: Get out your lipstick</p>
         <div style="text-align:center">
            <img src="images/lipstick-pig.jpg" alt="Lipstick on a pig" class="center" />
            <div style="clear:both;" />
            <sub style="font-size:70%">
               A transgenic fluorescent green pig bred by the National Taiwan University, <em>Photo: Reuters</em>
               
            <blockquote style="text-align: left;">
               <em>... unless the method of teaching and the common style of use for XSLT is radically changed to make it more accessible, XSLT will be relegated to niche status like SGML and other powerful technologies. - David Jacobs, 2002</em>
            </blockquote>
            </sub>
         </div>
      </page>
      <page>
        <h2>Why XSLT should be part of your toolkit:</h2>
        <UL>
          <LI>Unlike CSS, you can add new elements, or rearrange (XML + XSL = decorated XML)</LI>
          <LI>Easy to learn and program, if you take a functional, and not a procedural approach.</LI>
          <LI>Fast processor is built into the major browsers (IE, FF, Opera, not Safari!?)</LI>
          <LI>XML isn't going away - browsers can convert HTML to XML. The new technologies of the Semantic Web. XSLT is the easiest way to convert one to the other.</LI>
        </UL> 
      </page>
      <page>
         <h2>Quick XSLT Refresher</h2>
         <p>
            XSLT rewrites markup for (re)presentation/consumption. This example creates a XHTML select.
         </p>
         <h3>Example</h3>
         <table id="xslt-example" cellpadding="0" cellspacing="0" border="0">
            <tr>
            <td align="left" valign="top"> 
               <h5>select.xml</h5>
                  <div class="code-box">
                  <![CDATA[
<?xml version="1.0" encoding="ISO-8859-1"?>
<xml-stylesheet type="text/xsl" href="select.xsl"?>
<results>
   <result>
      <id>1</id>
      <label>Sexy</id>
   </result>
   <result>
      <id>2</id>
      <label>Not Sexy</label>
   </result>
</results>]]></div>
               </td>
               
               <td align="left" valign="top" style="border:0;padding: 0 15px;"><strong>+</strong></td>
               
               <td align="left" valign="top">
                  <h5>select.xsl</h5>
                  <div class="code-box">
                  <![CDATA[
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
   <select>
      <xsl:for-each select="results/result">
      <option>
      <xsl:attribute name="id">
         <xsl:value-of select="id" />
      </xsl:attribute>
      <xsl:value-of select="label" />
      </option>
      </xsl:for-each>
   </select>
</xsl:for-each>]]></div>
               </td>
            </tr>
            <tr>
               <td colspan="3" align="left" valign="top" style="padding: 20px 0; border:0;">
                  <strong>=</strong>
                  <select onchange="alert('now, there ya go! this.value:' + this.value);">
                     <option value="2">Not Sexy</option>
                     <option value="1">Sexy</option>
                  </select>
               </td>
            </tr>
         </table>
      </page>
      <page>
        <h2>On to the demos!</h2>
      </page>
      <page>
        <h2>XSLDataGrid: Why another datagrid component?</h2>
         <table>
          <tr>
            <td>
             <h4>The pure Javascript way</h4>
             <div class="code-box">
             <![CDATA[ 
    var myCells = [
    ["MSFT","Microsoft Corporation", "314,571.156"],
    ["ORCL", "Oracle Corporation", "62,615.266"]
    ];
    
    var myHeaders = ["Ticker", "Company Name", "Market Cap."];
    
    // create grid object
    var obj = new AW.UI.Grid;
    
    ...
    
    // write grid to the page
    document.write(obj);
             ]]>
             </div>
           </td>
           <td>
           <h4>The pure PHP way (or serverside class way)</h4>
           <div class="code-box">
           <![CDATA[
$dg = new DataGrid();
$dg->columns = array( "field1", "field2", "field3" );
$dg->data = $data;
etc...
$dg->render();
           ]]>
           </div>
           </td>
         </tr>
       </table>
      </page>
      
      <page>
         <h2>XSLDataGrid: How it's different</h2>
         <ul>
            <li><a href="http://www.commoner.com/lsimon/XSLDataGrid/test/Dynamic.php">Dynamic Demo</a></li>
            <li><a href="http://www.commoner.com/lsimon/XSLDataGrid/test/Multiple.html">Tables on a page</a></li>
            <li>Began as an attempt to use scriptaculous' sortable component for table columns</li>
            <li>First implementation was a PHP class + Smarty template (which limited adoption among RoR headz)</li>
            <li>Settled on a "microformat" approach to the component, based on Dojo's page scanner</li>
            <li>Degrades to a good old table</li>
            <li>Dual-DOM technique for client-side XLST (XML and HTML DOM)</li>
         </ul>
      </page>
      <page>
        <h2>This slide presentation is made with XSLT using <a href="http://www.robertnyman.com/2005/11/13/proudly-presenting-ajax-s/">AJAX-S</a></h2>
      </page>
      <page>
        <h2>Upcoming and Cool: XSLT2, etc...</h2>
        <p>
          XQuery, XSLT 2 and XPath 2 are officially W3C Recommendations (Q1 2007) (<a href="http://www.w3.org/TR/2007/REC-xslt20-20070123/">W3C Rec.</a>)
        </p>
        <ul>
            <li>XForms 1.2</li>
            <li>Last Call: <a href="http://www.w3.org/TR/xbl/">XML Binding Language (XBL) 2.0</a></li>
        </ul>
      </page>
      <page>
        <h2>Upcoming and Cool: Freja and Formbuilder</h2>
        <ul>
          <li>Freja's a MVC for Javascript</li>
          <li>XSL is the "View"</li>
          <li><a href="http://www.formassembly.com/form-builder-v2.4/?demo=1">Freja Formbuilder Demo</a></li>
        </ul>
      </page>
      <page>
        <h2>Upcoming and Cool: M. David Peterson's <a href="http://www.aspectxml.org/">AspectXML</a></h2>
        <ul>
          <li>Develop boiler plate code and test the XSLT engine to deliver only relevant CSS, Javascript</li>
          <li>AspectXML is a framework for writing code dynamically to output versions for different platforms</li>
          <li>Demo of end result using specific files: <a href="http://browserbasedxml.com/index.xml">BrowserBasedXML.com</a></li>
        </ul>
      </page>
      <page>
        <h2>Upcoming and Cool: GRDDL (pronounced "girdle")</h2>
        <blockquote>
          GRDDL is a markup format for Gleaning Resource Descriptions from Dialects of Languages; that is, for getting RDF data out of XML and XHTML documents using explicitly associated transformation algorithms, typically represented in XSLT. <em><a href="http://en.wikipedia.org/wiki/GRDDL">Wikipedia</a></em>
        </blockquote> 
        <ul>
          <li><a href="http://www.w3.org/2004/01/rdxh/spec">W3C Last Call: GRDDL</a></li>
          <li><a href="http://www.w3.org/2004/lambda/Sites/index.html">GRDDL Demo</a></li>
          <li><a href="http://simile.mit.edu/welkin/">Welkin: RDF Visualizer</a></li>
        </ul>
      </page>
      <page>
         <h2>Other Links/Resources</h2>
         <ul>
            <li><a href="http://www.commoner.com/lsimon/XSLDataGrid/">XSLDataGrid</a> by Lindsey Simon</li>
            <li><a href="http://www.openajax.org/whitepapers/Successful%20Deployment%20of%20Ajax%20and%20OpenAjax.html#Dual-DOM_client-side">Dual-DOM description and diagram from Open Ajax Alliance whitepaper</a></li>
            <li><a href="http://ajaxpatterns.org/Browser-Side_XSLT">Ajaxpatterns: Browser-side XSLT</a></li>
            <li><a href="http://sourceforge.net/projects/sarissa/">Sarissa</a> library by Manos Batsis</li>   
            <li><a href="http://www.xfront.com/rescuing-xslt.html">Rescuing XSLT from Niche Status</a> by David Jacobs, 2002</li>
            <li><a href="http://www.w3.org/2005/08/online_xslt/">W3's Online XSLT service</a></li>
            <li><a href="http://www.w3schools.com/xsl/xsl_transformation.asp">W3Schools XSL Tutorial</a></li>
            <li><a href="http://suda.co.uk/projects/X2V/">Brian Suda's X2V</a></li>
            <li><a href="http://www.robertnyman.com/2005/11/13/proudly-presenting-ajax-s/">AJAX-S</a> by Robert Nyman</li>
            <li><a href="http://johnvey.com/features/deliciousdirector/xslt-filter-sort.html">Del.icio.us Direc.tor</a> by John Vey</li>
            <li><a href="http://goessner.net/articles/jsont/">JSONT</a> by Stefan Gössner</li>
            <li><a href="http://infinitesque.net/articles/2006/XHTML-XForms/inXSLT1.xhtml">XHTML -> XForms in XSLT-1</a></li>
            <li><a href="http://idealliance.org/proceedings/xtech05/papers/03-06-01/">Bridging XHTML, XML and RDF with GRDDL</a></li>
            <li><a href="http://weblogs.mozillazine.org/hyatt/archives/2003_05.html#003262">XBL vs XSLT</a></li>
         </ul>
      </page>
	</pages>
</ajax-s>
