quay/static/js/controllers.js

$.fn.clipboardCopy = function() { 
  var clip = new ZeroClipboard($(this),  { 'moviePath': 'static/lib/ZeroClipboard.swf' });  

  clip.on('complete', function() {
    // Resets the animation.
    var elem = $('#clipboardCopied')[0];
    elem.style.display = 'none';
    elem.classList.remove('animated');

    // Show the notification.
    setTimeout(function() {
      elem.style.display = 'inline-block';
      elem.classList.add('animated');
    }, 10);
  });
};

function SigninCtrl($scope) {
};

function PlansCtrl($scope, $location, UserService, PlanService) {
  // Load the list of plans.
  PlanService.getPlans(function(plans) {
    $scope.plans = plans;
  }, /* include the personal plan */ true);

  // Monitor any user changes and place the current user into the scope.
  UserService.updateUserIn($scope);

  $scope.signedIn = function() {
    $('#signinModal').modal('hide');
    PlanService.handleNotedPlan();    
  };
    
  $scope.buyNow = function(plan) {
    PlanService.notePlan(plan);
    if ($scope.user && !$scope.user.anonymous) {
      PlanService.handleNotedPlan();    
    } else {
      $('#signinModal').modal({});
    }
  };
}

function GuideCtrl($scope) {
}

function SecurityCtrl($scope) {
}

function RepoListCtrl($scope, Restangular, UserService, ApiService) {
  $scope.namespace = null;
  $scope.page = 1;
  $scope.publicPageCount = null;
 
  // Monitor changes in the user.
  UserService.updateUserIn($scope, function() {
    loadMyRepos($scope.namespace);
  });

  // Monitor changes in the namespace.
  $scope.$watch('namespace', function(namespace) {
    loadMyRepos(namespace);
  });

  $scope.movePublicPage = function(increment) {
    if ($scope.publicPageCount == null) {
      return;
    }

    $scope.page += increment;
    if ($scope.page < 1) {
      $scope.page = 1;
    }

    if ($scope.page > $scope.publicPageCount) {
      $scope.page = $scope.publicPageCount;
    }

    loadPublicRepos();
  };

  var loadMyRepos = function(namespace) {
    if (!$scope.user || $scope.user.anonymous || !namespace) {
      return;
    }

    var options = {'public': false, 'sort': true, 'namespace': namespace};
    
    $scope.user_repositories = ApiService.listReposAsResource().withOptions(options).get(function(resp) {
      return resp.repositories;
    });
  };

  var loadPublicRepos = function() {
    var options = {
      'public': true,
      'private': false,
      'sort': true,
      'limit': 10,
      'page': $scope.page,
      'count': $scope.page == 1
    };

    $scope.public_repositories = ApiService.listReposAsResource().withOptions(options).get(function(resp) {
      if (resp.count) {
        $scope.publicPageCount = Math.ceil(resp.count / 10);
      }
      return resp.repositories;
    });
  };

  loadPublicRepos();
}

function LandingCtrl($scope, UserService, ApiService) {
  $scope.namespace = null;

  $scope.$watch('namespace', function(namespace) {
    loadMyRepos(namespace);
  });

  UserService.updateUserIn($scope, function() {
    loadMyRepos($scope.namespace);
  });

  $scope.canCreateRepo = function(namespace) {
    if (!$scope.user) { return false; }

    if (namespace == $scope.user.username) {
      return true;
    }
    
    if ($scope.user.organizations) {
      for (var i = 0; i < $scope.user.organizations.length; ++i) {
        var org = $scope.user.organizations[i];
        if (org.name == namespace) {
          return org.can_create_repo;
        }
      }
    }

    return false;
  };

  var loadMyRepos = function(namespace) {
    if (!$scope.user || $scope.user.anonymous || !namespace) {
      return;
    }

    var options = {'limit': 4, 'public': false, 'sort': true, 'namespace': namespace };
    $scope.my_repositories = ApiService.listReposAsResource().withOptions(options).get(function(resp) {
      return resp.repositories;
    });
  };

  browserchrome.update();
}

