From: Nigel Metheringham <nigel.metheringham@jrtheatre.co.uk>
Date: Thu, 28 Jun 2012 11:17:55 +0000 (+0100)
Subject: Move static files into separate staticroot directory
X-Git-Tag: exim-4_89_1~46
X-Git-Url: https://git.exim.org/exim-website.git/commitdiff_plain/b0968890317ffaab0352f6278340d310aacfdc54

Move static files into separate staticroot directory

This is a step on the way to making it possible to generate
documentation for a single version without the website but
with attached js/images
---

diff --git a/script/gen.pl b/script/gen.pl
index debd301..6febf7f 100755
--- a/script/gen.pl
+++ b/script/gen.pl
@@ -20,11 +20,16 @@ my $canonical_url = 'http://www.exim.org/';
 ## Parse arguments
 my %opt = parse_arguments();
 
+## setup static root location
+## TODO: for doc generation only this should be within the docs dir
+$opt{staticroot} = File::Spec->catdir( $opt{docroot}, 'static' );
+
 ## Generate the pages
 my %cache;    # General cache object
 do_doc( 'spec',   $_ ) foreach @{ $opt{spec}   || [] };
 do_doc( 'filter', $_ ) foreach @{ $opt{filter} || [] };
 do_web() if ( $opt{web} );
+do_static();    # need this for all other pages generated
 
 ## Add the exim-html-current symlink
 print "Symlinking exim-html-current to exim-html-$opt{latest}\n" if ( $opt{verbose} );
