Add a table view to the repos list page

Fixes #104

static/js/directives/ui/repo-list-table.js

@@ -0,0 +1,102 @@
+/**
+ * An element which displays a table of repositories.
+ */
+angular.module('quay').directive('repoListTable', function () {
+  var directiveDefinitionObject = {
+    priority: 0,
+    templateUrl: '/static/directives/repo-list-table.html',
+    replace: false,
+    transclude: true,
+    restrict: 'C',
+    scope: {
+      'repositoriesResources': '=repositoriesResources',
+      'namespaces': '=namespaces'
+    },
+    controller: function($scope, $element, $filter) {
+      var orderBy = $filter('orderBy');
+
+      $scope.repositories = null;
+      $scope.orderedRepositories = [];
+
+      $scope.maxPopularity = 0;
+      $scope.options = {
+        'predicate': 'is_starred',
+        'reverse': true
+      };
+
+      var buildOrderedRepositories = function() {
+        if (!$scope.repositories) { return; }
+        var modifier = $scope.options.reverse ? '-' : '';
+        var fields = [modifier + $scope.options.predicate];
+
+        // Secondary ordering by full name.
+        if ($scope.options.predicate != 'full_name') {
+          fields.push('full_name');
+        }
+
+        var ordered = orderBy($scope.repositories, fields, false);
+        $scope.orderedRepositories = ordered;
+      };
+
+      $scope.tablePredicateClass = function(name, predicate, reverse) {
+        if (name != predicate) {
+          return '';
+        }
+
+        return 'current ' + (reverse ? 'reversed' : '');
+      };
+
+      $scope.orderBy = function(predicate) {
+        if (predicate == $scope.options.predicate) {
+          $scope.options.reverse = !$scope.options.reverse;
+          return;
+        }
+
+        $scope.options.reverse = false;
+        $scope.options.predicate = predicate;
+      };
+
+      $scope.getAvatarData = function(namespace) {
+        var found = {};
+        $scope.namespaces.forEach(function(current) {
+          if (current.name == namespace) {
+            found = current.avatar;
+          }
+        });
+        return found;
+      };
+
+      $scope.getStrengthClass = function(value, max, id) {
+        var adjusted = Math.round((value / max) * 5);
+        if (adjusted >= id) {
+          return 'active-' + adjusted;
+        }
+
+        return '';
+      };
+
+      $scope.$watch('options.predicate', buildOrderedRepositories);
+      $scope.$watch('options.reverse', buildOrderedRepositories);
+
+      $scope.$watch('repositoriesResources', function(resources) {
+        $scope.repositories = [];
+        $scope.maxPopularity = 0;
+
+        resources.forEach(function(resource) {
+          (resource.value || []).forEach(function(repository) {
+            var repositoryInfo = $.extend(repository, {
+              'full_name': repository.namespace + '/' + repository.name,
+              'last_modified_datetime': (new Date(repository.last_modified || 0)).valueOf() * (-1)
+            });
+
+            $scope.repositories.push(repositoryInfo);
+            $scope.maxPopularity = Math.max($scope.maxPopularity, repository.popularity);
+          });
+        });
+
+        buildOrderedRepositories();
+      }, /* deep */ true);
+    }
+  };
+  return directiveDefinitionObject;
+});