gm/rebaseline_server/static/view.html - Issue 856103002: Revert "Revert "delete old things!""

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

Issue 856103002: Revert "Revert "delete old things!"" (Closed) Base URL: https://skia.googlesource.com/skia.git@master

Patch Set: Created 5 years, 11 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

OLD	NEW
	(Empty)
1 <!DOCTYPE html>

2

3 <html ng-app="Loader" ng-controller="Loader.Controller">

4

5 <head>

6 <title ng-bind="windowTitle"></title>

7 <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></scr ipt>

8 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.js "></script>

9 <script src="constants.js"></script>

10 <script src="loader.js"></script>

11 <script src="utils.js"></script>

12 <link rel="stylesheet" href="view.css">

13 </head>

14

15 <body>

16 <h2>

17 Instructions, roadmap, etc. are at

18 <a href="http://tinyurl.com/SkiaRebaselineServer">

19 http://tinyurl.com/SkiaRebaselineServer

20 </a>

21 </h2>

22

23 <em ng-show="!readyToDisplay">

24 Loading results from <a href="{{resultsToLoad}}">{{resultsToLoad}}</a> ...

25 {{loadingMessage}}

26 </em>

27

28 <div ng-show="readyToDisplay">

29

30 <div class="warning-div"

31 ng-show="urlSchemaVersionLoaded != constants.URL_VALUE__SCHEMA_VERSION_ _CURRENT">

32 WARNING! The URL you loaded used schema version {{urlSchemaVersionLoaded} }, rather than

33 the most recent version {{constants.URL_VALUE__SCHEMA_VERSION__CURRENT}}. It has been

34 converted to the most recent version on a best-effort basis; you may wish to double-check

35 which records are displayed.

36 </div>

37

38 <div class="warning-div"

39 ng-show="header[constants.KEY__HEADER__IS_EDITABLE] && header[constants .KEY__HEADER__IS_EXPORTED]">

40 WARNING! These results are editable and exported, so any user

41 who can connect to this server over the network can modify them.

42 </div>

43

44 <div ng-show="header[constants.KEY__HEADER__TIME_UPDATED]">

45 These results, from raw JSON file

46 <a href="{{resultsToLoad}}">{{resultsToLoad}}</a>, current as of

47 {{localTimeString(header[constants.KEY__HEADER__TIME_UPDATED])}}

48 <br>

49 To see other sets of results (all results, failures only, etc.),

50 <a href="/">click here</a>

51 </div>

52

53 <div class="tab-wrapper"><!-- tabs -->

54 <div class="tab-spacer" ng-repeat="tab in tabs">

55 <div class="tab tab-{{tab == viewingTab}}"

56 ng-click="setViewingTab(tab)">

57  {{tab}} ({{numResultsPerTab[tab]}})

58 </div>

59 <div class="tab-spacer">

60

61 </div>

62 </div>

63 </div><!-- tabs -->

64

65 <div class="tab-main"><!-- main display area of selected tab -->

66

67 <br>

68 <!-- We only show the filters/settings table on the Unfiled tab. -->

69 <table ng-show="viewingTab == defaultTab" border="1">

70 <tr>

71 <th colspan="4">

72 Filters

73 </th>

74 <th>

75 Settings

76 </th>

77 </tr>

78 <tr valign="top">

79

80 <!-- filters -->

81 <td ng-repeat="columnName in orderedColumnNames">

82

83 <!-- Only display filterable columns here... -->

84 <div ng-if="extraColumnHeaders[columnName][constants.KEY__EXTRACOLUMNHEA DERS__IS_FILTERABLE]">

85 {{extraColumnHeaders[columnName][constants.KEY__EXTRACOLUMNHEADERS__HE ADER_TEXT]}}<br>

86

87 <!-- If we filter this column using free-form text match... -->

88 <div ng-if="extraColumnHeaders[columnName][constants.KEY__EXTRACOLUMNH EADERS__USE_FREEFORM_FILTER]">

89 <input type="text"

90 ng-model="columnStringMatch[columnName]"

91 ng-change="setUpdatesPending(true)"/>

92 <br>

93 <button ng-click="setColumnStringMatch(columnName, '')"

94 ng-disabled="('' == columnStringMatch[columnName])">

95 clear (show all)

96 </button>

97 </div>

98

99 <!-- If we filter this column using checkboxes... -->