@@ -32,67 +37,90 @@ unlink("$opt{docroot}/exim-html-current") if ( -l "$opt{docroot}/exim-html-curre
 symlink( "exim-html-$opt{latest}", "$opt{docroot}/exim-html-current" )
     || die "symlink to $opt{docroot}/exim-html-current failed";
 
+# ------------------------------------------------------------------
 ## Generate the website files
 sub do_web {
 
+    ## copy these templates to docroot...
+    copy_transform_files( "$opt{tmpl}/web", $opt{docroot}, 0 );
+}
+
+# ------------------------------------------------------------------
+## Generate the static file set
+sub do_static {
+
+    ## make sure I have a directory
+    mkdir( $opt{staticroot} ) or die "Unable to make staticroot: $!\n" unless ( -d $opt{staticroot} );
+
+    ## copy these templates to docroot...
+    copy_transform_files( "$opt{tmpl}/static", $opt{staticroot}, 1 );
+}
+
+# ------------------------------------------------------------------
+## Generate the website files
+sub copy_transform_files {
+    my $source = shift;
+    my $target = shift;
+    my $static = shift;
+
     ## Make sure the template web directory exists
-    die "No such directory: $opt{tmpl}/web\n" unless -d "$opt{tmpl}/web";
+    die "No such directory: $source\n" unless ( -d $source );
 
     ## Scan the web templates
     find(
         sub {
-            my ($path) =
-                substr( $File::Find::name, length("$opt{tmpl}/web"), length($File::Find::name) ) =~ m#^/*(.*)$#;
+            my ($path) = substr( $File::Find::name, length("$source"), length($File::Find::name) ) =~ m#^/*(.*)$#;
 
-            if ( -d "$opt{tmpl}/web/$path" ) {
+            if ( -d "$source/$path" ) {
 
-                ## Create the directory in the doc root if it doesn't exist
-                if ( !-d "$opt{docroot}/$path" ) {
-                    mkdir("$opt{docroot}/$path") or die "Unable to make $opt{docroot}/$path: $!\n";
+                ## Create the directory in the target if it doesn't exist
+                if ( !-d "$target/$path" ) {
+                    mkdir("$target/$path") or die "Unable to make $target/$path: $!\n";
                 }
 
             }
             else {
 
                 ## Build HTML from XSL files and simply copy static files which have changed
-                if ( $path =~ /(.+)\.xsl$/ ) {
-                    print "Generating  : docroot:/$1.html\n" if ( $opt{verbose} );
-                    transform( undef, "$opt{tmpl}/web/$path", "$opt{docroot}/$1.html" );
+                if ( ( !$static ) and ( $path =~ /(.+)\.xsl$/ ) ) {
+                    print "Generating  : /$1.html\n" if ( $opt{verbose} );
+                    transform( undef, "$source/$path", "$target/$1.html" );
                 }
-                elsif ( -f "$opt{tmpl}/web/$path" ) {
+                elsif ( -f "$source/$path" ) {
 
-                    ## Skip if the file hasn't changed (mtime based)
+                    ## Skip if the file hasn't changed (mtime/size based)
                     return
-                        if -f "$opt{docroot}/$path"
-                            && ( stat("$opt{tmpl}/web/$path") )[9] == ( stat("$opt{docroot}/$path") )[9];
+                        if (( -f "$target/$path" )
+                        and ( ( stat("$source/$path") )[9] == ( stat("$target/$path") )[9] )
+                        and ( ( stat("$source/$path") )[7] == ( stat("$target/$path") )[7] ) );
 
                     if ( $path =~ /(.+)\.css$/ ) {
-                        print "CSS to  : docroot:/$path\n" if ( $opt{verbose} );
-                        my $content = read_file("$opt{tmpl}/web/$path");
-                        write_file( "$opt{docroot}/$path",
-                            $opt{minify} ? CSS::Minifier::XS::minify($content) : $content );
+                        print "CSS to  : /$path\n" if ( $opt{verbose} );
+                        my $content = read_file("$source/$path");
+                        write_file( "$target/$path", $opt{minify} ? CSS::Minifier::XS::minify($content) : $content );
                     }
                     elsif ( $path =~ /(.+)\.js$/ ) {
-                        print "JS to  : docroot:/$path\n" if ( $opt{verbose} );
-                        my $content = read_file("$opt{tmpl}/web/$path");
-                        write_file( "$opt{docroot}/$path",
+                        print "JS to  : /$path\n" if ( $opt{verbose} );
+                        my $content = read_file("$source/$path");
+                        write_file( "$target/$path",
                             $opt{minify} ? JavaScript::Minifier::XS::minify($content) : $content );
                     }
                     else {
                         ## Copy
-                        print "Copying to  : docroot:/$path\n" if ( $opt{verbose} );
-                        copy( "$opt{tmpl}/web/$path", "$opt{docroot}/$path" ) or die "$path: $!";
+                        print "Copying to  : /$path\n" if ( $opt{verbose} );
+                        copy( "$source/$path", "$target/$path" ) or die "$path: $!";
                     }
                     ## Set mtime
-                    utime( time, ( stat("$opt{tmpl}/web/$path") )[9], "$opt{docroot}/$path" );
+                    utime( time, ( stat("$source/$path") )[9], "$target/$path" );
                 }
             }
 
         },
-        "$opt{tmpl}/web"
+        "$source"
     );
 }
 
+# ------------------------------------------------------------------
 ## Generate index/chapter files for a doc
 sub do_doc {
     my ( $type, $xml_path ) = @_;
@@ -187,6 +215,7 @@ sub do_doc {
     }
 }
 
+# ------------------------------------------------------------------
 ## Fixup xref tags
 sub xref_fixup {
     my ( $xml, $prepend_chapter ) = @_;
@@ -249,6 +278,7 @@ sub xref_fixup {
     }
 }
 
+# ------------------------------------------------------------------
 ## Build indexes
 sub build_indexes {
     my ( $xml, $prepend_chapter, $xref ) = @_;
@@ -322,6 +352,7 @@ sub build_indexes {
     }
 }
 
+# ------------------------------------------------------------------
 ## Handle the transformation
 sub transform {
     my ( $xml, $xsl_path, $out_path ) = @_;
@@ -344,8 +375,12 @@ sub transform {
     ## Generate a stylesheet from the ".xsl" XML.
     my $stylesheet = XML::LibXSLT->new()->parse_stylesheet($xsl);
 
+    ## work out the static root relative to the target
+    my $target_dir = ( File::Spec->splitpath($out_path) )[1];
+    my $staticroot = File::Spec->abs2rel( $opt{staticroot}, $target_dir );
+
     ## Generate a doc from the XML transformed with the XSL
-    my $doc = $stylesheet->transform($xml);
+    my $doc = $stylesheet->transform( $xml, staticroot => sprintf( "'%s'", $staticroot ) );
 
     ## Make the containing directory if it doesn't exist
     make_path( ( $out_path =~ /^(.+)\/.+$/ )[0], { verbose => $opt{verbose} } );
@@ -356,6 +391,7 @@ sub transform {
     close $out;
 }
 
+# ------------------------------------------------------------------
 ## Look in the docroot for old versions of the documentation
 sub old_docs_versions {
     if ( !exists $cache{old_docs_versions} ) {
@@ -368,6 +404,7 @@ sub old_docs_versions {
     return @{ $cache{old_docs_versions} };
 }
 
+# ------------------------------------------------------------------
 ## error_help
 sub error_help {
     my $msg = shift;
@@ -376,6 +413,7 @@ sub error_help {
     pod2usage( -exitval => 1, -verbose => 0 );
 }
 
+# ------------------------------------------------------------------
 ## Parse arguments
 sub parse_arguments {
 
@@ -414,6 +452,7 @@ sub parse_arguments {
     return %opt;
 }
 
+# ------------------------------------------------------------------
 1;
 
 __END__
@@ -516,6 +555,6 @@ Mike produced.
 
 =head1 COPYRIGHT
 
-Copyright 2010-2011 Exim Maintainers. All rights reserved.
+Copyright 2010-2012 Exim Maintainers. All rights reserved.
 
 =cut
diff --git a/templates/doc/chapter.xsl b/templates/doc/chapter.xsl
index 06e320d..bb0a337 100644
--- a/templates/doc/chapter.xsl
+++ b/templates/doc/chapter.xsl
@@ -16,7 +16,7 @@
    <xsl:variable name="html.head.append">
 
       <!-- CSS -->
-         <link rel="stylesheet" type="text/css" href="{$docroot}/doc/chapter.css"/>
+         <link rel="stylesheet" type="text/css" href="{$staticroot}/doc/chapter.css"/>
 
       <!-- Canonical -->
          <link rel="canonical" href="{/chapter/canonical_url}"/>
@@ -25,7 +25,7 @@
  
    <!-- JavaScript -->
       <xsl:variable name="html.body.append">
-         <script type="text/javascript" src="{$docroot}/doc/chapter.js"/>
+         <script type="text/javascript" src="{$staticroot}/doc/chapter.js"/>
       </xsl:variable>
 
    <!-- Table of Contents -->
diff --git a/templates/doc/index.xsl b/templates/doc/index.xsl
index 8e08d4a..651cde7 100644
--- a/templates/doc/index.xsl
+++ b/templates/doc/index.xsl
@@ -16,7 +16,7 @@
    <xsl:variable name="html.head.append">
 
       <!-- CSS -->
-         <link rel="stylesheet" type="text/css" href="{$docroot}/doc/index.css"/>
+         <link rel="stylesheet" type="text/css" href="{$staticroot}/doc/index.css"/>
 
       <!-- Canonical -->
          <link rel="canonical" href="{/book/canonical_url}"/>
@@ -25,7 +25,7 @@
  
    <!-- JavaScript -->
       <xsl:variable name="html.body.append">
-         <script type="text/javascript" src="{$docroot}/doc/index.js"/>
+         <script type="text/javascript" src="{$staticroot}/doc/index.js"/>
       </xsl:variable>
 
    <!-- CONTENT -->
diff --git a/templates/static/css/common.css b/templates/static/css/common.css
new file mode 100644
index 0000000..2aa1c13
--- /dev/null
+++ b/templates/static/css/common.css
@@ -0,0 +1,273 @@
+/* Reset CSS */
+html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-weight: inherit;
+  font-style: inherit;
+  font-size: 100%;
+  font-family: inherit;
+  vertical-align: baseline;
+}
+
+/* Fonts */
+
+  body {
+    font-size:          62.5%;
+    font-family:        Verdana, Arial, Helvetica, Sans-Serif;
+  }
+
+/* Header Defaults */
+
+  h1, h2, h3, h4, h5, h6 { font-family:serif; line-height:1.7; font-weight: bold; }
+  h1 { font-size: 3.0em; text-align: center; }
+  h2 { font-size: 2.2em; text-align: center; }
+  h3 { font-size: 1.7em; }
+  h4 { font-size: 1.5em; }
+  h5 { font-size: 1.3em; }
+  h6 { font-size: 1.1em; }
+
+/* Shrink header sizes on thin windows (phones?) */
+  @media all and ( max-width:640px ){
+    h1 { font-size: 2.4em; }
+    h2 { font-size: 1.4em; }
+    h3 { font-size: 1.25em;  }
+    h4 { font-size: 1.2em; }
+    h5 { font-size: 1.15em;  }
+    h6 { font-size: 1.1em; }
+  }
+
+/* Anchor Defaults */
+
+  a   { color: #037094; }
+  a:visited { color: #335024; }
+  a:hover, a:visited:hover { color: #000; }
+
+/* Some more Defaults */
+
+  html, body {
+    height:       100%;
+    background-color:   #fff;
+  }
+  .hidden {
+    display:      none;
+  }
+  #inner ul, #inner ol {
+    padding:      0 0 1em 4em;
+  }
+  #inner p, #inner pre {
+    margin-bottom: 1em;
+  }
+  #inner pre {
+    font-family:      monospace;
+          white-space:                    pre-wrap;       /* css-3 */
+          white-space:                    -moz-pre-wrap;  /* Mozilla, since 1999 */
+          white-space:                    -pre-wrap;      /* Opera 4-6 */
+          white-space:                    -o-pre-wrap;    /* Opera 7 */
+          word-wrap:                      break-word;     /* Internet Explorer 5.5+ */
+  }
+  #content {
+    padding: 0 1em;
+  }
+  @media all and ( max-width:640px ){ #content { padding:0; } }
+
+/* Main Header */
+
+  #header {
+    position:     absolute;
+    top:        0;
+    left:       0;
+    height:       2em; /* 60px */
+    width:        100%;
+    line-height:      2;   /* 60px */
+    background-color:   #000;
+    z-index:      1000;
+
+    background-color:   #1f3c5a; /* For browsers without gradient support */
+    filter:       progid:DXImageTransform.Microsoft.gradient(startColorstr='#032044', endColorstr='#1f3c5a'); /* IE */
+    background:     -webkit-gradient(linear,left top,left bottom,from(#032044),to(#1f3c5a)); /* Webkit */
+    background:     -moz-linear-gradient(top, #032044, #1f3c5a); /* Firefox >= 3.6 */
+  }
+  @media all and ( max-width:640px ){
+    #header {
+      height:     2.5em; /* 60px */
+      line-height:    2.5;   /* 60px */
+    }
+  }
+
+  body > #header.fixed {
+    position:     fixed;
+  }
+
+  #header a {
+    color:        #fff;
+    white-space:      nowrap;
+  }
+
+  #header a:hover {
+    color:        #aaf;
+  }
+
+  #header, .nav {
+    opacity:      0.925;
+  }
+
+/* Outer Container (Positionining) */
+
+  #outer {
+    position:     absolute;
+    top:        0;
+    left:       0;
+    width:        100%;
+    min-height:     100%;
+    height:       auto !important;
+    height:       100%;
+    background-color:   #fff;
+  }
+
+/* Grey Side Bars */
+
+  #outer .left_bar, #outer .right_bar {
+    display:      none;
+  }
+
+  #outer > .left_bar.display, #outer > .right_bar.display {
+    display:      block;
+    position:     absolute;
+    top:        0;
+    width:        10%;
+    height:       100%;
+    background-color:   #ddd;
+  }
+  #outer > .left_bar  { left: 0; }
+  #outer > .right_bar { right:  0; }
+
+  @media all and ( max-width:640px ){
+    #outer > .left_bar.display, #outer > .right_bar.display { display: none; }
+  }
+
+/* Navigation */
+
+  .nav {
+    position:       relative;
+    top:            0;
+    left:           0;
+    margin-top:     6em;
+    padding:      0 0 0.5em 0;
+    width:        100%;
+    text-align:     center;
+    list-style:     none;
+    background-color:   #1f3c5a;
+    z-index:      1000;
+  }
+
+  .nav li {
+    display:      inline;
+    font-size:      1.2em;
+    padding:      0 0.3em;
+  }
+
+  .nav li a         { color: #fff; }
+  .nav li a:hover   { color: #aaf; }
+  .nav li a:visited { color: #aaf; }
+  .nav li a:visited:hover { color: #fff; } 
+
+  .nav li.img { padding-top: 0.1em; position:relative;top:0.3em;}
+
+  #outer > #nav_float {
+    position:     fixed;
+    top:        0;
+    left:       0;
+    width:      100%;
+    display:    none;
+    margin-top: 0;
+  }
+
+/* Search Field */
+  .nav li.search, .nav form {
+    display:          inline;
+    padding-top:      4px;
+  }
+  .nav .search_field_container.roundit .search_field {
+    border:       0;
+    padding:      0;
+    margin:       0;
+  }
+  .nav .search_field_container.roundit {
+    background-color:   #fff;
+    -moz-border-radius:   1em;
+    -webkit-border-radius:    1em;
+    padding:      0.1em 1em;
+    font-size:      1.2em;
+  }
+  .nav .search_field_container {
+    cursor:       text;
+  }
+
+/* Main content */
+
+  #inner {
+    z-index:      1000;
+    width:        80%;
+    min-width:      50%;
+    max-width:      65em;
+    padding:      0.71429em 0 1.42857em 0;
+    margin:       0 auto;
+    font-size:      1.4em; /* 14px */
+    line-height:    2;     /* 28px */
+    background-color:   #fff;
+  }
+  /* Remove side padding on thin windows (phones?) */
+    @media all and ( max-width:640px ){
+      #inner { width: auto; }
+    }
+
+/* Branding */
+  #branding {
+    display:      block;
+    visibility:     hidden;
+    width:        80%;
+    margin:       -1.42857em auto 1.42857em auto;
+    overflow:     hidden;
+    border:       0;
+    outline:      0;
+  }
+
+/* Footer */
+  #footer {
+    position:     absolute;
+    bottom:       0;
+    left:       0;
+    height:       1.4em;  /* 14px */
+    width:        100%;
+    z-index:      1000;
+    line-height:      1.4;    /* 14px */
+    text-align:     center;
+    text-align:     center;
+  }
+
+  #footer, #footer a {
+    color:        #999;
+  }
+
+  #footer:hover, #footer:hover a { color: #444; }
+  #footer a:hover { color: #000; }
+
+/* Some docbook elements */
+
+  .docbook_filename, .docbook_emphasis, .docbook_function {
+    font-style:        italic;
+  }
+  .docbook_option, .docbook_command {
+    font-weight:      bold;
+  }
+  .docbook_literal {
+    font-family:      monospace;
+  }
+  .docbook_literallayout {
+    background-color:   #e8e8d0;
+  }
+  .docbook_literallayout pre {
+    padding:      1em;
+    margin-bottom:      1em;
+  }
diff --git a/templates/static/css/index.css b/templates/static/css/index.css
new file mode 100644
index 0000000..1cbc418
--- /dev/null
+++ b/templates/static/css/index.css
@@ -0,0 +1,8 @@
+#inner img {
+	float:				left;
+	margin:				0 1em 0.5em 0;
+}
+
+#book_info {
+	min-height:			100px;
+}
diff --git a/templates/static/doc/chapter.css b/templates/static/doc/chapter.css
new file mode 100644
index 0000000..9f9b22e
--- /dev/null
+++ b/templates/static/doc/chapter.css
@@ -0,0 +1,166 @@
+#old_version_warning {
+  text-align:  center;
+  padding:     0.1em;
+  margin:      0;
+  font-size:   1.4em;
+}
+
+body.with-js #old_version_warning {
+  display:          none;
+  text-align:       left;
+  position:         fixed;
+  top:              20%;
+  left:	            30%;
+  width:            40%;
+  background-color: #fff;
+  border:           1px solid #000;
+  padding:          1em;
+  z-index:          10000;
+}
+
+#old_version_warning span.closebar {
+  float:            right;
+  position:         relative;
+  right:            -0.5em;
+  top:              -0.5em;
+}
+
+#old_version_warning span.closebar a {
+  text-decoration:  none;
+}
+
+body.no-js #old_version_warning span.closebar {
+  display: none;
+}
+
+.previous_page, .next_page, .toc_page {
+  font-size:      1.2em;
+}
+
+.previous_page {
+  float:        left;
+  clear:        left;
+}
+
+.next_page {
+  float:        right;
+  clear:        right;
+}
+
+.toc_page {
+  position:     absolute;
+  right:        13em;
+  left:         13em;
+  text-align:   center;
+}
+
+#chapter {
+  line-height: 1.5;
+}
+
+#chapter table {
+  margin-top:       1em;
+  margin-bottom:    1em;
+}
+
+#chapter table td {
+  padding-left:     1em;
+  padding-right:    1em;
+  background-color: #eaeaea;
+  border: thin solid white;
+  font-size: 80%;
+}
+
+td .docbook_option, td .docbook_emphasis {
+  font-size: 125%;
+}
+
+/* Index section styling */
+
+h3.index {
+  padding-top: 10px;
+  border-bottom: medium solid #000;
+  margin-bottom: 10px;
+}
+
+dl dt
+{
+  clear: left;
+  float: left;
+  margin: 0;
+  font-weight: bold;
+  padding-left: 2em;
+  line-height: 1.1;
+}
+
+dl dd
+{
+  margin-left: 4em;
+  padding-top: 0.2em;
+  clear: left;
+  line-height: 1.1;
+  white-space: normal;
+}
+
+dl dd dl
+{
+  margin-left: -180px;
+}
+
+
+/* Side Table of Contents */
+
+ #outer > #toc {
+   position:     fixed;
+   top:        35%;
+   left:       0;
+   z-index:      3000;
+ }
+
+ #outer > #toc img {
+   position:     fixed;
+   top:        35%;
+   left:       0;
+   background-color:   #304b66;
+   padding:      0.5em;
+   z-index:      3000;
+   display:      none;
+ }
+
+ #outer > #toc img:hover {
+   cursor:       pointer;
+   background-color:   #000;
+ }
+
+ #outer > #toc > ul {
+   position:     fixed;
+   top:        30%;
+   background-color:   #fff;
+   min-height:     200px;
+   max-height:     65%;
+   overflow-y:     auto;
+   padding:      0.5em 0;
+   border-top:     1px solid #bbb;
+   border-bottom:      1px solid #bbb;
+   z-index:      3000;
+ }
+ #outer > #toc a {
+   font-size:      1.2em;
+   color:        #304b67;
+   text-decoration:    none;
+   padding:      0 0.5em;
+ }
+ #outer > #toc a:hover {
+   color:        #000;
+ }
+
+ @media all and ( max-width: 640px ){
+   #outer > #toc {
+     display:    none;
+   }
+ }
+
+/* Changebars  -- experimental */
+.changed {
+  border-right: 5px solid #000;
+}
diff --git a/templates/static/doc/chapter.js b/templates/static/doc/chapter.js
new file mode 100644
index 0000000..add4bd3
--- /dev/null
+++ b/templates/static/doc/chapter.js
@@ -0,0 +1,69 @@
+// Warnings about reading old version of documentation
+(function ($) {
+    if( $.grep( document.cookie.split(/\s*;\s*/), function(a){return a === 'old_version_warning_removed=true' ? true : false }).length === 0 ){
+        $('#old_version_warning')
+	    .show()
+	    .find('span.closebar a')
+	        .click(function(e){
+                    $('#old_version_warning').remove();
+                    document.cookie="old_version_warning_removed=true";
+                    e.preventDefault();
+                });
+    }
+})(jQuery);
+
+// Sidebar table of contents
+(function ($) {
+
+    var click_func = function (e) {
+        e.stopPropagation();
+        if ($('#toc').data('opened')) {
+            $('#toc > *').animate({
+                left: '-=' + $('#toc > ul').width() + 'px'
+            }, 'fast');
+            $('#toc').removeData('opened');
+        } else {
+            $('#toc > *').animate({
+                left: '+=' + $('#toc > ul').width() + 'px'
+            }, 'fast');
+            $('#toc').data('opened', 1);
+        }
+    };
+
+    $('body').click(function () {
+        if( $('#toc').data('opened') ) $('#toc > img').mousedown();
+    });
+
+    var type = document.location.pathname.match(/\/doc\/html\/spec_html\/filter/) ? 'filter' : 'spec';
+
+    // Get the relevant table of contents
+    $.get(type === 'spec' ? 'index_toc.xml' : 'filter_toc.xml', function (xml) {
+
+        // Remove the main list from the DOM for performance
+        var $ul = $('#toc > ul').remove();
+
+        // Traverse chapters
+        var chapter_id = 0;
+        $(xml).find('c').each(function () {
+            ++chapter_id;
+            var chapter_title = $(this).children('t').text();
+            var chapter_url = $(this).children('u').text();
+
+            var chapter_li = $('<li/>').append(
+            $('<a/>').attr({
+                href: chapter_url,
+                title: chapter_title
+            }).text(chapter_id + '. ' + chapter_title), $('<ul/>').hide()).appendTo($ul);
+        });
+
+        $('#toc img').fadeIn('slow', function () {
+            // Add the main list back to the DOM
+            $ul.removeClass('hidden').css('visibility', 'hidden').appendTo('#toc').css('left', '-' + $ul.width() + 'px').css('visibility', 'visible');
+            $('#toc > img').mousedown(click_func);
+            $('#toc > ul').click(click_func);
+            $('#toc, #toc a').click(function (e) {
+                e.stopPropagation()
+            });
+        });
+    });
+})(jQuery);
diff --git a/templates/static/doc/contents.png b/templates/static/doc/contents.png
new file mode 100644
index 0000000..03a6d22
Binary files /dev/null and b/templates/static/doc/contents.png differ
diff --git a/templates/static/doc/index.css b/templates/static/doc/index.css
new file mode 100644
index 0000000..63ea01f
--- /dev/null
+++ b/templates/static/doc/index.css
@@ -0,0 +1,69 @@
+#old_version_warning {
+	text-align:			center;
+	padding:			0.1em;
+	margin:				0;
+	font-size:			1.4em;
+}
+
+#options {
+	padding:			1em 0 0 2em;
+}
+
+#options img {
+	margin:				10px 4px 0 0;
+	float:				left;
+}
+
+#options img.collapse {
+	margin-right:			0.5em;
+}
+
+#options img:hover {
+	cursor:				pointer;
+}
+
+#chapters a {
+	text-decoration:		none;
+}
+
+#chapters, .chapter, .section {
+	float:				left;
+	clear:				both;
+	list-style:			none;
+	white-space:			nowrap;
+}
+
+#chapters li.chapter .button {
+	width:				12px;
+	height:				12px;
+	margin:				10px 10px 0 0;
+	background-repeat:		no-repeat;
+	float:				left;
+	display:			none;
+}
+
+#chapters li.chapter .button:hover {
+	cursor:				pointer;
+}
+
+#chapters.expandable li.chapter .button {
+	display:			block;
+	background-image:		url('../../../../doc/plus-12x12.png');
+}
+
+#chapters.expandable li.chapter span.chapter_title.nosub {
+	margin-left:			22px;
+}
+
+#chapters.expandable li.chapter ul.sections {
+	display:			none;
+}
+
+#chapters.expandable li.chapter.open .button {
+	background-image:		url('../../../../doc/minus-12x12.png');
+}
+
+#chapters.expandable li.chapter.open ul.sections {
+	display:			block;
+}
+
diff --git a/templates/static/doc/index.js b/templates/static/doc/index.js
new file mode 100644
index 0000000..0a8737a
--- /dev/null
+++ b/templates/static/doc/index.js
@@ -0,0 +1,11 @@
+// Add the expand/collapse functionality
+$('#chapters').addClass('expandable').find('.button').click(function () {
+    $(this).parent().toggleClass('open');
+});
+$('#options img.expand').click(function () {
+    $('.chapter').addClass('open');
+});
+$('#options img.collapse').click(function () {
+    $('.chapter').removeClass('open')
+});
+$('#options').removeClass('hidden');
\ No newline at end of file
diff --git a/templates/static/doc/minus-12x12.png b/templates/static/doc/minus-12x12.png
new file mode 100644
index 0000000..81c2ee0
Binary files /dev/null and b/templates/static/doc/minus-12x12.png differ
diff --git a/templates/static/doc/plus-12x12.png b/templates/static/doc/plus-12x12.png
new file mode 100644
index 0000000..94f34b1
Binary files /dev/null and b/templates/static/doc/plus-12x12.png differ
diff --git a/templates/static/js/common.js b/templates/static/js/common.js
new file mode 100644
index 0000000..3aef463
--- /dev/null
+++ b/templates/static/js/common.js
@@ -0,0 +1,125 @@
+// Fix the header and navigation at the top of the page
+(function ($) {
+
+    var $nav_float = $('#nav_flow').clone().attr('id','nav_float').appendTo('#outer');
+
+    var floating = false;
+
+    $(window).bind('load resize scroll',function () {
+        var header_height = $('#header').height();
+        var top = $(this).scrollTop();
+
+        if( top > header_height ){
+            if( !floating ){
+                $nav_float.show();
+                $('#nav_flow').css('visibility','hidden');
+                floating = true;
+            }
+        } else {
+            if( floating ){
+                $nav_float.hide();
+                $('#nav_flow').css('visibility','visible');
+                floating = false;
+            }
+        }
+    });
+
+    $('#outer > .right_bar, #outer > .left_bar').addClass('display');
+})(jQuery);
+
+// Add branding for mirrors
+if (document.location.href.match(/^https?:\/\/([^\/]+\.)*exim\.org\//)) {
+    $('#branding').remove();
+} else {
+    $('#branding').ready(function () {
+        try {
+            var doc = $('#branding')[0].contentWindow.document;
+            if (doc.title.match(/\b(found|404)\b/i)) { // Crude but "good enough" check to see if the branding request failed
+                $('#branding').remove();
+            } else {
+                $(doc).find('a').each(function () {
+                    if ($(this).attr('title') == '') $(this).attr('title', 'Sponsor of this mirror');
+                    $(this).css('opacity', 0.8).mouseover(function () {
+                        $(this).css('opacity', 1)
+                    }).mouseout(function () {
+                        $(this).css('opacity', 0.8)
+                    });
+                });
+                $('#branding').height($(doc).find('img').height() ? $(doc).find('img').height() + 16 + 'px' : 'auto').hide().css('visibility', 'visible').fadeIn(2000);
+            }
+        } catch (e) {
+            $('#branding').remove();
+        }
+    });
+}
+
+// Footer
+(function () {
+    $('#footer').hide();
+    setTimeout(function () {
+        $('#footer').fadeIn('slow')
+    }, 2000);
+})();
+
+// Search box
+(function () {
+
+    // Add placeholder functionality to browsers which don't support it
+    if (!('placeholder' in document.createElement('input'))) $('.nav li.search input.search_field').focus(function (e) {
+        if ($(this).val() === ' ' + $(this).attr('placeholder')) $(this).val('').css('color', '#000');
+    }).blur(function (e) {
+        if ($(this).val() === ' ' + $(this).attr('placeholder') || $(this).val() === '') $(this).css('color', '#666').val(' ' + $(this).attr('placeholder'));
+    }).blur();
+
+    // Add rounded borders to search field on Gecko based browsers
+    if (document.body.style.MozBorderRadius !== undefined) $('.search_field_container').addClass('roundit').click(function () {
+        $(this).find('input').focus()
+    });
+})();
+
+// Jump to the right location on the page. Fixed header can cause problems.
+(function ($) {
+    // Jump to the given ID
+    var jump = function (id) {
+        if ($('#' + id).length == 0) return false;
+
+        document.location.href = document.location.href.replace(/#.+/, '') + '#' + id;
+
+        $('html,body').animate({
+            scrollTop: $('#' + id).position()['top'] - $('.nav').height() - 5
+        }, 100);
+
+        return true;
+    };
+
+    var uri = document.location.pathname;
+    var uri_end = uri.replace(/^.*\//, '');
+
+    // Page load
+    if (document.location.href.match(/#./)) jump(document.location.href.replace(/^.*#(.+)$/, '$1'));
+
+    // Anchor click
+    $('a').live('click', function (e) {
+        var href = $(this).attr('href');
+        if (!href.match(/^.*#.+$/)) return true; // No # in the anchor
+        var href_uri = href.replace(/^([^#]*)(#.*)?/, '$1'); // href without the #
+        if (href_uri.match(/^([a-z]+:)?\/\//)) return true; // Ignore full URLs
+        if (href_uri.match(/^[^\/]/) && href_uri != uri_end) return true; // Ignore relative links to other pages
+        if (href_uri.match(/^\//) && href_uri != uri) return true; // Ignore absolute links to other pages
+        if (jump(href.replace(/^.*#(.+)$/, '$1'))) e.preventDefault();
+    });
+
+    // For browsers which support it, detect when the hash in the address bar changes
+    $(window).bind('hashchange', function (e) {
+        if (jump(document.location.href.replace(/^.*#(.+)$/, '$1'))) e.preventDefault();
+    });
+})(jQuery);
+
+// Google Analytics
+(function($){
+    window._gaq = [
+        ['_setAccount', 'UA-18951566-1'],
+        ['_trackPageview']
+    ];
+    $.getScript((document.location.protocol === 'https:' ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js');
+})(jQuery);
diff --git a/templates/web/common.css b/templates/web/common.css
deleted file mode 100644
index 2aa1c13..0000000
--- a/templates/web/common.css
+++ /dev/null
@@ -1,273 +0,0 @@
-/* Reset CSS */
-html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-weight: inherit;
-  font-style: inherit;
-  font-size: 100%;
-  font-family: inherit;
-  vertical-align: baseline;
-}
-
-/* Fonts */
-
-  body {
-    font-size:          62.5%;
-    font-family:        Verdana, Arial, Helvetica, Sans-Serif;
-  }
-
-/* Header Defaults */
-
-  h1, h2, h3, h4, h5, h6 { font-family:serif; line-height:1.7; font-weight: bold; }
-  h1 { font-size: 3.0em; text-align: center; }
-  h2 { font-size: 2.2em; text-align: center; }
-  h3 { font-size: 1.7em; }
-  h4 { font-size: 1.5em; }
-  h5 { font-size: 1.3em; }
-  h6 { font-size: 1.1em; }
-
-/* Shrink header sizes on thin windows (phones?) */
-  @media all and ( max-width:640px ){
-    h1 { font-size: 2.4em; }
-    h2 { font-size: 1.4em; }
-    h3 { font-size: 1.25em;  }
-    h4 { font-size: 1.2em; }
-    h5 { font-size: 1.15em;  }
-    h6 { font-size: 1.1em; }
-  }
-
-/* Anchor Defaults */
-
-  a   { color: #037094; }
-  a:visited { color: #335024; }
-  a:hover, a:visited:hover { color: #000; }
-
-/* Some more Defaults */
-
-  html, body {
-    height:       100%;
-    background-color:   #fff;
-  }
-  .hidden {
-    display:      none;
-  }
-  #inner ul, #inner ol {
-    padding:      0 0 1em 4em;
-  }
-  #inner p, #inner pre {
-    margin-bottom: 1em;
-  }
-  #inner pre {
-    font-family:      monospace;
-          white-space:                    pre-wrap;       /* css-3 */
-          white-space:                    -moz-pre-wrap;  /* Mozilla, since 1999 */
-          white-space:                    -pre-wrap;      /* Opera 4-6 */
-          white-space:                    -o-pre-wrap;    /* Opera 7 */
-          word-wrap:                      break-word;     /* Internet Explorer 5.5+ */
-  }
-  #content {
-    padding: 0 1em;
-  }
-  @media all and ( max-width:640px ){ #content { padding:0; } }
-
-/* Main Header */
-
-  #header {
-    position:     absolute;
-    top:        0;
-    left:       0;
-    height:       2em; /* 60px */
-    width:        100%;
-    line-height:      2;   /* 60px */
-    background-color:   #000;
-    z-index:      1000;
-
-    background-color:   #1f3c5a; /* For browsers without gradient support */
-    filter:       progid:DXImageTransform.Microsoft.gradient(startColorstr='#032044', endColorstr='#1f3c5a'); /* IE */
-    background:     -webkit-gradient(linear,left top,left bottom,from(#032044),to(#1f3c5a)); /* Webkit */
-    background:     -moz-linear-gradient(top, #032044, #1f3c5a); /* Firefox >= 3.6 */
-  }
-  @media all and ( max-width:640px ){
-    #header {
-      height:     2.5em; /* 60px */
-      line-height:    2.5;   /* 60px */
-    }
-  }
-
-  body > #header.fixed {
-    position:     fixed;
-  }
-
-  #header a {
-    color:        #fff;
-    white-space:      nowrap;
-  }
-
-  #header a:hover {
-    color:        #aaf;
-  }
-
-  #header, .nav {
-    opacity:      0.925;
-  }
-
-/* Outer Container (Positionining) */
-
-  #outer {
-    position:     absolute;
-    top:        0;
-    left:       0;
-    width:        100%;
-    min-height:     100%;
-    height:       auto !important;
-    height:       100%;
-    background-color:   #fff;
-  }
-
-/* Grey Side Bars */
-
-  #outer .left_bar, #outer .right_bar {
-    display:      none;
-  }
-
-  #outer > .left_bar.display, #outer > .right_bar.display {
-    display:      block;
-    position:     absolute;
-    top:        0;
-    width:        10%;
-    height:       100%;
-    background-color:   #ddd;
-  }
-  #outer > .left_bar  { left: 0; }
-  #outer > .right_bar { right:  0; }
-
-  @media all and ( max-width:640px ){
-    #outer > .left_bar.display, #outer > .right_bar.display { display: none; }
-  }
-
-/* Navigation */
-
-  .nav {
-    position:       relative;
-    top:            0;
-    left:           0;
-    margin-top:     6em;
-    padding:      0 0 0.5em 0;
-    width:        100%;
-    text-align:     center;
-    list-style:     none;
-    background-color:   #1f3c5a;
-    z-index:      1000;
-  }
-
-  .nav li {
-    display:      inline;
-    font-size:      1.2em;
-    padding:      0 0.3em;
-  }
-
-  .nav li a         { color: #fff; }
-  .nav li a:hover   { color: #aaf; }
-  .nav li a:visited { color: #aaf; }
-  .nav li a:visited:hover { color: #fff; } 
-
-  .nav li.img { padding-top: 0.1em; position:relative;top:0.3em;}
-
-  #outer > #nav_float {
-    position:     fixed;
-    top:        0;
-    left:       0;
-    width:      100%;
-    display:    none;
-    margin-top: 0;
-  }
-
-/* Search Field */
-  .nav li.search, .nav form {
-    display:          inline;
-    padding-top:      4px;
-  }
-  .nav .search_field_container.roundit .search_field {
-    border:       0;
-    padding:      0;
-    margin:       0;
-  }
-  .nav .search_field_container.roundit {
-    background-color:   #fff;
-    -moz-border-radius:   1em;
-    -webkit-border-radius:    1em;
-    padding:      0.1em 1em;
-    font-size:      1.2em;
-  }
-  .nav .search_field_container {
-    cursor:       text;
-  }
-
-/* Main content */
-
-  #inner {
-    z-index:      1000;
-    width:        80%;
-    min-width:      50%;
-    max-width:      65em;
-    padding:      0.71429em 0 1.42857em 0;
-    margin:       0 auto;
-    font-size:      1.4em; /* 14px */
-    line-height:    2;     /* 28px */
-    background-color:   #fff;
-  }
-  /* Remove side padding on thin windows (phones?) */
-    @media all and ( max-width:640px ){
-      #inner { width: auto; }
-    }
-
-/* Branding */
-  #branding {
-    display:      block;
-    visibility:     hidden;
-    width:        80%;
-    margin:       -1.42857em auto 1.42857em auto;
-    overflow:     hidden;
-    border:       0;
-    outline:      0;
-  }
-
-/* Footer */
-  #footer {
-    position:     absolute;
-    bottom:       0;
-    left:       0;
-    height:       1.4em;  /* 14px */
-    width:        100%;
-    z-index:      1000;
-    line-height:      1.4;    /* 14px */
-    text-align:     center;
-    text-align:     center;
-  }
-
-  #footer, #footer a {
-    color:        #999;
-  }
-
-  #footer:hover, #footer:hover a { color: #444; }
-  #footer a:hover { color: #000; }
-
-/* Some docbook elements */
-
-  .docbook_filename, .docbook_emphasis, .docbook_function {
-    font-style:        italic;
-  }
-  .docbook_option, .docbook_command {
-    font-weight:      bold;
-  }
-  .docbook_literal {
-    font-family:      monospace;
-  }
-  .docbook_literallayout {
-    background-color:   #e8e8d0;
-  }
-  .docbook_literallayout pre {
-    padding:      1em;
-    margin-bottom:      1em;
-  }
diff --git a/templates/web/common.js b/templates/web/common.js
deleted file mode 100644
index 3aef463..0000000
--- a/templates/web/common.js
+++ /dev/null
@@ -1,125 +0,0 @@
-// Fix the header and navigation at the top of the page
-(function ($) {
-
-    var $nav_float = $('#nav_flow').clone().attr('id','nav_float').appendTo('#outer');
-
-    var floating = false;
-
-    $(window).bind('load resize scroll',function () {
-        var header_height = $('#header').height();
-        var top = $(this).scrollTop();
-
-        if( top > header_height ){
-            if( !floating ){
-                $nav_float.show();
-                $('#nav_flow').css('visibility','hidden');
-                floating = true;
-            }
-        } else {
-            if( floating ){
-                $nav_float.hide();
-                $('#nav_flow').css('visibility','visible');
-                floating = false;
-            }
-        }
-    });
-
-    $('#outer > .right_bar, #outer > .left_bar').addClass('display');
-})(jQuery);
-
-// Add branding for mirrors
-if (document.location.href.match(/^https?:\/\/([^\/]+\.)*exim\.org\//)) {
-    $('#branding').remove();
-} else {
-    $('#branding').ready(function () {
-        try {
-            var doc = $('#branding')[0].contentWindow.document;
-            if (doc.title.match(/\b(found|404)\b/i)) { // Crude but "good enough" check to see if the branding request failed
-                $('#branding').remove();
-            } else {
-                $(doc).find('a').each(function () {
-                    if ($(this).attr('title') == '') $(this).attr('title', 'Sponsor of this mirror');
-                    $(this).css('opacity', 0.8).mouseover(function () {
-                        $(this).css('opacity', 1)
-                    }).mouseout(function () {
-                        $(this).css('opacity', 0.8)
-                    });
-                });
-                $('#branding').height($(doc).find('img').height() ? $(doc).find('img').height() + 16 + 'px' : 'auto').hide().css('visibility', 'visible').fadeIn(2000);
-            }
-        } catch (e) {
-            $('#branding').remove();
-        }
-    });
-}
-
-// Footer
-(function () {
-    $('#footer').hide();
-    setTimeout(function () {
-        $('#footer').fadeIn('slow')
-    }, 2000);
-})();
-
-// Search box
-(function () {
-
-    // Add placeholder functionality to browsers which don't support it
-    if (!('placeholder' in document.createElement('input'))) $('.nav li.search input.search_field').focus(function (e) {
-        if ($(this).val() === ' ' + $(this).attr('placeholder')) $(this).val('').css('color', '#000');
-    }).blur(function (e) {
-        if ($(this).val() === ' ' + $(this).attr('placeholder') || $(this).val() === '') $(this).css('color', '#666').val(' ' + $(this).attr('placeholder'));
-    }).blur();
-
-    // Add rounded borders to search field on Gecko based browsers
-    if (document.body.style.MozBorderRadius !== undefined) $('.search_field_container').addClass('roundit').click(function () {
-        $(this).find('input').focus()
-    });
-})();
-
-// Jump to the right location on the page. Fixed header can cause problems.
-(function ($) {
-    // Jump to the given ID
-    var jump = function (id) {
-        if ($('#' + id).length == 0) return false;
-
-        document.location.href = document.location.href.replace(/#.+/, '') + '#' + id;
-
-        $('html,body').animate({
-            scrollTop: $('#' + id).position()['top'] - $('.nav').height() - 5
-        }, 100);
-
-        return true;
-    };
-
-    var uri = document.location.pathname;
-    var uri_end = uri.replace(/^.*\//, '');
-
-    // Page load
-    if (document.location.href.match(/#./)) jump(document.location.href.replace(/^.*#(.+)$/, '$1'));
-
-    // Anchor click
-    $('a').live('click', function (e) {
-        var href = $(this).attr('href');
-        if (!href.match(/^.*#.+$/)) return true; // No # in the anchor
-        var href_uri = href.replace(/^([^#]*)(#.*)?/, '$1'); // href without the #
-        if (href_uri.match(/^([a-z]+:)?\/\//)) return true; // Ignore full URLs
-        if (href_uri.match(/^[^\/]/) && href_uri != uri_end) return true; // Ignore relative links to other pages
-        if (href_uri.match(/^\//) && href_uri != uri) return true; // Ignore absolute links to other pages
-        if (jump(href.replace(/^.*#(.+)$/, '$1'))) e.preventDefault();
-    });
-
-    // For browsers which support it, detect when the hash in the address bar changes
-    $(window).bind('hashchange', function (e) {
-        if (jump(document.location.href.replace(/^.*#(.+)$/, '$1'))) e.preventDefault();
-    });
-})(jQuery);
-
-// Google Analytics
-(function($){
-    window._gaq = [
-        ['_setAccount', 'UA-18951566-1'],
-        ['_trackPageview']
-    ];
-    $.getScript((document.location.protocol === 'https:' ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js');
-})(jQuery);
diff --git a/templates/web/doc/chapter.css b/templates/web/doc/chapter.css
deleted file mode 100644
index 9f9b22e..0000000
--- a/templates/web/doc/chapter.css
+++ /dev/null
@@ -1,166 +0,0 @@
-#old_version_warning {
-  text-align:  center;
-  padding:     0.1em;
-  margin:      0;
-  font-size:   1.4em;
-}
-
-body.with-js #old_version_warning {
-  display:          none;
-  text-align:       left;
-  position:         fixed;
-  top:              20%;
-  left:	            30%;
-  width:            40%;
-  background-color: #fff;
-  border:           1px solid #000;
-  padding:          1em;
-  z-index:          10000;
-}
-
-#old_version_warning span.closebar {
-  float:            right;
-  position:         relative;
-  right:            -0.5em;
-  top:              -0.5em;
-}
-
-#old_version_warning span.closebar a {
-  text-decoration:  none;
-}
-
-body.no-js #old_version_warning span.closebar {
-  display: none;
-}
-
-.previous_page, .next_page, .toc_page {
-  font-size:      1.2em;
-}
-
-.previous_page {
-  float:        left;
-  clear:        left;
-}
-
-.next_page {
-  float:        right;
-  clear:        right;
-}
-
-.toc_page {
-  position:     absolute;
-  right:        13em;
-  left:         13em;
-  text-align:   center;
-}
-
-#chapter {
-  line-height: 1.5;
-}
-
-#chapter table {
-  margin-top:       1em;
-  margin-bottom:    1em;
-}
-
-#chapter table td {
-  padding-left:     1em;
-  padding-right:    1em;
-  background-color: #eaeaea;
-  border: thin solid white;
-  font-size: 80%;
-}
-
-td .docbook_option, td .docbook_emphasis {
-  font-size: 125%;
-}
-
-/* Index section styling */
-
-h3.index {
-  padding-top: 10px;
-  border-bottom: medium solid #000;
-  margin-bottom: 10px;
-}
-
-dl dt
-{
-  clear: left;
-  float: left;
-  margin: 0;
-  font-weight: bold;
-  padding-left: 2em;
-  line-height: 1.1;
-}
-
-dl dd
-{
-  margin-left: 4em;
-  padding-top: 0.2em;
-  clear: left;
-  line-height: 1.1;
-  white-space: normal;
-}
-
-dl dd dl
-{
-  margin-left: -180px;
-}
-
-
-/* Side Table of Contents */
-
- #outer > #toc {
-   position:     fixed;
-   top:        35%;
-   left:       0;
-   z-index:      3000;
- }
-
- #outer > #toc img {
-   position:     fixed;
-   top:        35%;
-   left:       0;
-   background-color:   #304b66;
-   padding:      0.5em;
-   z-index:      3000;
-   display:      none;
- }
-
- #outer > #toc img:hover {
-   cursor:       pointer;
-   background-color:   #000;
- }
-
- #outer > #toc > ul {
-   position:     fixed;
-   top:        30%;
-   background-color:   #fff;
-   min-height:     200px;
-   max-height:     65%;
-   overflow-y:     auto;
-   padding:      0.5em 0;
-   border-top:     1px solid #bbb;
-   border-bottom:      1px solid #bbb;
-   z-index:      3000;
- }
- #outer > #toc a {
-   font-size:      1.2em;
-   color:        #304b67;
-   text-decoration:    none;
-   padding:      0 0.5em;
- }
- #outer > #toc a:hover {
-   color:        #000;
- }
-
- @media all and ( max-width: 640px ){
-   #outer > #toc {
-     display:    none;
-   }
- }
-
-/* Changebars  -- experimental */
-.changed {
-  border-right: 5px solid #000;
-}
diff --git a/templates/web/doc/chapter.js b/templates/web/doc/chapter.js
deleted file mode 100644
index add4bd3..0000000
--- a/templates/web/doc/chapter.js
+++ /dev/null
@@ -1,69 +0,0 @@
-// Warnings about reading old version of documentation
-(function ($) {
-    if( $.grep( document.cookie.split(/\s*;\s*/), function(a){return a === 'old_version_warning_removed=true' ? true : false }).length === 0 ){
-        $('#old_version_warning')
-	    .show()
-	    .find('span.closebar a')
-	        .click(function(e){
-                    $('#old_version_warning').remove();
-                    document.cookie="old_version_warning_removed=true";
-                    e.preventDefault();
-                });
-    }
-})(jQuery);
-
-// Sidebar table of contents
-(function ($) {
-
-    var click_func = function (e) {
-        e.stopPropagation();
-        if ($('#toc').data('opened')) {
-            $('#toc > *').animate({
-                left: '-=' + $('#toc > ul').width() + 'px'
-            }, 'fast');
-            $('#toc').removeData('opened');
-        } else {
-            $('#toc > *').animate({
-                left: '+=' + $('#toc > ul').width() + 'px'
-            }, 'fast');
-            $('#toc').data('opened', 1);
-        }
-    };
-
-    $('body').click(function () {
-        if( $('#toc').data('opened') ) $('#toc > img').mousedown();
-    });
-
-    var type = document.location.pathname.match(/\/doc\/html\/spec_html\/filter/) ? 'filter' : 'spec';
-
-    // Get the relevant table of contents
-    $.get(type === 'spec' ? 'index_toc.xml' : 'filter_toc.xml', function (xml) {
-
-        // Remove the main list from the DOM for performance
-        var $ul = $('#toc > ul').remove();
-
-        // Traverse chapters
-        var chapter_id = 0;
-        $(xml).find('c').each(function () {
-            ++chapter_id;
-            var chapter_title = $(this).children('t').text();
-            var chapter_url = $(this).children('u').text();
-
-            var chapter_li = $('<li/>').append(
-            $('<a/>').attr({
-                href: chapter_url,
-                title: chapter_title
-            }).text(chapter_id + '. ' + chapter_title), $('<ul/>').hide()).appendTo($ul);
-        });
-
-        $('#toc img').fadeIn('slow', function () {
-            // Add the main list back to the DOM
-            $ul.removeClass('hidden').css('visibility', 'hidden').appendTo('#toc').css('left', '-' + $ul.width() + 'px').css('visibility', 'visible');
-            $('#toc > img').mousedown(click_func);
-            $('#toc > ul').click(click_func);
-            $('#toc, #toc a').click(function (e) {
-                e.stopPropagation()
-            });
-        });
-    });
-})(jQuery);
diff --git a/templates/web/doc/contents.png b/templates/web/doc/contents.png
deleted file mode 100644
index 03a6d22..0000000
Binary files a/templates/web/doc/contents.png and /dev/null differ
diff --git a/templates/web/doc/index.css b/templates/web/doc/index.css
deleted file mode 100644
index 63ea01f..0000000
--- a/templates/web/doc/index.css
+++ /dev/null
@@ -1,69 +0,0 @@
-#old_version_warning {
-	text-align:			center;
-	padding:			0.1em;
-	margin:				0;
-	font-size:			1.4em;
-}
-
-#options {
-	padding:			1em 0 0 2em;
-}
-
-#options img {
-	margin:				10px 4px 0 0;
-	float:				left;
-}
-
-#options img.collapse {
-	margin-right:			0.5em;
-}
-
-#options img:hover {
-	cursor:				pointer;
-}
-
-#chapters a {
-	text-decoration:		none;
-}
-
-#chapters, .chapter, .section {
-	float:				left;
-	clear:				both;
-	list-style:			none;
-	white-space:			nowrap;
-}
-
-#chapters li.chapter .button {
-	width:				12px;
-	height:				12px;
-	margin:				10px 10px 0 0;
-	background-repeat:		no-repeat;
-	float:				left;
-	display:			none;
-}
-
-#chapters li.chapter .button:hover {
-	cursor:				pointer;
-}
-
-#chapters.expandable li.chapter .button {
-	display:			block;
-	background-image:		url('../../../../doc/plus-12x12.png');
-}
-
-#chapters.expandable li.chapter span.chapter_title.nosub {
-	margin-left:			22px;
-}
-
-#chapters.expandable li.chapter ul.sections {
-	display:			none;
-}
-
-#chapters.expandable li.chapter.open .button {
-	background-image:		url('../../../../doc/minus-12x12.png');
-}
-
-#chapters.expandable li.chapter.open ul.sections {
-	display:			block;
-}
-
diff --git a/templates/web/doc/index.js b/templates/web/doc/index.js
deleted file mode 100644
index 0a8737a..0000000
--- a/templates/web/doc/index.js
+++ /dev/null
@@ -1,11 +0,0 @@
-// Add the expand/collapse functionality
-$('#chapters').addClass('expandable').find('.button').click(function () {
-    $(this).parent().toggleClass('open');
-});
-$('#options img.expand').click(function () {
-    $('.chapter').addClass('open');
-});
-$('#options img.collapse').click(function () {
-    $('.chapter').removeClass('open')
-});
-$('#options').removeClass('hidden');
\ No newline at end of file
diff --git a/templates/web/doc/minus-12x12.png b/templates/web/doc/minus-12x12.png
deleted file mode 100644
index 81c2ee0..0000000
Binary files a/templates/web/doc/minus-12x12.png and /dev/null differ
diff --git a/templates/web/doc/plus-12x12.png b/templates/web/doc/plus-12x12.png
deleted file mode 100644
index 94f34b1..0000000
Binary files a/templates/web/doc/plus-12x12.png and /dev/null differ
diff --git a/templates/web/index.css b/templates/web/index.css
deleted file mode 100644
index 1cbc418..0000000
--- a/templates/web/index.css
+++ /dev/null
@@ -1,8 +0,0 @@
-#inner img {
-	float:				left;
-	margin:				0 1em 0.5em 0;
-}
-
-#book_info {
-	min-height:			100px;
-}
diff --git a/templates/web/index.xsl b/templates/web/index.xsl
index 464b442..4e91c28 100644
--- a/templates/web/index.xsl
+++ b/templates/web/index.xsl
@@ -14,7 +14,7 @@
 	<xsl:variable name="html.head.append">
 
 		<!-- CSS -->
-			<link rel="stylesheet" type="text/css" href="{$docroot}/index.css"/>
+			<link rel="stylesheet" type="text/css" href="{$staticroot}/css/index.css"/>
 
 	        <!-- Canonical -->
                         <link rel="canonical" href="http://www.exim.org/"/>
diff --git a/templates/wrapper.xsl b/templates/wrapper.xsl
index 22052f9..d9a2edf 100644
--- a/templates/wrapper.xsl
+++ b/templates/wrapper.xsl
@@ -23,10 +23,10 @@
       <xsl:template match="/">
          <html lang="en-GB">
             <head>
-               <link rel="stylesheet" type="text/css" href="{$docroot}/common.css"/>
+               <link rel="stylesheet" type="text/css" href="{$staticroot}/css/common.css"/>
 
                <meta name="author"      content="The Exim Project. &lt;http://www.exim.org/&gt;"/>
-               <meta name="copyright"   content="Copyright ©1995-2011 The Exim Project. All rights reserved"/>
+               <meta name="copyright"   content="Copyright ©1995-2012 The Exim Project. All rights reserved"/>
                <meta name="description" content="{$html.head.description}"/>
                <meta name="keywords"    content="{$html.head.keywords}"/>
                <meta name="robots"      content="{$html.head.robots}"/>
@@ -119,7 +119,7 @@
                    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
 
                 <!-- Local JavaScript -->
-                   <script type="text/javascript" src="{$docroot}/common.js"></script>
+                   <script type="text/javascript" src="{$staticroot}/js/common.js"></script>
                    
                    <xsl:copy-of select="$html.body.append"/>