Add the image view page with the changes view, filterable by typing into a field. Still needs pagination or some other mechanism for getting an overview

static/js/app.js

@@ -148,6 +148,7 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
     $routeProvider.
       when('/repository/:namespace/:name', {templateUrl: '/static/partials/view-repo.html', controller: RepoCtrl, reloadOnSearch: false}).
       when('/repository/:namespace/:name/tag/:tag', {templateUrl: '/static/partials/view-repo.html', controller: RepoCtrl}).
+      when('/repository/:namespace/:name/image/:image', {templateUrl: '/static/partials/image-view.html', controller: ImageViewCtrl}).
       when('/repository/:namespace/:name/admin', {templateUrl: '/static/partials/repo-admin.html', controller:RepoAdminCtrl}).
       when('/repository/', {title: 'Repositories', templateUrl: '/static/partials/repo-list.html', controller: RepoListCtrl}).
       when('/user/', {title: 'User Admin', templateUrl: '/static/partials/user-admin.html', controller: UserAdminCtrl}).

static/js/controllers.js

@@ -782,6 +782,96 @@ function UserAdminCtrl($scope, $timeout, Restangular, PlanService, UserService,
   };
 }
 
+function ImageViewCtrl($scope, $routeParams, $rootScope, Restangular) {  
+  var namespace = $routeParams.namespace;
+  var name = $routeParams.name;
+  var imageid = $routeParams.image;
+
+  $('#copyClipboard').clipboardCopy();
+
+  $scope.getMarkedDown = function(string) {
+    if (!string) { return ''; }
+    return getMarkedDown(string);
+  };
+
+  $scope.parseDate = function(dateString) {
+    return Date.parse(dateString);
+  };
+
+  $scope.getFolder = function(filepath) {
+    var index = filepath.lastIndexOf('/');
+    if (index < 0) {
+      return '';
+    }
+    return filepath.substr(0, index + 1);
+  };
+
+  $scope.getFolders = function(filepath) {
+    var index = filepath.lastIndexOf('/');
+    if (index < 0) {
+      return '';
+    }
+    
+    return filepath.substr(0, index).split('/');
+  };
+
+  $scope.getFilename = function(filepath) {
+    var index = filepath.lastIndexOf('/');
+    if (index < 0) {
+      return filepath;
+    }
+    return filepath.substr(index + 1);
+  };
+
+  $scope.setFolderFilter = function(folderPath, index) {
+    var parts = folderPath.split('/');
+    parts = parts.slice(0, index + 1);
+    $scope.setFilter(parts.join('/'));
+  };
+
+  $scope.setFilter = function(filter) {
+    $scope.search = {};
+    $scope.search['$'] = filter;
+    document.getElementById('change-filter').value = filter;
+  };
+
+  // Fetch the image.
+  var imageFetch = Restangular.one('repository/' + namespace + '/' + name + '/image/' + imageid);
+  imageFetch.get().then(function(image) {
+    $scope.loading = false;
+    $scope.repo = {
+      'name': name,
+      'namespace': namespace
+    };
+    $scope.image = image;
+    $rootScope.title = 'View Image - ' + image.id;
+  }, function() {
+    $rootScope.title = 'Unknown Image';
+    $scope.loading = false;
+  });
+
+  // Fetch the image changes.
+  var changesFetch = Restangular.one('repository/' + namespace + '/' + name + '/image/' + imageid + '/changes');
+  changesFetch.get().then(function(changes) {
+    var combinedChanges = [];
+    var addCombinedChanges = function(c, kind) {
+      for (var i = 0;  i < c.length; ++i) {
+        combinedChanges.push({ 
+          'kind': kind,
+          'file': c[i]
+        });
+      }
+    };
+
+    addCombinedChanges(changes.added, 'added');
+    addCombinedChanges(changes.removed, 'removed');
+    addCombinedChanges(changes.changed, 'changed');
+
+    $scope.combinedChanges = combinedChanges;
+    $scope.imageChanges = changes;
+  });
+}
+
 function V1Ctrl($scope, UserService) {
   $scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
     $scope.user = currentUser;