<html>
<head>
<title><%= title %></title>
<!-- TODO: most of the css before the '*' can be removed. -->
<style>
#container{ margin: 0 auto; width: 800px; }
/* Debug borders */
/* p, li, dt, dd, div, pre, h1, h2, h3, h4, h5, h6 { border: 1px solid red; } */
body { font-size: 14px; line-height: 20px; margin: 1em 5% 1em 5%; font-family: Verdana, Arial, Helvetica, sans-serif; }
a { color: #336; text-decoration: underline; }
a:visited { color: #334; }
em { font-style: italic; }
strong { font-weight: bold; }
tt { color: navy; }
h1, h2, h3, h4, h5, h6 { color: #223; margin-top: 1.2em; margin-bottom: 0.5em; line-height: 1.3; }
h1 { border-bottom: 2px solid silver; }
h2 { border-bottom: 2px solid silver; padding-top: 0.5em; }
hr { color: #ccc; margin-top: 1.6em; }
p { color: #222; text-align: justify; margin-top: 0.5em; margin-bottom: 0.5em; line-height: 1.4em; }
/* pre { padding: 10; margin: 0; font-family: monospace; font-size: 0.9em; } */
pre.pass { color: green; }
pre.fail { color: red; }
pre.error { color: red; font-weight: bold; }
span#author { color: #527bbd; font-weight: bold; font-size: 1.1em; }
span#email { }
span#revision { }
div#footer { font-size: small; border-top: 2px solid silver; padding-top: 0.5em; margin-top: 4.0em; }
div#footer-text { float: left; padding-bottom: 0.5em; }
div#footer-badges { float: right; padding-bottom: 0.5em; }
/* Block element content. */
div.content { padding: 0; }
/* Block element titles. */
h1.title { font-weight: bold; text-align: left; font-size: 3em; margin-top: 1.0em; margin-bottom: 0.5em; }
/* Block element titles. */
div.title, caption.title { font-weight: bold; text-align: left; margin-top: 1.0em; margin-bottom: 0.5em; }
div.title + * { margin-top: 0; }
td div.title:first-child { margin-top: 0.0em; }
div.content div.title:first-child { margin-top: 0.0em; }
div.content + div.title { margin-top: 0.0em; }
div.sidebarblock > div.content { background: #ffffee; border: 1px solid silver; padding: 0.5em; }
img { border-style: none; }
dl { margin-top: 0.8em; margin-bottom: 0.8em; }
dt { margin-top: 0.5em; margin-bottom: 0; font-style: italic; }
dd > *:first-child { margin-top: 0; }
ul, ol { list-style-position: outside; }
thead { font-weight: bold; }
tfoot { font-weight: bold; }
*{margin:0;padding:0;}
html,body{height:100%;color:black;}
body{background-color:white;font:13.34px helvetica,arial,freesans,clean,sans-serif;*font-size:small;}
table{font-size:inherit;font:100%;}
select,input[type=text],input[type=password],input[type=image],textarea{font:99% helvetica,arial,freesans,sans-serif;}
select,option{padding:0 .25em;}
optgroup{margin-top:.5em;}
input.text{padding:1px 0;}
pre,code{font:12px Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;}
body *{line-height:1.4em;}
p{margin:1em 0;}
img{border:0;}
abbr{border-bottom:none;}
.wikistyle h1,.wikistyle h2,.wikistyle h3,.wikistyle h4,.wikistyle h5,.wikistyle h6{border:0!important;}
.wikistyle h1{font-size:170%!important;border-top:4px solid #aaa!important;padding-top:.5em!important;margin-top:1.5em!important;}
.wikistyle h1:first-child{margin-top:0!important;padding-top:.25em!important;border-top:none!important;}
.wikistyle h2{font-size:150%!important;margin-top:1.5em!important;border-top:4px solid #e0e0e0!important;padding-top:.5em!important;}
.wikistyle h3{margin-top:1em!important;}
.wikistyle p{margin:1em 0!important;line-height:1.5em!important;}
.wikistyle ul{margin:1em 0 1em 2em!important;}
.wikistyle ol{margin:1em 0 1em 2em!important;}
.wikistyle ul ul,.wikistyle ul ol,.wikistyle ol ol,.wikistyle ol ul{margin-top:0!important;margin-bottom:0!important;}
.wikistyle blockquote{margin:1em 0!important;border-left:5px solid #ddd!important;padding-left:.6em!important;color:#555!important;}
.wikistyle dt{font-weight:bold!important;margin-left:1em!important;}
.wikistyle dd{margin-left:2em!important;margin-bottom:1em!important;}
.wikistyle table{margin:1em 0!important;}
.wikistyle table th{border-bottom:1px solid #bbb!important;padding:.2em 1em!important;}
.wikistyle table td{border-bottom:1px solid #ddd!important;padding:.2em 1em!important;}
.wikistyle pre{margin:1em 0!important;font-size:90%!important;background-color:#f8f8ff!important;border:1px solid #dedede!important;padding:.5em!important;line-height:1.5em!important;color:#444!important;overflow:auto!important;}
.wikistyle pre code{padding:0!important;font-size:100%!important;background-color:#f8f8ff!important;border:none!important;}
.wikistyle code{font-size:90%!important;background-color:#f8f8ff!important;color:#444!important;padding:0 .2em!important;border:1px solid #dedede!important;}
.wikistyle pre.console{margin:1em 0!important;font-size:90%!important;background-color:black!important;padding:.5em!important;line-height:1.5em!important;color:white!important;}
.wikistyle pre.console code{padding:0!important;font-size:100%!important;background-color:black!important;border:none!important;color:white!important;}
.wikistyle pre.console span{color:#888!important;}
.wikistyle pre.console span.command{color:yellow!important;}
.title { font-size: 2em; }
</style>
<% if css %>
<link rel="stylesheet" href="<%= css %>" type="text/css">
<% end %>
<!-- JQuery is needed -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript" language="javascript"></script>
</head>
<body class="wikistyle">
<!-- Side Table of Contents -->
<div id="sidebar" style="position: fixed; top: 10; right: 10; background: white;">
<a href="javascript: toc_toggle();">
<img src="http://www.cdnjs.com/images/poweredbycloudflare.png" style="border: none;" alt="TOC" align="right"/>
</a>
<div id="toc_side" class="toc">
</div>
</div>
<div id="container">
<div id="header">
<img src="http://www.cdnjs.com/images/poweredbycloudflare.png" align="left" style="padding-right: 10px;" alt=""/>
<div class="title"><%= title %></div>
<h1>Table of Contents</h1>
<div class="toc">
</div>
</div>
<div id="content">
<%= spec %>
</div>
</div>
<br/><br/><br/>
</body>
</html>
<script src="../assets/scripts/spec.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript" language="javascript">
/*****************************************************************
* $.toc()
* by rebecca murphey
* rmurphey gmail com
*
* This function is called on its own and takes as an argument
* a list of selectors with which it will build a table of
* contents.
*
* The first selector will make up the top level of the TOC;
* the second selector will make up the second level of the TOC;
* etc.
*
* This function returns a div containing nested unordered lists;
* each list item is linked to an anchor tag added before the item
* on the page.
*
* usage: $.toc('h1,h2,h3').prependTo('body');
************************************************************************/
(function($) {
$.toc = function(tocList) {
$(tocList).addClass('jquery-toc');
var tocListArray = tocList.split(',');
$.each(tocListArray, function(i,v) { tocListArray[i] = $.trim(v); });
var $elements = $('.jquery-toc');
$('body').append('<div></div>');
var $toc = $('body div:last');
var lastLevel = 1;
$toc.append('<ul class="jquery-toc-1"></ul>');
$elements.each(function() {
var $e = $(this);
var text = $e.text();
var anchor = text.replace(/ /g,'-');
$e.before('<a name="' + anchor + '"></a>');
var level;
$.each(tocListArray, function(i,v) {
if (v.match(' ')) {
var vArray = v.split(' ');
var e = vArray[vArray.length - 1];
} else { e = v; }
if ($e.is(e)) { level = i+1; }
});
var className = 'jquery-toc-' + level;
var li = '<li><a href="#' + anchor + '">' + text + '</a></li>';
if (level == lastLevel) {
$('ul.' + className + ':last',$toc).append(li);
} else if (level > lastLevel) {
var parentLevel = level - 1;
var parentClassName = 'jquery-toc-' + parentLevel;
$('ul.' + parentClassName + ':last',$toc).
append('<ul class="' + className + '"></ul>');
$('ul.' + className + ':last',$toc).append(li);
} else if (level < lastLevel) {
$('ul.' + className + ':last',$toc).append(li);
}
lastLevel = level;
});
var $toc_ul = $('ul.jquery-toc-1',$toc);
$toc.remove();
return($toc_ul);
}
})(jQuery);
</script>
<script>
function toc_toggle() {
$('#toc_side').toggle();
$("pre").addClass("pass");
$("pre:contains('FAIL:')").addClass("fail");
$("pre:contains('ERROR:')").addClass("error");
};
$.toc('#content h1,h2,h3,h4').appendTo('.toc');
toc_toggle();
</script>