/**
 * An element which loads and displays UI representing the changes made in an image.
 */
angular.module('quay').directive('imageChangesView', function () {
  var directiveDefinitionObject = {
    priority: 0,
    templateUrl: '/static/directives/image-changes-view.html',
    replace: false,
    transclude: false,
    restrict: 'C',
    scope: {
      'repository': '=repository',
      'image': '=image',
      'hasChanges': '=hasChanges'
    },
    controller: function($scope, $element, ApiService) {
      $scope.$watch('image', function() {
        if (!$scope.image || !$scope.repository) { return; }

        var params = {
          'repository': $scope.repository.namespace + '/' + $scope.repository.name,
          'image_id': $scope.image
        };

        $scope.hasChanges = true;
        $scope.imageChangesResource = ApiService.getImageChangesAsResource(params).get(function(resp) {
          $scope.changeData = resp;
          $scope.hasChanges = resp.added.length || resp.removed.length || resp.changed.length;
        });
      });
    }
  };
  return directiveDefinitionObject;
});