function RepoCtrl($scope, Restangular, ApiService, $routeParams, $rootScope, $location, $timeout) {
  var namespace = $routeParams.namespace;
  var name = $routeParams.name;

  $rootScope.title = 'Loading...';

  // Watch for the destruction of the scope.
  $scope.$on('$destroy', function() {
    if ($scope.tree) {
      $scope.tree.dispose();
    }
  });

  // Watch for changes to the repository.
  $scope.$watch('repo', function() {
    if ($scope.tree) {
      $timeout(function() {
        $scope.tree.notifyResized();
      });
    }
  });

  // Watch for changes to the tag parameter.
  $scope.$on('$routeUpdate', function(){
    if ($location.search().tag) {
      $scope.setTag($location.search().tag, false);
    } else if ($location.search().image) {
      $scope.setImage($location.search().image, false);
    } else {
      $scope.setTag($location.search().tag, false);
    }
  });

  // Start scope methods //////////////////////////////////////////

  $scope.updateForDescription = function(content) {
    $scope.repo.description = content;
    $scope.repo.put();
  };

  $scope.parseDate = function(dateString) {
    return Date.parse(dateString);
  };

  $scope.getTimeSince = function(createdTime) {
      return moment($scope.parseDate(createdTime)).fromNow();
  };

  $scope.loadImageChanges = function(image) {
    var params = {'repository': namespace + '/' + name, 'image_id': image.id};
    $scope.currentImageChangeResource = ApiService.getImageChangesAsResource(params).get(function(ci) {
      $scope.currentImageChanges = ci;
    });
  };

  $scope.getMoreCount = function(changes) {
    if (!changes) { return 0; }
    var addedDisplayed = Math.min(5, changes.added.length);
    var removedDisplayed = Math.min(5, changes.removed.length);
    var changedDisplayed = Math.min(5, changes.changed.length);

    return (changes.added.length + changes.removed.length + changes.changed.length) -
      addedDisplayed - removedDisplayed - changedDisplayed;
  };

  $scope.setImage = function(imageId, opt_updateURL) {
    var image = null;
    for (var i = 0; i < $scope.images.length; ++i) {
      var currentImage = $scope.images[i];
      if (currentImage.id == imageId || currentImage.id.substr(0, 12) == imageId) {
        image = currentImage;
        break;
      }
    }

    if (!image) { return; }

    $scope.currentTag = null;
    $scope.currentImage = image;
    $scope.loadImageChanges(image);
    if ($scope.tree) {
      $scope.tree.setImage(image.id);
    }

    if (opt_updateURL) {
      $location.search('tag', null);
      $location.search('image', imageId.substr(0, 12));
    }
  };

  $scope.tagSpecificImages = function(tagName) {
    if (!tagName) { return []; }

    var tag = $scope.repo.tags[tagName];
    if (!tag) { return []; }

    if ($scope.specificImages && $scope.specificImages[tagName]) {
      return $scope.specificImages[tagName];
    }

    var getIdsForTag = function(currentTag) {
      var ids = {};
      forAllTagImages(currentTag, function(image) {
        ids[image.dbid] = true;
      });
      return ids;
    };

    // Remove any IDs that match other tags.
    var toDelete = getIdsForTag(tag);
    for (var currentTagName in $scope.repo.tags) {
      var currentTag = $scope.repo.tags[currentTagName];
      if (currentTag != tag) {
        for (var dbid in getIdsForTag(currentTag)) {
          delete toDelete[dbid];
        }
      }
    }

    // Return the matching list of images.
    var images = [];
    for (var i = 0; i < $scope.images.length; ++i) {
      var image = $scope.images[i];
      if (toDelete[image.dbid]) {
        images.push(image);
      }
    }
      
    images.sort(function(a, b) {
      var result = new Date(b.created) - new Date(a.created);
      if (result != 0) {
        return result;
      }

      return b.dbid - a.dbid;
    });

    $scope.specificImages[tagName] = images;
    return images;
  };

  $scope.askDeleteTag = function(tagName) {
    if (!$scope.repo.can_admin) { return; }

    $scope.tagToDelete = tagName;
    $('#confirmdeleteTagModal').modal('show');
  };

  $scope.deleteTag = function(tagName) {
    if (!$scope.repo.can_admin) { return; }
    $('#confirmdeleteTagModal').modal('hide');

    var params = {
      'repository': namespace + '/' + name,
      'tag': tagName
    };

    ApiService.deleteFullTag(null, params).then(function() {
      loadViewInfo();
    }, function(resp) {
      bootbox.dialog({
        "message": resp.data ? resp.data : 'Could not delete tag',
        "title": "Cannot delete tag",
        "buttons": {
          "close": {
            "label": "Close",
            "className": "btn-primary"
          }
        }
      });
    });
  };

  $scope.getImagesForTagBySize = function(tag) {
    var images = [];
    forAllTagImages(tag, function(image) {
        images.push(image);
    });

    images.sort(function(a, b) {
      return b.size - a.size;
    });

    return images;
  };

  $scope.getTotalSize = function(tag) {
    var size = 0;
    forAllTagImages(tag, function(image) {
      size += image.size;
    });
    return size;
  };

  $scope.setTag = function(tagName, opt_updateURL) {
    var repo = $scope.repo;
    var proposedTag = repo.tags[tagName];
    if (!proposedTag) {
      // We must find a good default
      for (tagName in repo.tags) {
        if (!proposedTag || tagName == 'latest') {
          proposedTag = repo.tags[tagName];          
        }
      }
    }

    if (proposedTag) {
      $scope.currentTag = proposedTag;
      $scope.currentImage = $scope.currentTag.image;
      $scope.loadImageChanges($scope.currentImage);
      if ($scope.tree) {
        $scope.tree.setTag($scope.currentTag.name);
      } 

      if (opt_updateURL) {
        $location.search('image', null);
        $location.search('tag', $scope.currentTag.name);
      }
    }

    if ($scope.currentTag && !repo.tags[$scope.currentTag.name]) {
      $scope.currentTag = null;
      $scope.currentImage = null;
    }
  };

  $scope.getFirstTextLine = getFirstTextLine;

  $scope.getImageListingClasses = function(image, tagName) {
    var classes = '';
    if (image.ancestors.length > 1) {
      classes += 'child ';
    }
 
    var currentTag = $scope.repo.tags[tagName];
    if (image.dbid == currentTag.image.dbid) {
      classes += 'tag-image ';
    }

    return classes;
  };

  $scope.getTagCount = function(repo) {
    if (!repo) { return 0; }
    var count = 0;
    for (var tag in repo.tags) {
      ++count;
    }
    return count;
  };

  $scope.hideTagMenu = function(tagName, clientX, clientY) {
    $scope.currentMenuTag = null;

    var tagMenu = $("#tagContextMenu");
    tagMenu.hide();
  };

  $scope.showTagMenu = function(tagName, clientX, clientY) {
    if (!$scope.repo.can_admin) { return; }

    $scope.currentMenuTag = tagName;

    var tagMenu = $("#tagContextMenu");
    tagMenu.css({
      display: "block",
      left: clientX,
      top: clientY
    });

    tagMenu.on("blur", function() {
      setTimeout(function() {
        tagMenu.hide();
      }, 100); // Needed to allow clicking on menu items.
    });

    tagMenu.on("click", "a", function() {
      setTimeout(function() {
        tagMenu.hide();
      }, 100); // Needed to allow clicking on menu items.
    });

    tagMenu[0].focus();
  };

  var getDefaultTag = function() {
    if ($scope.repo === undefined) {
      return undefined;
    } else if ($scope.repo.tags.hasOwnProperty('latest')) {
      return $scope.repo.tags['latest'];
    } else {
      for (key in $scope.repo.tags) {
        return $scope.repo.tags[key];
      }
    }
  };

  var forAllTagImages = function(tag, callback) {
    if (!tag || !$scope.imageByDBID) { return; }

    callback(tag.image);

    var ancestors = tag.image.ancestors.split('/');
    for (var i = 0; i < ancestors.length; ++i) {
      var image = $scope.imageByDBID[ancestors[i]];
      if (image) {
        callback(image);
      }
    }
  };

  var fetchRepository = function() {
    var params = {'repository': namespace + '/' + name};
    $rootScope.title = 'Loading Repository...';
    $scope.repository = ApiService.getRepoAsResource(params).get(function(repo) {
      // Set the repository object.
      $scope.repo = repo;

      // Set the default tag.
      $scope.setTag($routeParams.tag);

      // Set the title of the page.
      var qualifiedRepoName = namespace + '/' + name;
      $rootScope.title = qualifiedRepoName;
      var kind = repo.is_public ? 'public' : 'private';
      $rootScope.description = jQuery(getFirstTextLine(repo.description)).text() ||
        'Visualization of images and tags for ' + kind + ' Docker repository: ' + qualifiedRepoName;

      // If the repository is marked as building, start monitoring it for changes.
      if (repo.is_building) {
        startBuildInfoTimer(repo);
      }

      $('#copyClipboard').clipboardCopy();
    });
  };

  var startBuildInfoTimer = function(repo) {
    if ($scope.interval) { return; }

    getBuildInfo(repo);
    $scope.interval = setInterval(function() {
      $scope.$apply(function() { getBuildInfo(repo); });
    }, 5000);

    $scope.$on("$destroy", function() {
      cancelBuildInfoTimer();
    });
  };

  var cancelBuildInfoTimer = function() {
    if ($scope.interval) {
      clearInterval($scope.interval);
    }
  };

  var getBuildInfo = function(repo) {
    // Note: We use restangular manually here because we need to turn off the loading bar.
    var buildInfo = Restangular.one('repository/' + repo.namespace + '/' + repo.name + '/build/');
    buildInfo.withHttpConfig({
      'ignoreLoadingBar': true
    });

    buildInfo.get().then(function(resp) {
      var runningBuilds = [];
      for (var i = 0; i < resp.builds.length; ++i) {
        var build = resp.builds[i];
        if (build.status != 'complete') {
          runningBuilds.push(build);
        }
      }

      $scope.buildsInfo = runningBuilds;
      if (!runningBuilds.length) {
        // Cancel the build timer.
        cancelBuildInfoTimer();

        // Mark the repo as no longer building.
        $scope.repo.is_building = false;

        // Reload the repo information.
        loadViewInfo();
      }
    });
  };

  var listImages = function() {
    var params = {'repository': namespace + '/' + name};    
    $scope.imageHistory = ApiService.listRepositoryImagesAsResource(params).get(function(resp) {
      $scope.images = resp.images;
      $scope.specificImages = [];

      // Build various images for quick lookup of images.
      $scope.imageByDBID = {};
      for (var i = 0; i < $scope.images.length; ++i) {
        var currentImage = $scope.images[i];
        $scope.imageByDBID[currentImage.dbid] = currentImage;
      }

      // Dispose of any existing tree.
      if ($scope.tree) {
        $scope.tree.dispose();
      }

      // Create the new tree.
      $scope.tree = new ImageHistoryTree(namespace, name, resp.images,
          getFirstTextLine, $scope.getTimeSince);

      $scope.tree.draw('image-history-container');

      // If we already have a tag, use it
      if ($scope.currentTag) {
        $scope.tree.setTag($scope.currentTag.name);
      }

      // Listen for changes to the selected tag and image in the tree.
      $($scope.tree).bind('tagChanged', function(e) {
        $scope.$apply(function() { $scope.setTag(e.tag, true); });
      });

      $($scope.tree).bind('imageChanged', function(e) {
        $scope.$apply(function() { $scope.setImage(e.image.id, true); });
      });

      $($scope.tree).bind('showTagMenu', function(e) {
        $scope.$apply(function() { $scope.showTagMenu(e.tag, e.clientX, e.clientY); });
      });

      $($scope.tree).bind('hideTagMenu', function(e) {
        $scope.$apply(function() { $scope.hideTagMenu(); });
      });

      if ($routeParams.image) {
        $scope.setImage($routeParams.image);
      }

      return resp.images;
    });
  };

  var loadViewInfo = function() {
    fetchRepository();
    listImages();
  };

  // Fetch the repository itself as well as the image history.
  loadViewInfo();
}

