vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add spin.js-based throbber for all loading

Browse source
This commit is contained in:
Joseph Schorr 2013-10-01 16:42:20 -04:00
parent ee41f79bcc
commit 76d9cbc14f
8 changed files with 90 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

28
static/js/app.js
View file

@ -1,3 +1,31 @@
// Register any plugin code.
$.fn.spin = function(opts) {
this.each(function() {
var $this = $(this),
spinner = $this.data('spinner');
if (spinner) spinner.stop();
if (opts !== false) {
options = {
color: $this.css('color') || '#000',
lines: 12, // The number of lines to draw
length: 7, // The length of each line
width: 4, // The line thickness
radius: 10, // The radius of the inner circle
speed: 1, // Rounds per second
trail: 100, // Afterglow percentage
shadow: false // Whether to render a shadow
};
opts = $.extend(options, opts);
spinner = new Spinner(opts).spin(this);
$this.data('spinner', spinner);
}
});
return this;
};
// Start the application code itself.
quayApp = angular.module('quay', ['restangular', 'angularMoment'], function($provide) {
$provide.factory('UserService', ['Restangular', function(Restangular) {
var userResponse = {

53
static/js/controllers.js
View file

@ -78,11 +78,6 @@ function HeaderCtrl($scope, UserService) {
}
function RepoListCtrl($scope, Restangular) {
var repositoryFetch = Restangular.all('repository/');
repositoryFetch.getList().then(function(resp) {
$scope.repositories = resp.repositories;
});
$scope.getCommentFirstLine = function(commentString) {
return getMarkedDown(getFirstTextLine(commentString));
};
@ -91,6 +86,16 @@ function RepoListCtrl($scope, Restangular) {
if (!string) { return ''; }
return getMarkedDown(string);
};
$('.spin').spin();
$scope.loading = true;
// Load the list of repositories.
var repositoryFetch = Restangular.all('repository/');
repositoryFetch.getList().then(function(resp) {
$scope.repositories = resp.repositories;
$scope.loading = false;
});
}
function LandingCtrl($scope) {
@ -162,25 +167,31 @@ function RepoCtrl($scope, Restangular, $routeParams, $rootScope) {
var name = $routeParams.name;
var tag = $routeParams.tag || 'latest';
$('.spin').spin();
$scope.loading = true;
var repositoryFetch = Restangular.one('repository/' + namespace + '/' + name);
repositoryFetch.get().then(function(repo) {
$rootScope.title = namespace + '/' + name;
$scope.repo = repo;
$scope.currentTag = repo.tags[tag] || repo.tags['latest'];
var clip = new ZeroClipboard($('#copyClipboard'), { 'moviePath': 'static/lib/ZeroClipboard.swf' });
clip.on('complete', function() {
// Resets the animation.
var elem = $('#clipboardCopied')[0];
elem.style.display = 'none';
var clip = new ZeroClipboard($('#copyClipboard'), { 'moviePath': 'static/lib/ZeroClipboard.swf' });
clip.on('complete', function() {
// Resets the animation.
var elem = $('#clipboardCopied')[0];
elem.style.display = 'none';
// Show the notification.
setTimeout(function() {
elem.style.display = 'block';
}, 1);
});
// Show the notification.
setTimeout(function() {
elem.style.display = 'block';
}, 1);
});
$scope.loading = false;
}, function() {
$scope.repo = null;
$scope.loading = false;
$rootScope.title = 'Unknown Repository';
});
}
@ -189,7 +200,7 @@ function RepoAdminCtrl($scope, Restangular, $routeParams, $rootScope) {
var namespace = $routeParams.namespace;
var name = $routeParams.name;
$('#userSearch').typeahead({
$('#userSearch').typeahead({
name: 'users',
remote: {
url: '/api/users/%QUERY',
@ -311,11 +322,19 @@ function RepoAdminCtrl($scope, Restangular, $routeParams, $rootScope) {
$('#cannotchangeModal').modal({});
});
};
$('.spin').spin();
$scope.loading = true;
// Fetch the repository information.
var repositoryFetch = Restangular.one('repository/' + namespace + '/' + name);
repositoryFetch.get().then(function(repo) {
$scope.repo = repo;
$scope.loading = !($scope.permissions && $scope.repo);
}, function() {
$scope.permissions = null;
$rootScope.title = 'Unknown Repository';
$scope.loading = false;
});
// Fetch the permissions.
@ -323,8 +342,10 @@ function RepoAdminCtrl($scope, Restangular, $routeParams, $rootScope) {
permissionsFetch.get().then(function(resp) {
$rootScope.title = 'Settings - ' + namespace + '/' + name;
$scope.permissions = resp.permissions;
$scope.loading = !($scope.permissions && $scope.repo);
}, function() {
$scope.permissions = null;
$rootScope.title = 'Unknown Repository';
$scope.loading = false;
});
}