Added the files for the first time
author"Arun Ranganathan <arun@mozilla.com>"
Fri, 30 Nov 2012 11:52:12 -0500
changeset 0 c0c67c2a2f92
child 1 29781dff983b
Added the files for the first time
FileAPI.css
Makefile
Overview-UseCases.xml
Overview.html
WebIDL.css
WebIDL.xsl
dfn.js
section-links.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/FileAPI.css	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,294 @@
+.nt, pre, .terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .xattr, .regex, .prod-number, .prod-lines, .prod-mid {
+  font-size: 14px;
+}
+pre code, .prod-lines .nt {
+  font-size: 14px !important;
+}
+.terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .example, .note, blockquote {
+  background: #d9e8ff;
+}
+td code {
+  background: inherit;
+}
+.example blockquote {
+  background: #f0f6ff;
+}
+table.grammar {
+  background: #eee;
+}
+.ednote {
+  border-top: 3px solid red;
+  border-bottom: 3px solid red;
+  margin: 1em 2em;
+  padding: 0 1em 0 1em;
+  background: #f8eeee;
+}
+.ednoteHeader {
+  font-weight: bold;
+  display: block;
+  padding-top: 0.5em;
+}
+.toc ul li {
+  list-style-type: none;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.toc ul {
+  margin-bottom: 0.5em;
+}
+.terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .input {
+  font-family: /*Consolas, Monaco,*/ monospace !important;
+}
+pre.code code {
+  background: inherit;
+}
+.propattrset {
+}
+/*.prop {
+  font-family: Consolas, Monaco, monospace;
+}*/
+
+.xattr {
+  font-family: /*Consolas, Monaco,*/ monospace;
+}
+
+table { border-collapse:collapse; border-style:hidden hidden none hidden }
+table thead { border-bottom:solid }
+table tbody th:first-child { border-left:solid }
+table td, table th { border-left:solid; border-right:solid; border-bottom:solid thin; vertical-align:top; padding:0.2em }
+
+.nt, .prod-lines {
+  font-family: /*Consolas, Monaco,*/ monospace;
+  white-space: nowrap;
+}
+.idltype, .idlvalue {
+  font-weight: bold;
+}
+.idlop {
+  font-weight: bold;
+}
+.esvalue, .estype {
+  font-weight: bold;
+}
+.javatype, .javapkg {
+  font-weight: bold;
+}
+.regex {
+  font-family: /*Consolas, Monaco,*/ monospace;
+  white-space: nowrap;
+}
+.typevar {
+  font-style: italic;
+}
+.example, .note {
+  border-top: 3px solid #005a9c;
+  border-bottom: 3px solid #005a9c;
+  margin: 1em 2em;
+  padding: 0 1em 0 1em;
+}
+.exampleHeader, .noteHeader {
+  font-weight: bold;
+  display: block;
+  color: #005a9c;
+  color: black;
+  padding-top: 0.5em;
+}
+pre {
+  overflow: auto;
+  margin: 0;
+  font-family: /*Consolas, Monaco,*/ monospace;
+}
+pre.code {
+  padding: 0 1em;
+  margin: 0;
+  margin-bottom: 1em;
+}
+.block {
+  border: 1px solid #90b8de;
+  border-left: 3px double #90b8de;
+  border-left: none;
+  border-right: none;
+  background: #f0f6ff;
+  margin: 2em;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  padding: 0 0.5em;
+  padding-bottom: 0.5em;
+}
+.blockTitleDiv {
+  text-align: left;
+}
+.blockTitle {
+  position: relative;
+  top: -0.75em;
+  left: -1.5em;
+  /*border: 1px solid #90b8de;
+  border-left: none;
+  border-right: none;*/
+  background: #90b8de;
+  color: white;
+  padding: 0.25em 1em 0.25em 1em;
+  font-weight: bold;
+  font-size: 80%;
+}
+dfn {
+  font-weight: bold;
+  font-style: italic;
+}
+.dfnref {
+}
+li {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+ul > li {
+  list-style-type: disc;
+}
+.norm {
+  font-style: italic;
+}
+.rfc2119 {
+  text-transform: lowercase;
+  font-variant: small-caps;
+}
+dfn var {
+  font-style: normal;
+}
+blockquote {
+  padding: 1px 1em;
+  margin-left: 2em;
+  margin-right: 2em;
+}
+a.placeholder {
+  color: #00e;
+}
+dl.changes > dd {
+  margin-left: 0;
+}
+dd > :first-child {
+  margin-top: 0;
+}
+caption {
+  caption-side: bottom;
+  margin-top: 1em;
+  font-weight: bold;
+}
+body {
+  line-height: 1.3;
+}
[email protected] print {
+  .section-link {
+    display: none;
+  }
+}
+.section-link {
+  visibility: hidden;
+  width: 1px;
+  height: 1px;
+  overflow: visible;
+  font-size: 10pt;
+  font-style: normal;
+}
+.section-link a {
+  color: #666;
+  font-weight: bold;
+  text-decoration: none;
+}
+.section-link a:hover {
+  color: #c00;
+}
+.section > *:hover > .section-link {
+  visibility: visible;
+}
+div.set {
+  margin-left: 3em;
+  text-indent: -1em;
+}
+ol.algorithm ol {
+  border-left: 1px solid #90b8de;
+  margin-left: 1em;
+}
+dl.switch > dd > ol.only {
+  margin-left: 0;
+}
+dl.switch {
+  padding-left: 2em;
+}
+dl.switch > dt {
+  text-indent: -1.5em;
+  margin-top: 1em;
+}
+dl.switch > dt + dt {
+  margin-top: 0;
+}
+dl.switch > dt:before {
+  content: '\21AA';
+  padding: 0 0.5em 0 0;
+  display: inline-block;
+  width: 1em;
+  text-align: right;
+  line-height: 0.5em;
+}
+.diagram {
+  text-align: center;
+}
+iframe {
+  border: 0;
+}
+.ignore {
+  opacity: 0.5;
+}
+.comment {
+  color: #005a9c;
+}
+
+.matrix {
+  border-collapse: collapse;
+  margin-left: auto;
+  margin-right: auto;
+}
+.matrix th {
+  background: #d9e8ff;
+  text-align: right;
+}
+.matrix td, .matrix th {
+  border: 1px solid #90b8de;
+  padding: 4px;
+}
+.matrix th.corner {
+  border: 0;
+  background: none;
+}
+.matrix td {
+  text-align: center;
+  background: #f0f6ff;
+}
+.matrix .belowdiagonal {
+  background: #ddd;
+}
+
+ul.notes { font-size: 90%; padding-left: 0 }
+ul.notes li { list-style-type: none }
+ul.notes .note-link { vertical-align: super }
+.note-link { font-size: 90% }
+
+.code var { color: #f44; }
+
+/* For dfn.js */
+body.dfnEnabled dfn { cursor: pointer; }
+.dfnPanel {
+  display: inline;
+  position: absolute;
+  height: auto;
+  width: auto;
+  padding: 0.5em 0.75em;
+  font: small sans-serif;
+  background: #DDDDDD;
+  color: black;
+  border: outset 0.2em;
+  cursor: default;
+}
+.dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
+.dfnPanel :link, .dfnPanel :visited { color: black; }
+.dfnPanel p { font-weight: bolder; }
+.dfnPanel li { list-style-position: inside; }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/Makefile	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,2 @@
+OverviewUseCases.html : Overview-UseCases.xml WebIDL.xsl
+	xsltproc --nodtdattr WebIDL.xsl Overview-UseCases.xml >Overview.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/Overview-UseCases.xml	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,234 @@
+<?xml version='1.0'?>
+
+<!--
+  Overview.xml
+  I reuse WebILD.xsl 
+
+  This is written in XHTML 1.0 Strict with an inline <options> element that
+  helps the WebIDL.xsl stylesheet process the document (generating a table
+  of contents, section numbers, certain processing instructions).
+  -->
+
+<?xml-stylesheet href='WebIDL.xsl' type='text/xsl'?>
+
+<html xmlns='http://www.w3.org/1999/xhtml' xmlns:x='http://mcc.id.au/ns/local' xml:lang='en'>
+  <head>
+    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
+    <title>Web Cryptography API Use Cases</title>
+
+    <meta name='revision' content='$Id: Overview-FA.xml,v 1.164 2012/10/22 21:58:12 arangana Exp $'/>
+
+    <link rel='stylesheet' href='FileAPI.css' type='text/css'/>
+    <script src='section-links.js' type='application/ecmascript'/>
+    <script src='dfn.js' type='application/ecmascript'/>
+    <!--[if IE]>
+    <style type='text/css'>
+      .ignore {
+        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+        filter: alpha(opacity=50);
+      }
+    </style>
+    <![endif]-->
+
+    <options xmlns='http://mcc.id.au/ns/local'>
+      <versions>
+        <cvs href='http://dev.w3.org/2006/webapi/FileAPI/'/>
+        <this href='http://www.w3.org/TR/2012/WD-FileAPI-20121025/' />
+        <previous href='http://www.w3.org/TR/2012/WD-FileAPI-20120712/' />
+        <latest href='http://www.w3.org/TR/FileAPI/' />
+      </versions>
+      <editors>
+        <person homepage='http://arunranga.com/' email='[email protected]'>
+          <name>Arun Ranganathan</name>
+          <affiliation>Mozilla Corporation</affiliation>
+        </person>
+      </editors>
+      <maturity>ED</maturity>  
+    </options>
+  </head>
+
+  <body>
+    <?top?>
+
+    <div class='section'>
+      <h2>Abstract</h2>
+     <p>
+      This document collates the target use cases for the Web Cryptography API.  These use cases, described as <em>scenarios</em>, represent the set of expected functionality that may be achieved by the Web Cryptography API .  A set of "secondary" functionality may also be documented here as scenarios.
+    </p>
+
+
+      <?revision-note?>
+    </div>
+
+    <div class='section'>
+      <h2>Status of this Document</h2>
+      <?sotd-top [email protected] http://lists.w3.org/Archives/Public/public-webcrypto/?>
+      <p>
+         Ongoing discussion of this document will be on the <a href="mailto:[email protected]">[email protected]</a>
+        mailing list.
+      </p>
+      
+      <p>
+      <em>This section describes the status of this document at the time of its publication.
+      Other documents may supersede this document, since it is only an editor's draft.
+      A list of current <acronym title="World Wide Web Consortium">W3C</acronym>
+      publications and the latest revision of this technical report can be found in the 
+      <a href="http://www.w3.org/TR/"><acronym title="World Wide Web Consortium">W3C</acronym>
+      technical reports index</a> at <a href="http://www.w3.org/TR/">http://www.w3.org/TR/</a>.</em>
+      </p>
+
+    <p>
+      This document is produced by the <a href="http://www.w3.org/2012/webcrypto/">Web <acronym title="Cryptography">Cryptography</acronym>
+      <acronym title="Working Group">WG</acronym></a> in the <acronym title="World Wide Web Consortium">W3C</acronym>
+      <a href="http://www.w3.org/Interaction/">Interaction Domain</a>.
+    </p>
+    <p>
+      Web content and browser developers are encouraged to review this draft. Please send comments to
+      <a href="mailto:[email protected]">[email protected]</a>, the <acronym title="World Wide Web Consortium">W3C</acronym>'s
+      public email list for issues related to Web <acronym title="Application Programming Interface">API</acronym>s.
+      <a href="http://lists.w3.org/Archives/Public/public-webcrypto/">Archives</a> of the
+      list are available.
+    </p>
+    <p>
+        This document is produced by the <a href='http://www.w3.org/2012/webcrypto/'>Web Cryptography Working Group</a>, within
+        the W3C <a href='http://www.w3.org/Interaction/'>Interaction Domain</a>.
+        Changes made to this document can be found in the
+        <a href='http://dev.w3.org/cvsweb/2006/webapi/FileAPI/Overview-UseCases.xml'>W3C public CVS server</a>.
+    </p>
+      <?sotd-bottom http://www.w3.org/2004/01/pp-impl/42538/status?>
+    </div>
+
+    <div id='toc'>
+      <h2>Table of Contents</h2>
+      <?toc sections appendices?>
+    </div>
+
+    <div id='sections'>
+    <div id='introduction' class='section'>
+    <h2>Introduction</h2>
+      <p>The Web Cryptography API describes a JavaScript API for basic cryptographic operations, including: hashing, signature generation and verification, encryption and decryption.  Additionally, it describes an API for applications to generate and/or manage the keying material necessary to perform these operations.  This document presents use cases in the form of scenarios, with each scenario describing a potential web application using the API.</p>
+    </div>
+    <div id='requirements' class='section'>
+    <h2>Requirements</h2>
+    <p>This section presents required features of the Web Cryptography API; in many cases, the Web Cryptography API encompasses more than one algorithm and more than one mechanism to accomplish each of these features.  The section presents code names for each of the features.</p>
+    <ul>
+      <li><p><dfn id="hash">HASH</dfn>, the ability to perform a cryptographic hash, where an algorithm that takes an arbitrary block of data returns a fixed-size bit sequence, called the <dfn id="hash-value">hash value</dfn>, such that any change to the block of data changes the hash value.</p></li>
+      <li><p><dfn id="mac">MAC</dfn>, the ability to generate a <em>message authentication code</em>, using an algorithm</p></li>
+      <li><p><dfn id="sign">SIGN</dfn>, the ability to digitally sign a document, such that upon verification of the signature, the document's authenticity can be determined.  The term document in this context can refer to any kind of data used in web applications.</p></li>
+      <li><p><dfn id="verify">VERIFY</dfn>, the ability to verify a digitally signed document, as well as verify a MAC.</p></li>
+      <li><p><dfn id="encrypt">ENCRYPT</dfn>, the ability to encode a document using an encryption algorithm.  <dfn id="encrypt-pki">ENCRYPT-PKI</dfn> is a specific type of encryption involving PKI, and <dfn id="encrypt-sym">ENCRYPT-SYM</dfn> is a specific type of encryption using symmetric keys.</p></li> 
+      <li><p><dfn id="decrypt">DECRYPT</dfn>, the ability to decrypt a digitally signed document.  <dfn id="decrypt-pki">DECRYPT-PKI</dfn> is a specific type of decryption using PKI, and <dfn id="decrypt-sym">DECRYPT-SYM</dfn> is a specific type of decryption using symmetric keys.</p></li>
+      <li><p><dfn id="derive">DERIVE</dfn>, the ability to derive a key or keys used in cryptographic operations; <dfn id="derive-pki">DERIVE-PKI</dfn> is the ability to derive keys usable in PKI operations.</p></li>
+      <li><p><dfn id="keyexchange">KEYEX</dfn>, the ability for two entities to exchange key(s) without interception by a third party, with <dfn id="keyex-dh">KEYEX-DH</dfn> representing Diffie-Hellman key exchange, a particularly common application of safe key exchange.</p></li>
+      <li><p><dfn id="keycall">KEYCALL</dfn>, the ability to call a particular key from a web application that either generated the key or that is in the same domain as the key.</p></li>
+      <li><p><dfn id="PKI">-PKI</dfn>, an acronym for <dfn id="pki">Public Key Infrastructure</dfn> used in this document as a suffix to other features.</p></li>
+      <li><p><dfn id="SYM">-SYM</dfn>, an acronym for <dfn id="sym">Symmetric Key</dfn> operations, used in this document as a suffix to other features.</p></li>
+      <li><p><dfn id="random">RANDOM</dfn>, the ability to generate a random cryptographically secure number.</p></li>
+
+    </ul>  
+    </div>
+    <div id='scenarios' class='section'>
+      <h2>Use Case Scenarios</h2>
+      <p>This section collates use case scenarios based on the requirements.</p>
+      <div id='banking-korea' class='section'>
+      <h3>Banking Transactions</h3>
+      <p>Park Jae-sang opens up a bank account with Gangnam Bank (GB), and wishes to log-in and engage in online transactions, including account balance checking, online payments (with some automated scheduled payments), and account transfers between domestic and investment accounts.  The first time Park logs in to the GB website with a temporary verification code sent to his cell phone, the bank asks him to ascertain if the browser he is using is not at a kiosk; moreover, he is asked if it is a web browser and machine configuration he will use often.</p>
+      <p>He confirms that it is.  The GB web site then asks him to generate a public key/private key pair, along with a digital certificate.  Park consents, and the web page creates the key pair, storing his private key in the browser's designated key store, along with a one-time key escrow by the bank. [<a href="#derive">DERIVE</a> | <a href="#keyex-dh">KEYEX-DH</a>].</p>
+      <p>Subsequent access to the GB website is triggered via presentation of the key that Park generated when he first accessed the website [<a href="#keycall">KEYCALL</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#sign">??SIGN</a>].  His browser presents this key every time he accesses the website and enters his password, which effectively binds his username and password to the generated private key and certificate.  Additionally, Park can digitally sign online checks, authorize payments, and sign tax forms that he submits to the bank site using this generated key [<a href="#sign">SIGN</a>]. Park can also perform the following tasks:</p>
+      <ol>
+        <li><p>Park can receive documents from GB that only he can read.  These include his private bank statements and tax documents. [<a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#decrypt">DECRYPT</a>]</p></li>
+        <li><p>Park can submit documents to GB that only GB can read, with the assurance that these have come from Park.  Such documents include confidential financial information. [<a href="#encrypt-pki">ENCRYPT-PKI</a>]</p></li> 
+      </ol>
+    </div>
+    <div id='video-service' class='section'>    
+      <h3>Dr. What: Video Service</h3>
+      <p>Virginie connects to her favorite video service to watch an episode of a show she is interested in using her entertainment device, which connects to the biggest screen in her living room.  The video service collects a monthly subscription fee and allows the watching of five streaming movies a month at that fee, and streams high definition content over an Internet connection.  Virginie does the following:</p>
+      <ol>
+        <li><p>She sets her device up to interact with the service.  Her device runs a user agent that meets the conformance criteria for the Web Cryptography API specification.  During the set up process, the entertainment device generates the keys it will use and exchanges them safely with the video service [<a href="#derive">DERIVE</a> | <a href="#derive-pki">DERIVE-PKI</a> | <a href="#keys-dh">KEYEX-DH</a>].</p></li>
+        <li><p>Subsequent access to the video service from her device is seamless, and it identifies her as Virginie, loading her preferences and her watch queue. [<a href="#keycall">KEYCALL</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#sign">??SIGN</a>].  She can access the service and browse videos to watch.</p></li> 
+        <li><p>She selects her favorite show -- Dr. What -- and picks an episode that she has not yet seen.  The service then determines that she is authorized to watch that video, and streams that video. [???] </p></li>
+        <li><p>Virginie rates the video so that the service understands her preferences.  Along with personalized data about Virginie, the device sends usage statistics and metrics back to the service [<a href="#mac">MAC</a> | <a href="#encrypt-sym">ENCRYPT-SYM</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>].</p></li>
+      </ol>
+    </div>
+    <div id='data-integrity' class='section'>
+      <h3>Code Sanctity and Bandwidth Saver</h3>
+      <p>A major social networking site wishes to optimize website performance by storing JavaScript and other resources in local storage, preventing a needless server roundrip.  The social network site wishes to verify that these resources have not been tampered with; the service uses <a href="#localStorage"><code>localStorage</code></a> and <a href="#IndexedDB"><code>IndexedDB</code></a> to store assets for their web pages, notably JavaScript.  Their threat model is such that the social networking site implicitly trusts the HTTP connection (which uses TLS), the browser, and the HTTP cache, but cannot vouch for localStorage or IndexedDB.  Let us take the case of a couple who have gone from being "In a Relationship" to "It's Complicated."  John Doe uses the social networking site often, while Jane Doe, a JavaScript programmer, packs her bags to move out of the apartment.
+      <div class="example">
+      <p>This illustrates a worst case scenario, in which <code>localStorage</code> is compromised by a malicious user.  Normally, the social networking site deploys code of the sort below, which John Doe's browser runs everytime he logs into the social networking site.</p>
+      <x:codeblock language="es">
+      function init() {
+      var src = window.localStorage.getItem('src');
+      <span class="comment">// up until now env is safe</span>
+      if (src) {
+      <span class="comment">  // now whatever code was in src will be executed</span>
+        eval(src);
+      } else {
+        <span class="comment">// fetch the code using xhr, populate localStorage</span>
+        <span class="comment">// with it. Execute it.</span>
+      }
+    }
+      </x:codeblock>
+      <p>But at some point in time, a malicious user -- Jane Doe -- with access to the JavaScript console of John Doe's browser does something of the sort:</p>
+      <x:codeblock language="es"> 
+      window.localStorage.setItem('src', evil_code);
+      <span class="comment">// evil_code sends photos to Jane Doe's personal server.</span>
+      </x:codeblock>
+      <p>John Doe's use of the social network is thus compromised by Jane Doe's script injection, since the next time he logs in, and <code>init()</code> is called, <code>evil_code</code> is run, which may upload his private photos to Jane Doe's server.  To mitigate against situations like this, the social networking site might do something like this:</p>
+      <x:codeblock language="es">
+      <span class="comment">// Synchronously retrieve an MD5 hash of the pristine version of the code</span>
+      <span class="comment">// This is retrieved from the server</span>
+        var src_hash = getHashFromServer();
+        function init()
+        {
+          var src = window.localStorage.getItem('src');
+
+          <span class="comment">// validateSrc is an utility function that wraps the Crypto API</span>
+
+          validateSrc(src, src_hash, success, failFetch);
+
+          function success(){eval(src)};
+          function failFetch(){<span class="comment">//Fetch the code using XHR, and populate localStorage with it</span>};
+
+        }
+
+      </x:codeblock>
+      <p>In this case, <code>getHashFromServer()</code> is guaranteed to be untampered with, since it connects to the server or the HTTP cache, which are above suspicion.
+    </p>
+      </div>
+
+          [<a href="#hash">HASH</a> | <a href="#keycall">KEYCALL</a> |  <a href="#verify">VERIFY</a>]</p>
+  </div>
+   <div id='encrypt' class='section'>
+    <h3>Mitch Turns 21: Encrypted Communications</h3>
+    <p>Mark wishes to post pictures of Mitch's 21st birthday party to a social network that allows confidential and encrypted communication between members, but wishes to ensure that these pictures are safe from prying eyes -- more importantly, he wants them to be indecipherable digital data for everyone except Mitch.  Mark can do the following: </p>
+    <ol>
+      <li><p>He can encrypt the photos with a key he generates for the occasion. [<a href="#derive">DERIVE</a> | <a href="#encrypt">ENCRYPT</a>]</p></li>
+      <li><p>He can communicate with others on the network about the key and share the encrypted photos. [<a href="#keyex">KEYEX</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>He can receive confidential communication from Mitch about the pictures via encrypted messages that are virtually impossible to read by any other entity than Mark. [<a href="#verify">VERIFY</a> | <a href="#decrypt-pki">DECRYPT-PKI</a>]</p></li>
+    </ol>
+   </div>
+  <div id='realtime-messaging' class='section'>
+    <h3>Off The Record Real Time Messaging</h3>
+    <p>David and Nadim wish to have an "Off The Record" chat in real time, completely between them, and in text, including the ability to share digital data such as photographs.  They log on to a chat server that serves up web content, and connect to each other's machines directly.  The server merely serves up the chat client necessary, and does not log their conversation (and in fact cannot).  David and Nadim need to:</p>
+    <ul>
+      <li><p>Be assured that they are who they claim they are. [<a href="#decrypt">DECRYPT</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#encrypt">ENCRYPT</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>Be assured that during a conversation, messages sent back and forth are unmodified. [<a href="#random">RANDOM</a> | <a href="#encrypt">ENCRYPT</a> | <a href="#decrypt">DECRYPT</a>] </p></li>
+      <li><p>Be assured that after the conversation, the contents of the conversation cannot be determined. [???] </p></li>
+    </ul>
+
+  </div>
+  <div id='savemystuff' class='section'>
+    <h3>Documents In the Cloud</h3>
+    <p>Vijay wishes to confidentially store certain documents, including photos, music, pages from the novel he is working on, and notes about his employer using a web service that he pays a monthly subscription to for such confidential storage.  He can drag and drop content from his laptop onto a web page of the service, and it automatically stores it in an encrypted manner.  Vijay can do the following:</p>
+    <ol>
+      <li><p>Log on to the service using his credentials; after the service determines that Vijay is using his primary browser, which he will use to access the service subsequently, it generates encryption keys. [<a href="#derive">DERIVE</a> | <a href="#derive-pki">DERIVE-PKI</a>] </p></li>
+      <li><p>Drag over content from his underlying file system that he wishes to store. [<a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>Store that content on the server, with the assurance that it is stored there in a way that is virtually undecipherable to third-parties, including employees of the service in question.</p></li>
+      <li><p>Later, Vijay can retrieve the content, and save it back to his local file system. [<a href="#decrypt-pki">DECRYPT-PKI</a>] </p></li>
+    </ol>
+  </div>
+ </div>
+</div>
+  
+</body>
+</html>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/Overview.html	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,247 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
+<!--
+  Overview.html
+  Web IDL
+
+  Note: This file is generated from Overview.xml.  Run "make" to regenerate it.
+  -->
+
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <title>Web Cryptography API Use Cases</title>
+
+    <meta name="revision" content="$Id: OverviewUseCases.html,v 1.4 2012-11-19 05:50:44 arangana Exp $" />
+
+    <link rel="stylesheet" href="FileAPI.css" type="text/css" />
+    <script src="section-links.js" type="application/ecmascript"></script>
+    <script src="dfn.js" type="application/ecmascript"></script>
+    <!--[if IE]>
+    <style type='text/css'>
+      .ignore {
+        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+        filter: alpha(opacity=50);
+      }
+    </style>
+    <![endif]-->
+
+    
+  <link rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/W3C-ED" type="text/css" /></head>
+
+  <body>
+    <div class="head"><div><a href="http://www.w3.org/"><img src="http://www.w3.org/Icons/w3c_home" width="72" height="48" alt="W3C" /></a></div><h1>Web Cryptography API Use Cases</h1><h2>W3C Editor’s Draft <em>22 October 2012</em></h2><dl><dt>Latest Editor’s Draft:</dt><dd><a href="http://dev.w3.org/2006/webapi/FileAPI/">http://dev.w3.org/2006/webapi/FileAPI/</a></dd><dt>Latest Published Version:</dt><dd><a href="http://www.w3.org/TR/FileAPI/">http://www.w3.org/TR/FileAPI/</a></dd><dt>Previous Version(s):</dt><dd><a href="http://www.w3.org/TR/2012/WD-FileAPI-20120712/">http://www.w3.org/TR/2012/WD-FileAPI-20120712/</a></dd><dt>Editor:</dt><dd><a href="http://arunranga.com/">Arun Ranganathan</a>, Mozilla Corporation &lt;[email protected]&gt;</dd><dt>Participate:</dt><dd></dd></dl><p class="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> &copy; 2012 <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>&reg;</sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.org/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></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> and <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply.</p></div><hr />
+
+    <div class="section">
+      <h2>Abstract</h2>
+     <p>
+      This document collates the target use cases for the Web Cryptography API.  These use cases, described as <em>scenarios</em>, represent the set of expected functionality that may be achieved by the Web Cryptography API .  A set of "secondary" functionality may also be documented here as scenarios.
+    </p>
+
+
+      <div class="ednote"><div class="ednoteHeader">Editorial note</div><p>This is revision $Id: OverviewUseCases.html,v 1.4 2012-11-19 05:50:44 arangana Exp $.</p></div>
+    </div>
+
+    <div class="section">
+      <h2>Status of this Document</h2>
+      <p><em>
+        This section describes the status of this document at the time of
+        its publication.  Other documents may supersede this document. A list
+        of current W3C publications and the latest revision of this technical
+        report can be found in the <a href="http://www.w3.org/TR/">W3C technical
+          reports index</a> at http://www.w3.org/TR/.
+      </em></p><p>
+        This document is the 22 October 2012 <b>Editor’s Draft</b> of the
+        <cite>Web Cryptography API Use Cases</cite> specification.
+      
+      Please send comments about this document to
+      <a href="mailto:[email protected]">[email protected]</a>
+      (<a href="http://lists.w3.org/Archives/Public/public-webcrypto/">archived</a>).
+    </p>
+      <p>
+         Ongoing discussion of this document will be on the <a href="mailto:[email protected]">[email protected]</a>
+        mailing list.
+      </p>
+      
+      <p>
+      <em>This section describes the status of this document at the time of its publication.
+      Other documents may supersede this document, since it is only an editor's draft.
+      A list of current <acronym title="World Wide Web Consortium">W3C</acronym>
+      publications and the latest revision of this technical report can be found in the 
+      <a href="http://www.w3.org/TR/"><acronym title="World Wide Web Consortium">W3C</acronym>
+      technical reports index</a> at <a href="http://www.w3.org/TR/">http://www.w3.org/TR/</a>.</em>
+      </p>
+
+    <p>
+      This document is produced by the <a href="http://www.w3.org/2012/webcrypto/">Web <acronym title="Cryptography">Cryptography</acronym>
+      <acronym title="Working Group">WG</acronym></a> in the <acronym title="World Wide Web Consortium">W3C</acronym>
+      <a href="http://www.w3.org/Interaction/">Interaction Domain</a>.
+    </p>
+    <p>
+      Web content and browser developers are encouraged to review this draft. Please send comments to
+      <a href="mailto:[email protected]">[email protected]</a>, the <acronym title="World Wide Web Consortium">W3C</acronym>'s
+      public email list for issues related to Web <acronym title="Application Programming Interface">API</acronym>s.
+      <a href="http://lists.w3.org/Archives/Public/public-webcrypto/">Archives</a> of the
+      list are available.
+    </p>
+    <p>
+        This document is produced by the <a href="http://www.w3.org/2012/webcrypto/">Web Cryptography Working Group</a>, within
+        the W3C <a href="http://www.w3.org/Interaction/">Interaction Domain</a>.
+        Changes made to this document can be found in the
+        <a href="http://dev.w3.org/cvsweb/2006/webapi/FileAPI/Overview-UseCases.xml">W3C public CVS server</a>.
+    </p>
+      <p>
+          Publication as an Editor’s Draft does not imply endorsement by the
+          W3C Membership.  This is a draft document and may be updated, replaced
+          or obsoleted by other documents at any time. It is inappropriate to cite
+          this document as other than work in progress.
+        </p><p>
+      This document was produced by a group operating under the
+      <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February
+        2004 W3C Patent Policy</a>. W3C maintains a
+      <a href="http://www.w3.org/2004/01/pp-impl/42538/status">public list of
+        any patent disclosures</a> made in connection with the deliverables of
+      the group; that page also includes instructions for disclosing a patent.
+      An individual who has actual knowledge of a patent which the individual
+      believes contains
+      <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential
+        Claim(s)</a> must disclose the information in accordance with
+      <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section
+        6 of the W3C Patent Policy</a>.
+    </p>
+    </div>
+
+    <div id="toc">
+      <h2>Table of Contents</h2>
+      <div class="toc"><ul><li><a href="#introduction">1. Introduction</a></li><li><a href="#requirements">2. Requirements</a></li><li><a href="#scenarios">3. Use Case Scenarios</a><ul><li><a href="#banking-korea">3.1. Banking Transactions</a></li><li><a href="#video-service">3.2. Dr. What: Video Service</a></li><li><a href="#data-integrity">3.3. Code Sanctity and Bandwidth Saver</a></li><li><a href="#encrypt">3.4. Mitch Turns 21: Encrypted Communications</a></li><li><a href="#realtime-messaging">3.5. Off The Record Real Time Messaging</a></li><li><a href="#savemystuff">3.6. Documents In the Cloud</a></li></ul></li></ul></div>
+    </div>
+
+    <div id="sections">
+    <div id="introduction" class="section">
+    <h2>1. Introduction</h2>
+      <p>The Web Cryptography API describes a JavaScript API for basic cryptographic operations, including: hashing, signature generation and verification, encryption and decryption.  Additionally, it describes an API for applications to generate and/or manage the keying material necessary to perform these operations.  This document presents use cases in the form of scenarios, with each scenario describing a potential web application using the API.</p>
+    </div>
+    <div id="requirements" class="section">
+    <h2>2. Requirements</h2>
+    <p>This section presents required features of the Web Cryptography API; in many cases, the Web Cryptography API encompasses more than one algorithm and more than one mechanism to accomplish each of these features.  The section presents code names for each of the features.</p>
+    <ul>
+      <li><p><dfn id="hash">HASH</dfn>, the ability to perform a cryptographic hash, where an algorithm that takes an arbitrary block of data returns a fixed-size bit sequence, called the <dfn id="hash-value">hash value</dfn>, such that any change to the block of data changes the hash value.</p></li>
+      <li><p><dfn id="mac">MAC</dfn>, the ability to generate a <em>message authentication code</em>, using an algorithm</p></li>
+      <li><p><dfn id="sign">SIGN</dfn>, the ability to digitally sign a document, such that upon verification of the signature, the document's authenticity can be determined.  The term document in this context can refer to any kind of data used in web applications.</p></li>
+      <li><p><dfn id="verify">VERIFY</dfn>, the ability to verify a digitally signed document, as well as verify a MAC.</p></li>
+      <li><p><dfn id="encrypt">ENCRYPT</dfn>, the ability to encode a document using an encryption algorithm.  <dfn id="encrypt-pki">ENCRYPT-PKI</dfn> is a specific type of encryption involving PKI, and <dfn id="encrypt-sym">ENCRYPT-SYM</dfn> is a specific type of encryption using symmetric keys.</p></li> 
+      <li><p><dfn id="decrypt">DECRYPT</dfn>, the ability to decrypt a digitally signed document.  <dfn id="decrypt-pki">DECRYPT-PKI</dfn> is a specific type of decryption using PKI, and <dfn id="decrypt-sym">DECRYPT-SYM</dfn> is a specific type of decryption using symmetric keys.</p></li>
+      <li><p><dfn id="derive">DERIVE</dfn>, the ability to derive a key or keys used in cryptographic operations; <dfn id="derive-pki">DERIVE-PKI</dfn> is the ability to derive keys usable in PKI operations.</p></li>
+      <li><p><dfn id="keyexchange">KEYEX</dfn>, the ability for two entities to exchange key(s) without interception by a third party, with <dfn id="keyex-dh">KEYEX-DH</dfn> representing Diffie-Hellman key exchange, a particularly common application of safe key exchange.</p></li>
+      <li><p><dfn id="keycall">KEYCALL</dfn>, the ability to call a particular key from a web application that either generated the key or that is in the same domain as the key.</p></li>
+      <li><p><dfn id="PKI">-PKI</dfn>, an acronym for <dfn id="pki">Public Key Infrastructure</dfn> used in this document as a suffix to other features.</p></li>
+      <li><p><dfn id="SYM">-SYM</dfn>, an acronym for <dfn id="sym">Symmetric Key</dfn> operations, used in this document as a suffix to other features.</p></li>
+      <li><p><dfn id="random">RANDOM</dfn>, the ability to generate a random cryptographically secure number.</p></li>
+
+    </ul>  
+    </div>
+    <div id="scenarios" class="section">
+      <h2>3. Use Case Scenarios</h2>
+      <p>This section collates use case scenarios based on the requirements.</p>
+      <div id="banking-korea" class="section">
+      <h3>3.1. Banking Transactions</h3>
+      <p>Park Jae-sang opens up a bank account with Gangnam Bank (GB), and wishes to log-in and engage in online transactions, including account balance checking, online payments (with some automated scheduled payments), and account transfers between domestic and investment accounts.  The first time Park logs in to the GB website with a temporary verification code sent to his cell phone, the bank asks him to ascertain if the browser he is using is not at a kiosk; moreover, he is asked if it is a web browser and machine configuration he will use often.</p>
+      <p>He confirms that it is.  The GB web site then asks him to generate a public key/private key pair, along with a digital certificate.  Park consents, and the web page creates the key pair, storing his private key in the browser's designated key store, along with a one-time key escrow by the bank. [<a href="#derive">DERIVE</a> | <a href="#keyex-dh">KEYEX-DH</a>].</p>
+      <p>Subsequent access to the GB website is triggered via presentation of the key that Park generated when he first accessed the website [<a href="#keycall">KEYCALL</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#sign">??SIGN</a>].  His browser presents this key every time he accesses the website and enters his password, which effectively binds his username and password to the generated private key and certificate.  Additionally, Park can digitally sign online checks, authorize payments, and sign tax forms that he submits to the bank site using this generated key [<a href="#sign">SIGN</a>]. Park can also perform the following tasks:</p>
+      <ol>
+        <li><p>Park can receive documents from GB that only he can read.  These include his private bank statements and tax documents. [<a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#decrypt">DECRYPT</a>]</p></li>
+        <li><p>Park can submit documents to GB that only GB can read, with the assurance that these have come from Park.  Such documents include confidential financial information. [<a href="#encrypt-pki">ENCRYPT-PKI</a>]</p></li> 
+      </ol>
+    </div>
+    <div id="video-service" class="section">    
+      <h3>3.2. Dr. What: Video Service</h3>
+      <p>Virginie connects to her favorite video service to watch an episode of a show she is interested in using her entertainment device, which connects to the biggest screen in her living room.  The video service collects a monthly subscription fee and allows the watching of five streaming movies a month at that fee, and streams high definition content over an Internet connection.  Virginie does the following:</p>
+      <ol>
+        <li><p>She sets her device up to interact with the service.  Her device runs a user agent that meets the conformance criteria for the Web Cryptography API specification.  During the set up process, the entertainment device generates the keys it will use and exchanges them safely with the video service [<a href="#derive">DERIVE</a> | <a href="#derive-pki">DERIVE-PKI</a> | <a href="#keys-dh">KEYEX-DH</a>].</p></li>
+        <li><p>Subsequent access to the video service from her device is seamless, and it identifies her as Virginie, loading her preferences and her watch queue. [<a href="#keycall">KEYCALL</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#sign">??SIGN</a>].  She can access the service and browse videos to watch.</p></li> 
+        <li><p>She selects her favorite show -- Dr. What -- and picks an episode that she has not yet seen.  The service then determines that she is authorized to watch that video, and streams that video. [???] </p></li>
+        <li><p>Virginie rates the video so that the service understands her preferences.  Along with personalized data about Virginie, the device sends usage statistics and metrics back to the service [<a href="#mac">MAC</a> | <a href="#encrypt-sym">ENCRYPT-SYM</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>].</p></li>
+      </ol>
+    </div>
+    <div id="data-integrity" class="section">
+      <h3>3.3. Code Sanctity and Bandwidth Saver</h3>
+      <p>A major social networking site wishes to optimize website performance by storing JavaScript and other resources in local storage, preventing a needless server roundrip.  The social network site wishes to verify that these resources have not been tampered with; the service uses <a href="#localStorage"><code>localStorage</code></a> and <a href="#IndexedDB"><code>IndexedDB</code></a> to store assets for their web pages, notably JavaScript.  Their threat model is such that the social networking site implicitly trusts the HTTP connection (which uses TLS), the browser, and the HTTP cache, but cannot vouch for localStorage or IndexedDB.  Let us take the case of a couple who have gone from being "In a Relationship" to "It's Complicated."  John Doe uses the social networking site often, while Jane Doe, a JavaScript programmer, packs her bags to move out of the apartment.
+      <div class="example"><div class="exampleHeader">Example</div>
+      <p>This illustrates a worst case scenario, in which <code>localStorage</code> is compromised by a malicious user.  Normally, the social networking site deploys code of the sort below, which John Doe's browser runs everytime he logs into the social networking site.</p>
+      <div class="block"><div class="blockTitleDiv"><span class="blockTitle">ECMAScript</span></div><div class="blockContent"><pre class="code"><code class="es-code">
+      function init() {
+      var src = window.localStorage.getItem('src');
+      <span class="comment">// up until now env is safe</span>
+      if (src) {
+      <span class="comment">  // now whatever code was in src will be executed</span>
+        eval(src);
+      } else {
+        <span class="comment">// fetch the code using xhr, populate localStorage</span>
+        <span class="comment">// with it. Execute it.</span>
+      }
+    }
+      </code></pre></div></div>
+      <p>But at some point in time, a malicious user -- Jane Doe -- with access to the JavaScript console of John Doe's browser does something of the sort:</p>
+      <div class="block"><div class="blockTitleDiv"><span class="blockTitle">ECMAScript</span></div><div class="blockContent"><pre class="code"><code class="es-code"> 
+      window.localStorage.setItem('src', evil_code);
+      <span class="comment">// evil_code sends photos to Jane Doe's personal server.</span>
+      </code></pre></div></div>
+      <p>John Doe's use of the social network is thus compromised by Jane Doe's script injection, since the next time he logs in, and <code>init()</code> is called, <code>evil_code</code> is run, which may upload his private photos to Jane Doe's server.  To mitigate against situations like this, the social networking site might do something like this:</p>
+      <div class="block"><div class="blockTitleDiv"><span class="blockTitle">ECMAScript</span></div><div class="blockContent"><pre class="code"><code class="es-code">
+      <span class="comment">// Synchronously retrieve an MD5 hash of the pristine version of the code</span>
+      <span class="comment">// This is retrieved from the server</span>
+        var src_hash = getHashFromServer();
+        function init()
+        {
+          var src = window.localStorage.getItem('src');
+
+          <span class="comment">// validateSrc is an utility function that wraps the Crypto API</span>
+
+          validateSrc(src, src_hash, success, failFetch);
+
+          function success(){eval(src)};
+          function failFetch(){<span class="comment">//Fetch the code using XHR, and populate localStorage with it</span>};
+
+        }
+
+      </code></pre></div></div>
+      <p>In this case, <code>getHashFromServer()</code> is guaranteed to be untampered with, since it connects to the server or the HTTP cache, which are above suspicion.
+    </p>
+      </div>
+
+          [<a href="#hash">HASH</a> | <a href="#keycall">KEYCALL</a> |  <a href="#verify">VERIFY</a>]</p>
+  </div>
+   <div id="encrypt" class="section">
+    <h3>3.4. Mitch Turns 21: Encrypted Communications</h3>
+    <p>Mark wishes to post pictures of Mitch's 21st birthday party to a social network that allows confidential and encrypted communication between members, but wishes to ensure that these pictures are safe from prying eyes -- more importantly, he wants them to be indecipherable digital data for everyone except Mitch.  Mark can do the following: </p>
+    <ol>
+      <li><p>He can encrypt the photos with a key he generates for the occasion. [<a href="#derive">DERIVE</a> | <a href="#encrypt">ENCRYPT</a>]</p></li>
+      <li><p>He can communicate with others on the network about the key and share the encrypted photos. [<a href="#keyex">KEYEX</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>He can receive confidential communication from Mitch about the pictures via encrypted messages that are virtually impossible to read by any other entity than Mark. [<a href="#verify">VERIFY</a> | <a href="#decrypt-pki">DECRYPT-PKI</a>]</p></li>
+    </ol>
+   </div>
+  <div id="realtime-messaging" class="section">
+    <h3>3.5. Off The Record Real Time Messaging</h3>
+    <p>David and Nadim wish to have an "Off The Record" chat in real time, completely between them, and in text, including the ability to share digital data such as photographs.  They log on to a chat server that serves up web content, and connect to each other's machines directly.  The server merely serves up the chat client necessary, and does not log their conversation (and in fact cannot).  David and Nadim need to:</p>
+    <ul>
+      <li><p>Be assured that they are who they claim they are. [<a href="#decrypt">DECRYPT</a> | <a href="#decrypt-pki">DECRYPT-PKI</a> | <a href="#encrypt">ENCRYPT</a> | <a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>Be assured that during a conversation, messages sent back and forth are unmodified. [<a href="#random">RANDOM</a> | <a href="#encrypt">ENCRYPT</a> | <a href="#decrypt">DECRYPT</a>] </p></li>
+      <li><p>Be assured that after the conversation, the contents of the conversation cannot be determined. [???] </p></li>
+    </ul>
+
+  </div>
+  <div id="savemystuff" class="section">
+    <h3>3.6. Documents In the Cloud</h3>
+    <p>Vijay wishes to confidentially store certain documents, including photos, music, pages from the novel he is working on, and notes about his employer using a web service that he pays a monthly subscription to for such confidential storage.  He can drag and drop content from his laptop onto a web page of the service, and it automatically stores it in an encrypted manner.  Vijay can do the following:</p>
+    <ol>
+      <li><p>Log on to the service using his credentials; after the service determines that Vijay is using his primary browser, which he will use to access the service subsequently, it generates encryption keys. [<a href="#derive">DERIVE</a> | <a href="#derive-pki">DERIVE-PKI</a>] </p></li>
+      <li><p>Drag over content from his underlying file system that he wishes to store. [<a href="#encrypt-pki">ENCRYPT-PKI</a>] </p></li>
+      <li><p>Store that content on the server, with the assurance that it is stored there in a way that is virtually undecipherable to third-parties, including employees of the service in question.</p></li>
+      <li><p>Later, Vijay can retrieve the content, and save it back to his local file system. [<a href="#decrypt-pki">DECRYPT-PKI</a>] </p></li>
+    </ol>
+  </div>
+ </div>
+</div>
+  
+</body>
+</html>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/WebIDL.css	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,300 @@
+.nt, pre, .terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .xattr, .regex, .prod-number, .prod-lines, .prod-mid {
+  font-size: 14px;
+}
+pre code, .prod-lines .nt {
+  font-size: 14px !important;
+}
+.ednote, .terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .example, .note, blockquote {
+  background: #d9e8ff;
+}
+td code {
+  background: inherit;
+}
+.example blockquote {
+  background: #f0f6ff;
+}
+table.grammar {
+  background: #eee;
+}
+.ednote {
+  border-top: 3px solid red;
+  border-bottom: 3px solid red;
+  margin: 1em 2em;
+  padding: 0 1em 0 1em;
+  background: #f8eeee;
+}
+.ednoteHeader {
+  font-weight: bold;
+  display: block;
+  padding-top: 0.5em;
+}
+.toc ul li {
+  list-style-type: none;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.toc ul {
+  margin-bottom: 0.5em;
+}
+.terminal, code, .prop, .esstring, .javavalue, .idlident, .idlstring, .input {
+  font-family: /*Consolas, Monaco,*/ monospace !important;
+}
+pre.code code {
+  background: inherit;
+}
+.propattrset {
+}
+/*.prop {
+  font-family: Consolas, Monaco, monospace;
+}*/
+
+.xattr {
+  font-family: /*Consolas, Monaco,*/ monospace;
+}
+
+table { border-collapse:collapse; border-style:hidden hidden none hidden }
+table thead { border-bottom:solid }
+table tbody th:first-child { border-left:solid }
+table td, table th { border-left:solid; border-right:solid; border-bottom:solid thin; vertical-align:top; padding:0.2em }
+
+.nt, .prod-lines {
+  font-family: /*Consolas, Monaco,*/ monospace;
+  white-space: nowrap;
+}
+.idltype, .idlvalue {
+  font-weight: bold;
+}
+.idlop {
+  font-weight: bold;
+}
+.esvalue, .estype {
+  font-weight: bold;
+}
+.javatype, .javapkg {
+  font-weight: bold;
+}
+.regex {
+  font-family: /*Consolas, Monaco,*/ monospace;
+  white-space: nowrap;
+}
+.typevar {
+  font-style: italic;
+}
+.example, .note {
+  border-top: 3px solid #005a9c;
+  border-bottom: 3px solid #005a9c;
+  margin: 1em 2em;
+  padding: 0 1em 0 1em;
+}
+.exampleHeader, .noteHeader {
+  font-weight: bold;
+  display: block;
+  color: #005a9c;
+  color: black;
+  padding-top: 0.5em;
+}
+pre {
+  overflow: auto;
+  margin: 0;
+  font-family: /*Consolas, Monaco,*/ monospace;
+}
+pre.code {
+  padding: 0 1em;
+  margin: 0;
+  margin-bottom: 1em;
+}
+.block {
+  border: 1px solid #90b8de;
+  border-left: 3px double #90b8de;
+  border-left: none;
+  border-right: none;
+  background: #f0f6ff;
+  margin: 2em;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  padding: 0 0.5em;
+  padding-bottom: 0.5em;
+}
+.blockTitleDiv {
+  text-align: left;
+}
+.blockTitle {
+  position: relative;
+  top: -0.75em;
+  left: -1.5em;
+  /*border: 1px solid #90b8de;
+  border-left: none;
+  border-right: none;*/
+  background: #90b8de;
+  color: white;
+  padding: 0.25em 1em 0.25em 1em;
+  font-weight: bold;
+  font-size: 80%;
+}
+dfn {
+  font-weight: bold;
+  font-style: italic;
+}
+.dfnref {
+}
+li {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+ul > li {
+  list-style-type: disc;
+}
+.norm {
+  font-style: italic;
+}
+.rfc2119 {
+  text-transform: lowercase;
+  font-variant: small-caps;
+}
+dfn var {
+  font-style: normal;
+}
+blockquote {
+  padding: 1px 1em;
+  margin-left: 2em;
+  margin-right: 2em;
+}
+a.placeholder {
+  color: #00e;
+}
+dl.changes > dd {
+  margin-left: 0;
+}
+dd > :first-child {
+  margin-top: 0;
+}
+caption {
+  caption-side: bottom;
+  margin-top: 1em;
+  font-weight: bold;
+}
+body {
+  line-height: 1.3;
+}
[email protected] print {
+  .section-link {
+    display: none;
+  }
+}
+.section-link {
+  visibility: hidden;
+  width: 1px;
+  height: 1px;
+  overflow: visible;
+  font-size: 10pt;
+  font-style: normal;
+}
+.section-link a {
+  color: #666;
+  font-weight: bold;
+  text-decoration: none;
+}
+.section-link a:hover {
+  color: #c00;
+}
+.section > *:hover > .section-link {
+  visibility: visible;
+}
+div.set {
+  margin-left: 3em;
+  text-indent: -1em;
+}
+ol.algorithm ol {
+  border-left: 1px solid #90b8de;
+  margin-left: 1em;
+}
+dl.switch > dd > ol.only {
+  margin-left: 0;
+}
+dl.switch {
+  padding-left: 2em;
+}
+dl.switch > dt {
+  text-indent: -1.5em;
+  margin-top: 1em;
+}
+dl.switch > dt + dt {
+  margin-top: 0;
+}
+dl.switch > dt:before {
+  content: '\21AA';
+  padding: 0 0.5em 0 0;
+  display: inline-block;
+  width: 1em;
+  text-align: right;
+  line-height: 0.5em;
+}
+.diagram {
+  text-align: center;
+}
+iframe {
+  border: 0;
+}
+.ignore {
+  opacity: 0.5;
+}
+.comment {
+  color: #005a9c;
+}
+
+#distinguishable-table {
+  font-size: 80%;
+}
+#distinguishable-table td {
+  text-align: "●";
+}
+.matrix {
+  border-collapse: collapse;
+  margin-left: auto;
+  margin-right: auto;
+}
+.matrix th {
+  background: #d9e8ff;
+  text-align: right;
+}
+.matrix td, .matrix th {
+  border: 1px solid #90b8de;
+  padding: 4px;
+}
+.matrix th.corner {
+  border: 0;
+  background: none;
+}
+.matrix td {
+  text-align: center;
+  background: #f0f6ff;
+}
+.matrix .belowdiagonal {
+  background: #ddd;
+}
+
+ul.notes { font-size: 90%; padding-left: 0 }
+ul.notes li { list-style-type: none }
+ul.notes .note-link { vertical-align: super }
+.note-link { font-size: 90% }
+
+.code var { color: #f44; }
+
+/* For dfn.js */
+body.dfnEnabled dfn { cursor: pointer; }
+.dfnPanel {
+  display: inline;
+  position: absolute;
+  height: auto;
+  width: auto;
+  padding: 0.5em 0.75em;
+  font: small sans-serif;
+  background: #DDDDDD;
+  color: black;
+  border: outset 0.2em;
+  cursor: default;
+}
+.dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
+.dfnPanel :link, .dfnPanel :visited { color: black; }
+.dfnPanel p { font-weight: bolder; }
+.dfnPanel li { list-style-position: inside; }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/WebIDL.xsl	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,692 @@
+<xsl:stylesheet xmlns:xsl='http://www.w3.org/1999/XSL/Transform'
+                xmlns:h='http://www.w3.org/1999/xhtml'
+                xmlns:x='http://mcc.id.au/ns/local'
+                xmlns='http://www.w3.org/1999/xhtml'
+                exclude-result-prefixes='h x'
+                version='1.0' id='xslt'>
+
+  <xsl:output method='xml' encoding='UTF-8'
+              omit-xml-declaration='yes'
+              doctype-public='-//W3C//DTD XHTML 1.0 Transitional//EN'
+              doctype-system='http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'
+              media-type='application/xhtml+xml; charset=UTF-8'/>
+
+  <xsl:variable name='options' select='/*/h:head/x:options'/>
+  <xsl:variable name='id' select='/*/h:head/h:meta[@name="revision"]/@content'/>
+  <xsl:variable name='rev' select='substring-before(substring-after(substring-after($id, " "), " "), " ")'/>
+  <xsl:variable name='tocpi' select='//processing-instruction("toc")[1]'/>
+
+  <xsl:template match='/'>
+    <xsl:text>&#xa;</xsl:text>
+    <xsl:if test='$options/x:maturity="ED"'>
+      <xsl:comment>
+  Overview.html
+  Web IDL
+
+  Note: This file is generated from Overview.xml.  Run "make" to regenerate it.
+  </xsl:comment>
+      <xsl:text>&#xa;</xsl:text>
+    </xsl:if>
+    <xsl:apply-templates select='/*'/>
+  </xsl:template>
+
+  <xsl:template match='h:*'>
+    <xsl:element name="{name()}" namespace="{namespace-uri()}">
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <xsl:apply-templates select='node()'/>
+    </xsl:element>
+  </xsl:template>
+
+  <xsl:template match='h:head'>
+    <head>
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <xsl:apply-templates select='node()'/>
+      <xsl:choose>
+        <xsl:when test='$options/x:maturity="FPWD" or $options/x:maturity="LCWD" or $options/x:maturity="FPWDLC"'>
+          <link rel='stylesheet' href='http://www.w3.org/StyleSheets/TR/W3C-WD' type='text/css'/>
+        </xsl:when>
+        <xsl:otherwise>
+          <link rel='stylesheet' href='http://www.w3.org/StyleSheets/TR/W3C-{$options/x:maturity}' type='text/css'/>
+        </xsl:otherwise>
+      </xsl:choose>
+    </head>
+  </xsl:template>
+
+  <xsl:template match='h:span[@class="idltype"]'>
+    <xsl:variable name='id' select='concat("idl-", translate(., " ", "-"))'/>
+    <xsl:variable name='def' select='//*[@id=$id]'/>
+    <xsl:choose>
+      <xsl:when test='not(ancestor::h:a) and $def'>
+        <a class='idltype' href='#{$id}'><xsl:apply-templates select='node()'/></a>
+      </xsl:when>
+      <xsl:otherwise>
+        <span>
+          <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+          <xsl:apply-templates select='node()'/>
+        </span>
+      </xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template name='monthName'>
+    <xsl:param name='n' select='1'/>
+    <xsl:param name='s' select='"January February March April May June July August September October November December "'/>
+    <xsl:choose>
+      <xsl:when test='string(number($n))="NaN"'>@@</xsl:when>
+      <xsl:when test='$n = 1'>
+        <xsl:value-of select='substring-before($s, " ")'/>
+      </xsl:when>
+      <xsl:otherwise>
+        <xsl:call-template name='monthName'>
+          <xsl:with-param name='n' select='$n - 1'/>
+          <xsl:with-param name='s' select='substring-after($s, " ")'/>
+        </xsl:call-template>
+      </xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("top")'>
+    <div class='head'>
+      <div><a href="http://www.w3.org/"><img src="http://www.w3.org/Icons/w3c_home" width="72" height="48" alt="W3C"></img></a></div>
+      <h1><xsl:value-of select='/*/h:head/h:title'/></h1>
+      <h2>
+        <xsl:text>W3C </xsl:text>
+        <xsl:choose>
+          <xsl:when test='$options/x:maturity="WD" or $options/x:maturity="FPWD" or $options/x:maturity="LCWD" or $options/x:maturity="FPWDLC"'>Working Draft</xsl:when>
+          <xsl:when test='$options/x:maturity="CR"'>Candidate Recommendation</xsl:when>
+          <xsl:when test='$options/x:maturity="PR"'>Proposed Recommendation</xsl:when>
+          <xsl:when test='$options/x:maturity="PER"'>Proposed Edited Recommendation</xsl:when>
+          <xsl:when test='$options/x:maturity="REC"'>Recommendation</xsl:when>
+          <xsl:when test='$options/x:maturity="WG-NOTE"'>Working Group Note</xsl:when>
+          <xsl:otherwise>Editor’s Draft</xsl:otherwise>
+        </xsl:choose>
+        <xsl:text> </xsl:text>
+        <em><xsl:call-template name='date'/></em>
+      </h2>
+
+      <dl>
+        <xsl:choose>
+          <xsl:when test='$options/x:versions/x:cvs and $options/x:maturity="ED"'>
+            <dt>Latest Editor’s Draft:</dt>
+            <dd>
+              <xsl:variable name='href' select='$options/x:versions/x:cvs/@href'/>
+              <a href='{$href}'><xsl:value-of select='$href'/></a>
+            </dd>
+            <dt>Latest Published Version:</dt>
+            <xsl:if test='$options/x:versions/x:latest/@href != ""'>
+              <dd><a href='{$options/x:versions/x:latest/@href}'><xsl:value-of select='$options/x:versions/x:latest/@href'/></a></dd>
+            </xsl:if>
+          </xsl:when>
+          <xsl:otherwise>
+            <dt>This Version:</dt>
+            <dd>
+              <a href='{$options/x:versions/x:this/@href}'><xsl:value-of select='$options/x:versions/x:this/@href'/></a>
+            </dd>
+            <dt>Latest Published Version:</dt>
+            <xsl:if test='$options/x:versions/x:latest/@href != ""'>
+              <dd><a href='{$options/x:versions/x:latest/@href}'><xsl:value-of select='$options/x:versions/x:latest/@href'/></a></dd>
+            <dt>Latest Editor’s Draft:</dt>
+            <dd>
+              <xsl:variable name='href' select='$options/x:versions/x:cvs/@href'/>
+              <a href='{$href}'><xsl:value-of select='$href'/></a>
+            </dd>  
+            </xsl:if>
+          </xsl:otherwise>
+        </xsl:choose>
+        <xsl:if test='$options/x:versions/x:previous[@href!=""]'>
+          <dt>Previous Version(s)<xsl:if test='count($options/x:versions/x:previous[@href!=""]) > 1'>s</xsl:if>:</dt>
+          <xsl:if test='$options/x:versions/x:previous/@href != ""'>
+            <xsl:for-each select='$options/x:versions/x:previous/@href'>
+              <dd><a href='{$options/x:versions/x:previous/@href}'><xsl:value-of select='$options/x:versions/x:previous/@href'/></a></dd>
+            </xsl:for-each>
+          </xsl:if>
+        </xsl:if>
+        <dt>Editor<xsl:if test='count($options/x:editors/x:person) &gt; 1'>s</xsl:if>:</dt>
+        <xsl:for-each select='$options/x:editors/x:person'>
+          <dd>
+            <xsl:choose>
+              <xsl:when test='@homepage'>
+                <a href='{@homepage}'><xsl:value-of select='x:name'/></a>
+              </xsl:when>
+              <xsl:otherwise>
+                <xsl:value-of select='x:name'/>
+              </xsl:otherwise>
+            </xsl:choose>
+            <xsl:if test='x:affiliation'>
+              <xsl:text>, </xsl:text>
+              <xsl:choose>
+                <xsl:when test='x:affiliation/@homepage'>
+                  <a href='{x:affiliation/@homepage}'><xsl:value-of select='x:affiliation'/></a>
+                </xsl:when>
+                <xsl:otherwise>
+                  <xsl:value-of select='x:affiliation'/>
+                </xsl:otherwise>
+              </xsl:choose>
+            </xsl:if>
+            <xsl:if test='@email'>
+              <xsl:text> &lt;</xsl:text>
+              <xsl:value-of select='@email'/>
+              <xsl:text>&gt;</xsl:text>
+            </xsl:if>
+          </dd>
+        </xsl:for-each>
+        <dt>Participate:</dt>
+         <dd><xsl:if test='$options/x:participate[@qual="STND"]'><p>Send feedback to <a href="mailto:[email protected]?subject=%5BFileAPI%5D">[email protected]</a> (<a href="http://lists.w3.org/Archives/Public/public-webapps/">archives</a>), or <a href="https://www.w3.org/Bugs/Public/enter_bug.cgi?product=WebAppsWG&amp;component=File%20API">file a bug</a> 
+    (see <a href="https://www.w3.org/Bugs/Public/buglist.cgi?product=WebAppsWG&amp;component=File%20API&amp;resolution=---">existing bugs</a>).</p></xsl:if></dd>
+      </dl>
+      <p class="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a><xsl:text disable-output-escaping='yes'> &amp;copy; </xsl:text><xsl:value-of select='concat(substring($options/x:versions/x:this/@href, string-length($options/x:versions/x:this/@href) - 8, 4), " ")'/><a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup><xsl:text disable-output-escaping='yes'>&amp;reg;</xsl:text></sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.org/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></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> and <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply.</p>
+    </div>
+    <hr/>
+  </xsl:template>
+
+  <xsl:template name='date'>
+    <xsl:variable name='date'>
+      <xsl:choose>
+        <xsl:when test='$options/x:maturity="ED"'>
+          <xsl:value-of select='translate(substring-before(substring-after(substring-after(substring-after($id, " "), " "), " "), " "), "/", "")'/>
+        </xsl:when>
+        <xsl:otherwise>
+          <xsl:value-of select='substring($options/x:versions/x:this/@href, string-length($options/x:versions/x:this/@href) - 8, 8)'/>
+        </xsl:otherwise>
+      </xsl:choose>
+    </xsl:variable>
+    <xsl:value-of select='number(substring($date, 7))'/>
+    <xsl:text> </xsl:text>
+    <xsl:call-template name='monthName'>
+      <xsl:with-param name='n' select='number(substring($date, 5, 2))'/>
+    </xsl:call-template>
+    <xsl:text> </xsl:text>
+    <xsl:value-of select='substring($date, 1, 4)'/>
+  </xsl:template>
+
+  <xsl:template name='maturity'>
+    <xsl:choose>
+      <xsl:when test='$options/x:maturity="FPWD"'>First Public Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="LCWD"'>Last Call Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="FPWDLC"'>First Public Working Draft and Last Call Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="WD"'>Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="CR"'>Candidate Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="PR"'>Proposed Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="PER"'>Proposed Edited Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="REC"'>Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="WG-NOTE"'>Working Group Note</xsl:when>
+      <xsl:otherwise>Editor’s Draft</xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template name='maturity-short'>
+    <xsl:choose>
+      <xsl:when test='$options/x:maturity="FPWD"'>a Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="LCWD"'>a Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="FPWDLC"'>a Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="WD"'>a Working Draft</xsl:when>
+      <xsl:when test='$options/x:maturity="CR"'>a Candidate Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="PR"'>a Proposed Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="PER"'>a Proposed Edited Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="REC"'>a Recommendation</xsl:when>
+      <xsl:when test='$options/x:maturity="WG-NOTE"'>a Working Group Note</xsl:when>
+      <xsl:otherwise>an Editor’s Draft</xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("sotd-top")'>
+    <xsl:variable name='mail' select='substring-before(., " ")'/>
+    <xsl:variable name='temp' select='substring-after(., " ")'/>
+    <xsl:variable name='archive'>
+      <xsl:choose>
+        <xsl:when test='contains($temp, " ")'><xsl:value-of select='substring-before($temp, " ")'/></xsl:when>
+        <xsl:otherwise><xsl:value-of select='$temp'/></xsl:otherwise>
+      </xsl:choose>
+    </xsl:variable>
+    <xsl:variable name='prefix'><xsl:if test='contains($temp, " ")'><xsl:value-of select='substring-after($temp, " ")'/></xsl:if></xsl:variable>
+    <p>
+      <em>
+        This section describes the status of this document at the time of
+        its publication.  Other documents may supersede this document. A list
+        of current W3C publications and the latest revision of this technical
+        report can be found in the <a href="http://www.w3.org/TR/">W3C technical
+          reports index</a> at http://www.w3.org/TR/.
+      </em>
+    </p>
+    <p>
+      <xsl:if test='$options/x:maturity!="REC" and $options/x:maturity!="WG-NOTE"'>
+        This document is the <xsl:call-template name='date'/><xsl:text> </xsl:text>
+        <b><xsl:call-template name='maturity'/></b> of the
+        <cite><xsl:value-of select='/*/h:head/h:title'/></cite> specification.
+      </xsl:if>
+      Please send comments about this document to
+      <a href='mailto:{$mail}'><xsl:value-of select='$mail'/></a>
+      (<a href='{$archive}'>archived</a>)<xsl:if test='$prefix != ""'>
+      with “<xsl:value-of select='$prefix'/>” at the start of the subject line</xsl:if>.
+    </p>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("sotd-bottom")'>
+    <xsl:variable name='ipp' select='.'/>
+    <p>
+      <xsl:choose>
+        <xsl:when test='$options/x:maturity="REC"'>
+          This document has been reviewed by W3C Members, by software developers,
+          and by other W3C groups and interested parties, and is endorsed by the
+          Director as a W3C Recommendation. It is a stable document and may be
+          used as reference material or cited from another document. W3C’s role
+          in making the Recommendation is to draw attention to the specification
+          and to promote its widespread deployment. This enhances the
+          functionality and interoperability of the Web.
+        </xsl:when>
+        <xsl:otherwise>
+          Publication as <xsl:call-template name='maturity-short'/> does not imply endorsement by the
+          W3C Membership.  This is a draft document and may be updated, replaced
+          or obsoleted by other documents at any time. It is inappropriate to cite
+          this document as other than work in progress.
+        </xsl:otherwise>
+      </xsl:choose>
+    </p>
+    <p>
+      This document was produced by a group operating under the
+      <a href='http://www.w3.org/Consortium/Patent-Policy-20040205/'>5 February
+        2004 W3C Patent Policy</a>. W3C maintains a
+      <a href='{$ipp}'>public list of
+        any patent disclosures</a> made in connection with the deliverables of
+      the group; that page also includes instructions for disclosing a patent.
+      An individual who has actual knowledge of a patent which the individual
+      believes contains
+      <a href='http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential'>Essential
+        Claim(s)</a> must disclose the information in accordance with
+      <a href='http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure'>section
+        6 of the W3C Patent Policy</a>.
+    </p>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("productions")'>
+    <xsl:variable name='id' select='substring-before(., " ")'/>
+    <xsl:variable name='names' select='concat(" ", substring-after(., " "), " ")'/>
+    <table class='grammar'>
+      <xsl:apply-templates select='//*[@id=$id]/x:prod[contains($names, concat(" ", @nt, " "))]' mode='def'/>
+    </table>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("toc")'>
+    <xsl:variable name='sectionsID' select='substring-before(., " ")'/>
+    <xsl:variable name='appendicesID' select='substring-after(., " ")'/>
+
+    <div class='toc'>
+      <xsl:for-each select='//*[@id=$sectionsID]'>
+        <xsl:call-template name='toc1'/>
+      </xsl:for-each>
+      <xsl:for-each select='//*[@id=$appendicesID]'>
+        <xsl:call-template name='toc1'>
+          <xsl:with-param name='alpha' select='true()'/>
+        </xsl:call-template>
+      </xsl:for-each>
+    </div>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("sref")'>
+    <xsl:variable name='id' select='string(.)'/>
+    <xsl:variable name='s' select='//*[@id=$id]/self::h:div[@class="section"]'/>
+    <xsl:choose>
+      <xsl:when test='$s'>
+        <xsl:call-template name='section-number'>
+          <xsl:with-param name='section' select='$s'/>
+        </xsl:call-template>
+      </xsl:when>
+      <xsl:otherwise>@@</xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("sdir")'>
+    <xsl:variable name='id' select='string(.)'/>
+    <xsl:choose>
+      <xsl:when test='preceding::h:div[@id=$id][@class="section"]'>above</xsl:when>
+      <xsl:when test='following::h:div[@id=$id][@class="section"]'>below</xsl:when>
+      <xsl:otherwise>@@</xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("revision-note")'>
+    <xsl:if test='$options/x:maturity="ED"'>
+      <div class='ednote'>
+        <div class='ednoteHeader'>Editorial note</div>
+        <p>This is revision <xsl:value-of select='$id'/>.</p>
+        <xsl:variable name='n' select='count(//h:div[@class="ednote"])'/>
+        <xsl:if test='$n'>
+          <p>There are <xsl:value-of select='$n'/> further editorial notes in the document.</p>
+        </xsl:if>
+      </div>
+    </xsl:if>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction("stepref")'>
+    <xsl:variable name='step' select='string(.)'/>
+    <xsl:variable name='li' select='ancestor::*[@class="algorithm"]/*[@x:step=$step]'/>
+    <xsl:choose>
+      <xsl:when test='$li'>
+        <xsl:value-of select='count($li/preceding-sibling::*) + 1'/>
+      </xsl:when>
+      <xsl:otherwise>@@</xsl:otherwise>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='processing-instruction()|comment()'/>
+
+  <xsl:template name='toc1'>
+    <xsl:param name='prefix'/>
+    <xsl:param name='alpha'/>
+
+    <xsl:variable name='subsections' select='h:div[@class="section"]'/>
+    <xsl:if test='$subsections'>
+      <ul>
+        <xsl:for-each select='h:div[@class="section"]'>
+          <xsl:variable name='number'>
+            <xsl:value-of select='$prefix'/>
+            <xsl:if test='$prefix'>.</xsl:if>
+            <xsl:choose>
+              <xsl:when test='$alpha'><xsl:number value='position()' format='A'/></xsl:when>
+              <xsl:otherwise><xsl:value-of select='position()'/></xsl:otherwise>
+            </xsl:choose>
+          </xsl:variable>
+          <xsl:variable name='frag'>
+            <xsl:choose>
+              <xsl:when test='@id'><xsl:value-of select='@id'/></xsl:when>
+              <xsl:otherwise><xsl:value-of select='generate-id(.)'/></xsl:otherwise>
+            </xsl:choose>
+          </xsl:variable>
+          <li>
+            <a href='#{$frag}'>
+              <xsl:value-of select='$number'/>
+              <xsl:text>. </xsl:text>
+              <xsl:for-each select='h:h2|h:h3|h:h4|h:h5|h:h6'>
+                <xsl:call-template name='toc-entry-name'/>
+              </xsl:for-each>
+            </a>
+            <xsl:call-template name='toc1'>
+              <xsl:with-param name='prefix' select='$number'/>
+            </xsl:call-template>
+          </li>
+        </xsl:for-each>
+      </ul>
+    </xsl:if>
+  </xsl:template>
+
+  <xsl:template name='toc-entry-name'>
+    <xsl:for-each select='node()'>
+      <xsl:choose>
+        <xsl:when test='self::h:var'>
+          <var>
+            <xsl:value-of select='.'/>
+          </var>
+        </xsl:when>
+        <xsl:otherwise>
+          <xsl:value-of select='.'/>
+        </xsl:otherwise>
+      </xsl:choose>
+    </xsl:for-each>
+  </xsl:template>
+
+  <xsl:template name='section-number'>
+    <xsl:param name='section'/>
+    <xsl:variable name='sections' select='//*[@id=substring-before($tocpi, " ")]'/>
+    <xsl:variable name='appendices' select='//*[@id=substring-after($tocpi, " ")]'/>
+    <xsl:choose>
+      <xsl:when test='$section/ancestor::* = $sections'>
+        <xsl:for-each select='$section/ancestor-or-self::h:div[@class="section"]'>
+          <xsl:value-of select='count(preceding-sibling::h:div[@class="section"]) + 1'/>
+          <xsl:if test='position() != last()'>
+            <xsl:text>.</xsl:text>
+          </xsl:if>
+        </xsl:for-each>
+      </xsl:when>
+      <xsl:when test='$section/ancestor::* = $appendices'>
+        <xsl:for-each select='$section/ancestor-or-self::h:div[@class="section"]'>
+          <xsl:choose>
+            <xsl:when test='position()=1'>
+              <xsl:number value='count(preceding-sibling::h:div[@class="section"]) + 1' format='A'/>
+            </xsl:when>
+            <xsl:otherwise>
+              <xsl:value-of select='count(preceding-sibling::h:div[@class="section"]) + 1'/>
+            </xsl:otherwise>
+          </xsl:choose>
+          <xsl:if test='position() != last()'>
+            <xsl:text>.</xsl:text>
+          </xsl:if>
+        </xsl:for-each>
+      </xsl:when>
+    </xsl:choose>
+  </xsl:template>
+
+  <xsl:template match='h:div[@class="section"]/h:h2 | h:div[@class="section"]/h:h3 | h:div[@class="section"]/h:h4 | h:div[@class="section"]/h:h5 | h:div[@class="section"]/h:h6'>
+    <xsl:element name="{name()}" namespace="{namespace-uri()}">
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <xsl:if test='$tocpi'>
+        <xsl:variable name='num'>
+          <xsl:call-template name='section-number'>
+            <xsl:with-param name='section' select='..'/>
+          </xsl:call-template>
+        </xsl:variable>
+        <xsl:if test='$num != ""'>
+          <xsl:value-of select='$num'/>
+          <xsl:text>. </xsl:text>
+        </xsl:if>
+      </xsl:if>
+      <xsl:apply-templates select='node()'/>
+    </xsl:element>
+  </xsl:template>
+
+  <xsl:template match='h:div[@class="ednote"]'>
+    <div>
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <div class='ednoteHeader'>Editorial note</div>
+      <xsl:apply-templates select='node()'/>
+    </div>
+  </xsl:template>
+
+  <xsl:template match='h:div[@class="example"]'>
+    <div>
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <div class='exampleHeader'>Example</div>
+      <xsl:apply-templates select='node()'/>
+    </div>
+  </xsl:template>
+
+  <xsl:template match='h:div[@class="note"]'>
+    <div>
+      <xsl:copy-of select='@*[namespace-uri()="" or namespace-uri="http://www.w3.org/XML/1998/namespace"]'/>
+      <div class='noteHeader'>Note</div>
+      <xsl:apply-templates select='node()'/>
+    </div>
+  </xsl:template>
+
+  <!--
+  <xsl:template match='h:tr'>
+    <xsl:copy>
+      <xsl:attribute name='class'>
+        <xsl:value-of select='@class'/>
+        <xsl:if test='@class'><xsl:text> </xsl:text></xsl:if>
+        <xsl:choose>
+          <xsl:when test='count(preceding-sibling::h:tr) mod 2 = 0'>odd</xsl:when>
+          <xsl:otherwise>even</xsl:otherwise>
+        </xsl:choose>
+      </xsl:attribute>
+      <xsl:copy-of select='node()[not(self::class)]'/>
+    </xsl:copy>
+  </xsl:template>
+  -->
+
+  <xsl:template match='x:codeblock'>
+    <div class='block'>
+      <div class='blockTitleDiv'>
+        <span class='blockTitle'>
+          <xsl:choose>
+            <xsl:when test='@language="idl"'>IDL</xsl:when>
+            <xsl:when test='@language="es"'>ECMAScript</xsl:when>
+            <xsl:when test='@language="java"'>Java</xsl:when>
+            <xsl:when test='@language="c"'>C</xsl:when>
+            <xsl:when test='@language="abnf"'>ABNF</xsl:when>
+            <xsl:when test='@language="headers"'>HEADERS</xsl:when>
+            <xsl:otherwise>@@</xsl:otherwise>
+          </xsl:choose>
+        </span>
+      </div>
+      <div class='blockContent'>
+        <pre class='code'><code class='{@language}-code'><xsl:apply-templates select='node()'/></code></pre>
+      </div>
+    </div>
+  </xsl:template>
+
+  <xsl:template match='x:grammar'>
+    <table class='grammar'>
+      <xsl:apply-templates select='x:prod'/>
+    </table>
+  </xsl:template>
+
+  <xsl:template match='x:prod' mode='def'>
+    <tr id='proddef-{@nt}'>
+      <td><span class='prod-number'>[<xsl:value-of select='count(preceding-sibling::x:prod) + 1'/>]</span></td>
+      <td>
+        <a class='nt' href='#prod-{@nt}'><xsl:value-of select='@nt'/></a>
+        <xsl:if test='@whitespace="explicit"'>
+          <sub class='nt-attr'>explicit</sub>
+        </xsl:if>
+      </td>
+      <td class='prod-mid'>→</td>
+      <td class='prod-rhs'>
+        <span class='prod-lines'>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='string(.)'/>
+          </xsl:call-template>
+        </span>
+      </td>
+    </tr>
+  </xsl:template>
+
+  <xsl:template match='x:prod'>
+    <tr id='prod-{@nt}'>
+      <td><span class='prod-number'>[<xsl:value-of select='count(preceding-sibling::x:prod) + 1'/>]</span></td>
+      <td>
+        <a class='nt' href='#proddef-{@nt}'><xsl:value-of select='@nt'/></a>
+        <xsl:if test='@whitespace="explicit"'>
+          <sub class='nt-attr'>explicit</sub>
+        </xsl:if>
+      </td>
+      <td class='prod-mid'>→</td>
+      <td class='prod-rhs'>
+        <span class='prod-lines'>
+            <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='string(.)'/>
+          </xsl:call-template>
+        </span>
+      </td>
+    </tr>
+  </xsl:template>
+
+  <xsl:template name='bnf'>
+    <xsl:param name='s'/>
+    <xsl:param name='mode' select='0'/>
+    <xsl:if test='$s != ""'>
+      <xsl:variable name='c' select='substring($s, 1, 1)'/>
+      <xsl:choose>
+        <xsl:when test='$mode = 0 and contains("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", $c)'>
+          <xsl:variable name='nt'>
+            <xsl:value-of select='$c'/>
+            <xsl:call-template name='bnf-nt'>
+              <xsl:with-param name='s' select='substring($s, 2)'/>
+            </xsl:call-template>
+          </xsl:variable>
+          <a class='nt' href='#prod-{$nt}'><xsl:value-of select='$nt'/></a>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='substring($s, string-length($nt) + 1)'/>
+          </xsl:call-template>
+        </xsl:when>
+        <xsl:when test='$mode = 0 and $c = "|"'>
+          <!--div class='prod-line-subsequent'--><br/> |
+            <xsl:call-template name='bnf'>
+              <xsl:with-param name='s' select='substring($s, 2)'/>
+            </xsl:call-template>
+          <!--/div-->
+        </xsl:when>
+        <xsl:when test='$c = &#39;"&#39;'>
+          <xsl:value-of select='$c'/>
+          <xsl:variable name='newMode'>
+            <xsl:choose>
+              <xsl:when test='$mode = 1'>0</xsl:when>
+              <xsl:otherwise>1</xsl:otherwise>
+            </xsl:choose>
+          </xsl:variable>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='substring($s, 2)'/>
+            <xsl:with-param name='mode' select='$newMode'/>
+          </xsl:call-template>
+        </xsl:when>
+        <xsl:when test="$c = &#34;'&#34;">
+          <xsl:value-of select='$c'/>
+          <xsl:variable name='newMode'>
+            <xsl:choose>
+              <xsl:when test='$mode = 2'>0</xsl:when>
+              <xsl:otherwise>2</xsl:otherwise>
+            </xsl:choose>
+          </xsl:variable>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='substring($s, 2)'/>
+            <xsl:with-param name='mode' select='$newMode'/>
+          </xsl:call-template>
+        </xsl:when>
+        <xsl:when test="$c = '[' and $mode = 0">
+          <xsl:value-of select='$c'/>
+          <xsl:choose>
+            <xsl:when test='substring($s, 2, 1) = "]"'>
+              <xsl:text>]</xsl:text>
+              <xsl:call-template name='bnf'>
+                <xsl:with-param name='s' select='substring($s, 3)'/>
+              </xsl:call-template>
+            </xsl:when>
+            <xsl:otherwise>
+              <xsl:variable name='newMode'>
+                <xsl:choose>
+                  <xsl:when test='$mode = 3'>0</xsl:when>
+                  <xsl:otherwise>3</xsl:otherwise>
+                </xsl:choose>
+              </xsl:variable>
+              <xsl:call-template name='bnf'>
+                <xsl:with-param name='s' select='substring($s, 2)'/>
+                <xsl:with-param name='mode' select='$newMode'/>
+              </xsl:call-template>
+            </xsl:otherwise>
+          </xsl:choose>
+        </xsl:when>
+        <xsl:when test="$c = ']' and $mode = 3">
+          <xsl:value-of select='$c'/>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='substring($s, 2)'/>
+          </xsl:call-template>
+        </xsl:when>
+        <xsl:otherwise>
+          <xsl:value-of select='$c'/>
+          <xsl:call-template name='bnf'>
+            <xsl:with-param name='s' select='substring($s, 2)'/>
+            <xsl:with-param name='mode' select='$mode'/>
+          </xsl:call-template>
+        </xsl:otherwise>
+      </xsl:choose>
+    </xsl:if>
+  </xsl:template>
+
+  <xsl:template name='bnf-nt'>
+    <xsl:param name='s'/>
+    <xsl:if test='$s != ""'>
+      <xsl:variable name='c' select='substring($s, 1, 1)'/>
+      <xsl:if test='contains("0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ_abcdefghijklmnopqrstuvwxyz", $c)'>
+        <xsl:value-of select='$c'/>
+        <xsl:call-template name='bnf-nt'>
+          <xsl:with-param name='s' select='substring($s, 2)'/>
+        </xsl:call-template>
+      </xsl:if>
+    </xsl:if>
+  </xsl:template>
+
+  <xsl:template match='*'/>
+
+  <xsl:template match='comment()'>
+    <xsl:copy/>
+  </xsl:template>
+</xsl:stylesheet>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/dfn.js	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,129 @@
+/*
+ * Taken from http://www.whatwg.org/specs/web-apps/current-work/dfn.js
+ * as of Wed Dec 10 13:08:00 Australia/Melbourne 2008.
+ *
+ * With modifications to make it work with the Web IDL section structure.
+ */
+
+// dfn.js
+// makes <dfn> elements link back to all uses of the term
+// no copyright is asserted on this file
+
+var dfnMapTarget = -1;
+var dfnMapDone = 0;
+var dfnMap = {};
+document.addEventListener('DOMContentLoaded', function (event) {
+  var links = [];
+  dfnMapTarget = document.links.length;
+  for (var i = 0; i < dfnMapTarget; i += 1)
+    links[i] = document.links[i];
+  var inc = 100;
+  for (var i = 0; i < dfnMapTarget; i += inc) {
+    setTimeout(function (j) {
+      for (var k = j; k < j+inc && k < dfnMapTarget; k += 1) {
+        if (links[k].href.indexOf('#') >= 0) {
+          if (links[k].className != "no-backref" &&
+              links[k].parentNode.className != "no-backref") {
+            var s = links[k].href.substr(links[k].href.indexOf('#') + 1);
+            if (!(s in dfnMap))
+              dfnMap[s] = [];
+            dfnMap[s].push(links[k]);
+          }
+        }
+        dfnMapDone += 1;
+      }
+    }, 0, i);
+  }
+  document.body.className += " dfnEnabled";
+}, false);
+
+var dfnPanel;
+var dfnUniqueId = 0;
+var dfnTimeout;
+document.addEventListener('click', dfnShow, false);
+function dfnShow(event) {
+  if (dfnTimeout) {
+    clearTimeout(dfnTimeout);
+    dfnTimeout = null;
+  }
+  if (dfnPanel) {
+    dfnPanel.parentNode.removeChild(dfnPanel);
+    dfnPanel = null;
+  }
+  if (dfnMapDone == dfnMapTarget) {
+    var node = event.target;
+    while (node && (node.nodeType != event.target.ELEMENT_NODE || node.tagName != "DFN"))
+      node = node.parentNode;
+    if (node) {
+      var panel = document.createElement('div');
+      panel.className = 'dfnPanel';
+      if (node.id) {
+        var permalinkP = document.createElement('p');
+        var permalinkA = document.createElement('a');
+        permalinkA.href = '#' + node.id;
+        permalinkA.textContent = '#' + node.id;
+        permalinkP.appendChild(permalinkA);
+        panel.appendChild(permalinkP);
+      }
+      var p = document.createElement('p');
+      panel.appendChild(p);
+      if (node.id in dfnMap || node.parentNode.id in dfnMap) {
+        p.textContent = 'Referenced in:';
+        var ul = document.createElement('ul');
+        var lastHeader;
+        var lastLi;
+        var n;
+        var sourceLinks = [];
+        if (node.id in dfnMap)
+          for (var i = 0; i < dfnMap[node.id].length; i += 1)
+            sourceLinks.push(dfnMap[node.id][i]);
+        if (node.parentNode.id in dfnMap)
+          for (var i = 0; i < dfnMap[node.parentNode.id].length; i += 1)
+            sourceLinks.push(dfnMap[node.parentNode.id][i]);
+        for (var i = 0; i < sourceLinks.length; i += 1) {
+          var link = sourceLinks[i];
+          var header = dfnGetCaption(link);
+          var a = document.createElement('a');
+          if (!link.id)
+            link.id = 'dfnReturnLink-' + dfnUniqueId++;
+          a.href = '#' + link.id;
+          if (header != lastHeader) {
+            lastHeader = header;
+            n = 1;
+            var li = document.createElement('li');
+            var cloneHeader = header.cloneNode(true);
+            while (cloneHeader.hasChildNodes())
+              if (cloneHeader.firstChild.className == 'section-link')
+                cloneHeader.removeChild(cloneHeader.firstChild);
+              else
+                a.appendChild(cloneHeader.firstChild);
+            lastLi = li;
+            li.appendChild(a);
+            ul.appendChild(li);
+          } else {
+            n += 1;
+            a.appendChild(document.createTextNode('(' + n + ')'));
+            lastLi.appendChild(document.createTextNode(' '));
+            lastLi.appendChild(a);
+          }
+        }
+        panel.appendChild(ul);
+      } else {
+        p.textContent = 'No references in this file.';
+      }
+      node.appendChild(panel);
+      dfnPanel = panel;
+    }
+  } else {
+    dfnTimeout = setTimeout(dfnShow, 250, event);
+  }
+}
+
+function dfnGetCaption(link) {
+  var node = link;
+  while (node && !(node.parentNode.tagName == "DIV" && node.parentNode.className == "section"))
+    node = node.parentNode;
+  while (node && (node.nodeType != node.ELEMENT_NODE || !node.tagName.match(/^H[1-6]$/)))
+    node = node.previousSibling;
+  return node;
+}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/section-links.js	Fri Nov 30 11:52:12 2012 -0500
@@ -0,0 +1,21 @@
+document.addEventListener('DOMContentLoaded', function(event) {
+  function f(n) {
+    if (n.nodeType == 1 && n.tagName.match(/^H[1-6]$/)) {
+      var span = document.createElement('span');
+      span.className = 'section-link';
+      span.textContent = '\xa0';
+      var a = document.createElement('a');
+      a.href = '#' + n.parentNode.id;
+      a.textContent = '\xb6';
+      span.appendChild(a);
+      n.appendChild(span);
+    } else {
+      n = n.firstChild;
+      while (n) {
+        f(n);
+        n = n.nextSibling;
+      }
+    }
+  }
+  f(document.getElementById('sections'));
+}, false);