function RepoAdminCtrl($scope, Restangular, ApiService, $routeParams, $rootScope) {
  var namespace = $routeParams.namespace;
  var name = $routeParams.name;

  $scope.permissions = {'team': [], 'user': []};
  $scope.logsShown = 0;
  
  $scope.loadLogs = function() {
    $scope.logsShown++;
  };

  $scope.grantRole = function() {
    $('#confirmaddoutsideModal').modal('hide');
    var entity = $scope.currentAddEntity;
    $scope.addRole(entity.name, 'read', entity.kind, entity.is_org_member)
    $scope.currentAddEntity = null;
  };

  $scope.addNewPermission = function(entity) {
    // Don't allow duplicates.
    if ($scope.permissions[entity.kind][entity.name]) { return; }

    if (entity.is_org_member === false) {
      $scope.currentAddEntity = entity;
      $('#confirmaddoutsideModal').modal('show');
      return;
    }

    $scope.addRole(entity.name, 'read', entity.kind);
  };

  $scope.deleteRole = function(entityName, kind) {
    var permissionDelete = Restangular.one(getRestUrl('repository', namespace, name, 'permissions', kind, entityName));
    permissionDelete.customDELETE().then(function() {
      delete $scope.permissions[kind][entityName];
    }, function(resp) {
      if (resp.status == 409) {
        $scope.changePermError = resp.data || '';
        $('#channgechangepermModal').modal({});       
      } else {
        $('#cannotchangeModal').modal({});
      }
    });
  };

  $scope.addRole = function(entityName, role, kind) {
    var permission = {
      'role': role,
    };

    var permissionPost = Restangular.one(getRestUrl('repository', namespace, name, 'permissions', kind, entityName));
    permissionPost.customPOST(permission).then(function(result) {
      $scope.permissions[kind][entityName] = result;
    }, function(result) {
      $('#cannotchangeModal').modal({});
    });
  };

  $scope.roles = [
      { 'id': 'read', 'title': 'Read', 'kind': 'success' },
      { 'id': 'write', 'title': 'Write', 'kind': 'success' },
      { 'id': 'admin', 'title': 'Admin', 'kind': 'primary' }
  ];

  $scope.setRole = function(role, entityName, kind) {
    var permission = $scope.permissions[kind][entityName];
    var currentRole = permission.role;
    permission.role = role;
   
    var permissionPut = Restangular.one(getRestUrl('repository', namespace, name, 'permissions', kind, entityName));
    permissionPut.customPUT(permission).then(function() {}, function(resp) {
      $scope.permissions[kind][entityName] = {'role': currentRole};
      $scope.changePermError = null;
      if (resp.status == 409 || resp.data) {
        $scope.changePermError = resp.data || '';
        $('#channgechangepermModal').modal({});
      } else {
        $('#cannotchangeModal').modal({});
      }
    });
  };

  $scope.createToken = function() {
    var friendlyName = {
      'friendlyName': $scope.newToken.friendlyName
    };

    var params = {'repository': namespace + '/' + name};
    ApiService.createToken(friendlyName, params).then(function(newToken) {
      $scope.newToken.friendlyName = '';
      $scope.createTokenForm.$setPristine();
      $scope.tokens[newToken.code] = newToken;
    });
  };

  $scope.deleteToken = function(tokenCode) {
    var params = {
      'repository': namespace + '/' + name,
      'code': tokenCode
    };

    ApiService.deleteToken(null, params).then(function() {
      delete $scope.tokens[tokenCode];
    });
  };

  $scope.changeTokenAccess = function(tokenCode, newAccess) {
    var role = {
      'role': newAccess
    };

    var params = {
      'repository': namespace + '/' + name,
      'code': tokenCode
    };

    ApiService.changeToken(role, params).then(function(updated) {
      $scope.tokens[updated.code] = updated;
    });
  };

  $scope.shownTokenCounter = 0;

  $scope.showToken = function(tokenCode) {
    $scope.shownToken = $scope.tokens[tokenCode];
    $scope.shownTokenCounter++;
  };

  $scope.askChangeAccess = function(newAccess) {
    $('#make' + newAccess + 'Modal').modal({});
  };

  $scope.changeAccess = function(newAccess) {
    $('#make' + newAccess + 'Modal').modal('hide');

    var visibility = {
      'visibility': newAccess
    };

    var params = {
      'repository': namespace + '/' + name
    };

    ApiService.changeRepoVisibility(visibility, params).then(function() {
      $scope.repo.is_public = newAccess == 'public';
    }, function() {
      $('#cannotchangeModal').modal({});
    });
  };

  $scope.askDelete = function() {
    $('#confirmdeleteModal').modal({});
  };

  $scope.deleteRepo = function() {
    $('#confirmdeleteModal').modal('hide');

    var params = {
      'repository': namespace + '/' + name
    };

    ApiService.deleteRepository(null, params).then(function() {
      $scope.repo = null;
      
      setTimeout(function() {
        document.location = '/repository/';
      }, 1000);
    }, function() {
      $('#cannotchangeModal').modal({});
    });
  };

  $scope.loadWebhooks = function() {
    var params = {
      'repository': namespace + '/' + name
    };

    $scope.newWebhook = {};
    $scope.webhooksResource = ApiService.listWebhooksAsResource(params).get(function(resp) {
      $scope.webhooks = resp.webhooks;
      return $scope.webhooks;
    });
  };

  $scope.createWebhook = function() {
    if (!$scope.newWebhook.url) {
      return;
    }

    var params = {
      'repository': namespace + '/' + name
    };

    ApiService.createWebhook($scope.newWebhook, params).then(function(resp) {
      $scope.webhooks.push(resp);
      $scope.newWebhook.url = '';
      $scope.createWebhookForm.$setPristine();
    });
  };

  $scope.deleteWebhook = function(webhook) {
    var params = {
      'repository': namespace + '/' + name,
      'public_id': webhook.public_id
    };

    ApiService.deleteWebhook(null, params).then(function(resp) {
      $scope.webhooks.splice($scope.webhooks.indexOf(webhook), 1);
    });
  };

  var fetchTokens = function() {
    var params = {
      'repository': namespace + '/' + name
    };

    ApiService.listRepoTokens(null, params).then(function(resp) {
      $scope.tokens = resp.tokens;
    }, function() {
      $scope.tokens = null;
    });
  };

  var fetchPermissions = function(kind) {
    var permissionsFetch = Restangular.one('repository/' + namespace + '/' + name + '/permissions/' + kind + '/');
    permissionsFetch.get().then(function(resp) {
      $scope.permissions[kind] = resp.permissions;
    }, function() {
      $scope.permissions[kind] = null;
    });
  };

  var fetchRepository = function() {
    var params = {
      'repository': namespace + '/' + name
    };

    $scope.repository = ApiService.getRepoAsResource(params).get(function(repo) {
      $scope.repo = repo;

      $rootScope.title = 'Settings - ' + namespace + '/' + name;
      $rootScope.description = 'Administrator settings for ' + namespace + '/' + name +
          ': Permissions, webhooks and other settings';

      // Fetch all the permissions and token info for the repository.
      fetchPermissions('user');
      fetchPermissions('team');
      fetchTokens();

      $('.info-icon').popover({
        'trigger': 'hover',
        'html': true
      });

      return $scope.repo;
    });
  };

  // Fetch the repository.
  fetchRepository();
}

