add diff viewer website

add diff viewer website

- adjust PMetric output to be percentage

R=borenet@google.com, bsalomon@google.com

Committed: https://code.google.com/p/skia/source/detail?r=9942

[bsalomon, 2013-07-08 17:14:54]

On 2013/07/08 15:32:43, Zach Reizner wrote:

ok lgtm, but me not read css/html/js good.

[borenet, 2013-07-08 20:44:38]

Looks okay, but would like a little clarification.

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
File experimental/skpdiff/diff_viewer.js (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
experimental/skpdiff/diff_viewer.js:11: $scope.records = SkPDiffRecords.records;
Where does SkPDiffRecords come from?  There isn't a server in play here, is
there?

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.html
File experimental/skpdiff/viewer.html (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.h...
experimental/skpdiff/viewer.html:12: <div ng-app
ng-controller="DiffViewController">
Since I've never seen angular.js before (and I suspect few on this team have), I
think some comments, either on the review or in the code, would be helpful.

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.h...
experimental/skpdiff/viewer.html:24: <td>Test Image</td>
We typically use "actual" as the term to describe the images generated by GM.  I
think that would be clearer, here and elsewhere.

[Zach Reizner, 2013-07-08 21:02:19]

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
File experimental/skpdiff/diff_viewer.js (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
experimental/skpdiff/diff_viewer.js:11: $scope.records = SkPDiffRecords.records;
On 2013/07/08 20:44:38, borenet wrote:
> Where does SkPDiffRecords come from?  There isn't a server in play here, is
> there?

I'm using JSONP to avoid using AJAX because I don't wish to run a local server.
JSONP is loaded using the script tag. This tag is located in viewer.html with
src="skpdiff_output.json". skpdiff_output.json is generated by skpdiff.

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.html
File experimental/skpdiff/viewer.html (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.h...
experimental/skpdiff/viewer.html:24: <td>Test Image</td>
On 2013/07/08 20:44:38, borenet wrote:
> We typically use "actual" as the term to describe the images generated by GM. 
I
> think that would be clearer, here and elsewhere.

So the correct term is "Baseline Actual?"

[borenet, 2013-07-09 15:25:51]

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
File experimental/skpdiff/diff_viewer.js (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/diff_vie...
experimental/skpdiff/diff_viewer.js:11: $scope.records = SkPDiffRecords.records;
On 2013/07/08 21:02:19, Zach Reizner wrote:
> On 2013/07/08 20:44:38, borenet wrote:
> > Where does SkPDiffRecords come from?  There isn't a server in play here, is
> > there?
> 
> I'm using JSONP to avoid using AJAX because I don't wish to run a local
server.
> JSONP is loaded using the script tag. This tag is located in viewer.html with
> src="skpdiff_output.json". skpdiff_output.json is generated by skpdiff.

Got it, thanks.

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.html
File experimental/skpdiff/viewer.html (right):

https://codereview.chromium.org/18132007/diff/1/experimental/skpdiff/viewer.h...
experimental/skpdiff/viewer.html:24: <td>Test Image</td>
On 2013/07/08 21:02:19, Zach Reizner wrote:
> On 2013/07/08 20:44:38, borenet wrote:
> > We typically use "actual" as the term to describe the images generated by
GM. 
> I
> > think that would be clearer, here and elsewhere.
> 
> So the correct term is "Baseline Actual?"

"Actual," as opposed to "Baseline."  So your headers would be something like
"Baseline Image" and "Actual Image."

[Zach Reizner, 2013-07-09 20:43:48]

I changed "Test Image" to "Actual Image"

[bsalomon, 2013-07-09 20:51:58]

On 2013/07/09 20:43:48, Zach Reizner wrote:
> I changed "Test Image" to "Actual Image"

Sorry for chiming in late. We won't only be using this for GM baselines vs. GM
actuals. People will run it locally to check their changes. We'll run in it on
one config/platform vs another. I think the names should be generic (A, B),
(left, right), or something along those lines.

[borenet, 2013-07-09 20:53:03]

LGTM but I'd still like some comments

[borenet, 2013-07-09 21:02:38]

On 2013/07/09 20:51:58, bsalomon wrote:
> On 2013/07/09 20:43:48, Zach Reizner wrote:
> > I changed "Test Image" to "Actual Image"
> 
> Sorry for chiming in late. We won't only be using this for GM baselines vs. GM
> actuals. People will run it locally to check their changes. We'll run in it on
> one config/platform vs another. I think the names should be generic (A, B),
> (left, right), or something along those lines.

What if the tool took optional "left title" and "right title" parameters, so
that rebaselining scripts could provide those so that there's no confusion over
which is which, but if they aren't specified you get A/B?

[bsalomon, 2013-07-09 21:02:57]

On 2013/07/09 21:02:38, borenet wrote:
> On 2013/07/09 20:51:58, bsalomon wrote:
> > On 2013/07/09 20:43:48, Zach Reizner wrote:
> > > I changed "Test Image" to "Actual Image"
> > 
> > Sorry for chiming in late. We won't only be using this for GM baselines vs.
GM
> > actuals. People will run it locally to check their changes. We'll run in it
on
> > one config/platform vs another. I think the names should be generic (A, B),
> > (left, right), or something along those lines.
> 
> What if the tool took optional "left title" and "right title" parameters, so
> that rebaselining scripts could provide those so that there's no confusion
over
> which is which, but if they aren't specified you get A/B?

sgtm

[Zach Reizner, 2013-07-09 21:08:31]

Committed patchset #2 manually as r9942 (presubmit successful).