100 <div ng-if="!extraColumnHeaders[columnName][constants.KEY__EXTRACOLUMN HEADERS__USE_FREEFORM_FILTER]">

101 <label ng-repeat="valueAndCount in extraColumnHeaders[columnName][co nstants.KEY__EXTRACOLUMNHEADERS__VALUES_AND_COUNTS]">

102 <input type="checkbox"

103 name="resultTypes"

104 value="{{valueAndCount[0]}}"

105 ng-checked="isValueInSet(valueAndCount[0], showingColumnVal ues[columnName])"

106 ng-click="toggleValueInSet(valueAndCount[0], showingColumnV alues[columnName]); setUpdatesPending(true)">

107 {{valueAndCount[0]}} ({{valueAndCount[1]}})<br>

108 </label>

109 <button ng-click="showingColumnValues[columnName] = {}; toggleValues InSet(allColumnValues[columnName], showingColumnValues[columnName]); updateResul ts()"

110 ng-disabled="!readyToDisplay \|\| allColumnValues[columnName]. length == setSize(showingColumnValues[columnName])">

111 all

112 </button>

113 <button ng-click="showingColumnValues[columnName] = {}; updateResult s()"

114 ng-disabled="!readyToDisplay \|\| 0 == setSize(showingColumnVa lues[columnName])">

115 none

116 </button>

117 <button ng-click="toggleValuesInSet(allColumnValues[columnName], sho wingColumnValues[columnName]); updateResults()">

118 toggle

119 </button>

120 </div>

121

122 </div>

123 </td>

124

125 <!-- settings -->

126 <td><table>

127 <tr><td>

128 <input type="checkbox" ng-model="showThumbnailsPending"

129 ng-init="showThumbnailsPending = true"

130 ng-change="areUpdatesPending = true"/>

131 Show thumbnails

132 </td></tr>

133 <tr><td>

134 <input type="checkbox" ng-model="mergeIdenticalRowsPending"

135 ng-init="mergeIdenticalRowsPending = true"

136 ng-change="areUpdatesPending = true"/>

137 Merge identical rows

138 </td></tr>

139 <tr><td>

140 Image width

141 <input type="text" ng-model="imageSizePending"

142 ng-init="imageSizePending=100"

143 ng-change="areUpdatesPending = true"

144 maxlength="4"/>

145 </td></tr>

146 <tr><td>

147 Max records to display

148 <input type="text" ng-model="displayLimitPending"

149 ng-init="displayLimitPending=50"

150 ng-change="areUpdatesPending = true"

151 maxlength="4"/>

152 </td></tr>

153 <tr><td>

154 <button class="update-results-button"

155 ng-click="updateResults()"

156 ng-disabled="!areUpdatesPending">

157 Update Results

158 </button>

159 </td></tr>

160 </tr></table></td>

161 </tr>

162 </table>

163

164 <p>

165

166 <!-- Submission UI that we only show in the Pending Approval tab. -->

167 <div ng-show="'Pending Approval' == viewingTab">

168 <div style="display:inline-block">

169 <button style="font-size:20px"

170 ng-click="submitApprovals(filteredImagePairs)"

171 ng-disabled="submitPending \|\| (filteredImagePairs.length == 0) ">

172 Update these {{filteredImagePairs.length}} expectations on the serve r

173 </button>

174 </div>

175 <div style="display:inline-block">

176 <div style="font-size:20px"

177 ng-show="submitPending">

178 Submitting, please wait...

179 </div>

180 </div>

181 <div>

182 Advanced settings...

183 <input type="checkbox" ng-model="showSubmitAdvancedSettings">

184 show

185 <ul ng-show="showSubmitAdvancedSettings">

186 <li ng-repeat="setting in [constants.KEY__EXPECTATIONS__REVIEWED, co nstants.KEY__EXPECTATIONS__IGNOREFAILURE]">

187 {{setting}}

188 <input type="checkbox" ng-model="submitAdvancedSettings[setting]">

189 </li>

190 <li ng-repeat="setting in ['bug']">

191 {{setting}}

192 <input type="text" ng-model="submitAdvancedSettings[setting]">

193 </li>

194 </ul>

195 </div>

196 </div>

197

198 <p>

199

200 <div class="results-header"> <!-- results header -->

201 <div class="results-header-actions">

202 all tests shown:

203 <button ng-click="selectAllImagePairs()">

204 select

205 </button>

206 <button ng-click="clearAllImagePairs()">

207 clear

208 </button>