function UserAdminCtrl($scope, $timeout, $location, ApiService, PlanService, UserService, KeyService, $routeParams) {
  if ($routeParams['migrate']) {
    $('#migrateTab').tab('show')
  }

  UserService.updateUserIn($scope, function(user) {
    $scope.askForPassword = user.askForPassword;
    $scope.cuser = jQuery.extend({}, user);
  });

  $scope.readyForPlan = function() {
    // Show the subscribe dialog if a plan was requested.
    return $routeParams['plan'];
  };

  $scope.loading = true;
  $scope.updatingUser = false;
  $scope.changePasswordSuccess = false;
  $scope.convertStep = 0;
  $scope.org = {};

  $('.form-change-pw').popover();

  $scope.logsShown = 0;
  $scope.invoicesShown = 0;
  
  $scope.loadLogs = function() {
    if (!$scope.hasPaidBusinessPlan) { return; }
    $scope.logsShown++;
  };

  $scope.loadInvoices = function() {
    if (!$scope.hasPaidBusinessPlan) { return; }
    $scope.invoicesShown++;
  };

  $scope.planChanged = function(plan) {
    $scope.hasPaidPlan = plan && plan.price > 0;
    $scope.hasPaidBusinessPlan = PlanService.isOrgCompatible(plan) && plan.price > 0;
  };

  $scope.showConvertForm = function() {
    PlanService.getMatchingBusinessPlan(function(plan) {
      $scope.org.plan = plan;
    });

    PlanService.getPlans(function(plans) {
      $scope.orgPlans = plans;
    });
      
    $scope.convertStep = 1;
  };

  $scope.convertToOrg = function() {
    $('#reallyconvertModal').modal({});
  };

  $scope.reallyConvert = function() {
    $scope.loading = true;

    var data = {
      'adminUser': $scope.org.adminUser,
      'adminPassword': $scope.org.adminPassword,
      'plan': $scope.org.plan.stripeId
    };

    ApiService.convertUserToOrganization(data).then(function(resp) {
      UserService.load();
      $location.path('/');
    }, function(resp) {
      $scope.loading = false;
      if (resp.data.reason == 'invaliduser') {
        $('#invalidadminModal').modal({});
      } else {
        $('#cannotconvertModal').modal({});
      }
    });
  };

  $scope.changePassword = function() {
    $('.form-change-pw').popover('hide');
    $scope.updatingUser = true;
    $scope.changePasswordSuccess = false;

    ApiService.changeUserDetails($scope.cuser).then(function() {
      $scope.updatingUser = false;
      $scope.changePasswordSuccess = true;

      // Reset the form
      $scope.cuser.password = '';
      $scope.cuser.repeatPassword = '';
      $scope.changePasswordForm.$setPristine();

      // Reload the user.
      UserService.load();
    }, function(result) {
      $scope.updatingUser = false;

      $scope.changePasswordError = result.data.message;
      $timeout(function() {
        $('.form-change-pw').popover('show');
      });
    });
  };
}

