Add a loading bar and convert to using the new ApiService and resource-view (part #2)

This commit is contained in:
Joseph Schorr 2013-12-17 22:56:28 -05:00
parent 414bd34d52
commit b2e4b8152e
24 changed files with 1243 additions and 481 deletions

View file

@ -539,7 +539,7 @@ function RepoAdminCtrl($scope, Restangular, ApiService, $routeParams, $rootScope
newWebhook.customPOST($scope.newWebhook).then(function(resp) {
$scope.webhooks.push(resp);
$scope.newWebhook.url = '';
$scope.newWebhookForm.$setPristine();
$scope.createWebhookForm.$setPristine();
});
};
@ -590,23 +590,19 @@ function RepoAdminCtrl($scope, Restangular, ApiService, $routeParams, $rootScope
}
function UserAdminCtrl($scope, $timeout, $location, Restangular, PlanService, UserService, KeyService, $routeParams) {
$scope.$watch(function () { return UserService.currentUser(); }, function (currentUser) {
if ($routeParams['migrate']) {
$('#migrateTab').tab('show')
}
UserService.updateUserIn($scope, function(user) {
$scope.askForPassword = currentUser.askForPassword;
if (!currentUser.anonymous) {
$scope.user = currentUser;
}
$scope.loading = false;
}, true);
});
$scope.readyForPlan = function() {
// Show the subscribe dialog if a plan was requested.
return $routeParams['plan'];
};
if ($routeParams['migrate']) {
$('#migrateTab').tab('show')
}
$scope.loading = true;
$scope.updatingUser = false;
$scope.changePasswordSuccess = false;
@ -685,13 +681,11 @@ function UserAdminCtrl($scope, $timeout, $location, Restangular, PlanService, Us
};
}
function ImageViewCtrl($scope, $routeParams, $rootScope, Restangular) {
function ImageViewCtrl($scope, $routeParams, $rootScope, $timeout, ApiService, Restangular) {
var namespace = $routeParams.namespace;
var name = $routeParams.name;
var imageid = $routeParams.image;
$('#copyClipboard').clipboardCopy();
$scope.parseDate = function(dateString) {
return Date.parse(dateString);
};
@ -737,61 +731,63 @@ function ImageViewCtrl($scope, $routeParams, $rootScope, Restangular) {
if ($scope.tree) { return; }
$scope.tree = new ImageFileChangeTree($scope.image, $scope.combinedChanges);
setTimeout(function() {
$timeout(function() {
$scope.tree.draw('changes-tree-container');
}, 10);
};
// Fetch the image.
$scope.loading = true;
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;
$rootScope.description = 'Viewing docker image ' + image.id + ' under repository ' + namespace + '/' + name +
var fetchImage = function() {
$scope.image = ApiService.at('repository', namespace, name, 'image', imageid).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';
}, 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]
});
}
};
// Fetch the image's changes.
fetchChanges();
addCombinedChanges(changes.added, 'added');
addCombinedChanges(changes.removed, 'removed');
addCombinedChanges(changes.changed, 'changed');
$('#copyClipboard').clipboardCopy();
$scope.combinedChanges = combinedChanges;
$scope.imageChanges = changes;
});
return image;
});
};
var fetchChanges = function() {
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;
});
};
// Fetch the image.
fetchImage();
}
function V1Ctrl($scope, $location, UserService) {
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
}, true);
UserService.updateUserIn($scope);
}
function NewRepoCtrl($scope, $location, $http, $timeout, UserService, Restangular, PlanService) {
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
}, true);
UserService.updateUserIn($scope);
$scope.repo = {
'is_public': 1,
@ -805,6 +801,94 @@ function NewRepoCtrl($scope, $location, $http, $timeout, UserService, Restangula
});
});
// 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.planRequired = null;
$scope.isUserNamespace = isUserNamespace;
if (isUserNamespace) {
// Load the user's subscription information in case they want to create a private
// repository.
PlanService.getSubscription(null, subscribedToPlan, function() {
PlanService.getMinimumPlan(1, false, function(minimum) { $scope.planRequired = minimum; });
});
} else {
$scope.planRequired = null;
var checkPrivateAllowed = Restangular.one('organization/' + namespace + '/private');
checkPrivateAllowed.get().then(function(resp) {
$scope.planRequired = resp.privateAllowed ? null : {};
}, function() {
$scope.planRequired = {};
});
// 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
};
var createPost = Restangular.one('repository');
createPost.customPOST(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;
@ -890,120 +974,19 @@ function NewRepoCtrl($scope, $location, $http, $timeout, UserService, Restangula
}
});
};
$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
};
var createPost = Restangular.one('repository');
createPost.customPOST(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);
};
// 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.planRequired = null;
$scope.isUserNamespace = isUserNamespace;
if (isUserNamespace) {
// Load the user's subscription information in case they want to create a private
// repository.
PlanService.getSubscription(null, subscribedToPlan, function() {
PlanService.getMinimumPlan(1, false, function(minimum) { $scope.planRequired = minimum; });
});
} else {
$scope.planRequired = null;
var checkPrivateAllowed = Restangular.one('organization/' + namespace + '/private');
checkPrivateAllowed.get().then(function(resp) {
$scope.planRequired = resp.privateAllowed ? null : {};
}, function() {
$scope.planRequired = {};
});
// Auto-set to private repo.
$scope.repo.is_public = '0';
}
});
}
function OrgViewCtrl($rootScope, $scope, Restangular, $routeParams) {
function OrgViewCtrl($rootScope, $scope, Restangular, ApiService, $routeParams) {
var orgname = $routeParams.orgname;
$('.info-icon').popover({
'trigger': 'hover',
'html': true
'trigger': 'hover',
'html': true
});
$scope.TEAM_PATTERN = TEAM_PATTERN;
$rootScope.title = 'Loading...';
var orgname = $routeParams.orgname;
var loadOrganization = function() {
var getOrganization = Restangular.one(getRestUrl('organization', orgname));
getOrganization.get().then(function(resp) {
$scope.organization = resp;
$scope.loading = false;
$rootScope.title = orgname;
$rootScope.description = 'Viewing organization ' + orgname;
}, function() {
$scope.loading = false;
});
};
$scope.teamRoles = [
{ 'id': 'member', 'title': 'Member', 'kind': 'default' },
{ 'id': 'creator', 'title': 'Creator', 'kind': 'success' },
@ -1063,10 +1046,21 @@ function OrgViewCtrl($rootScope, $scope, Restangular, $routeParams) {
});
};
var loadOrganization = function() {
$scope.orgResource = ApiService.at('organization', orgname).get(function(org) {
$scope.organization = org;
$rootScope.title = orgname;
$rootScope.description = 'Viewing organization ' + orgname;
});
};
// Load the organization.
loadOrganization();
}
function OrgAdminCtrl($rootScope, $scope, Restangular, $routeParams, UserService, PlanService) {
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.business;
@ -1082,8 +1076,6 @@ function OrgAdminCtrl($rootScope, $scope, Restangular, $routeParams, UserService
addPlans(plans.business);
});
var orgname = $routeParams.orgname;
$scope.orgname = orgname;
$scope.membersLoading = true;
$scope.membersFound = null;
@ -1133,35 +1125,32 @@ function OrgAdminCtrl($rootScope, $scope, Restangular, $routeParams, UserService
};
var loadOrganization = function() {
var getOrganization = Restangular.one(getRestUrl('organization', orgname));
getOrganization.get().then(function(resp) {
if (resp && resp.is_admin) {
$scope.organization = resp;
$scope.orgResource = ApiService.at('organization', orgname).get(function(org) {
if (org && org.is_admin) {
$scope.organization = org;
$rootScope.title = orgname + ' (Admin)';
$rootScope.description = 'Administration page for organization ' + orgname;
}
$scope.loading = false;
}, function() {
$scope.loading = false;
});
};
// Load the organization.
loadOrganization();
}
function TeamViewCtrl($rootScope, $scope, Restangular, $routeParams) {
function TeamViewCtrl($rootScope, $scope, Restangular, ApiService, $routeParams) {
$('.info-icon').popover({
'trigger': 'hover',
'html': true
'trigger': 'hover',
'html': true
});
$scope.orgname = $routeParams.orgname;
var teamname = $routeParams.teamname;
var orgname = $routeParams.orgname;
$scope.orgname = orgname;
$scope.teamname = teamname;
$rootScope.title = 'Loading...';
$scope.loading = true;
$scope.teamname = teamname;
$scope.addNewMember = function(member) {
if ($scope.members[member.name]) { return; }
@ -1195,57 +1184,38 @@ function TeamViewCtrl($rootScope, $scope, Restangular, $routeParams) {
};
var loadOrganization = function() {
var getOrganization = Restangular.one(getRestUrl('organization', $scope.orgname))
getOrganization.get().then(function(resp) {
$scope.organization = resp;
$scope.orgResource = ApiService.at('organization', orgname).get(function(org) {
$scope.organization = org;
$scope.team = $scope.organization.teams[teamname];
$scope.loading = !$scope.organization || !$scope.members;
}, function() {
$scope.organization = null;
$scope.members = null;
$scope.loading = false;
$rootScope.title = teamname + ' (' + $scope.orgname + ')';
$rootScope.description = 'Team management page for team ' + teamname + ' under organization ' + $scope.orgname;
loadMembers();
return org;
});
};
var loadMembers = function() {
var getMembers = Restangular.one(getRestUrl('organization', $scope.orgname, 'team', teamname, 'members'));
getMembers.get().then(function(resp) {
$scope.membersResource = ApiService.at('organization', $scope.orgname, 'team', teamname, 'members').get(function(resp) {
$scope.members = resp.members;
$scope.canEditMembers = resp.can_edit;
$scope.loading = !$scope.organization || !$scope.members;
$rootScope.title = teamname + ' (' + $scope.orgname + ')';
$rootScope.description = 'Team management page for team ' + teamname + ' under organization ' + $scope.orgname;
}, function() {
$scope.organization = null;
$scope.members = null;
$scope.loading = false;
});
return resp.members;
});
};
// Load the organization.
loadOrganization();
loadMembers();
}
function OrgsCtrl($scope, UserService) {
$scope.loading = true;
$scope.$watch(function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
$scope.loading = false;
}, true);
UserService.updateUserIn($scope);
browserchrome.update();
}
function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, PlanService, Restangular) {
$scope.loading = true;
$scope.$watch(function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
$scope.loading = false;
}, true);
UserService.updateUserIn($scope);
requested = $routeParams['plan'];
var requested = $routeParams['plan'];
// Load the list of plans.
PlanService.getPlans(function(plans) {
@ -1284,13 +1254,13 @@ function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, Plan
var createPost = Restangular.one('organization/');
createPost.customPOST(data).then(function(created) {
$scope.creating = false;
$scope.created = created;
// Reset the organizations list.
UserService.load();
var showOrg = function() {
$scope.creating = false;
$location.path('/organization/' + org.name + '/');
};
@ -1301,6 +1271,7 @@ function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, Plan
}
// Otherwise, show the subscribe for the plan.
$scope.creating = true;
var callbacks = {
'opened': function() { $scope.creating = true; },
'closed': showOrg,
@ -1308,7 +1279,7 @@ function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, Plan
'failure': showOrg
};
PlanService.changePlan($scope, org.name, $scope.currentPlan.stripeId, false, callbacks);
PlanService.changePlan($scope, org.name, $scope.currentPlan.stripeId, callbacks);
}, function(result) {
$scope.creating = false;
$scope.createError = result.data.message || result.data;
@ -1320,49 +1291,38 @@ function NewOrgCtrl($scope, $routeParams, $timeout, $location, UserService, Plan
}
function OrgMemberLogsCtrl($scope, $routeParams, $rootScope, $timeout, Restangular) {
function OrgMemberLogsCtrl($scope, $routeParams, $rootScope, $timeout, Restangular, ApiService) {
var orgname = $routeParams.orgname;
var membername = $routeParams.membername;
$scope.orgname = orgname;
$scope.loading = true;
$scope.memberInfo = null;
$scope.ready = false;
var checkReady = function() {
$scope.loading = !$scope.organization || !$scope.memberInfo;
if (!$scope.loading) {
$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;
});
}
};
var loadOrganization = function() {
var getOrganization = Restangular.one(getRestUrl('organization', orgname))
getOrganization.get().then(function(resp) {
$scope.organization = resp;
checkReady();
}, function() {
$scope.organization = null;
$scope.loading = false;
$scope.orgResource = ApiService.at('organization', orgname).get(function(org) {
$scope.organization = org;
return org;
});
};
var loadMemberInfo = function() {
var getMemberInfo = Restangular.one(getRestUrl('organization', orgname, 'members', membername))
getMemberInfo.get().then(function(resp) {
$scope.memberResource = ApiService.at('organization', $scope.orgname, 'members', membername).get(function(resp) {
$scope.memberInfo = resp.member;
checkReady();
}, function() {
$scope.memberInfo = null;
$scope.loading = false;
});
$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();
}