Rip out spinjs in favor of a font-awesome + css spinner.

static/js/app.js

@@ -1,30 +1,3 @@
-// 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) {

static/js/controllers.js

@@ -108,7 +108,6 @@ function RepoListCtrl($scope, Restangular, UserService) {
     return getMarkedDown(string);
   };
 
-  $('.spin').spin();
   $scope.loading = true;
   $scope.public_repositories = null;
   $scope.private_repositories = null;
@@ -131,7 +130,6 @@ function RepoListCtrl($scope, Restangular, UserService) {
 
 function LandingCtrl($scope, $timeout, Restangular, UserService) {
   $('.form-signup').popover();
-  $('.spin').spin();
 
   $scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
     if (!currentUser.anonymous) {
@@ -262,7 +260,6 @@ 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);
@@ -417,7 +414,6 @@ function RepoAdminCtrl($scope, Restangular, $routeParams, $rootScope) {
     });
   };
 
-  $('.spin').spin();
   $scope.loading = true;
 
   // Fetch the repository information.
@@ -472,8 +468,6 @@ function UserAdminCtrl($scope, Restangular) {
     planDict[$scope.plans[i].stripeId] = $scope.plans[i];
   }
 
-  $('.spin').spin();
-
   var subscribedToPlan = function(sub) {
     $scope.subscription = sub;
     $scope.subscribedPlan = planDict[sub.plan];

static/partials/landing.html

@@ -9,7 +9,7 @@
 
   <div class="message-container" ng-show="!user.anonymous">
     <div ng-show="loadingmyrepos">
-      <div class="spin"></div>
+      <i class="icon-spinner icon-spin icon-3x"></i>
     </div>
     <div ng-show="!loadingmyrepos && myrepos.length > 0">
       <h2>Your Top Repositories</h4>      
@@ -43,7 +43,7 @@
         <button class="btn btn-lg btn-primary btn-block" ng-disabled="signupForm.$invalid" type="submit">Get Started!</button>
       </form>
       <div ng-show="registering" style="text-align: center">
-        <span class="spin" color="#fff" style="display: inline-block"></span>
+        <i class="icon-spinner icon-spin icon-3x"></i>
       </div>
       <div ng-show="awaitingConfirmation">
         <div class="sub-message">Thank you for registering! We have sent you an activation email. You must <b>verify your email address</b> before you can continue.</div>

static/partials/repo-admin.html

@@ -1,5 +1,5 @@
 <div class="loading" ng-show="loading">
-  <div class="spin"></div>
+  <i class="icon-spinner icon-spin icon-3x"></i>
 </div>
 
 <div class="container" ng-show="!loading && (!repo || !permissions)">

static/partials/repo-list.html

@@ -1,5 +1,5 @@
 <div class="loading" ng-show="loading">
-  <div class="spin"></div>
+  <i class="icon-spinner icon-spin icon-3x"></i>
 </div>
 
 <div class="container" ng-show="!loading">

static/partials/user-admin.html

@@ -1,6 +1,6 @@
 <div class="container user-admin">
   <div class="loading" ng-show="planLoading || planChanging">
-    <div class="spin"></div>
+    <i class="icon-spinner icon-spin icon-3x"></i>
   </div>
   <div class="row" ng-show="errorMessage">
     <div class="col-md-12">

static/partials/view-repo.html

@@ -3,7 +3,7 @@
 </div>
 
 <div class="loading" ng-show="loading">
-  <div class="spin"></div>
+  <i class="icon-spinner icon-spin icon-3x"></i>
 </div>
 
 <div class="container repo" ng-show="!loading && repo">
@@ -93,7 +93,7 @@
 
     <div id="image-history" style="display: none">
       <div ng-hide="imageHistory">
-        <div class="spin"></div>
+        <i class="icon-spinner icon-spin icon-3x"></i>
       </div>
 
       <div ng-show="imageHistory">

templates/index.html

@@ -26,7 +26,6 @@
 
     <script src="static/lib/ZeroClipboard.min.js"></script>
     <script src="static/lib/typeahead.min.js"></script>
-    <script src="static/lib/spin.min.js"></script>
 
     <script src="static/js/app.js"></script>
     <script src="static/js/controllers.js"></script>