Index: experimental/skpdiff/diff_viewer.js |
diff --git a/experimental/skpdiff/diff_viewer.js b/experimental/skpdiff/diff_viewer.js |
deleted file mode 100644 |
index 700bf4b0e4f6a958605769f9cac5b1dfb0b13c10..0000000000000000000000000000000000000000 |
--- a/experimental/skpdiff/diff_viewer.js |
+++ /dev/null |
@@ -1,103 +0,0 @@ |
-angular.module('diff_viewer', []). |
-config(['$routeProvider', function($routeProvider) { |
- // Show the list of differences by default |
- $routeProvider. |
- otherwise({ templateUrl: '/diff_list.html', controller: DiffListController}); |
-}]). |
-directive('swapImg', function() { |
- // Custom directive for showing an image that gets swapped my mouseover. |
- return { |
- restrict: 'E', // The directive can be used as an element name |
- replace: true, // The directive replaces itself with the template |
- template: '<canvas ng-mouseenter="swap()" ng-mouseleave="swap()"></canvas>', |
- scope: { // The attributes below are bound to the scope |
- leftSrc: '@', |
- rightSrc: '@', |
- side: '@' |
- }, |
- link: function(scope, elm, attrs, ctrl) { |
- var leftImage = new Image(); |
- var rightImage = new Image(); |
- var ctx = elm[0].getContext('2d'); |
- |
- scope.render = function() { |
- var image; |
- if (scope.side == "left") { |
- image = leftImage; |
- } else { |
- image = rightImage; |
- } |
- |
- // Make it so the maximum size of an image is 500, and the images are scaled |
- // down in halves. |
- var divisor = 1; |
- while ((image.width / divisor) > 500) { |
- divisor *= 2; |
- } |
- |
- // Set canvas to correct size and draw the image into it |
- elm[0].width = image.width / divisor; |
- elm[0].height = image.height / divisor; |
- ctx.drawImage(image, 0, 0, elm[0].width, elm[0].height); |
- }; |
- |
- // When the leftSrc attribute changes, load the image and then rerender |
- attrs.$observe('leftSrc', function(value) { |
- leftImage.src = value; |
- leftImage.onload = function() { |
- if (scope.side == "left") { |
- scope.render(); |
- } |
- }; |
- }); |
- |
- // When the rightSrc attribute changes, load the image and then rerender |
- attrs.$observe('rightSrc', function(value) { |
- rightImage.src = value; |
- rightImage.onload = function() { |
- if (scope.side == "right") { |
- scope.render(); |
- } |
- }; |
- }); |
- |
- // Swap which side to draw onto the canvas and then rerender |
- scope.swap = function() { |
- if (scope.side == "left") { |
- scope.side = "right"; |
- } else { |
- scope.side = "left"; |
- } |
- scope.render(); |
- }; |
- } |
- }; |
-}); |
- |
-function DiffListController($scope) { |
- // Label each kind of differ for the sort buttons. |
- $scope.differs = [ |
- { |
- "title": "Different Pixels" |
- }, |
- { |
- "title": "Perceptual Difference" |
- } |
- ]; |
- |
- // Puts the records within AngularJS scope |
- $scope.records = SkPDiffRecords.records; |
- |
- // Indicates which diff metric is used for sorting |
- $scope.sortIndex = 1; |
- |
- // Called by the sort buttons to adjust the metric used for sorting |
- $scope.setSortIndex = function(idx) { |
- $scope.sortIndex = idx; |
- }; |
- |
- // A predicate for pulling out the number used for sorting |
- $scope.sortingDiffer = function(record) { |
- return record.diffs[$scope.sortIndex].result; |
- }; |
-} |