209 <button ng-click="toggleAllImagePairs()">

210 toggle

211 </button>

212 <div ng-repeat="otherTab in tabs">

213 <button ng-click="moveSelectedImagePairsToTab(otherTab)"

214 ng-disabled="selectedImagePairs.length == 0"

215 ng-show="otherTab != viewingTab">

216 move {{selectedImagePairs.length}} selected tests to {{otherTab}} tab

217 </button>

218 </div>

219 </div>

220 <div class="results-header-stats">

221 Found {{filteredImagePairs.length}} matches;

222 <span ng-show="filteredImagePairs.length > limitedImagePairs.length">

223 displaying the first {{limitedImagePairs.length}}.

224 </span>

225 <span ng-show="filteredImagePairs.length <= limitedImagePairs.length">

226 displaying them all.

227 </span>

228 <span ng-show="renderEndTime > renderStartTime">

229 Rendered in {{(renderEndTime - renderStartTime).toFixed(0)}} ms.

230 </span>

231 <br>

232 (click on the column header radio buttons to re-sort by that column)

233 </div>

234 </div> <!-- results header -->

235

236 <table border="0"><tr><td> <!-- table holding results header + results table -->

237 </td></tr><tr><td>

238 <table border="1"> <!-- results -->

239 <tr>

240 <!-- Most column headers are displayed in a common fashion... -->

241 <th ng-repeat="columnName in orderedColumnNames">

242 <a ng-class="'sort-' + sortedByColumnsCls(columnName)"

243 ng-click="sortResultsBy(constants.KEY__IMAGEPAIRS__EXTRACOLUMNS , columnName)"

244 href=""

245 class="sortable-header">

246 {{extraColumnHeaders[columnName][constants.KEY__EXTRACOLUMNHEADER S__HEADER_TEXT]}}

247 </a>

248 </th>

249

250 <!-- ... but there are a few columns where we display things different ly. -->

251 <th>

252 <a ng-class="'sort-' + sortedByColumnsCls(constants.KEY__EXPECTATION S__BUGS)"

253 ng-click="sortResultsBy(constants.KEY__IMAGEPAIRS__EXPECTATIONS, constants.KEY__EXPECTATIONS__BUGS)"

254 href=""

255 class="sortable-header">

256 bugs

257 </a>

258 </th>

259 <th width="{{imageSize}}">

260 <a ng-class="'sort-' + sortedByColumnsCls(constants.KEY__IMAGEPAIRS_ _IMAGE_A_URL)"

261 ng-click="sortResultsBy('none', constants.KEY__IMAGEPAIRS__IMAGE_ A_URL)"

262 href=""

263 class="sortable-header">

264 {{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][constants .KEY__IMAGESETS__FIELD__DESCRIPTION]}}

265 </a>

266 </th>

267 <th width="{{imageSize}}">

268 <a ng-class="'sort-' + sortedByColumnsCls(constants.KEY__IMAGEPAIRS_ _IMAGE_B_URL)"

269 ng-click="sortResultsBy('none', constants.KEY__IMAGEPAIRS__IMAGE_ B_URL)"

270 href=""

271 class="sortable-header">

272 {{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][constants. KEY__IMAGESETS__FIELD__DESCRIPTION]}}

273 </a>

274 </th>

275 <th width="{{imageSize}}">

276 <a ng-class="'sort-' + sortedByColumnsCls(constants.KEY__DIFFERENCES __PERCENT_DIFF_PIXELS)"

277 ng-click="sortResultsBy(constants.KEY__IMAGEPAIRS__DIFFERENCES, c onstants.KEY__DIFFERENCES__PERCENT_DIFF_PIXELS)"

278 href=""

279 class="sortable-header">

280 differing pixels in white

281 </a>

282 </th>

283 <th width="{{imageSize}}">

284 <a ng-class="'sort-' + sortedByColumnsCls(constants.KEY__DIFFERENCES __PERCEPTUAL_DIFF)"

285 ng-click="sortResultsBy(constants.KEY__IMAGEPAIRS__DIFFERENCES, c onstants.KEY__DIFFERENCES__PERCEPTUAL_DIFF)"

286 href=""

287 class="sortable-header">

288 perceptual difference

289 </a>

290 <br>

291 <input type="range" ng-model="pixelDiffBgColorBrightness"

292 ng-init="pixelDiffBgColorBrightness=64; pixelDiffBgColor=brig htnessStringToHexColor(pixelDiffBgColorBrightness)"

