OLD | NEW |
| (Empty) |
1 <html> | |
2 | |
3 <!-- | |
4 Copyright (c) 2012 The Chromium Authors. All rights reserved. | |
5 Use of this source code is governed by a BSD-style license that can be | |
6 found in the LICENSE file. | |
7 --> | |
8 | |
9 <!-- | |
10 Display platform comparison by channel and graph. | |
11 --> | |
12 | |
13 <head> | |
14 | |
15 <style type="text/css"> | |
16 body { | |
17 font-family: sans-serif; | |
18 } | |
19 div.plot { | |
20 cursor: pointer; | |
21 } | |
22 div.switcher * { | |
23 border: 1px solid black; | |
24 border-radius: 4px 4px 0 0; | |
25 padding-left: 0.5em; | |
26 padding-right: 0.5em; | |
27 } | |
28 div.switcher .select { | |
29 background: #ddd; | |
30 cursor: pointer; | |
31 } | |
32 canvas.plot { | |
33 border: 1px solid black; | |
34 cursor: pointer; | |
35 } | |
36 div.plot-coordinates { | |
37 font-family: monospace; | |
38 } | |
39 iframe.detail { | |
40 display: none; | |
41 width: 100%; | |
42 height: 100%; | |
43 border: none; | |
44 } | |
45 div.selector { | |
46 border: solid 1px black; | |
47 cursor: pointer; | |
48 padding-left: 0.3em; | |
49 background-color: white; | |
50 } | |
51 div.selector:hover { | |
52 background-color: rgb(200,200,250); | |
53 } | |
54 div.selected { | |
55 border-left: none; | |
56 } | |
57 div.selectors { | |
58 width: 80px; | |
59 display: none; | |
60 } | |
61 #explain { | |
62 font-size: 0.75em; | |
63 font-style: italic; | |
64 color: rgb(100,100,100); | |
65 } | |
66 </style> | |
67 | |
68 <title>Chrome Perf Platform Comparison</title> | |
69 <script src="chrome_config.js"></script> | |
70 <script src="ui/js/common.js"></script> | |
71 <script src="ui/js/plotter.js"></script> | |
72 <script src="ui/js/coordinates.js"></script> | |
73 <script src="ui/js/graph.js"></script> | |
74 | |
75 <script> | |
76 | |
77 var params = ParseParams(); | |
78 | |
79 function init() { | |
80 if (!params['test'] || !params['platforms'] || !params['channel'] || | |
81 !params['graph']) | |
82 return; | |
83 | |
84 // Fetch list of path to graphs.dat. | |
85 var testName = params['test']; | |
86 var platforms = params['platforms'].split(','); | |
87 var graphFiles = []; | |
88 var graphPaths = []; | |
89 for (var i = 0; i < platforms.length; i++) { | |
90 for (var system in ChromeConfig.systemTitles) { | |
91 if (platforms[i] == ChromeConfig.systemTitles[system]) { | |
92 var path = '../' + system + '/' + testName; | |
93 graphFiles.push(path + '/' + 'graphs.dat'); | |
94 var p = { | |
95 path: path, | |
96 machine: platforms[i], | |
97 } | |
98 graphPaths.push(p); | |
99 } | |
100 } | |
101 } | |
102 new FetchList(graphFiles, onGraphListReceived, graphPaths); | |
103 } | |
104 | |
105 function onGraphListReceived(data, graphPaths) { | |
106 // Select graph from graph list. | |
107 var toBeGraphedList = []; | |
108 for (var i = 0; i < data.length; i++) { | |
109 var graphList = JsonToJs(data[i]); | |
110 if (graphList) { | |
111 for (var j = 0; j < graphList.length; j++) { | |
112 if (graphList[j].name == params['graph']) { | |
113 var gList = graphList[j]; | |
114 gList.loc = graphPaths[i].path + '/' + params['graph'] + | |
115 '-summary.dat'; | |
116 gList.machine = cleanId(graphPaths[i].machine); | |
117 toBeGraphedList.push(gList); | |
118 break; | |
119 } | |
120 } | |
121 } | |
122 } | |
123 | |
124 var options = { | |
125 channels: [params['channel']], | |
126 showDetail: false, | |
127 showTabs: false, | |
128 orderDataByVersion: true, | |
129 enableMouseScroll: true, | |
130 }; | |
131 var graph = new Graph('output', toBeGraphedList, options) | |
132 graph.setTitle('<h3>' + ChromeConfig.testTitles[params['test']] + ': ' + | |
133 params['graph'] + '</h3>'); | |
134 graph.graph(); | |
135 } | |
136 | |
137 function cleanId(str) { | |
138 return str.replace(/\s/g, '_').toLowerCase(); | |
139 } | |
140 | |
141 function reportError(error) { | |
142 document.getElementById('output').innerHTML = "<p>" + error + "</p>"; | |
143 } | |
144 | |
145 window.addEventListener('load', init, false); | |
146 </script> | |
147 </head> | |
148 <body> | |
149 <br /> | |
150 <center> | |
151 <h2>Chrome Perf Platform Comparison</h2> | |
152 </center> | |
153 <div id="explain"> | |
154 The vertical axis is measured values, and the horizontal | |
155 axis is the version number for the build being tested. | |
156 Shift-click to place baseline. Shift-scroll to zoom slowly. | |
157 </div> | |
158 <p></p> | |
159 <div id="output"></div> | |
160 <pre id="log"></pre> | |
161 </body> | |
162 </html> | |
OLD | NEW |