| 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 |