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

Side by Side Diff: gm/rebaseline_server/static/view.html

Issue 44123004: rebaseline_server: UI improvements + set reviewed-by-human on commit (Closed) Base URL: http://skia.googlecode.com/svn/trunk/
Patch Set: javascript_style_fix Created 7 years, 1 month 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
« no previous file with comments | « gm/rebaseline_server/static/loader.js ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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 class="warning-div" 19 <div class="warning-div"
20 ng-hide="!(header.isEditable && header.isExported)"> 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 class="todo-div"><!-- 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" ng-model="showTodos">
29 ng-checked="showTodos == true"
30 ng-click="showTodos = !showTodos">
31 show 29 show
32 <ul ng-hide="!showTodos"> 30 <ul ng-hide="!showTodos">
33 <li> 31 <li>
34 If server was run with --reload flag, automatically check for 32 If server was run with --reload flag, automatically check for
35 new results and tell the user when new results are available 33 new results and tell the user when new results are available
36 (the user can reload the page if he wants to see them). 34 (the user can reload the page if he wants to see them).
37 </li><li> 35 </li><li>
38 Add ability to filter builder and test names 36 Add ability to filter builder and test names
39 (using a free-form text field, with partial string match) 37 (using a free-form text field, with partial string match)
40 </li><li> 38 </li><li>
41 Add more columns, such as pixel diffs, notes/bugs, 39 Add pixel diffs, and sorting by percentage of different pixels
42 ignoreFailure boolean 40 </li><li>
41 Add ability to sort/filter by reviewed-by-human. Depends on
42 <a href="https://code.google.com/p/skia/issues/detail?id=1758">
43 bug 1758
44 </a>
45 ('rebaseline_server: make the "categories" struct passed from server t o client a list instead of a dict')
43 </li><li> 46 </li><li>
44 Improve the column sorting, as per 47 Improve the column sorting, as per
45 <a href="http://jsfiddle.net/vojtajina/js64b/14/"> 48 <a href="http://jsfiddle.net/vojtajina/js64b/14/">
46 http://jsfiddle.net/vojtajina/js64b/14/ 49 http://jsfiddle.net/vojtajina/js64b/14/
47 </a> 50 </a>
48 </li><li> 51 </li><li>
49 Right now, if you change which column is used to 52 Right now, if you change which column is used to
50 sort the data, the column widths may fluctuate based on the 53 sort the data, the column widths may fluctuate based on the
51 longest string <i>currently visible</i> within the top {{displayLimit} } 54 longest string <i>currently visible</i> within the top {{displayLimit} }
52 results. Can we fix the column widths to be wide enough to hold 55 results. Can we fix the column widths to be wide enough to hold
(...skipping 25 matching lines...) Expand all
78 <table ng-hide="viewingTab != defaultTab" border="1"> 81 <table ng-hide="viewingTab != defaultTab" border="1">
79 <tr> 82 <tr>
80 <th colspan="2"> 83 <th colspan="2">
81 Filters 84 Filters
82 </th> 85 </th>
83 <th> 86 <th>
84 Settings 87 Settings
85 </th> 88 </th>
86 </tr> 89 </tr>
87 <tr valign="top"> 90 <tr valign="top">
91 <!-- TODO(epoger): make this an ng-repeat over resultType, config, etc? -- >
88 <td> 92 <td>
89 resultType<br> 93 resultType<br>
90 <label ng-repeat="(resultType, count) in categories['resultType']"> 94 <label ng-repeat="(resultType, count) in categories['resultType']">
91 <input type="checkbox" 95 <input type="checkbox"
92 name="resultTypes" 96 name="resultTypes"
93 value="{{resultType}}" 97 value="{{resultType}}"
94 ng-checked="!isValueInSet(resultType, hiddenResultTypes)" 98 ng-checked="!isValueInSet(resultType, hiddenResultTypes)"
95 ng-click="toggleValueInSet(resultType, hiddenResultTypes); setU pdatesPending(true)"> 99 ng-click="toggleValueInSet(resultType, hiddenResultTypes); setU pdatesPending(true)">
96 {{resultType}} ({{count}})<br> 100 {{resultType}} ({{count}})<br>
97 </label> 101 </label>
(...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after
143 ng-disabled="submitPending || (filteredTestData.length == 0)"> 147 ng-disabled="submitPending || (filteredTestData.length == 0)">
144 Update these {{filteredTestData.length}} expectations on the server 148 Update these {{filteredTestData.length}} expectations on the server
145 </button> 149 </button>
146 </div> 150 </div>
147 <div style="display:inline-block"> 151 <div style="display:inline-block">
148 <div style="font-size:20px" 152 <div style="font-size:20px"
149 ng-hide="!submitPending"> 153 ng-hide="!submitPending">
150 Submitting, please wait... 154 Submitting, please wait...
151 </div> 155 </div>
152 </div> 156 </div>
157 <div>
158 Advanced settings...
159 <input type="checkbox" ng-model="showSubmitAdvancedSettings">
160 show
161 <ul ng-hide="!showSubmitAdvancedSettings">
162 <li ng-repeat="setting in ['reviewed-by-human', 'ignore-failures']">
163 {{setting}}
164 <input type="checkbox" ng-model="submitAdvancedSettings[setting]">
165 </li>
166 <li ng-repeat="setting in ['bug']">
167 {{setting}}
168 <input type="text" ng-model="submitAdvancedSettings[setting]">
169 </li>
170 </ul>
171 </div>
153 </div> 172 </div>
154 173
155 <p> 174 <p>
156 175
157 <div> 176 <div>
158 <div style="float:left"> 177 <div style="float:left">
159 Found {{filteredTestData.length}} matches; 178 Found {{filteredTestData.length}} matches;
160 <span ng-hide="filteredTestData.length <= limitedTestData.length"> 179 <span ng-hide="filteredTestData.length <= limitedTestData.length">
161 displaying the first {{limitedTestData.length}} 180 displaying the first {{limitedTestData.length}}
162 </span> 181 </span>
163 <span ng-hide="filteredTestData.length > limitedTestData.length"> 182 <span ng-hide="filteredTestData.length > limitedTestData.length">
164 displaying them all 183 displaying them all
165 </span> 184 </span>
166 <br> 185 <br>
167 (click on the column header radio buttons to re-sort by that column) 186 (click on the column header radio buttons to re-sort by that column)
168 </div> 187 </div>
169 <div style="float:right"> 188 <div style="float:right">
189 <div>
190 all tests shown:
191 <button ng-click="selectAllItems()">
192 select
193 </button>
194 <button ng-click="clearAllItems()">
195 clear
196 </button>
197 <button ng-click="toggleAllItems()">
198 toggle
199 </button>
200 </div>
170 <div ng-repeat="otherTab in tabs"> 201 <div ng-repeat="otherTab in tabs">
171 <button ng-click="moveSelectedItemsToTab(otherTab)" 202 <button ng-click="moveSelectedItemsToTab(otherTab)"
172 ng-disabled="selectedItems.length == 0" 203 ng-disabled="selectedItems.length == 0"
173 ng-hide="otherTab == viewingTab"> 204 ng-hide="otherTab == viewingTab">
174 {{selectedItems.length}} move selected tests to {{otherTab}} tab 205 move {{selectedItems.length}} selected tests to {{otherTab}} tab
175 </button> 206 </button>
176 </div> 207 </div>
177 </div> 208 </div>
178 <div style="clear:both"> 209 <div style="clear:both">
179 </div> 210 </div>
180 </div> 211 </div>
181 <br> 212 <br>
182 213
183 <table border="1"> 214 <table border="1">
184 <tr> 215 <tr>
185 <!-- Most column headers are displayed in a common fashion... --> 216 <!-- Most column headers are displayed in a common fashion... -->
186 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf ig']"> 217 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf ig']">
187 <input type="radio" 218 <input type="radio"
188 name="sortColumnRadio" 219 name="sortColumnRadio"
189 value="{{categoryName}}" 220 value="{{categoryName}}"
190 ng-checked="(sortColumn == categoryName)" 221 ng-checked="(sortColumn == categoryName)"
191 ng-click="sortResultsBy(categoryName)"> 222 ng-click="sortResultsBy(categoryName)">
192 {{categoryName}} 223 {{categoryName}}
193 </th> 224 </th>
194 <!-- ... but there are a few columns where we display things different ly. --> 225 <!-- ... but there are a few columns where we display things different ly. -->
195 <th> 226 <th>
196 <input type="radio" 227 <input type="radio"
197 name="sortColumnRadio" 228 name="sortColumnRadio"
229 value="bugs"
230 ng-checked="(sortColumn == 'bugs')"
231 ng-click="sortResultsBy('bugs')">
232 bugs
233 </th>
234 <th>
235 <input type="radio"
236 name="sortColumnRadio"
198 value="expectedHashDigest" 237 value="expectedHashDigest"
199 ng-checked="(sortColumn == 'expectedHashDigest')" 238 ng-checked="(sortColumn == 'expectedHashDigest')"
200 ng-click="sortResultsBy('expectedHashDigest')"> 239 ng-click="sortResultsBy('expectedHashDigest')">
201 expected image 240 expected image
202 </th> 241 </th>
203 <th> 242 <th>
204 <input type="radio" 243 <input type="radio"
205 name="sortColumnRadio" 244 name="sortColumnRadio"
206 value="actualHashDigest" 245 value="actualHashDigest"
207 ng-checked="(sortColumn == 'actualHashDigest')" 246 ng-checked="(sortColumn == 'actualHashDigest')"
208 ng-click="sortResultsBy('actualHashDigest')"> 247 ng-click="sortResultsBy('actualHashDigest')">
209 actual image 248 actual image
210 </th> 249 </th>
211 <th> 250 <th>
212 <!-- item-selection checkbox column --> 251 <!-- item-selection checkbox column -->
213 </th> 252 </th>
214 </tr> 253 </tr>
215 <tr ng-repeat="result in limitedTestData"> 254 <tr ng-repeat="result in limitedTestData">
216 <td>{{result.resultType}}</td> 255 <td ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf ig']">
217 <td>{{result.builder}}</td> 256 {{result[categoryName]}}
218 <td>{{result.test}}</td> 257 </td>
219 <td>{{result.config}}</td> 258 <td>
259 <a ng-repeat="bug in result['bugs']"
260 href="https://code.google.com/p/skia/issues/detail?id={{bug}}"
261 target="_blank">
262 {{bug}}
263 </a>
264 </td>
220 <td> 265 <td>
221 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g oogleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.expectedHa shDigest}}.png"> 266 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g oogleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.expectedHa shDigest}}.png">
222 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.e xpectedHashDigest}}.png"/> 267 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.e xpectedHashDigest}}.png"/>
223 </a> 268 </a>
224 </td> 269 </td>
225 <td> 270 <td>
226 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g oogleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDi gest}}.png"> 271 <a target="_blank" href="http://chromium-skia-gm.commondatastorage.g oogleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDi gest}}.png">
227 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.act ualHashDigest}}.png"/> 272 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.act ualHashDigest}}.png"/>
228 </a> 273 </a>
229 </td> 274 </td>
(...skipping 11 matching lines...) Expand all
241 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and 286 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and
242 issues list) from 287 issues list) from
243 http://skia.googlecode.com/svn/buildbot/site_config/global_variables.json 288 http://skia.googlecode.com/svn/buildbot/site_config/global_variables.json
244 ? I tried importing the 289 ? I tried importing the
245 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using 290 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using
246 that to do so, but I got Access-Control-Allow-Origin errors. 291 that to do so, but I got Access-Control-Allow-Origin errors.
247 --> 292 -->
248 293
249 </body> 294 </body>
250 </html> 295 </html>
OLDNEW
« no previous file with comments | « gm/rebaseline_server/static/loader.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698