function ImageViewCtrl($scope, $routeParams, $rootScope, $timeout, ApiService) {  
  var namespace = $routeParams.namespace;
  var name = $routeParams.name;
  var imageid = $routeParams.image;

  $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;
  };
  
  $scope.initializeTree = function() {
    if ($scope.tree) { return; }
    
    $scope.tree = new ImageFileChangeTree($scope.image, $scope.combinedChanges);
    $timeout(function() {
      $scope.tree.draw('changes-tree-container');
    }, 10);
  };

  var fetchImage = function() {
    var params = {
      'repository': namespace + '/' + name,
      'image_id': imageid  
    };

    $scope.image = ApiService.getImageAsResource(params).get(function(image) {
      $scope.repo = {
        'name': name,
        'namespace': namespace
      };

      $rootScope.title = 'View Image - ' + image.id;
      $rootScope.description = 'Viewing docker image ' + image.id + ' under repository ' + namespace + '/' + name +
        ': Image changes tree and list view';

      // Fetch the image's changes.
      fetchChanges();

      $('#copyClipboard').clipboardCopy();

      return image;
    });
  };

  var fetchChanges = function() {
    var params = {
      'repository': namespace + '/' + name,
      'image_id': imageid  
    };

    ApiService.getImageChanges(null, params).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;
    });
  };

  // Fetch the image.
  fetchImage();
}

