src/third_party/skia/gm/rebaseline_server/static/new/partials/rebaseline-view.html

   1 <div class="container-fluid ng-cloak" ng-cloak>
   2
   3     <div class="row" ng-show="state === c.ST_LOADING">
   4         <h4>Loading ...</h4>
   5     </div>
   6
   7     <div class="row" ng-show="state === c.ST_STILL_LOADING">
   8         <h4>Still loading from backend.</h4>
   9         <div>
  10             Load time so far: {{ loadTime | number:0 }} s.
  11         </div>
  12     </div>
  13
  14     <div class="row" ng-show="state === c.ST_READY">
  15         <tabset>
  16             <tab heading="Unfiled">
  17                 <!-- settings -->
  18                 <div class="container controlBox">
  19                     <form class="form-inline settingsForm" novalidate >
  20                         <legend class="simpleLegend">Settings</legend>
  21                             <div class="checkbox formPadding">
  22                                 <label>
  23                                        <input type="checkbox"
  24                                            ng-model="settings.showThumbnails">Show thumbnails
  25                                  </label>
  26                              </div>
  27
  28                             <div class="checkbox formPadding">
  29                                 <label>
  30                                        <input type="checkbox"
  31                                      ng-model="settings.mergeIdenticalRows"
  32                                       ng-change="mergeRowsChanged(mergeIdenticalRows)"> Merge identical rows
  33                                  </label>
  34                             </div>
  35
  36                             <div class="form-group formPadding">
  37                                  <label for="imageWidth">Image Width</label>
  38                                      <select ng-model="settings.imageSize"
  39                                              ng-options="iSize for iSize in c.IMAGE_SIZES"
  40                                              class="form-control input-sm">
  41
  42                                      </select>
  43                             </div>
  44                             <div class="form-group formPadding">
  45                                  <label>Max records</label>
  46                                      <select ng-model="settings.nRecords"
  47                                              ng-options="n for n in c.MAX_RECORDS"
  48                                              ng-change="maxRecordsChanged();"
  49                                              class="form-control input-sm">
  50                                      </select>
  51                             </div>
  52                     </form>
  53                     <br>
  54
  55                     <form class="form settingsForm" novalidate>
  56                         <legend class="simpleLegend">Filters</legend>
  57                         <div class="container-fluid">
  58                             <div class="col-lg-2 filterBox" ng-repeat="oneCol in filterCols">
  59                                   <div class="filterKey">{{ oneCol.key }}</div>
  60
  61                                   <!-- If we filter this column using free-form text match... -->
  62                                   <div ng-if="oneCol.ftype === c.FILTER_FREE_FORM">
  63                                     <input type="text"
  64                                            ng-model="filterVals[$index]"
  65                                            typeahead="opt.value for opt in oneCol.foptions | filter:$viewValue"
  66                                            class="form-control input-sm">
  67                                     <br>
  68                                     <a ng-click="filterVals[$index]=''"
  69                                        ng-disabled="'' === filterVals[$index]"
  70                                        href="">
  71                                       Clear
  72                                     </a>
  73                                   </div>
  74
  75                                   <!-- If we filter this column using checkboxes... -->
  76                                   <div ng-if="oneCol.ftype === c.FILTER_CHECK_BOX">
  77
  78                                       <div class="checkbox" ng-repeat="oneOpt in oneCol.foptions">
  79                                         <label>
  80                                           <input type="checkbox"
  81                                                  ng-model="filterVals[$parent.$index][$index]">{{oneOpt.value}} ({{ oneOpt.count }})
  82                                         </label>
  83                                     </div>
  84                                     <div>
  85                                         <a ng-click="setFilterAll($index, true)" href="">All</a> -
  86                                         <a ng-click="setFilterAll($index, False)" href="">None</a> -
  87                                         <a ng-click="setFilterToggle($index)" href="">Toggle</a>
  88                                     </div>
  89                                   </div>
  90                             </div>
  91                             <br>
  92                         </div>
  93
  94                         <div class="container updateBtn">
  95                             <button class="btn btn-success col-lg-4 pull-left"
  96                                     ng-click="filtersChanged()"
  97                                     ng-disabled="updating">
  98                                         {{ updating && 'Updating ...' || 'Update' }}
  99                             </button>
 100                         </div>
 101
 102                     </form>
 103
 104                     <br>
 105
 106                     <!-- Rows -->
 107
 108                     <!-- results header -->
 109                     <div class="col-lg-12 resultsHeaderActions well">
 110                             <div class="col-lg-6">
 111                               <h4>Showing {{showingRecords}} of {{selectedRecords}} (of {{totalRecords}} total)</h4>
 112                               <span ng-show="renderTime > 0">
 113                                 Rendered in {{renderTime | number:0 }} ms (filtered and sorted in {{ filterTime | number:0 }} ms).
 114                               </span>
 115                               <br>
 116                               (click on the column header radio buttons to re-sort by that column)
 117                             </div>
 118
 119
 120                             <div class="col-lg-6">
 121                                 All tests shown:
 122                                 <button class="btn btn-default btn-sm" ng-click="selectAllImagePairs()">Select</button>
 123                                 <button class="btn btn-default btn-sm" ng-click="clearAllImagePairs()">Clear</button>
 124                                 <button class="btn btn-default btn-sm" ng-click="toggleAllImagePairs()">Toggle</button>
 125
 126                                 <div ng-repeat="otherTab in tabs">
 127                                     <button class="btn btn-default btn-sm"
 128                                             ng-click="moveSelectedImagePairsToTab(otherTab)"
 129                                             ng-disabled="selectedImagePairs.length == 0"
 130                                             ng-show="otherTab != viewingTab">
 131                                             Move {{selectedImagePairs.length}} selected tests to {{otherTab}} tab
 132                                     </button>
 133                                 </div>
 134                             </div>
 135                             <br>
 136                     </div>
 137
 138                     <!-- results -->
 139                     <table class="table table-bordered">
 140                         <thead>
 141                             <tr>
 142                                 <!-- Most column headers are displayed in a common fashion... -->
 143                                 <th ng-repeat="oneCol in allCols" ng-style="{ 'min-width': getImageWidthStyle(oneCol, 20, 'auto') }">
 144                                     <a ng-class="getSortedClass('sort', $index, '')"
 145                                        ng-click="sortBy($index)"
 146                                        href=""
 147                                        class="sortableHeader">
 148                                           {{ oneCol.ctitle }}
 149                                     </a>
 150                                 </th>
 151                                 <th>
 152                                     <div class="checkbox">
 153                                         <label>
 154                                                <input type="checkbox" ng-model="allChecked" ng-change="checkAll()">All
 155                                          </label>
 156                                      </div>
 157                                 </th>
 158                             </tr>
 159                         </thead>
 160                         <tbody>
 161                             <tr ng-repeat="oneRow in data">
 162                                 <td ng-repeat="oneColVal in oneRow.dataCols">
 163                                     {{oneColVal}}
 164                                 </td>
 165
 166                                 <td ng-repeat="oneCol in oneRow.imageCols" ng-if="oneRow.rowspan > 0" rowspan="{{ oneRow.rowspan }}">
 167                                     <div ng-show="oneCol.url">
 168                                         <a href="{{ oneCol.url }}" target="_blank">View Image</a><br/>
 169                                         <img ng-if="settings.showThumbnails"
 170                                              ng-style="{ width: settings.imageSize+'px' }"
 171                                              ng-src="{{ oneCol.url }}" />
 172                                         <div ng-if="oneCol.percent && oneCol.value">
 173                                             {{oneCol.percent}}% ({{ oneCol.value }})
 174                                         </div>
 175                                     </div>
 176                                     <div ng-hide="oneCol.url" style="text-align:center">
 177                                         <span ng-show="oneCol.url === null">&ndash;none&ndash;</span>
 178                                         <span ng-hide="oneCol.url === null">&nbsp;</span>
 179                                     </div>
 180                                 </td>
 181
 182                                 <td ng-if="oneRow.rowspan > 0" rowspan="{{ oneRow.rowspan }}">
 183                                     <div class="checkbox">
 184                                         <input type="checkbox"
 185                                                ng-model="checkRows[$index]"
 186                                                ng-change="rowCheckChanged($index)">
 187                                     </div>
 188                                 </td>
 189                             </tr>
 190                         </tbody>
 191                     </table>
 192
 193                 </div>
 194             </tab>
 195
 196             <tab heading="Hidden">
 197                 <h3>Hidden</h3>
 198             </tab>
 199
 200             <tab heading="Pending Approval">
 201                 <h3>Pending Approval</h3>
 202             </tab>
 203
 204         </tabset>
 205
 206     </div>
 207 </div>