Fix plans manager display to be less confusing when we show deprecated plans

This commit is contained in:
Joseph Schorr 2017-12-15 14:28:49 -05:00
parent e06a83faf9
commit 0a176d0abe
3 changed files with 15 additions and 27 deletions

View file

@ -62,7 +62,7 @@
</thead>
<tr ng-repeat="plan in plans" ng-show="isPlanVisible(plan, subscribedPlan)"
ng-class="{'active':isPlanActive(plan, subscribedPlan), 'deprecated-plan':plan.deprecated}">
ng-class="{'active':isPlanActive(plan, subscribedPlan)}">
<td>
{{ plan.title }}
<div class="deprecated-plan-label" ng-show="plan.deprecated">

View file

@ -170,19 +170,19 @@
<!-- Plan columns -->
<div class="row-container">
<div class="row">
<!-- Personal Plan -->
<!-- Developer Plan -->
<div class="col-md-3 col-sm-6 plan-col">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$12/mo</span>
<b>Personal</b>
<span class="plan-box-price">$15/mo</span>
<b>Developer</b>
</div>
<ul>
<li>5 private repositories</li>
<li>Unlimited public repos</li>
</ul>
<div class="plan-description">Great for individuals</div>
<a class="btn btn-primary trial-button" ng-click="buyNow('personal-30')">
<a class="btn btn-primary trial-button" ng-click="buyNow('personal-2018')">
Start Free Trial
<i class="fa fa-angle-double-right"></i>
</a>
@ -193,12 +193,12 @@
</ul>
</div>
<!-- Skiff Plan -->
<!-- Micro Plan -->
<div class="col-md-3 col-sm-6 plan-col">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$25/mo</span>
<b>Skiff</b>
<span class="plan-box-price">$30/mo</span>
<b>Micro</b>
</div>
<ul>
<li>10 private repositories</li>
@ -206,7 +206,7 @@
<li>Team-based permissions</li>
</ul>
<div class="plan-description">Great for startups</div>
<a class="btn btn-primary trial-button" ng-click="buyNow('bus-micro-30')">
<a class="btn btn-primary trial-button" ng-click="buyNow('bus-micro-2018')">
Start Free Trial
<i class="fa fa-angle-double-right"></i>
</a>
@ -217,12 +217,12 @@
</ul>
</div>
<!-- Yacht Plan -->
<!-- Small Plan -->
<div class="col-md-3 col-sm-6 plan-col popular">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$50/mo</span>
<b>Yacht</b>
<span class="plan-box-price">$60/mo</span>
<b>Small</b>
</div>
<ul>
<li>20 private repositories</li>
@ -230,7 +230,7 @@
<li>Team-based permissions</li>
</ul>
<div class="plan-description">Great for small businesses</div>
<a class="btn btn-primary trial-button" ng-click="buyNow('bus-small-30')">
<a class="btn btn-primary trial-button" ng-click="buyNow('bus-small-2018')">
Start Free Trial
<i class="fa fa-angle-double-right"></i>
</a>

View file

@ -29,14 +29,8 @@ angular.module('quay').directive('planManager', function () {
return false;
}
// A plan is visible if it is not deprecated, or if it is both not superseded
// by another plan, and also the active plan for the user.
// A plan is visible if it is not deprecated, or if it is the namespace's current plan.
if (plan['deprecated']) {
var superseded = PlanService.getPlanImmediately(plan['superseded_by']);
if (superseded) {
return !$scope.isPlanVisible(superseded, subscribedPlan);
}
return subscribedPlan && plan.stripeId === subscribedPlan.stripeId;
}
@ -44,16 +38,10 @@ angular.module('quay').directive('planManager', function () {
};
$scope.isPlanActive = function(plan, subscribedPlan) {
// A plan is active if it is either the plan directly subscribed to by the user
// or the plan which supersedes the plan to which the user is subscribed.
if (!subscribedPlan) {
return false;
}
if (subscribedPlan['deprecated'] && subscribedPlan['superseded_by']) {
return $scope.isPlanActive(plan, PlanService.getPlanImmediately(subscribedPlan['superseded_by']));
}
return plan.stripeId === subscribedPlan.stripeId;
};