function V1Ctrl($scope, $location, UserService) {
  UserService.updateUserIn($scope);
}

function NewRepoCtrl($scope, $location, $http, $timeout, UserService, ApiService, PlanService) {
  UserService.updateUserIn($scope);

  $scope.repo = {
    'is_public': 1,
    'description': '',
    'initialize': false
  };

  $('#couldnotbuildModal').on('hidden.bs.modal', function() {
    $scope.$apply(function() {
      $location.path('/repository/' + $scope.created.namespace + '/' + $scope.created.name);
    });
  });

  // Watch the namespace on the repo. If it changes, we update the plan and the public/private
  // accordingly.
  $scope.isUserNamespace = true;
  $scope.$watch('repo.namespace', function(namespace) {
    // Note: Can initially be undefined.
    if (!namespace) { return; }
    
    var isUserNamespace = (namespace == $scope.user.username);

    $scope.checkingPlan = true;
    $scope.planRequired = null;
    $scope.isUserNamespace = isUserNamespace;

    if (isUserNamespace) {
      // Load the user's subscription information in case they want to create a private
      // repository.
      ApiService.getUserPrivateCount().then(function(resp) {
        if (resp.privateCount + 1 > resp.reposAllowed) {
          PlanService.getMinimumPlan(resp.privateCount + 1, false, function(minimum) {
            $scope.planRequired = minimum;
          });
        }

        $scope.checkingPlan = false;
      }, function() {
        $scope.planRequired = {};
        $scope.checkingPlan = false;
      });
    } else {
      ApiService.getOrganizationPrivateAllowed(null, {'orgname': namespace}).then(function(resp) {
        $scope.planRequired = resp.privateAllowed ? null : {};
        $scope.checkingPlan = false;
      }, function() {
        $scope.planRequired = {};
        $scope.checkingPlan = false;
      });

      // Auto-set to private repo.
      $scope.repo.is_public = '0';
    }
  });

  $scope.createNewRepo = function() {
    $('#repoName').popover('hide');

    var uploader = $('#file-drop')[0];
    if ($scope.repo.initialize && uploader.files.length < 1) {
      $('#missingfileModal').modal();
      return;
    }

    $scope.creating = true;
    var repo = $scope.repo;
    var data = {
      'namespace': repo.namespace,
      'repository': repo.name,
      'visibility': repo.is_public == '1' ? 'public' : 'private',
      'description': repo.description
    };

    ApiService.createRepo(data).then(function(created) {
      $scope.creating = false;
      $scope.created = created;

      // Repository created. Start the upload process if applicable.
      if ($scope.repo.initialize) {
        startFileUpload(created);
        return;
      }

      // Otherwise, redirect to the repo page.
      $location.path('/repository/' + created.namespace + '/' + created.name);
    }, function(result) {
      $scope.creating = false;
      $scope.createError = result.data;
      $timeout(function() {
        $('#repoName').popover('show');
      });
    });
  };

  $scope.upgradePlan = function() {
    var callbacks = {
      'started': function() { $scope.planChanging = true; },
      'opened': function() { $scope.planChanging = true; },
      'closed': function() { $scope.planChanging = false; },
      'success': subscribedToPlan,
      'failure': function(resp) {
        $('#couldnotsubscribeModal').modal();
        $scope.planChanging = false;
      }
    };

    PlanService.changePlan($scope, null, $scope.planRequired.stripeId, callbacks);
  };
 
  var startBuild = function(repo, fileId) {
    $scope.building = true;

    var data = {
      'file_id': fileId
    };

    var params = {
      'repository': repo.namespace + '/' + repo.name
    };

    ApiService.requestRepoBuild(data, params).then(function(resp) {
      $location.path('/repository/' + params.repository);
    }, function() {
      $('#couldnotbuildModal').modal();
    });
  };

  var conductUpload = function(repo, file, url, fileId, mimeType) {
    var request = new XMLHttpRequest();
    request.open('PUT', url, true);
    request.setRequestHeader('Content-Type', mimeType);
    request.onprogress = function(e) {
      $scope.$apply(function() {
        var percentLoaded;
        if (e.lengthComputable) {
          $scope.upload_progress = (e.loaded / e.total) * 100;
        }
      });
    };
    request.onerror = function() {
      $scope.$apply(function() {
        $('#couldnotbuildModal').modal();
      });
    };
    request.onreadystatechange = function() {
      var state = request.readyState;
      if (state == 4) {
        $scope.$apply(function() {
          $scope.uploading = false;
          startBuild(repo, fileId);
        });
        return;
      }
    };
    request.send(file);
  };

  var startFileUpload = function(repo) {
    $scope.uploading = true;
    $scope.uploading_progress = 0;

    var uploader = $('#file-drop')[0];
    var file = uploader.files[0];
    $scope.upload_file = file.name;
      
    var mimeType = file.type || 'application/octet-stream';
    var data = {
      'mimeType': mimeType
    };

    var getUploadUrl = ApiService.getFiledropUrl(data).then(function(resp) {
      conductUpload(repo, file, resp.url, resp.file_id, mimeType);
    }, function() {        
      $('#couldnotbuildModal').modal();
    });
  };

  var subscribedToPlan = function(sub) {
    $scope.planChanging = false;
    $scope.subscription = sub;

    PlanService.getPlan(sub.plan, function(subscribedPlan) {
      $scope.subscribedPlan = subscribedPlan;
      $scope.planRequired = null;

      // Check to see if the current plan allows for an additional private repository to
      // be created.
      var privateAllowed = $scope.subscription.usedPrivateRepos < $scope.subscribedPlan.privateRepos;
      if (!privateAllowed) {
        // If not, find the minimum repository that does.
        PlanService.getMinimumPlan($scope.subscription.usedPrivateRepos + 1, !$scope.isUserNamespace, function(minimum) {
          $scope.planRequired = minimum;
        });
      }
    });
  };
}

