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

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

Issue 31583007: rebaseline_server: cleanup of HTML/Javascript (Closed) Base URL: http://skia.googlecode.com/svn/trunk/
Patch Set: why Created 7 years, 2 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
« no previous file with comments | « gm/rebaseline_server/static/view.css ('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 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
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 &nbsp;{{tab}} ({{numResultsPerTab[tab]}})&nbsp; 66 &nbsp;{{tab}} ({{numResultsPerTab[tab]}})&nbsp;
69 </div> 67 </div>
70 <div style="display:inline-block"> 68 <div class="tab-spacer">
71 &nbsp; 69 &nbsp;
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
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
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>
OLDNEW
« no previous file with comments | « gm/rebaseline_server/static/view.css ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698