| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 | 2 |
| 3 <html ng-app="Loader" ng-controller="Loader.Controller"> | 3 <html ng-app="Loader" ng-controller="Loader.Controller"> |
| 4 | 4 |
| 5 <head> | 5 <head> |
| 6 <title ng-bind="windowTitle"></title> | 6 <title ng-bind="windowTitle"></title> |
| 7 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"
></script> | 7 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"
></script> |
| 8 <script src="loader.js"></script> | 8 <script src="loader.js"></script> |
| 9 <link rel="stylesheet" href="view.css"> | 9 <link rel="stylesheet" href="view.css"> |
| 10 </head> | 10 </head> |
| 11 | 11 |
| 12 <body> | 12 <body> |
| 13 <em> | 13 <em> |
| 14 {{loadingMessage}} | 14 {{loadingMessage}} |
| 15 </em> | 15 </em> |
| 16 | 16 |
| 17 <div ng-hide="!categories"><!-- everything: hide until data is loaded --> | 17 <div ng-hide="!categories"><!-- everything: hide until data is loaded --> |
| 18 | 18 |
| 19 <div ng-hide="!(header.isEditable && header.isExported)" | 19 <div class="warning-div" |
| 20 style="background-color:#ffbb00"> | 20 ng-hide="!(header.isEditable && header.isExported)"> |
| 21 WARNING! These results are editable and exported, so any user | 21 WARNING! These results are editable and exported, so any user |
| 22 who can connect to this server over the network can modify them. | 22 who can connect to this server over the network can modify them. |
| 23 </div> | 23 </div> |
| 24 | 24 |
| 25 <div style="background-color:#bbffbb"><!-- TODOs --> | 25 <div class="todo-div"><!-- TODOs --> |
| 26 <p> | 26 <p> |
| 27 TODO(epoger): | 27 TODO(epoger): |
| 28 <input type="checkbox" name="showTodosCheckbox" value="true" | 28 <input type="checkbox" name="showTodosCheckbox" value="true" |
| 29 ng-checked="showTodos == true" | 29 ng-checked="showTodos == true" |
| 30 ng-click="showTodos = !showTodos"> | 30 ng-click="showTodos = !showTodos"> |
| 31 show | 31 show |
| 32 <ul ng-hide="!showTodos"> | 32 <ul ng-hide="!showTodos"> |
| 33 <li> | 33 <li> |
| 34 If server was run with --reload flag, automatically check for | 34 If server was run with --reload flag, automatically check for |
| 35 new results and tell the user when new results are available | 35 new results and tell the user when new results are available |
| (...skipping 16 matching lines...) Expand all Loading... |
| 52 results. Can we fix the column widths to be wide enough to hold | 52 results. Can we fix the column widths to be wide enough to hold |
| 53 any result, even the currently hidden results? | 53 any result, even the currently hidden results? |
| 54 </li> | 54 </li> |
| 55 </ul> | 55 </ul> |
| 56 </div><!-- TODOs --> | 56 </div><!-- TODOs --> |
| 57 | 57 |
| 58 <div ng-hide="!(header.timeUpdated)"> | 58 <div ng-hide="!(header.timeUpdated)"> |
| 59 Results current as of {{localTimeString(header.timeUpdated)}} | 59 Results current as of {{localTimeString(header.timeUpdated)}} |
| 60 </div> | 60 </div> |
| 61 | 61 |
| 62 <div style="font-size:20px"><!-- tabs --> | 62 <div><!-- tabs --> |
| 63 <div ng-repeat="tab in tabs" | 63 <div class="tab-spacer" ng-repeat="tab in tabs"> |
| 64 style="display:inline-block"> | |
| 65 <div class="tab-{{tab == viewingTab}}" | 64 <div class="tab-{{tab == viewingTab}}" |
| 66 style="display:inline-block" | |
| 67 ng-click="setViewingTab(tab)"> | 65 ng-click="setViewingTab(tab)"> |
| 68 {{tab}} ({{numResultsPerTab[tab]}}) | 66 {{tab}} ({{numResultsPerTab[tab]}}) |
| 69 </div> | 67 </div> |
| 70 <div style="display:inline-block"> | 68 <div class="tab-spacer"> |
| 71 | 69 |
| 72 </div> | 70 </div> |
| 73 </div> | 71 </div> |
| 74 </div><!-- tabs --> | 72 </div><!-- tabs --> |
| 75 | 73 |
| 76 <div class="tab-true"><!-- display of current tab --> | 74 <div class="tab-main"><!-- main display area of selected tab --> |
| 77 | 75 |
| 78 <br> | 76 <br> |
| 77 <!-- We only show the filters/settings table on the Unfiled tab. --> |
| 79 <table ng-hide="viewingTab != defaultTab" border="1"> | 78 <table ng-hide="viewingTab != defaultTab" border="1"> |
| 80 <tr> | 79 <tr> |
| 81 <th colspan="2"> | 80 <th colspan="2"> |
| 82 Filters | 81 Filters |
| 83 </th> | 82 </th> |
| 84 <th> | 83 <th> |
| 85 Settings | 84 Settings |
| 86 </th> | 85 </th> |
| 87 </tr> | 86 </tr> |
| 88 <tr valign="top"> | 87 <tr valign="top"> |
| 89 <td> | 88 <td> |
| 90 resultType<br> | 89 resultType<br> |
| 91 <label ng-repeat="(resultType, count) in categories['resultType']"> | 90 <label ng-repeat="(resultType, count) in categories['resultType']"> |
| 92 <input type="checkbox" | 91 <input type="checkbox" |
| 93 name="resultTypes" | 92 name="resultTypes" |
| 94 value="{{resultType}}" | 93 value="{{resultType}}" |
| 95 ng-checked="!isHiddenResultType(resultType)" | 94 ng-checked="!isValueInSet(resultType, hiddenResultTypes)" |
| 96 ng-click="toggleHiddenResultType(resultType)"> | 95 ng-click="toggleValueInSet(resultType, hiddenResultTypes); setU
pdatesPending(true)"> |
| 97 {{resultType}} ({{count}})<br> | 96 {{resultType}} ({{count}})<br> |
| 98 </label> | 97 </label> |
| 99 </td> | 98 </td> |
| 100 <td> | 99 <td> |
| 101 config<br> | 100 config<br> |
| 102 <label ng-repeat="(config, count) in categories['config']"> | 101 <label ng-repeat="(config, count) in categories['config']"> |
| 103 <input type="checkbox" | 102 <input type="checkbox" |
| 104 name="configs" | 103 name="configs" |
| 105 value="{{config}}" | 104 value="{{config}}" |
| 106 ng-checked="!isHiddenConfig(config)" | 105 ng-checked="!isValueInSet(config, hiddenConfigs)" |
| 107 ng-click="toggleHiddenConfig(config)"> | 106 ng-click="toggleValueInSet(config, hiddenConfigs); setUpdatesPe
nding(true)"> |
| 108 {{config}} ({{count}})<br> | 107 {{config}} ({{count}})<br> |
| 109 </label> | 108 </label> |
| 110 </td> | 109 </td> |
| 111 <td><table> | 110 <td><table> |
| 112 <tr><td> | 111 <tr><td> |
| 113 Image size | 112 Image size |
| 114 <input type="text" ng-model="imageSizePending" | 113 <input type="text" ng-model="imageSizePending" |
| 115 ng-init="imageSizePending=100" | 114 ng-init="imageSizePending=100" |
| 116 ng-change="areUpdatesPending = true" | 115 ng-change="areUpdatesPending = true" |
| 117 maxlength="4"/> | 116 maxlength="4"/> |
| 118 </td></tr> | 117 </td></tr> |
| 119 <tr><td> | 118 <tr><td> |
| 120 Max records to display | 119 Max records to display |
| 121 <input type="text" ng-model="displayLimitPending" | 120 <input type="text" ng-model="displayLimitPending" |
| 122 ng-init="displayLimitPending=50" | 121 ng-init="displayLimitPending=50" |
| 123 ng-change="areUpdatesPending = true" | 122 ng-change="areUpdatesPending = true" |
| 124 maxlength="4"/> | 123 maxlength="4"/> |
| 125 </td></tr> | 124 </td></tr> |
| 126 <tr><td> | 125 <tr><td> |
| 127 <button style="font-size:30px" | 126 <button class="update-results-button" |
| 128 ng-click="updateResults()" | 127 ng-click="updateResults()" |
| 129 ng-disabled="!areUpdatesPending"> | 128 ng-disabled="!areUpdatesPending"> |
| 130 Update Results | 129 Update Results |
| 131 </button> | 130 </button> |
| 132 </td></tr> | 131 </td></tr> |
| 133 </tr></table></td> | 132 </tr></table></td> |
| 134 </tr> | 133 </tr> |
| 135 </table> | 134 </table> |
| 136 | 135 |
| 137 <p> | 136 <p> |
| 138 | 137 |
| 138 <!-- Submission UI that we only show in the Pending Approval tab. --> |
| 139 <div ng-hide="'Pending Approval' != viewingTab"> | 139 <div ng-hide="'Pending Approval' != viewingTab"> |
| 140 <div style="display:inline-block"> | 140 <div style="display:inline-block"> |
| 141 <button style="font-size:20px" | 141 <button style="font-size:20px" |
| 142 ng-click="submitApprovals(filteredTestData)" | 142 ng-click="submitApprovals(filteredTestData)" |
| 143 ng-disabled="submitPending || (filteredTestData.length == 0)"> | 143 ng-disabled="submitPending || (filteredTestData.length == 0)"> |
| 144 Update these {{filteredTestData.length}} expectations on the server | 144 Update these {{filteredTestData.length}} expectations on the server |
| 145 </button> | 145 </button> |
| 146 </div> | 146 </div> |
| 147 <div style="display:inline-block"> | 147 <div style="display:inline-block"> |
| 148 <div style="font-size:20px" | 148 <div style="font-size:20px" |
| (...skipping 26 matching lines...) Expand all Loading... |
| 175 </button> | 175 </button> |
| 176 </div> | 176 </div> |
| 177 </div> | 177 </div> |
| 178 <div style="clear:both"> | 178 <div style="clear:both"> |
| 179 </div> | 179 </div> |
| 180 </div> | 180 </div> |
| 181 <br> | 181 <br> |
| 182 | 182 |
| 183 <table border="1"> | 183 <table border="1"> |
| 184 <tr> | 184 <tr> |
| 185 <!-- Most column headers are displayed in a common fashion... --> |
| 185 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf
ig']"> | 186 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf
ig']"> |
| 186 <input type="radio" | 187 <input type="radio" |
| 187 name="sortColumnRadio" | 188 name="sortColumnRadio" |
| 188 value="{{categoryName}}" | 189 value="{{categoryName}}" |
| 189 ng-checked="(sortColumn == categoryName)" | 190 ng-checked="(sortColumn == categoryName)" |
| 190 ng-click="sortResultsBy(categoryName)"> | 191 ng-click="sortResultsBy(categoryName)"> |
| 191 {{categoryName}} | 192 {{categoryName}} |
| 192 </th> | 193 </th> |
| 194 <!-- ... but there are a few columns where we display things different
ly. --> |
| 193 <th> | 195 <th> |
| 194 <input type="radio" | 196 <input type="radio" |
| 195 name="sortColumnRadio" | 197 name="sortColumnRadio" |
| 196 value="expectedHashDigest" | 198 value="expectedHashDigest" |
| 197 ng-checked="(sortColumn == 'expectedHashDigest')" | 199 ng-checked="(sortColumn == 'expectedHashDigest')" |
| 198 ng-click="sortResultsBy('expectedHashDigest')"> | 200 ng-click="sortResultsBy('expectedHashDigest')"> |
| 199 expected image | 201 expected image |
| 200 </th> | 202 </th> |
| 201 <th> | 203 <th> |
| 202 <input type="radio" | 204 <input type="radio" |
| (...skipping 19 matching lines...) Expand all Loading... |
| 222 </td> | 224 </td> |
| 223 <td> | 225 <td> |
| 224 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g
oogleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDi
gest}}.png"> | 226 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g
oogleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDi
gest}}.png"> |
| 225 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata
storage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.act
ualHashDigest}}.png"/> | 227 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata
storage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.act
ualHashDigest}}.png"/> |
| 226 </a> | 228 </a> |
| 227 </td> | 229 </td> |
| 228 <td> | 230 <td> |
| 229 <input type="checkbox" | 231 <input type="checkbox" |
| 230 name="rowSelect" | 232 name="rowSelect" |
| 231 value="{{result.index}}" | 233 value="{{result.index}}" |
| 232 ng-checked="isItemSelected(result.index)" | 234 ng-checked="isValueInArray(result.index, selectedItems)" |
| 233 ng-click="toggleItemSelected(result.index)"> | 235 ng-click="toggleValueInArray(result.index, selectedItems)"> |
| 234 </tr> | 236 </tr> |
| 235 </table> | 237 </table> |
| 236 </div><!-- display of current tab --> | 238 </div><!-- main display area of selected tab --> |
| 237 </div><!-- everything: hide until data is loaded --> | 239 </div><!-- everything: hide until data is loaded --> |
| 238 | 240 |
| 239 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and | 241 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and |
| 240 issues list) from | 242 issues list) from |
| 241 http://skia.googlecode.com/svn/buildbot/site_config/global_variables.json | 243 http://skia.googlecode.com/svn/buildbot/site_config/global_variables.json |
| 242 ? I tried importing the | 244 ? I tried importing the |
| 243 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using | 245 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using |
| 244 that to do so, but I got Access-Control-Allow-Origin errors. | 246 that to do so, but I got Access-Control-Allow-Origin errors. |
| 245 --> | 247 --> |
| 246 | 248 |
| 247 </body> | 249 </body> |
| 248 </html> | 250 </html> |
| OLD | NEW |