Create AJAX live-viewer of expected-vs-actual GM results

gm/viewer/module.js

Index: gm/viewer/module.js
===================================================================
--- gm/viewer/module.js	(revision 0)
+++ gm/viewer/module.js	(revision 0)
@@ -0,0 +1,80 @@
+/*

[epoger, 2013/07/26 21:43:02]

To check it out in action, go to
https://x20web.corp.google.com/~epoger/viewer/view.html

+ * JsonDataModule:
+ * Reads an actual-results.json file, and imports its data into $scope.
+ */
+var JsonDataModule = angular.module(
+    'JsonDataModule',
+    [],
+    function($httpProvider) {
+      /* Override transformResponse so that the numeric checksums are interpreted as
+       * strings instead, since Javascript cannot handle 64-bit integers. */
+      $httpProvider.defaults.transformResponse = function(data, headersGetter) {
+        return JSON.parse(data.replace(/\s(\d+)\s/g, " \"$1\" "));
+      }
+    }
+);
+JsonDataModule.controller(
+    'JsonDataModule.Controller',
+    function($scope, $http) {
+      /* When the changePlatformPath function is called, download actual-results.json
+       * from the desired platform directory.
+       *
+       * When the JSON is received, return it in several forms that are needed by
+       * the frontend:
+       * 1. rawJsonData

[Zach Reizner, 2013/07/29 18:40:34]

rawJsonData is not used in the front end.

[epoger, 2013/07/29 22:38:39]

Correct.  rawJsonData had been used by the frontend originally, but I ditched it
in favor of the other forms.

I figured it was cheap to provide, so I would leave it in place in case the
frontend decides to use it later.  Do you think that's reasonable, or do you
think providing it comes at a nonnegligible cost?

+       * 2. actualResults (an array broken down by result type)
+       * 3. expectedResultsByImageName (a dictionary)
+       */
+      $scope.changePlatformPath = function() {
+        $http.get($scope.platformPath + "/actual-results.json").success(
+            function(response) {
+
+              // Return rawJsonData
+              $scope.rawJsonData = response;
+
+              // Assemble and return actualResults
+              var actualResults = [];
+              angular.forEach(response['actual-results'], function(resultsOfThisType, resultType) {
+                var resultCollection = [];
+                angular.forEach(resultsOfThisType, function(hashTypeAndValue, imageName) {
+                  var hashType = hashTypeAndValue[0];
+                  var hashValue = hashTypeAndValue[1];
+                  var testName = imageName.replace(/_[^_]+\.png/, "");
+                  var url = "http://chromium-skia-gm.commondatastorage.googleapis.com/gm/"
+                      + hashType + "/" + testName + "/" + hashValue + ".png";
+                  var thisResult = new Object();

[Zach Reizner, 2013/07/29 18:40:34]

Creating objects like this is clearer and more JavaScripty with object literals:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Values,_variabl...

[epoger, 2013/07/29 22:38:39]

Cool, thanks for the tip!  Done.

+                  thisResult['imageName'] = imageName;
+                  thisResult['testName'] = testName;

[Zach Reizner, 2013/07/29 18:40:34]

testName is not used in the front end. Neither is hashType or hashValue.

[epoger, 2013/07/29 22:38:39]

hashValue *is* used, but the others aren't... removed.

+                  thisResult['hashType'] = hashType;
+                  thisResult['hashValue'] = hashValue;
+                  thisResult['url'] = url;
+                  resultCollection.push(thisResult);
+                });
+                var resultTypeAndCollection = new Object();
+                resultTypeAndCollection['resultType'] = resultType;
+                resultTypeAndCollection['resultsOfThisType'] = resultCollection;
+                actualResults.push(resultTypeAndCollection);
+              });
+              $scope.actualResults = actualResults;
+
+              // Assemble and return expectedResultsByImageName
+              var expectedResultsByImageName = response['expected-results'];
+              angular.forEach(expectedResultsByImageName, function(resultsForThisImageName, imageName) {
+                var allowedDigests = resultsForThisImageName['allowed-digests'];
+                if (allowedDigests != null) {
+                  var hashType = allowedDigests[0][0];
+                  var hashValue = allowedDigests[0][1];
+                  var testName = imageName.replace(/_[^_]+\.png/, "");
+                  var url = "http://chromium-skia-gm.commondatastorage.googleapis.com/gm/"
+                      + hashType + "/" + testName + "/" + hashValue + ".png";
+                  expectedResultsByImageName[imageName]['hashValue'] = hashValue;
+                  expectedResultsByImageName[imageName]['url'] = url;
+                }
+              });
+              $scope.expectedResultsByImageName = expectedResultsByImageName;
+
+            }
+         );
+      };
+    }
+);