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

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
static/directives/plan-manager.html
View file

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

24
static/directives/plans-display.html
View file

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

14
static/js/directives/ui/plan-manager.js
View file

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