Add a fetch tag dialog

static/js/directives/repo-view/repo-panel-info.js

@@ -12,7 +12,16 @@ angular.module('quay').directive('repoPanelInfo', function () {
       'repository': '=repository',
       'builds': '=builds'
     },
-    controller: function($scope, $element, ApiService) {
+    controller: function($scope, $element, ApiService, Config) {
+      $scope.$watch('repository', function(repository) {
+        if (!$scope.repository) { return; }
+
+        var namespace = $scope.repository.namespace;
+        var name = $scope.repository.name;
+
+        $scope.pullCommand = 'docker pull ' + Config.getDomain() + '/' + namespace + '/' + name;
+      });
+
       $scope.updateDescription = function(content) {
         $scope.repository.description = content;
         $scope.repository.put();

static/js/directives/ui/fetch-tag-dialog.js

@@ -0,0 +1,104 @@
+/**
+ * An element which adds a of dialog for fetching a tag.
+ */
+angular.module('quay').directive('fetchTagDialog', function () {
+  var directiveDefinitionObject = {
+    priority: 0,
+    templateUrl: '/static/directives/fetch-tag-dialog.html',
+    replace: false,
+    transclude: false,
+    restrict: 'C',
+    scope: {
+      'repository': '=repository',
+      'actionHandler': '=actionHandler'
+    },
+    controller: function($scope, $element, $timeout, ApiService, UserService, Config) {
+      $scope.clearCounter = 0;
+      $scope.currentFormat = null;
+      $scope.currentEntity = null;
+      $scope.currentRobot = null;
+
+      $scope.formats = [
+        {
+          'title': 'Squashed Docker Image',
+          'icon': 'fa-file-archive-o',
+          'command': 'curl -L -f {http}://{pull_user}:{pull_password}@{hostname}/c1/squash/{namespace}/{name}/{tag} | docker load',
+          'require_creds': true
+        },
+
+        {
+          'title': 'Basic Docker Pull',
+          'icon': 'docker-icon',
+          'command': 'docker pull {hostname}/{namespace}/{name}:{tag}'
+        }];
+
+      $scope.$watch('currentEntity', function(entity) {
+        if (!entity) {
+          $scope.currentRobot = null;
+          return;
+        }
+
+        if ($scope.currentRobot && $scope.currentRobot.name == entity.name) {
+          return;
+        }
+
+        $scope.currentRobot = null;
+
+        var parts = entity.name.split('+');
+        var namespace = parts[0];
+        var shortname = parts[1];
+
+        var params = {
+          'robot_shortname': shortname
+        };
+
+        var orgname = UserService.isOrganization(namespace) ? namespace : '';
+        ApiService.getRobot(orgname, null, params).then(function(resp) {
+          $scope.currentRobot = resp;
+        }, ApiService.errorDisplay('Cannot download robot token'));
+      });
+
+      $scope.getCommand = function(format, robot) {
+        if (!format || !format.command) { return ''; }
+        if (format.require_creds && !robot) { return ''; }
+
+        var params = {
+          'pull_user': robot ? robot.name : '',
+          'pull_password': robot ? robot.token : '',
+          'hostname': Config.getDomain(),
+          'http': Config.getHttp(),
+          'namespace': $scope.repository.namespace,
+          'name': $scope.repository.name,
+          'tag': $scope.currentTag.name
+        };
+
+        var value = format.command;
+        for (var param in params) {
+          if (!params.hasOwnProperty(param)) { continue; }
+          value = value.replace('{' + param + '}', params[param]);
+        }
+
+        return value;
+      };
+
+      $scope.setFormat = function(format) {
+        $scope.currentFormat = format;
+      };
+
+      $scope.actionHandler = {
+        'askFetchTag': function(tag) {
+          $scope.currentTag = tag;
+          $scope.currentFormat = null;
+          $scope.currentEntity = null;
+          $scope.currentRobot = null;
+
+          $scope.clearCounter++;
+
+          $element.find('#copyClipboard').clipboardCopy();
+          $element.find('#fetchTagDialog').modal({});
+        }
+      };
+    }
+  };
+  return directiveDefinitionObject;
+});