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

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

Issue 149473005: Add magnifier to rebaseline server (Closed) Base URL: https://skia.googlesource.com/skia.git@master
Patch Set: Remove unneeded mask size logic Created 6 years, 10 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') | 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 <script src="diff_viewer.js"></script>
9 <link rel="stylesheet" href="view.css"> 10 <link rel="stylesheet" href="view.css">
10 </head> 11 </head>
11 12
12 <body> 13 <body>
13 <h2> 14 <h2>
14 Instructions, roadmap, etc. are at 15 Instructions, roadmap, etc. are at
15 <a href="http://tinyurl.com/SkiaRebaselineServer"> 16 <a href="http://tinyurl.com/SkiaRebaselineServer">
16 http://tinyurl.com/SkiaRebaselineServer 17 http://tinyurl.com/SkiaRebaselineServer
17 </a> 18 </a>
18 </h2> 19 </h2>
(...skipping 186 matching lines...) Expand 10 before | Expand all | Expand 10 after
205 <button ng-click="moveSelectedItemsToTab(otherTab)" 206 <button ng-click="moveSelectedItemsToTab(otherTab)"
206 ng-disabled="selectedItems.length == 0" 207 ng-disabled="selectedItems.length == 0"
207 ng-hide="otherTab == viewingTab"> 208 ng-hide="otherTab == viewingTab">
208 move {{selectedItems.length}} selected tests to {{otherTab}} tab 209 move {{selectedItems.length}} selected tests to {{otherTab}} tab
209 </button> 210 </button>
210 </div> 211 </div>
211 </td> 212 </td>
212 </tr> 213 </tr>
213 </table> <!-- results header --> 214 </table> <!-- results header -->
214 </td></tr><tr><td> 215 </td></tr><tr><td>
215 <table border="1"> <!-- results --> 216 <table border="1" ng-app="diff_viewer"> <!-- results -->
216 <tr> 217 <tr>
217 <!-- Most column headers are displayed in a common fashion... --> 218 <!-- Most column headers are displayed in a common fashion... -->
218 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf ig']"> 219 <th ng-repeat="categoryName in ['resultType', 'builder', 'test', 'conf ig']">
219 <input type="radio" 220 <input type="radio"
220 name="sortColumnRadio" 221 name="sortColumnRadio"
221 value="{{categoryName}}" 222 value="{{categoryName}}"
222 ng-checked="(sortColumn == categoryName)" 223 ng-checked="(sortColumn == categoryName)"
223 ng-click="sortResultsBy(categoryName)"> 224 ng-click="sortResultsBy(categoryName)">
224 {{categoryName}} 225 {{categoryName}}
225 </th> 226 </th>
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after
268 <!-- item-selection checkbox column --> 269 <!-- item-selection checkbox column -->
269 </th> 270 </th>
270 </tr> 271 </tr>
271 272
272 <!-- For most columns... if the user clicks on the cell, and we are on 273 <!-- For most columns... if the user clicks on the cell, and we are on
273 the default tab, update the filter to only show results with the 274 the default tab, update the filter to only show results with the
274 same value for this category. 275 same value for this category.
275 This is made a bit tricky by the fact that AngularJS expressions 276 This is made a bit tricky by the fact that AngularJS expressions
276 do not allow control flow statements. See 277 do not allow control flow statements. See
277 http://docs.angularjs.org/guide/expression --> 278 http://docs.angularjs.org/guide/expression -->
278 <tr ng-repeat="result in limitedTestData"> 279 <tr ng-repeat="result in limitedTestData" ng-controller="ImageController ">
279 <td ng-click="(viewingTab != defaultTab) || showOnlyResultType(result. resultType)"> 280 <td ng-click="(viewingTab != defaultTab) || showOnlyResultType(result. resultType)">
280 {{result.resultType}} 281 {{result.resultType}}
281 </td> 282 </td>
282 <td ng-repeat="categoryName in ['builder', 'test']" 283 <td ng-repeat="categoryName in ['builder', 'test']"
283 ng-click="(viewingTab != defaultTab) || setCategoryValueMatch(cate goryName, result[categoryName])"> 284 ng-click="(viewingTab != defaultTab) || setCategoryValueMatch(cate goryName, result[categoryName])">
284 {{result[categoryName]}} 285 {{result[categoryName]}}
285 </td> 286 </td>
286 <td ng-click="(viewingTab != defaultTab) || showOnlyConfig(result.conf ig)"> 287 <td ng-click="(viewingTab != defaultTab) || showOnlyConfig(result.conf ig)">
287 {{result.config}} 288 {{result.config}}
288 </td> 289 </td>
289 <td> 290 <td>
290 <a ng-repeat="bug in result['bugs']" 291 <a ng-repeat="bug in result['bugs']"
291 href="https://code.google.com/p/skia/issues/detail?id={{bug}}" 292 href="https://code.google.com/p/skia/issues/detail?id={{bug}}"
292 target="_blank"> 293 target="_blank">
293 {{bug}} 294 {{bug}}
294 </a> 295 </a>
295 </td> 296 </td>
296 297
297 <!-- expected image --> 298 <!-- expected image -->
298 <td valign="top" width="{{imageSize}}"> 299 <td valign="top" width="{{imageSize}}">
299 <a class="image-link" target="_blank" href="http://chromium-skia-gm. commondatastorage.googleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/ {{result.expectedHashDigest}}.png"> 300 <br/>
300 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.e xpectedHashDigest}}.png"/> 301 <a href="http://chromium-skia-gm.commondatastorage.googleapis.com/gm /{{result.expectedHashType}}/{{result.test}}/{{result.expectedHashDigest}}.png" target="_blank">View Image</a><br/>
301 </a> 302 <img-compare type="baseline"
303 src="http://chromium-skia-gm.commondatastorage.googleap is.com/gm/{{result.expectedHashType}}/{{result.test}}/{{result.expectedHashDiges t}}.png" />
304
302 </td> 305 </td>
303 306
304 <!-- actual image --> 307 <!-- actual image -->
305 <td valign="top" width="{{imageSize}}"> 308 <td valign="top" width="{{imageSize}}">
306 <a class="image-link" target="_blank" href="http://chromium-skia-gm. commondatastorage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{ result.actualHashDigest}}.png"> 309 <br/>
307 <img width="{{imageSize}}" src="http://chromium-skia-gm.commondata storage.googleapis.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.act ualHashDigest}}.png"/> 310 <a href="http://chromium-skia-gm.commondatastorage.googleapis.com/gm /{{result.actualHashType}}/{{result.test}}/{{result.actualHashDigest}}.png" targ et="_blank">View Image</a><br/>
308 </a> 311 <img-compare type="test"
312 src="http://chromium-skia-gm.commondatastorage.googleap is.com/gm/{{result.actualHashType}}/{{result.test}}/{{result.actualHashDigest}}. png" />
313
309 </td> 314 </td>
310 315
311 <!-- whitediffs: every differing pixel shown in white --> 316 <!-- whitediffs: every differing pixel shown in white -->
312 <td valign="top" width="{{imageSize}}"> 317 <td valign="top" width="{{imageSize}}">
313 <div ng-hide="result.expectedHashDigest == result.actualHashDigest" 318 <div ng-hide="result.expectedHashDigest == result.actualHashDigest"
314 title="{{result.numDifferingPixels | number:0}} of {{(100 * res ult.numDifferingPixels / result.percentDifferingPixels) | number:0}} pixels ({{r esult.percentDifferingPixels.toFixed(4)}}%) differ from expectation."> 319 title="{{result.numDifferingPixels | number:0}} of {{(100 * res ult.numDifferingPixels / result.percentDifferingPixels) | number:0}} pixels ({{r esult.percentDifferingPixels.toFixed(4)}}%) differ from expectation.">
315 <a class="image-link" target="_blank" href="/static/generated-imag es/whitediffs/{{result.expectedHashDigest}}-vs-{{result.actualHashDigest}}.png"> 320
316 <img width="{{imageSize}}" src="/static/generated-images/whitedi ffs/{{result.expectedHashDigest}}-vs-{{result.actualHashDigest}}.png"/>
317 </a><br>
318 {{result.percentDifferingPixels.toFixed(4)}}% 321 {{result.percentDifferingPixels.toFixed(4)}}%
319 ({{result.numDifferingPixels}}) 322 ({{result.numDifferingPixels}})
323 <br/>
324 <a href="/static/generated-images/whitediffs/{{result.expectedHash Digest}}-vs-{{result.actualHashDigest}}.png" target="_blank">View Image</a><br/>
325 <img-compare type="differingPixelsInWhite"
326 src="/static/generated-images/whitediffs/{{result.exp ectedHashDigest}}-vs-{{result.actualHashDigest}}.png" />
327
320 </div> 328 </div>
321 <div ng-hide="result.expectedHashDigest != result.actualHashDigest" 329 <div ng-hide="result.expectedHashDigest != result.actualHashDigest"
322 style="text-align:center"> 330 style="text-align:center">
323 &ndash;none&ndash; 331 &ndash;none&ndash;
324 </div> 332 </div>
325 </td> 333 </td>
326 334
327 <!-- diffs: per-channel RGB deltas --> 335 <!-- diffs: per-channel RGB deltas -->
328 <td valign="top" width="{{imageSize}}"> 336 <td valign="top" width="{{imageSize}}">
329 <div ng-hide="result.expectedHashDigest == result.actualHashDigest" 337 <div ng-hide="result.expectedHashDigest == result.actualHashDigest"
330 title="Weighted difference measure is {{result.weightedDiffMeas ure.toFixed(4)}}%. Maximum difference per channel: R={{result.maxDiffPerChannel [0]}}, G={{result.maxDiffPerChannel[1]}}, B={{result.maxDiffPerChannel[2]}}"> 338 title="Weighted difference measure is {{result.weightedDiffMeas ure.toFixed(4)}}%. Maximum difference per channel: R={{result.maxDiffPerChannel [0]}}, G={{result.maxDiffPerChannel[1]}}, B={{result.maxDiffPerChannel[2]}}">
331 <a class="image-link" target="_blank" href="/static/generated-imag es/diffs/{{result.expectedHashDigest}}-vs-{{result.actualHashDigest}}.png"> 339
332 <img width="{{imageSize}}" src="/static/generated-images/diffs/{ {result.expectedHashDigest}}-vs-{{result.actualHashDigest}}.png"/>
333 </a><br>
334 {{result.weightedDiffMeasure.toFixed(4)}}% 340 {{result.weightedDiffMeasure.toFixed(4)}}%
335 {{result.maxDiffPerChannel}} 341 {{result.maxDiffPerChannel}}
342 <br/>
343 <a href="/static/generated-images/diffs/{{result.expectedHashDiges t}}-vs-{{result.actualHashDigest}}.png" target="_blank">View Image</a><br/>
344 <img-compare type="differencePerPixel"
345 src="/static/generated-images/diffs/{{result.expected HashDigest}}-vs-{{result.actualHashDigest}}.png"
346 ng-mousedown="MagnifyDraw($event, true)"
347 ng-mousemove="MagnifyDraw($event, false)"
348 ng-mouseup="MagnifyEnd($event)"
349 ng-mouseleave="MagnifyEnd($event)" />
350
336 </div> 351 </div>
337 <div ng-hide="result.expectedHashDigest != result.actualHashDigest" 352 <div ng-hide="result.expectedHashDigest != result.actualHashDigest"
338 style="text-align:center"> 353 style="text-align:center">
339 &ndash;none&ndash; 354 &ndash;none&ndash;
340 </div> 355 </div>
341 </td> 356 </td>
342 357
343 <td> 358 <td>
344 <input type="checkbox" 359 <input type="checkbox"
345 name="rowSelect" 360 name="rowSelect"
(...skipping 10 matching lines...) Expand all
356 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and 371 <!-- TODO(epoger): Can we get the base URLs (commondatastorage and
357 issues list) from 372 issues list) from
358 https://skia.googlesource.com/buildbot/+/master/site_config/global_variab les.json ? 373 https://skia.googlesource.com/buildbot/+/master/site_config/global_variab les.json ?
359 I tried importing the 374 I tried importing the
360 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using 375 http://skia.googlecode.com/svn/buildbot/skia_tools.js script and using
361 that to do so, but I got Access-Control-Allow-Origin errors. 376 that to do so, but I got Access-Control-Allow-Origin errors.
362 --> 377 -->
363 378
364 </body> 379 </body>
365 </html> 380 </html>
OLDNEW
« no previous file with comments | « gm/rebaseline_server/static/loader.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698