Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(588)

Side by Side Diff: Tools/Scripts/webkitpy/thirdparty/webpagereplay/perftracker/app/templates/search.html

Issue 18418010: Check in the thirdparty libs needed for webkitpy. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 7 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 <html>
2 <head>
3 <title>Chromium Perf Tracker</title>
4 <link rel="stylesheet" href="styles/style.css">
5 <script src="scripts/util.js"></script>
6 <script src="jst/util.js" type="text/javascript"></script>
7 <script src="jst/jsevalcontext.js" type="text/javascript"></script>
8 <script src="jst/jstemplate.js" type="text/javascript"></script>
9 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
10 </head>
11
12 <body onLoad="main()">
13 <h1><div id="header">Chromium Page Tracker TestSets</div></h1>
14
15 <script>
16 data = {}
17 networks_map = {}; // maps from db.Key to pretty name.
18 cpus_map = {}; // maps from db.Key to pretty name.
19
20 function loadFilters() {
21 // Fetch data for the filters.
22 var filter_data_url = "/json?type=filters";
23 new XHRGet(filter_data_url, function(result) {
24 data.filters = JSON.parse(result);
25 var context = JsEvalContext.create(data.filters);
26 var template = document.getElementById("filters_template");
27 jstProcess(context, template);
28 JsEvalContext.recycle(context);
29
30 var params = getParams();
31 setSelectValue("version_filter", params["version"]);
32 setSelectValue("networks_filter", params["network"]);
33 setSelectValue("cpus_filter", params["cpu"]);
34
35 // Populate the networks list
36 for (index in data.filters.networks) {
37 networks_map[data.filters.networks[index][1]] =
38 data.filters.networks[index][0];
39 }
40 for (index in data.filters.cpus) {
41 cpus_map[data.filters.cpus[index][1]] =
42 data.filters.cpus[index][0];
43 }
44 ProcessResults();
45 });
46 }
47
48 function loadData() {
49 var url = "/json?type=set_search";
50 var params = getParams();
51 if (params["version"]) url += "&version_filter=" + params["version"];
52 if (params["network"]) url += "&networks_filter=" + params["network"];
53 if (params["cpu"]) url += "&cpus_filter=" + params["cpu"];
54
55 new XHRGet(url, function(result) {
56 data.results = JSON.parse(result);
57 ProcessResults();
58 });
59 }
60
61 function ProcessResults() {
62 if (!data.results || !data.filters) {
63 return; // Still waiting for XHR to finish.
64 }
65
66 var context = JsEvalContext.create(data);
67 var template = document.getElementById("data_template");
68 jstProcess(context, template);
69 drawChart(data.results);
70 JsEvalContext.recycle(context);
71 }
72
73 google.load('visualization', '1', {'packages':['annotatedtimeline']});
74
75 function drawChart(results) {
76 var graph_data = new google.visualization.DataTable();
77 graph_data.addColumn('date', 'Date');
78 graph_data.addColumn('number', 'PLT');
79 graph_data.addColumn('number', 'First Paint');
80
81 for (var i = 0; i < results.length; ++i) {
82 graph_data.addRow([new Date(results[i].date),
83 results[i].total_time,
84 results[i].paint_time, ]);
85 }
86
87 var chart_div = document.getElementById('chart_div');
88 if (graph_data.getNumberOfRows()) {
89 var chart = new google.visualization.AnnotatedTimeLine(chart_div);
90 chart.draw(graph_data, {displayAnnotations: true});
91 } else {
92 chart_div.innerHTML = "No data";
93 }
94 }
95
96 function filterChanged() {
97 var params = {};
98 var versionFilter = getSelectValue("version_filter");
99 if (versionFilter) params["version"] = versionFilter;
100 var networksFilter = getSelectValue("networks_filter");
101 if (networksFilter) params["network"] = networksFilter;
102 var cpusFilter = getSelectValue("cpus_filter");
103 if (cpusFilter) params["cpu"] = cpusFilter;
104 setParams(params);
105 loadData();
106 }
107
108 function main() {
109 loadData();
110 loadFilters();
111 }
112
113 </script>
114
115 <div id="filters_template">
116 <div id="filter" style="border:1px solid black">
117 <table class="sortable">
118 <tr>
119 <td>Version</td>
120 <td>Network</td>
121 <td>CPU</td>
122 </tr>
123 <tr>
124 <td>
125 <select id="version_filter" onchange="filterChanged()">
126 <option></option>
127 <option jsselect="versions" jscontent="$this[0]"
128 jsvalues=".value:$this[1]"></option>
129 </select>
130 </td>
131 <td><select id="networks_filter" onchange="filterChanged()">
132 <option></option>
133 <option jsselect="networks" jscontent="$this[0]"
134 jsvalues=".value:$this[1]"></option>
135 </select>
136 </td>
137 <td><select id="cpus_filter" onchange="filterChanged()">
138 <option></option>
139 <option jsselect="cpus" jscontent="$this[0]"
140 jsvalues=".value:$this[1]"></option>
141 </select>
142 </td>
143 </tr>
144 </table>
145 </div>
146 </div>
147
148 <div id='chart_div' style='width: 700px; height: 240px;'></div>
149
150 <div id="data_template">
151 <form method="GET" action="/do_compare_set">
152 <table class="sortable">
153 <tr>
154 <th>Date</th>
155 <th>Machine</th>
156 <th>CPU</th>
157 <th>Network</th>
158 <th>URLs</th>
159 <th>Iterations</th>
160 <th>Start</th>
161 <th>DNS</th>
162 <th>Connect</th>
163 <th>First Byte</th>
164 <th>Last Byte</th>
165 <th>Paint</th>
166 <th>Interactive</th>
167 <th>DCL</th>
168 <th>Load</th>
169 <th><a href="#" onclick="document.forms[0].submit(); return false;">Comp are</a></th>
170 </tr>
171 <tr jsselect="results">
172 <td><span jseval="$val = '/do_view_set?id=' + key"></span><a jsvalues="h ref:$val" jscontent="date"></a></td>
173 <td jscontent="client_hostname.split('.')[0] + (notes ? ' ' + notes : '' )"></td>
174 <td jscontent="cpus_map[cpu]"></td>
175 <td jscontent="networks_map[network]"></td>
176 <td class="righttext" jscontent="url_count"></td>
177 <td class="righttext" jscontent="iterations"></td>
178 <td class="righttext" jscontent="start_load_time"></td>
179 <td class="righttext" jscontent="dns_time"></td>
180 <td class="righttext" jscontent="connect_time"></td>
181 <td class="righttext" jscontent="first_byte_time"></td>
182 <td class="righttext" jscontent="last_byte_time"></td>
183 <td class="righttext" jscontent="paint_time"></td>
184 <td class="righttext" jscontent="doc_load_time"></td>
185 <td class="righttext" jscontent="dcl_time"></td>
186 <td class="righttext" jscontent="total_time"></td>
187 <td class="righttext"><input type="checkbox" name="id" jsvalues="value:k ey"></td>
188 </table>
189 </form>
190 </div>
191 <div id="footer">
192 &copy;2011 Google - <a href="http://code.google.com/p/web-page-replay/wiki /ChromeBenchmarkMetrics">Metric definitions</a> | <a href="http://code.google.co m/p/web-page-replay/wiki/ChromeBenchmark">Running the benchmark</a><br>
193 Powered by <a href="http://code.google.com/p/web-page-replay/">Web Page Re play</a>
194 </div>
195 </body>
196 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698