function OrgViewCtrl($rootScope, $scope, ApiService, $routeParams) {
  var orgname = $routeParams.orgname;

  $scope.TEAM_PATTERN = TEAM_PATTERN;
  $rootScope.title = 'Loading...';

  $scope.teamRoles = [
      { 'id': 'member', 'title': 'Member', 'kind': 'default' },
      { 'id': 'creator', 'title': 'Creator', 'kind': 'success' },
      { 'id': 'admin', 'title': 'Admin', 'kind': 'primary' }
  ];
  
  $scope.setRole = function(role, teamname) {    
    var previousRole = $scope.organization.teams[teamname].role;
    $scope.organization.teams[teamname].role = role;

    var params = {
      'orgname': orgname,
      'teamname': teamname
    };

    var data = $scope.organization.teams[teamname];

    ApiService.updateOrganizationTeam(data, params).then(function(resp) {
    }, function(resp) {     
      $scope.organization.teams[teamname].role = previousRole;
      $scope.roleError = resp.data || '';
      $('#cannotChangeTeamModal').modal({});
    });
  };

  $scope.createTeam = function(teamname) {
    if (!teamname) {
      return;
    }

    if ($scope.organization.teams[teamname]) {
      $('#team-' + teamname).removeClass('highlight');
      setTimeout(function() {
        $('#team-' + teamname).addClass('highlight');
      }, 10);
      return;
    }

    createOrganizationTeam(ApiService, orgname, teamname, function(created) {
      $scope.organization.teams[teamname] = created;
    });
  };

  $scope.askDeleteTeam = function(teamname) {
    $scope.currentDeleteTeam = teamname;
    $('#confirmdeleteModal').modal({});
  };

  $scope.deleteTeam = function() {
    $('#confirmdeleteModal').modal('hide');
    if (!$scope.currentDeleteTeam) { return; }

    var teamname = $scope.currentDeleteTeam;
    var params = {
      'orgname': orgname,
      'teamname': teamname
    };

    ApiService.deleteOrganizationTeam(null, params).then(function() {
      delete $scope.organization.teams[teamname];
      $scope.currentDeleteTeam = null;
    }, function() {
      $('#cannotchangeModal').modal({});
      $scope.currentDeleteTeam = null;
    });
  };

  var loadOrganization = function() {
    $scope.orgResource = ApiService.getOrganizationAsResource({'orgname': orgname}).get(function(org) {
      $scope.organization = org;
      $rootScope.title = orgname;
      $rootScope.description = 'Viewing organization ' + orgname;

      $('.info-icon').popover({
        'trigger': 'hover',
        'html': true
      });
    });
  };

  // Load the organization.
  loadOrganization();
}

function OrgAdminCtrl($rootScope, $scope, Restangular, $routeParams, UserService, PlanService, ApiService) {
  var orgname = $routeParams.orgname;

  // Load the list of plans.
  PlanService.getPlans(function(plans) {
    $scope.plans = plans;
    $scope.plan_map = {};

    for (var i = 0; i < plans.length; ++i) {
      $scope.plan_map[plans[i].stripeId] = plans[i];
    }
  });

  $scope.orgname = orgname;
  $scope.membersLoading = true;
  $scope.membersFound = null;
  $scope.invoiceLoading = true;
  $scope.logsShown = 0;
  $scope.invoicesShown = 0;
  
  $scope.loadLogs = function() {
    $scope.logsShown++;
  };

  $scope.loadInvoices = function() {
    $scope.invoicesShown++;
  };

  $scope.planChanged = function(plan) {
    $scope.hasPaidPlan = plan && plan.price > 0;
  };

  $scope.loadMembers = function() {
    if ($scope.membersFound) { return; }
    $scope.membersLoading = true;

    var params = {
      'orgname': orgname
    };

    ApiService.getOrganizationMembers(null, params).then(function(resp) {
      var membersArray = [];
      for (var key in resp.members) {
        if (resp.members.hasOwnProperty(key)) {
          membersArray.push(resp.members[key]);
        }
      }

      $scope.membersFound = membersArray;
      $scope.membersLoading = false;
    });
  };

  var loadOrganization = function() {
    $scope.orgResource = ApiService.getOrganizationAsResource({'orgname': orgname}).get(function(org) {
      if (org && org.is_admin) {
        $scope.organization = org;
        $rootScope.title = orgname + ' (Admin)';
        $rootScope.description = 'Administration page for organization ' + orgname;
      }
    });
  };

  // Load the organization.
  loadOrganization();
}