293 ng-change="pixelDiffBgColor=brightnessStringToHexColor(pixelD iffBgColorBrightness)"

294 title="image background brightness"

295 min="0" max="255"/>

296 </th>

297 <th>

298 <!-- imagepair-selection checkbox column -->

299 </th>

300 </tr>

301

302 <tr ng-repeat="imagePair in limitedImagePairs" valign="top"

303 ng-class-odd="'results-odd'" ng-class-even="'results-even'"

304 results-updated-callback-directive>

305

306 <td ng-repeat="columnName in orderedColumnNames">

307 {{imagePair[constants.KEY__IMAGEPAIRS__EXTRACOLUMNS][columnName]}}

308 <br>

309 <button class="show-only-button"

310 ng-show="viewingTab == defaultTab"

311 ng-disabled="1 == setSize(showingColumnValues[columnName])"

312 ng-click="showOnlyColumnValue(columnName, imagePair[constant s.KEY__IMAGEPAIRS__EXTRACOLUMNS][columnName])"

313 title="show only results of {{extraColumnHeaders[columnName] [constants.KEY__EXTRACOLUMNHEADERS__HEADER_TEXT]}} {{imagePair[constants.KEY__IM AGEPAIRS__EXTRACOLUMNS][columnName]}}">

314 show only

315 </button>

316 <br>

317 <button class="show-all-button"

318 ng-show="viewingTab == defaultTab"

319 ng-disabled="allColumnValues[columnName].length == setSize(s howingColumnValues[columnName])"

320 ng-click="showAllColumnValues(columnName)"

321 title="show results of all {{extraColumnHeaders[columnName][ constants.KEY__EXTRACOLUMNHEADERS__HEADER_TEXT]}}s">

322 show all

323 </button>

324 </td>

325

326 <!-- bugs -->

327 <td>

328 <a ng-repeat="bug in imagePair[constants.KEY__IMAGEPAIRS__EXPECTATIO NS][constants.KEY__EXPECTATIONS__BUGS]"

329 href="https://code.google.com/p/skia/issues/detail?id={{bug}}"

330 target="_blank">

331 {{bug}}

332 </a>

333 </td>

334

335 <!-- image A -->

336 <td width="{{imageSize}}" ng-if="imagePair[constants.KEY__IMAGEPAIRS__ ROWSPAN] > 0" rowspan="{{imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN]}}">

337 <div ng-if="imagePair[constants.KEY__IMAGEPAIRS__IMAGE_A_URL] != nul l">

338 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][const ants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIRS__I MAGE_A_URL]}}" target="_blank">View Image</a><br/>

339 <img ng-if="showThumbnails"

340 width="{{imageSize}}"

341 ng-src="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][c onstants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIR S__IMAGE_A_URL]}}" />

342 </div>

343 <div ng-show="imagePair[constants.KEY__IMAGEPAIRS__IMAGE_A_URL] == n ull"

344 style="text-align:center">

345 –none–

346 </div>

347 </td>

348

349 <!-- image B -->

350 <td width="{{imageSize}}" ng-if="imagePair[constants.KEY__IMAGEPAIRS__ ROWSPAN] > 0" rowspan="{{imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN]}}">

351 <div ng-if="imagePair[constants.KEY__IMAGEPAIRS__IMAGE_B_URL] != nul l">

352 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][const ants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIRS__I MAGE_B_URL]}}" target="_blank">View Image</a><br/>

353 <img ng-if="showThumbnails"

354 width="{{imageSize}}"

355 ng-src="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][c onstants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIR S__IMAGE_B_URL]}}" />

356 </div>

357 <div ng-show="imagePair[constants.KEY__IMAGEPAIRS__IMAGE_B_URL] == n ull"

358 style="text-align:center">

359 –none–

360 </div>

361 </td>

362

363 <!-- whitediffs: every differing pixel shown in white -->

364 <td width="{{imageSize}}" ng-if="imagePair[constants.KEY__IMAGEPAIRS__ ROWSPAN] > 0" rowspan="{{imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN]}}">

365 <div ng-if="imagePair[constants.KEY__IMAGEPAIRS__IS_DIFFERENT]"

