Chromium Code Reviews| Index: gm/rebaseline_server/static/view.html |
| =================================================================== |
| --- gm/rebaseline_server/static/view.html (revision 11868) |
| +++ gm/rebaseline_server/static/view.html (working copy) |
| @@ -6,6 +6,7 @@ |
| <title ng-bind="windowTitle"></title> |
| <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script> |
| <script src="loader.js"></script> |
| + <link rel="stylesheet" href="view.css"> |
| </head> |
| <body> |
| @@ -13,16 +14,72 @@ |
| {{loadingMessage}} |
| </em> |
| - <div ng-hide="!categories"> |
| + <div ng-hide="!categories"><!-- everything: hide until data is loaded --> |
| + |
| <div ng-hide="!(header.isEditable && header.isExported)" |
| style="background-color:#ffbb00"> |
| WARNING! These results are editable and exported, so any user |
| who can connect to this server over the network can modify them. |
| </div> |
| + |
| + <div style="background-color:#bbffbb"><!-- TODOs --> |
|
epoger
2013/10/19 01:15:56
The TODO section just moved up from below.
|
| + <p> |
| + TODO(epoger): |
| + <input type="checkbox" name="showTodosCheckbox" value="true" |
| + ng-checked="showTodos == true" |
| + ng-click="showTodos = !showTodos"> |
| + show |
| + <ul ng-hide="!showTodos"> |
| + <li> |
| + Implement editing of results (we have added the --editable |
| + flag to the server, but it's not fully implemented yet). |
| + </li><li> |
| + If server was run with --reload flag, automatically check for |
| + new results and tell the user when new results are available |
| + (the user can reload the page if he wants to see them). |
| + </li><li> |
| + Add ability to filter builder and test names |
| + (using a free-form text field, with partial string match) |
| + </li><li> |
| + Add more columns, such as pixel diffs, notes/bugs, |
| + ignoreFailure boolean |
| + </li><li> |
| + Improve the column sorting, as per |
| + <a href="http://jsfiddle.net/vojtajina/js64b/14/"> |
| + http://jsfiddle.net/vojtajina/js64b/14/ |
| + </a> |
| + </li><li> |
| + Right now, if you change which column is used to |
| + sort the data, the column widths may fluctuate based on the |
| + longest string <i>currently visible</i> within the top {{displayLimit}} |
| + results. Can we fix the column widths to be wide enough to hold |
| + any result, even the currently hidden results? |
| + </li> |
| + </ul> |
| + </div><!-- TODOs --> |
| + |
| <div ng-hide="!(header.timeUpdated)"> |
| Results current as of {{localTimeString(header.timeUpdated)}} |
| </div> |
| - <table border="1"> |
| + |
| + <div style="font-size:20px"><!-- tabs --> |
| + <div ng-repeat="tab in tabs" |
| + style="display:inline-block"> |
| + <div class="tab-{{tab == viewingTab}}" |
|
epoger
2013/10/19 01:15:56
World's ugliest tabs. But they work.
|
| + style="display:inline-block" |
| + ng-click="setViewingTab(tab)"> |
| + {{tab}} |
| + </div> |
| + <div style="display:inline-block"> |
| + |
| + </div> |
| + </div> |
| + </div><!-- tabs --> |
| + |
| + <div class="tab-true"><!-- display of current tab --> |
| + |
| + <br> |
| + <table ng-hide="viewingTab != defaultTab" border="1"> |
| <tr> |
| <th colspan="2"> |
| Filters |
| @@ -80,49 +137,44 @@ |
| </tr> |
| </table> |
| - <p> |
| - TODO(epoger): |
| - <input type="checkbox" name="showTodosCheckbox" value="true" |
| - ng-checked="showTodos == true" |
| - ng-click="showTodos = !showTodos"> |
| - show |
| - <ul ng-hide="!showTodos"> |
| - <li> |
| - Implement editing of results (we have added the --editable |
| - flag to the server, but it's not fully implemented yet). |
| - <div ng-hide="!header.isEditable"> |
| - Currently selected items are: {{selectedItems}} |
| - </div> |
| - </li><li> |
| - If server was run with --reload flag, automatically check for |
| - new results and tell the user when new results are available |
| - (the user can reload the page if he wants to see them). |
| - </li><li> |
| - Add ability to filter builder and test names |
| - (using a free-form text field, with partial string match) |
| - </li><li> |
| - Add more columns, such as pixel diffs, notes/bugs, |
| - ignoreFailure boolean |
| - </li><li> |
| - Improve the column sorting, as per |
| - <a href="http://jsfiddle.net/vojtajina/js64b/14/"> |
| - http://jsfiddle.net/vojtajina/js64b/14/ |
| - </a> |
| - </li><li> |
| - Right now, if you change which column is used to |
| - sort the data, the column widths may fluctuate based on the |
| - longest string <i>currently visible</i> within the top {{displayLimit}} |
| - results. Can we fix the column widths to be wide enough to hold |
| - any result, even the currently hidden results? |
| - </li> |
| - </ul> |
| <p> |
| - Found {{filteredTestData.length}} matches, and displaying the first |
| - {{displayLimit}}: <br> |
| - <!-- TODO(epoger): If (displayLimit <= filteredTestData.length), |
| - modify this message to indicate that all results are shown. --> |
| - (click on the column header radio buttons to re-sort by that column) |
| + |
| + <div ng-hide="'Pending Approval' != viewingTab"> |
| + TODO(epoger): This is where we will add a |
| + <button> |
| + send approved items to server |
| + </button> |
| + button. |
| + <p> |
| + </div> |
| + |
| + <div> |
| + <div style="float:left"> |
| + Found {{filteredTestData.length}} matches; |
| + <span ng-hide="filteredTestData.length <= limitedTestData.length"> |
| + displaying the first {{limitedTestData.length}} |
| + </span> |
| + <span ng-hide="filteredTestData.length > limitedTestData.length"> |
| + displaying them all |
| + </span> |
| + <br> |
| + (click on the column header radio buttons to re-sort by that column) |
| + </div> |
| + <div style="float:right"> |
| + <button ng-click="moveSelectedItems()" |
| + ng-disabled="selectedItems.length == 0"> |
| + Move selected tests |
| + </button> |
| + to tab |
| + <select ng-model="newTab" |
| + ng-options="d for d in tabs"> |
| + </select> |
| + </div> |
| + <div style="clear:both"> |
| + </div> |
| + </div> |
| <br> |
| + |
| <table border="1"> |
| <tr> |
| <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'config']"> |
| @@ -149,7 +201,7 @@ |
| ng-click="sortResultsBy('actualHashDigest')"> |
| actual image |
| </th> |
| - <th ng-hide="!header.isEditable"> |
| + <th> |
| <!-- item-selection checkbox column --> |
| </th> |
| </tr> |
| @@ -168,7 +220,7 @@ |
| <img width="{{imageSize}}" src="http://chromium-skia-gm.commondatastorage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDigest}}.png"/> |
| </a> |
| </td> |
| - <td ng-hide="!header.isEditable"> |
| + <td> |
| <input type="checkbox" |
| name="rowSelect" |
| value="{{result.index}}" |
| @@ -176,7 +228,8 @@ |
| ng-click="toggleItemSelected(result.index)"> |
| </tr> |
| </table> |
| - </div> |
| + </div><!-- display of current tab --> |
| + </div><!-- everything: hide until data is loaded --> |
| <!-- TODO(epoger): Can we get the base URLs (commondatastorage and |
| issues list) from |