shake-0.3.1: html/report.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Shake report</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Shake summary report">
<link href="bootstrap.css" rel="stylesheet" type="text/css" />
<link href="bootstrap-responsive.css" rel="stylesheet" type="text/css"/>
<style>
.table {width: inherit;}
.table td {vertical-align: middle;}
.progress {margin-bottom: 0px;}
input {padding: 1px;}
body {margin-top: 15px;}
h1 {margin-bottom: 10px;}
h2 {margin-top: 20px; margin-bottom: 10px;}
.tab-pane {margin-top: 5px;}
.sorted {background: rgb(217,230,255);}
#details-output .sortable {cursor: pointer;}
#details-output th {vertical-align: top;}
.erroroneous {background: #faa;}
.error {border: 2px solid red; border-radius: 10px; padding: 5px; background: #faa;}
</style>
</head>
<body onload="load()"><div class="container">
<ul class="nav nav-tabs" id="tabs">
<li class="active"><a href="#overview">Overview</a></li>
<li><a href="#details">Details</a></li>
<li><a href="#expensive-rules">Expensive rules</a></li>
<li><a href="#expensive-commands">Expensive commands</a></li>
<li><a href="#rebuild-cost">Rebuild costs</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="overview">
<h1>Build Profile Report</h1>
<div id="summary"></div>
<h2>Traced commands</h2>
<div id="shakeplot" style="min-width:200px;width:80%;height:200px;"></div>
<p style="margin-top: 20px;">
This build report was generated by the <a href="http://hackage.haskell.org/package/shake">shake</a>
build system, using <a href="http://twitter.github.com/bootstrap">Bootstrap</a>,
<a href="http://jquery.com">jQuery</a> and <a href="http://code.google.com/p/flot">flot</a>.
</p>
</div>
<div class="tab-pane" id="details">
<p style="color:#d00;">Warning: this view is still under active development</p>
<p>
Advanced filter: <input id="advanced-filter" type="text" /><button id="advanced-apply">Apply</button>
</p>
<table id="details-output" class='table table-condensed'>
<thead>
<th><br/>Filter</th> <!-- bar -->
<th id="details-group" style="display:none;"><span class="sortable">Group</span></th>
<th><span class="sortable">Name</span><br/>
<input type="text" id="rule-filter" style="width: 10em;" />
<select id="rule-type" style="width: 11em;">
<option value="byName">By name</option>
<option value="thisDependsOn">This depends on</option>
<option value="thisDependsOnTransitive">This depends on (transitive)</option>
<option value="dependsOnThis">Depends on this</option>
<option value="dependsOnThisTransitive">Depends on this (transitive)</option>
</select>
</th>
<th colspan="2"><span class="sortable">Time</span></th>
<th colspan="2"><span class="sortable">Cost</span></th>
<th><span class="sortable">Unchanged</span><br/>
<input style="width: 5em;" type="text" id="unchanged-filter" />
</th>
<th><span class="sortable">Runs since</span><br/>
<input style="width: 5em;" type="text" id="runs-filter" />
</th>
<th><span class="sortable">Leaf</span><br/>
<input style="width: 5em;" type="text" id="leaf-filter" />
</th>
<th><span class="sortable">Commands</span><br/>
<input style="width: 10em;" type="text" id="command-filter" />
</th>
</thead>
<tbody></tbody>
</table>
</div>
<div class="tab-pane" id="expensive-rules">
<table id='rule-details' class='table table-condensed'>
<thead><tr>
<th></th>
<th>Time</th>
<th>Overall</th>
<th>Rule</th>
</tr></thead>
<tbody></tbody>
</table>
</div>
<div class="tab-pane" id="expensive-commands">
<table id='cmd-details' class='table table-condensed'>
<thead><tr>
<th></th>
<th>Time</th>
<th>Overall</th>
<th>Run</th>
<th>Name</th>
</tr></thead>
<tbody></tbody>
</table>
</div>
<div class="tab-pane" id="rebuild-cost">
<div class="control-group">Filter: <input type="text" /><span class="help-inline">Enter a regular expression, with (grouping)</span></div>
<table id='rebuild-details' class='table table-condensed'>
<thead><tr>
<th></th>
<th>Time</th>
<th>Overall</th>
<th>Rule</th>
</tr></thead>
<tbody></tbody>
</table>
</div>
</div>
</div> <!-- /container -->
<!-- Javascript placed at the end of the document so the pages load faster -->
<script src="jquery.js"></script>
<script src="jquery-flot.js"></script>
<script src="bootstrap.js"></script>
<script src="bootstrap-tab.js"></script>
<!-- Profiling output -->
<script src="data.js"></script>
<!-- Functions for creating info from Shake builds -->
<script src="shake.js"></script>
<script>
$('#tabs a').click(function (e) {
e.preventDefault();
$(this).tab('show');
})
</script>
</body>
</html>