366 title="{{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][cons tants.KEY__DIFFERENCES__NUM_DIFF_PIXELS] \| number:0}} of {{(100 * imagePair[cons tants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY__DIFFERENCES__NUM_DIFF_PIXELS] / imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY__DIFFERENCES_ _PERCENT_DIFF_PIXELS]) \| number:0}} pixels ({{imagePair[constants.KEY__IMAGEPAIR S__DIFFERENCES][constants.KEY__DIFFERENCES__PERCENT_DIFF_PIXELS].toFixed(4)}}%) differ from expectation.">

367

368 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__WHITEDIFFS][co nstants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIRS __DIFFERENCES][constants.KEY__DIFFERENCES__WHITE_DIFF_URL]}}" target="_blank">Vi ew Image</a><br/>

369 <img ng-if="showThumbnails"

370 width="{{imageSize}}"

371 ng-src="{{imageSets[constants.KEY__IMAGESETS__SET__WHITEDIFFS ][constants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEP AIRS__DIFFERENCES][constants.KEY__DIFFERENCES__WHITE_DIFF_URL]}}" />

372 <br/>

373 {{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY_ _DIFFERENCES__PERCENT_DIFF_PIXELS].toFixed(4)}}%

374 ({{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY __DIFFERENCES__NUM_DIFF_PIXELS]}})

375 </div>

376 <div ng-show="!imagePair[constants.KEY__IMAGEPAIRS__IS_DIFFERENT]"

377 style="text-align:center">

378 –none–

379 </div>

380 </td>

381

382 <!-- diffs: per-channel RGB deltas -->

383 <td width="{{imageSize}}" ng-if="imagePair[constants.KEY__IMAGEPAIRS__ ROWSPAN] > 0" rowspan="{{imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN]}}">

384 <div ng-if="imagePair[constants.KEY__IMAGEPAIRS__IS_DIFFERENT]"

385 title="Perceptual difference measure is {{imagePair[constants.K EY__IMAGEPAIRS__DIFFERENCES][constants.KEY__DIFFERENCES__PERCEPTUAL_DIFF].toFixe d(4)}}%. Maximum difference per channel: R={{imagePair[constants.KEY__IMAGEPAIR S__DIFFERENCES][constants.KEY__DIFFERENCES__MAX_DIFF_PER_CHANNEL][0]}}, G={{imag ePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY__DIFFERENCES__MAX_DI FF_PER_CHANNEL][1]}}, B={{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][cons tants.KEY__DIFFERENCES__MAX_DIFF_PER_CHANNEL][2]}}">

386

387 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__DIFFS][constan ts.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIRS__DIF FERENCES][constants.KEY__DIFFERENCES__DIFF_URL]}}" target="_blank">View Image</a ><br/>

388 <img ng-if="showThumbnails"

389 ng-style="{backgroundColor: pixelDiffBgColor}"

390 width="{{imageSize}}"

391 ng-src="{{imageSets[constants.KEY__IMAGESETS__SET__DIFFS][con stants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGEPAIRS_ _DIFFERENCES][constants.KEY__DIFFERENCES__DIFF_URL]}}" />

392 <br/>

393 {{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY_ _DIFFERENCES__PERCEPTUAL_DIFF].toFixed(4)}}%

394 {{imagePair[constants.KEY__IMAGEPAIRS__DIFFERENCES][constants.KEY_ _DIFFERENCES__MAX_DIFF_PER_CHANNEL]}}

395 </div>

396 <div ng-show="!imagePair[constants.KEY__IMAGEPAIRS__IS_DIFFERENT]"

397 style="text-align:center">

398 –none–

399 </div>

400 </td>

401

402 <td ng-if="imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN] > 0" rowspan= "{{imagePair[constants.KEY__IMAGEPAIRS__ROWSPAN]}}">

403 <br/>

404 <input type="checkbox"

405 name="rowSelect"

406 value="{{imagePair.index}}"

407 ng-checked="isValueInArray(imagePair.index, selectedImagePair s)"

408 ng-click="toggleSomeImagePairs($index, imagePair[constants.KE Y__IMAGEPAIRS__ROWSPAN])">

409 </tr>

410 </table> <!-- imagePairs -->

411 </td></tr></table> <!-- table holding results header + imagePairs table -->

412

413 </div><!-- main display area of selected tab -->

414 </div><!-- everything: hide until readyToDisplay -->

415

416 </body>

417 </html>

OLD	NEW

« no previous file with comments | « gm/rebaseline_server/static/view.css ('k') | gm/rebaseline_server/test_all.py » ('j') | no next file with comments »