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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 196533021: rebaseline_server: make intermediate JSON specify base urls for diff images (Closed) Base URL: https://skia.googlesource.com/skia.git@master
Patch Set: nits Created 6 years, 9 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
« no previous file with comments | « gm/rebaseline_server/static/loader.js ('k') | gm/rebaseline_server/testdata/outputs/expected/results_test.ResultsTest.test_gm/gm.json » ('j') | 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="constants.js"></script> 8 <script src="constants.js"></script>
9 <script src="loader.js"></script> 9 <script src="loader.js"></script>
10 <link rel="stylesheet" href="view.css"> 10 <link rel="stylesheet" href="view.css">
11 </head> 11 </head>
12 12
13 <body> 13 <body>
14 <h2> 14 <h2>
15 Instructions, roadmap, etc. are at 15 Instructions, roadmap, etc. are at
16 <a href="http://tinyurl.com/SkiaRebaselineServer"> 16 <a href="http://tinyurl.com/SkiaRebaselineServer">
17 http://tinyurl.com/SkiaRebaselineServer 17 http://tinyurl.com/SkiaRebaselineServer
18 </a> 18 </a>
19 </h2> 19 </h2>
20 20
21 <em> 21 <em ng-show="!extraColumnHeaders"><!-- show until data is loaded -->
22 Loading results from <a href="{{resultsToLoad}}">{{resultsToLoad}}</a> ...
22 {{loadingMessage}} 23 {{loadingMessage}}
23 </em> 24 </em>
24 25
25 <div ng-show="extraColumnHeaders"><!-- everything: hide until data is loaded - -> 26 <div ng-show="extraColumnHeaders"><!-- everything: hide until data is loaded - ->
26 27
27 <div class="warning-div" 28 <div class="warning-div"
28 ng-show="header[constants.KEY__HEADER__IS_EDITABLE] && header[constants .KEY__HEADER__IS_EXPORTED]"> 29 ng-show="header[constants.KEY__HEADER__IS_EDITABLE] && header[constants .KEY__HEADER__IS_EXPORTED]">
29 WARNING! These results are editable and exported, so any user 30 WARNING! These results are editable and exported, so any user
30 who can connect to this server over the network can modify them. 31 who can connect to this server over the network can modify them.
31 </div> 32 </div>
32 33
33 <div ng-show="header[constants.KEY__HEADER__TIME_UPDATED]"> 34 <div ng-show="header[constants.KEY__HEADER__TIME_UPDATED]">
34 Results current as of {{localTimeString(header[constants.KEY__HEADER__TIME _UPDATED])}} 35 Results from <a href="{{resultsToLoad}}">{{resultsToLoad}}</a> current as of {{localTimeString(header[constants.KEY__HEADER__TIME_UPDATED])}}
35 </div> 36 </div>
36 37
37 <div><!-- tabs --> 38 <div><!-- tabs -->
38 <div class="tab-spacer" ng-repeat="tab in tabs"> 39 <div class="tab-spacer" ng-repeat="tab in tabs">
39 <div class="tab-{{tab == viewingTab}}" 40 <div class="tab-{{tab == viewingTab}}"
40 ng-click="setViewingTab(tab)"> 41 ng-click="setViewingTab(tab)">
41 &nbsp;{{tab}} ({{numResultsPerTab[tab]}})&nbsp; 42 &nbsp;{{tab}} ({{numResultsPerTab[tab]}})&nbsp;
42 </div> 43 </div>
43 <div class="tab-spacer"> 44 <div class="tab-spacer">
44 &nbsp; 45 &nbsp;
(...skipping 190 matching lines...) Expand 10 before | Expand all | Expand 10 after
235 <!-- ... but there are a few columns where we display things different ly. --> 236 <!-- ... but there are a few columns where we display things different ly. -->
236 <th> 237 <th>
237 <input type="radio" 238 <input type="radio"
238 name="sortColumnRadio" 239 name="sortColumnRadio"
239 value="bugs" 240 value="bugs"
240 ng-checked="(sortColumnKey == constants.KEY__EXPECTATIONS__BU GS)" 241 ng-checked="(sortColumnKey == constants.KEY__EXPECTATIONS__BU GS)"
241 ng-click="sortResultsBy(constants.KEY__EXPECTATIONS_DATA, con stants.KEY__EXPECTATIONS__BUGS)"> 242 ng-click="sortResultsBy(constants.KEY__EXPECTATIONS_DATA, con stants.KEY__EXPECTATIONS__BUGS)">
242 bugs 243 bugs
243 </th> 244 </th>
244 <th width="{{imageSize}}"> 245 <th width="{{imageSize}}">
245 {{imageSets[0][constants.KEY__IMAGESETS__DESCRIPTION]}} 246 {{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][constants.KEY__I MAGESETS__FIELD__DESCRIPTION]}}
246 </th> 247 </th>
247 <th width="{{imageSize}}"> 248 <th width="{{imageSize}}">
248 {{imageSets[1][constants.KEY__IMAGESETS__DESCRIPTION]}} 249 {{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][constants.KEY__I MAGESETS__FIELD__DESCRIPTION]}}
249 </th> 250 </th>
250 <th width="{{imageSize}}"> 251 <th width="{{imageSize}}">
251 <input type="radio" 252 <input type="radio"
252 name="sortColumnRadio" 253 name="sortColumnRadio"
253 value="percentDifferingPixels" 254 value="percentDifferingPixels"
254 ng-checked="(sortColumnKey == constants.KEY__DIFFERENCE_DATA_ _PERCENT_DIFF_PIXELS)" 255 ng-checked="(sortColumnKey == constants.KEY__DIFFERENCE_DATA_ _PERCENT_DIFF_PIXELS)"
255 ng-click="sortResultsBy(constants.KEY__DIFFERENCE_DATA, const ants.KEY__DIFFERENCE_DATA__PERCENT_DIFF_PIXELS)"> 256 ng-click="sortResultsBy(constants.KEY__DIFFERENCE_DATA, const ants.KEY__DIFFERENCE_DATA__PERCENT_DIFF_PIXELS)">
256 differing pixels in white 257 differing pixels in white
257 </th> 258 </th>
258 <th width="{{imageSize}}"> 259 <th width="{{imageSize}}">
(...skipping 75 matching lines...) Expand 10 before | Expand all | Expand 10 after
334 <a ng-repeat="bug in imagePair[constants.KEY__EXPECTATIONS_DATA][con stants.KEY__EXPECTATIONS__BUGS]" 335 <a ng-repeat="bug in imagePair[constants.KEY__EXPECTATIONS_DATA][con stants.KEY__EXPECTATIONS__BUGS]"
335 href="https://code.google.com/p/skia/issues/detail?id={{bug}}" 336 href="https://code.google.com/p/skia/issues/detail?id={{bug}}"
336 target="_blank"> 337 target="_blank">
337 {{bug}} 338 {{bug}}
338 </a> 339 </a>
339 </td> 340 </td>
340 341
341 <!-- image A --> 342 <!-- image A -->
342 <td valign="bottom" width="{{imageSize}}"> 343 <td valign="bottom" width="{{imageSize}}">
343 <div ng-if="imagePair[constants.KEY__IMAGE_A_URL] != null"> 344 <div ng-if="imagePair[constants.KEY__IMAGE_A_URL] != null">
344 <a href="{{imageSets[0][constants.KEY__IMAGESETS__BASE_URL]}}/{{im agePair[constants.KEY__IMAGE_A_URL]}}" target="_blank">View Image</a><br/> 345 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][const ants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGE_A_URL]} }" target="_blank">View Image</a><br/>
345 <img ng-if="showThumbnails" 346 <img ng-if="showThumbnails"
346 width="{{imageSize}}" 347 width="{{imageSize}}"
347 src="{{imageSets[0][constants.KEY__IMAGESETS__BASE_URL]}}/{{i magePair[constants.KEY__IMAGE_A_URL]}}" /> 348 src="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_A][cons tants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGE_A_URL] }}" />
348 </div> 349 </div>
349 <div ng-show="imagePair[constants.KEY__IMAGE_A_URL] == null" 350 <div ng-show="imagePair[constants.KEY__IMAGE_A_URL] == null"
350 style="text-align:center"> 351 style="text-align:center">
351 &ndash;none&ndash; 352 &ndash;none&ndash;
352 </div> 353 </div>
353 </td> 354 </td>
354 355
355 <!-- image B --> 356 <!-- image B -->
356 <td valign="bottom" width="{{imageSize}}"> 357 <td valign="bottom" width="{{imageSize}}">
357 <div ng-if="imagePair[constants.KEY__IMAGE_B_URL] != null"> 358 <div ng-if="imagePair[constants.KEY__IMAGE_B_URL] != null">
358 <a href="{{imageSets[1][constants.KEY__IMAGESETS__BASE_URL]}}/{{im agePair[constants.KEY__IMAGE_B_URL]}}" target="_blank">View Image</a><br/> 359 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][const ants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGE_B_URL]} }" target="_blank">View Image</a><br/>
359 <img ng-if="showThumbnails" 360 <img ng-if="showThumbnails"
360 width="{{imageSize}}" 361 width="{{imageSize}}"
361 src="{{imageSets[1][constants.KEY__IMAGESETS__BASE_URL]}}/{{i magePair[constants.KEY__IMAGE_B_URL]}}" /> 362 src="{{imageSets[constants.KEY__IMAGESETS__SET__IMAGE_B][cons tants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{imagePair[constants.KEY__IMAGE_B_URL] }}" />
362 </div> 363 </div>
363 <div ng-show="imagePair[constants.KEY__IMAGE_B_URL] == null" 364 <div ng-show="imagePair[constants.KEY__IMAGE_B_URL] == null"
364 style="text-align:center"> 365 style="text-align:center">
365 &ndash;none&ndash; 366 &ndash;none&ndash;
366 </div> 367 </div>
367 </td> 368 </td>
368 369
369 <!-- whitediffs: every differing pixel shown in white --> 370 <!-- whitediffs: every differing pixel shown in white -->
370 <td valign="bottom" width="{{imageSize}}"> 371 <td valign="bottom" width="{{imageSize}}">
371 <div ng-if="imagePair[constants.KEY__IS_DIFFERENT]" 372 <div ng-if="imagePair[constants.KEY__IS_DIFFERENT]"
372 title="{{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KE Y__DIFFERENCE_DATA__NUM_DIFF_PIXELS] | number:0}} of {{(100 * imagePair[constant s.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__NUM_DIFF_PIXELS] / image Pair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__PERCENT_DIF F_PIXELS]) | number:0}} pixels ({{imagePair[constants.KEY__DIFFERENCE_DATA][cons tants.KEY__DIFFERENCE_DATA__PERCENT_DIFF_PIXELS].toFixed(4)}}%) differ from expe ctation."> 373 title="{{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KE Y__DIFFERENCE_DATA__NUM_DIFF_PIXELS] | number:0}} of {{(100 * imagePair[constant s.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__NUM_DIFF_PIXELS] / image Pair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__PERCENT_DIF F_PIXELS]) | number:0}} pixels ({{imagePair[constants.KEY__DIFFERENCE_DATA][cons tants.KEY__DIFFERENCE_DATA__PERCENT_DIFF_PIXELS].toFixed(4)}}%) differ from expe ctation.">
373 374
374 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__PERCENT_DIFF_PIXELS].toFixed(4)}}% 375 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__PERCENT_DIFF_PIXELS].toFixed(4)}}%
375 ({{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFER ENCE_DATA__NUM_DIFF_PIXELS]}}) 376 ({{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFER ENCE_DATA__NUM_DIFF_PIXELS]}})
376 <br/> 377 <br/>
377 <a href="/static/generated-images/whitediffs/{{getImageDiffRelativ eUrl(imagePair)}}" target="_blank">View Image</a><br/> 378 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__WHITEDIFFS][co nstants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{getImageDiffRelativeUrl(imagePair)} }" target="_blank">View Image</a><br/>
378 <img ng-if="showThumbnails" 379 <img ng-if="showThumbnails"
379 width="{{imageSize}}" 380 width="{{imageSize}}"
380 src="/static/generated-images/whitediffs/{{getImageDiffRelati veUrl(imagePair)}}" /> 381 src="{{imageSets[constants.KEY__IMAGESETS__SET__WHITEDIFFS][c onstants.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{getImageDiffRelativeUrl(imagePair) }}" />
381 </div> 382 </div>
382 <div ng-show="!imagePair[constants.KEY__IS_DIFFERENT]" 383 <div ng-show="!imagePair[constants.KEY__IS_DIFFERENT]"
383 style="text-align:center"> 384 style="text-align:center">
384 &ndash;none&ndash; 385 &ndash;none&ndash;
385 </div> 386 </div>
386 </td> 387 </td>
387 388
388 <!-- diffs: per-channel RGB deltas --> 389 <!-- diffs: per-channel RGB deltas -->
389 <td valign="bottom" width="{{imageSize}}"> 390 <td valign="bottom" width="{{imageSize}}">
390 <div ng-if="imagePair[constants.KEY__IS_DIFFERENT]" 391 <div ng-if="imagePair[constants.KEY__IS_DIFFERENT]"
391 title="Perceptual difference measure is {{imagePair[constants.K EY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__PERCEPTUAL_DIFF].toFixed(4) }}%. Maximum difference per channel: R={{imagePair[constants.KEY__DIFFERENCE_DA TA][constants.KEY__DIFFERENCE_DATA__MAX_DIFF_PER_CHANNEL][0]}}, G={{imagePair[co nstants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__MAX_DIFF_PER_CHANN EL][1]}}, B={{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENC E_DATA__MAX_DIFF_PER_CHANNEL][2]}}"> 392 title="Perceptual difference measure is {{imagePair[constants.K EY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__PERCEPTUAL_DIFF].toFixed(4) }}%. Maximum difference per channel: R={{imagePair[constants.KEY__DIFFERENCE_DA TA][constants.KEY__DIFFERENCE_DATA__MAX_DIFF_PER_CHANNEL][0]}}, G={{imagePair[co nstants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENCE_DATA__MAX_DIFF_PER_CHANN EL][1]}}, B={{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERENC E_DATA__MAX_DIFF_PER_CHANNEL][2]}}">
392 393
393 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__PERCEPTUAL_DIFF].toFixed(4)}}% 394 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__PERCEPTUAL_DIFF].toFixed(4)}}%
394 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__MAX_DIFF_PER_CHANNEL]}} 395 {{imagePair[constants.KEY__DIFFERENCE_DATA][constants.KEY__DIFFERE NCE_DATA__MAX_DIFF_PER_CHANNEL]}}
395 <br/> 396 <br/>
396 <a href="/static/generated-images/diffs/{{getImageDiffRelativeUrl( imagePair)}}" target="_blank">View Image</a><br/> 397 <a href="{{imageSets[constants.KEY__IMAGESETS__SET__DIFFS][constan ts.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{getImageDiffRelativeUrl(imagePair)}}" ta rget="_blank">View Image</a><br/>
397 <img ng-if="showThumbnails" 398 <img ng-if="showThumbnails"
398 ng-style="{backgroundColor: pixelDiffBgColor}" 399 ng-style="{backgroundColor: pixelDiffBgColor}"
399 width="{{imageSize}}" 400 width="{{imageSize}}"
400 src="/static/generated-images/diffs/{{getImageDiffRelativeUrl (imagePair)}}"/> 401 src="{{imageSets[constants.KEY__IMAGESETS__SET__DIFFS][consta nts.KEY__IMAGESETS__FIELD__BASE_URL]}}/{{getImageDiffRelativeUrl(imagePair)}}" / >
401 </div> 402 </div>
402 <div ng-show="!imagePair[constants.KEY__IS_DIFFERENT]" 403 <div ng-show="!imagePair[constants.KEY__IS_DIFFERENT]"
403 style="text-align:center"> 404 style="text-align:center">
404 &ndash;none&ndash; 405 &ndash;none&ndash;
405 </div> 406 </div>
406 </td> 407 </td>
407 408
408 <td> 409 <td>
409 <input type="checkbox" 410 <input type="checkbox"
410 name="rowSelect" 411 name="rowSelect"
411 value="{{imagePair.index}}" 412 value="{{imagePair.index}}"
412 ng-checked="isValueInArray(imagePair.index, selectedImagePair s)" 413 ng-checked="isValueInArray(imagePair.index, selectedImagePair s)"
413 ng-click="toggleValueInArray(imagePair.index, selectedImagePa irs)"> 414 ng-click="toggleValueInArray(imagePair.index, selectedImagePa irs)">
414 </tr> 415 </tr>
415 </table> <!-- imagePairs --> 416 </table> <!-- imagePairs -->
416 </td></tr></table> <!-- table holding results header + imagePairs table --> 417 </td></tr></table> <!-- table holding results header + imagePairs table -->
417 418
418 </div><!-- main display area of selected tab --> 419 </div><!-- main display area of selected tab -->
419 </div><!-- everything: hide until data is loaded --> 420 </div><!-- everything: hide until data is loaded -->
420 421
421 </body> 422 </body>
422 </html> 423 </html>
OLDNEW
« no previous file with comments | « gm/rebaseline_server/static/loader.js ('k') | gm/rebaseline_server/testdata/outputs/expected/results_test.ResultsTest.test_gm/gm.json » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698