function TeamViewCtrl($rootScope, $scope, Restangular, ApiService, $routeParams) {
  var teamname = $routeParams.teamname;
  var orgname = $routeParams.orgname;

  $scope.orgname = orgname;
  $scope.teamname = teamname;

  $rootScope.title = 'Loading...';

  $scope.addNewMember = function(member) {
    if ($scope.members[member.name]) { return; }

    var params = {
      'orgname': orgname,
      'teamname': teamname,
      'membername': member.name
    };

    ApiService.updateOrganizationTeamMember(null, params).then(function(resp) {
      $scope.members[member.name] = resp;
    }, function() {
      $('#cannotChangeMembersModal').modal({});
    });
  };

  $scope.removeMember = function(username) {
    var params = {
      'orgname': orgname,
      'teamname': teamname,
      'membername': username
    };

    ApiService.deleteOrganizationTeamMember(null, params).then(function(resp) {
      delete $scope.members[username];
    }, function() {
      $('#cannotChangeMembersModal').modal({});
    });
  };

  $scope.updateForDescription = function(content) {
    $scope.organization.teams[teamname].description = content;

    var params = {
      'orgname': orgname,
      'teamname': teamname
    };

    var teaminfo = $scope.organization.teams[teamname];
    ApiService.updateOrganizationTeam(teaminfo, params).then(function(resp) {
    }, function() {
      $('#cannotChangeTeamModal').modal({});
    });
  };

  var loadOrganization = function() {
    $scope.orgResource = ApiService.getOrganizationAsResource({'orgname': orgname}).get(function(org) {
      $scope.organization = org;
      $scope.team = $scope.organization.teams[teamname];
      $rootScope.title = teamname + ' (' + $scope.orgname + ')';
      $rootScope.description = 'Team management page for team ' + teamname + ' under organization ' + $scope.orgname;
      loadMembers();
      return org;
    });
  };

  var loadMembers = function() {
    var params = {
      'orgname': orgname,
      'teamname': teamname
    };

    $scope.membersResource = ApiService.getOrganizationTeamMembersAsResource(params).get(function(resp) {
      $scope.members = resp.members;
      $scope.canEditMembers = resp.can_edit;
        
      $('.info-icon').popover({
        'trigger': 'hover',
        'html': true
      });

      return resp.members;
    });
  };

  // Load the organization.
  loadOrganization();
}

function OrgsCtrl($scope, UserService) {
  UserService.updateUserIn($scope);
  browserchrome.update();
}

function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, PlanService, ApiService) {
  UserService.updateUserIn($scope);

  var requested = $routeParams['plan'];

  // Load the list of plans.
  PlanService.getPlans(function(plans) {
    $scope.plans = plans;
    $scope.currentPlan = null;
    if (requested) {
      PlanService.getPlan(requested, function(plan) {
        $scope.currentPlan = plan;
      });
    }
  });

  $scope.signedIn = function() {
    PlanService.handleNotedPlan();
  };

  $scope.signinStarted = function() {
    PlanService.getMinimumPlan(1, true, function(plan) {
      PlanService.notePlan(plan.stripeId);
    });
  };

  $scope.setPlan = function(plan) {
    $scope.currentPlan = plan;
  };

  $scope.createNewOrg = function() {
    $('#orgName').popover('hide');

    $scope.creating = true;
    var org = $scope.org;
    var data = {
      'name': org.name,
      'email': org.email
    };

    ApiService.createOrganization(data).then(function(created) {
      $scope.created = created;

      // Reset the organizations list.
      UserService.load();

      var showOrg = function() {
        $scope.creating = false;
        $location.path('/organization/' + org.name + '/');
      };

      // If the selected plan is free, simply move to the org page.
      if ($scope.currentPlan.price == 0) {
        showOrg();
        return;
      }

      // Otherwise, show the subscribe for the plan.
      $scope.creating = true;
      var callbacks = {
        'opened': function() { $scope.creating = true; },
        'closed': showOrg,
        'success': showOrg,
        'failure': showOrg
      };

      PlanService.changePlan($scope, org.name, $scope.currentPlan.stripeId, callbacks);
    }, function(result) {
      $scope.creating = false;
      $scope.createError = result.data.message || result.data;
      $timeout(function() {
        $('#orgName').popover('show');
      });
    });
  };
}


function OrgMemberLogsCtrl($scope, $routeParams, $rootScope, $timeout, Restangular, ApiService) {
  var orgname = $routeParams.orgname;
  var membername = $routeParams.membername;

  $scope.orgname = orgname;
  $scope.memberInfo = null;
  $scope.ready = false;

  var loadOrganization = function() {
    $scope.orgResource = ApiService.getOrganizationAsResource({'orgname': orgname}).get(function(org) {
      $scope.organization = org;
      return org;
    });
  };

  var loadMemberInfo = function() {
    var params = {
      'orgname': orgname,
      'membername': membername
    };

    $scope.memberResource = ApiService.getOrganizationMemberAsResource(params).get(function(resp) {
      $scope.memberInfo = resp.member;

      $rootScope.title = 'Logs for ' + $scope.memberInfo.username + ' (' + $scope.orgname + ')';
      $rootScope.description = 'Shows all the actions of ' + $scope.memberInfo.username +
         ' under organization ' + $scope.orgname;

      $timeout(function() {
        $scope.ready = true;
      });

      return resp.member;
    });   
  };

  // Load the org info and the member info.
  loadOrganization();
  loadMemberInfo();
}