Index: chrome/test/data/extensions/samples/benchmark/options.html |
=================================================================== |
--- chrome/test/data/extensions/samples/benchmark/options.html (revision 0) |
+++ chrome/test/data/extensions/samples/benchmark/options.html (revision 0) |
@@ -0,0 +1,228 @@ |
+<head> |
+ <title>Page Benchmark Options</title> |
+ <script src="jst/util.js" type="text/javascript"></script> |
+ <script src="jst/jsevalcontext.js" type="text/javascript"></script> |
+ <script src="jst/jstemplate.js" type="text/javascript"></script> |
+ <script src="jst/jstemplate_example.js" type="text/javascript"></script> |
+ |
+<style> |
+body { |
+ font-size: 84%; |
+ font-family: Arial, Helvetica, sans-serif; |
+ padding: 0.75em; |
+ margin: 0; |
+ min-width: 45em; |
+} |
+ |
+h1 { |
+ font-size: 110%; |
+ font-weight: bold; |
+ color: #4a8ee6; |
+ letter-spacing: -1px; |
+ padding: 0; |
+ margin: 0; |
+} |
+ |
+div#header { |
+ padding: 0.75em 1em; |
+ padding-top: 0.6em; |
+ padding-left: 10; |
+ margin-bottom: 0.75em; |
+ position: relative; |
+ overflow: hidden; |
+ background: #5296de; |
+ -webkit-background-size: 100%; |
+ border: 1px solid #3a75bd; |
+ -webkit-border-radius: 6px; |
+ color: white; |
+ text-shadow: 0 0 2px black; |
+} |
+div#header h1 { |
+ padding-left: 37px; |
+ margin: 0; |
+ display: inline; |
+ color: white; |
+} |
+div#header p { |
+ font-size: 84%; |
+ font-style: italic; |
+ padding: 0; |
+ margin: 0; |
+ color: white; |
+ padding-left: 0.4em; |
+ display: inline; |
+} |
+ |
+table.list { |
+ font-size: 84%; |
+ table-layout: fixed; |
+} |
+ |
+table.list:not([class*='filtered']) tr:nth-child(odd) td:not([class*='filtered']) { |
+ background: #eff3ff; |
+} |
+ |
+table.list th { |
+ padding: 0 0.5em; |
+ vertical-align: top; |
+ font-weight: bold; |
+ color: #315d94; |
+ color: black; |
+ white-space: nowrap; |
+ text-align: center; |
+} |
+ |
+.avg { |
+ font-weight: bold; |
+ text-align: center; |
+} |
+ |
+.data { |
+ text-align: left; |
+ white-space: nowrap; |
+} |
+ |
+.bggraph { |
+ background-color: #faa; |
+ white-space: nowrap; |
+} |
+</style> |
+ |
+<script> |
+ |
+var max_sample = 0; |
+ |
+Array.max = function(array) { |
+ return Math.max.apply( Math, array ); |
+} |
+ |
+Array.min = function(array) { |
+ return Math.min.apply( Math, array ); |
+}; |
+ |
+// Compute the average of an array |
+Array.avg = function(array) { |
+ var count = array.length; |
+ var sum = 0; |
+ for (var i = 0; i < count; i++) { |
+ sum += array[i]; |
+ } |
+ return (sum / count).toFixed(1); |
+} |
+ |
+// Compute the standard deviation of an array |
+Array.stddev = function(array) { |
+ var count = array.length; |
+ var mean = Array.avg(array); |
+ var variance = 0; |
+ for (var i = 0; i < count; i++) { |
+ var deviation = mean - array[i]; |
+ variance = variance + deviation * deviation; |
+ } |
+ variance = variance / count; |
+ return Math.sqrt(variance).toFixed(2); |
+} |
+ |
+// Computes min/max/mean/stddev, etc all up front. |
+function computeResults(data) { |
+ for (var i = 0; i < data.data.length; i++) { |
+ var obj = data.data[i]; |
+ obj.mean = Array.avg(data.data[i].results); |
+ obj.stddev = Array.stddev(data.data[i].results); |
+ obj.min = Array.min(data.data[i].results); |
+ obj.max = Array.max(data.data[i].results); |
+ } |
+ |
+ // Find the biggest sample for our bar graph. |
+ max_sample = 0; |
+ for (var i = 0; i < data.data.length; i++) { |
+ if (data.data[i].max > max_sample) { |
+ max_sample = data.data[i].max; |
+ } |
+ } |
+} |
+ |
+function jsinit() { |
+ // Run the template to show results |
+ var data = window.opener.results; |
+ computeResults(data); |
+ |
+ var context = new JsEvalContext(data); |
+ context.setVariable('$width', 0); |
+ context.setVariable('$samples', 0); |
+ var template = document.getElementById("t"); |
+ jstProcess(context, template); |
+ |
+ // Set the options |
+ var extension = window.opener; |
+ document.getElementById("iterations").value = extension.iterations; |
+ document.getElementById("clearconns").checked = extension.clearConnections; |
+ document.getElementById("clearcache").checked = extension.clearCache; |
+} |
+ |
+function getWidth(mean, max_width) { |
+ return Math.floor(max_width * (mean / max_sample)); |
+} |
+ |
+// Apply configuration back to our extension |
+function config() { |
+ var extension = window.opener; |
+ var iterations = parseInt(document.getElementById("iterations").value); |
+ var clearConnections = document.getElementById("clearconns").checked; |
+ var clearCache = document.getElementById("clearcache").checked; |
+ if (iterations > 0) { |
+ extension.iterations = iterations; |
+ extension.clearConnections = clearConnections; |
+ extension.clearCache = clearCache; |
+ } |
+} |
+ |
+// Clear the results |
+function clearResults() { |
+ window.opener.results.data = new Array(); |
+ jsinit(); |
+} |
+</script> |
+ |
+</head> |
+ |
+<body onload="jsinit()"> |
+ |
+<h1><div id="header">Page Benchmark Results</div></h1> |
+ |
+<h1>Configuration</h1> |
+ |
+<span>Iterations</span> |
+<input id="iterations" type=text style="text-align:right"> |
+<input type="button" value="Clear Results" onclick="clearResults();"> |
+Clear Connections?<input id="clearconns" type="checkbox"> |
+Clear Cache?<input id="clearcache" type="checkbox"> |
+<input type="button" value="OK" onclick="config();"> |
+<p> |
+ |
+<h1>Results</h1> |
+ |
+<table class="list" width="100%"> |
+ <tr> |
+ <th width=30%>url</th> |
+ <th width=50>avg</th> |
+ <th width=50>stddev</th> |
+ <th width=50>min</th> |
+ <th width=50>max</th> |
+ <th samples</th> |
+ </tr> |
+ |
+ <tr id="t" jsselect="data"> |
+ <td class="url" jseval="$width = getWidth($this.mean, 600)"><div jsvalues=".style.width:$width" class="bggraph"><a jsvalues="href:$this.url" jscontent="url"></a></div></td> |
+ <td class="avg" jscontent="mean"></td> |
+ <td class="avg" jscontent="stddev"></td> |
+ <td class="avg" jscontent="min"></td> |
+ <td class="avg" jscontent="max"></td> |
+ <td class="data"><span jsselect="results"><span jscontent="$this"></span>,</span> </td> |
+ </tr> |
+</table> |
+ |
+<script> |
+</script> |
+ |
+</body> |