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

Check in all new plan manager directive and add a nice donut chart for the repository usage by the user/org

Browse source
This commit is contained in:
Joseph Schorr 2013-11-06 17:30:20 -05:00
parent 934acce6d4
commit a6a225dd5f
6 changed files with 377 additions and 167 deletions
Download patch file Download diff file Expand all files Collapse all files

171
static/js/app.js
View file

@ -48,7 +48,7 @@ function getMarkedDown(string) {
// Start the application code itself.
quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics', 'angulartics.mixpanel', '$strap.directives'], function($provide) {
$provide.factory('UserService', ['Restangular', function(Restangular) {
$provide.factory('UserService', ['Restangular', 'PlanService', function(Restangular, PlanService) {
var userResponse = {
verified: false,
anonymous: true,
@ -85,9 +85,7 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
userService.getCurrentSubscription = function(callback, failure) {
if (currentSubscription) { callback(currentSubscription); }
var getSubscription = Restangular.one('user/plan');
getSubscription.get().then(function(sub) {
PlanService.getSubscription(null, function(sub) {
currentSubscription = sub;
callback(sub);
}, failure);
@ -171,23 +169,47 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
});
};
planService.showSubscribeDialog = function($scope, planId, orgname, started, success, failed) {
var submitToken = function(token) {
$scope.$apply(function() {
started();
});
planService.getSubscription = function(organization, success, failure) {
var url = planService.getSubscriptionUrl(organization);
var getSubscription = Restangular.one(url);
getSubscription.get().then(success, failure);
};
planService.getSubscriptionUrl = function(orgname) {
return orgname ? getRestUrl('organization', orgname, 'plan') : 'user/plan';
};
planService.setSubscription = function(orgname, planId, success, failure, opt_token) {
var subscriptionDetails = {
plan: planId
};
if (opt_token) {
subscriptionDetails['token'] = opt_token.id;
}
var url = planService.getSubscriptionUrl(orgname);
var createSubscriptionRequest = Restangular.one(url);
createSubscriptionRequest.customPUT(subscriptionDetails).then(success, failure);
};
planService.changePlan = function($scope, orgname, planId, hasExistingSubscription, started, success, failure) {
if (!hasExistingSubscription) {
planService.showSubscribeDialog($scope, orgname, planId, started, success, failure);
return;
}
started();
planService.setSubscription(orgname, planId, success, failure);
};
planService.showSubscribeDialog = function($scope, orgname, planId, started, success, failure) {
var submitToken = function(token) {
mixpanel.track('plan_subscribe');
var subscriptionDetails = {
token: token.id,
plan: planId,
};
var url = orgname ? getRestUrl('organization', orgname, 'plan') : 'user/plan';
var createSubscriptionRequest = Restangular.one(url);
$scope.$apply(function() {
createSubscriptionRequest.customPUT(subscriptionDetails).then(success, failed);
started();
planService.setSubscription(orgname, planId, success, failure);
});
};
@ -485,6 +507,121 @@ quayApp.directive('roleGroup', function () {
});
quayApp.directive('planManager', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/plan-manager.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'user': '=user',
'organization': '=organization'
},
controller: function($scope, $element, PlanService, Restangular) {
var hasSubscription = false;
$scope.getActiveSubClass = function() {
return 'active';
};
$scope.changeSubscription = function(planId) {
if ($scope.planChanging) { return; }
PlanService.changePlan($scope, $scope.organization, planId, hasSubscription, function() {
// Started.
$scope.planChanging = true;
}, function(sub) {
// Success.
subscribedToPlan(sub);
}, function() {
// Failure.
$scope.planChanging = false;
});
};
$scope.cancelSubscription = function() {
$scope.changeSubscription(getFreePlan());
};
var subscribedToPlan = function(sub) {
$scope.subscription = sub;
if (sub.plan != getFreePlan()) {
hasSubscription = true;
}
PlanService.getPlan(sub.plan, function(subscribedPlan) {
$scope.subscribedPlan = subscribedPlan;
$scope.planUsagePercent = sub.usedPrivateRepos * 100 / $scope.subscribedPlan.privateRepos;
if (sub.usedPrivateRepos > $scope.subscribedPlan.privateRepos) {
$scope.overLimit = true;
} else if (sub.usedPrivateRepos >= $scope.subscribedPlan.privateRepos * 0.7) {
$scope.nearLimit = true;
} else {
$scope.overLimit = false;
$scope.nearLimit = false;
}
if (!$scope.chart) {
$scope.chart = new RepositoryUsageChart();
$scope.chart.draw('repository-usage-chart');
}
$scope.chart.update(sub.usedPrivateRepos || 0, $scope.subscribedPlan.privateRepos || 0);
$scope.planChanging = false;
$scope.planLoading = false;
});
};
var getFreePlan = function() {
for (var i = 0; i < $scope.plans.length; ++i) {
if ($scope.plans[i].price == 0) {
return $scope.plans[i].stripeId;
}
}
return 'free';
};
var update = function() {
$scope.planLoading = true;
if (!$scope.plans) { return; }
if (!$scope.user && !$scope.organization) { return; }
PlanService.getSubscription($scope.organization, subscribedToPlan, function() {
// User/Organization has no subscription.
subscribedToPlan({ 'plan': getFreePlan() });
});
};
var loadPlans = function() {
PlanService.getPlans(function(plans) {
$scope.plans = plans[$scope.organization ? 'business' : 'user'];
update();
});
};
// Start the initial download.
loadPlans();
update();
$scope.$watch('organization', function() {
update();
});
$scope.$watch('user', function() {
update();
});
}
};
return directiveDefinitionObject;
});
quayApp.directive('namespaceSelector', function () {
var directiveDefinitionObject = {
priority: 0,