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

58
static/directives/plan-manager.html Normal file
View file

@ -0,0 +1,58 @@
<div class="plan-manager-element">
<!-- Loading/Changing -->
<i class="fa fa-spinner fa-spin fa-3x" ng-show="planLoading"></i>
<!-- Alerts -->
<div class="alert alert-danger" ng-show="overLimit && !planLoading">
You are using more private repositories than your plan allows, please
upgrade your subscription to avoid disruptions in your organization's service.
</div>
<div class="alert alert-warning" ng-show="nearLimit && !planLoading">
You are nearing the number of allowed private repositories. It might be time to think about
upgrading your subscription to avoid future disruptions in your organization's service.
</div>
<!-- Chart -->
<div>
<div id="repository-usage-chart"></div>
<span class="usage-caption" ng-show="chart">Repository Usage</span>
</div>
<!-- Plans Table -->
<table class="table table-hover plans-table" ng-show="!planLoading">
<thead>
<td>Plan</td>
<td>Private Repositories</td>
<td style="min-width: 64px">Price</td>
<td></td>
</thead>
<tr ng-repeat="plan in plans" ng-class="(subscribedPlan.stripeId === plan.stripeId) ? getActiveSubClass() : ''">
<td>{{ plan.title }}</td>
<td>{{ plan.privateRepos }}</td>
<td><div class="plan-price">${{ plan.price / 100 }}</div></td>
<td class="controls">
<div ng-switch='plan.stripeId'>
<div ng-switch-when='bus-free'>
<button class="btn button-hidden">Hidden!</button>
</div>
<div ng-switch-default>
<button class="btn" ng-show="subscribedPlan.stripeId !== plan.stripeId"
ng-class="subscribedPlan.price == 0 ? 'btn-primary' : 'btn-default'"
ng-click="changeSubscription(plan.stripeId)">
<i class="fa fa-spinner fa-spin" ng-show="planChanging"></i>
<span ng-show="!planChanging && subscribedPlan.price != 0">Change</span>
<span ng-show="!planChanging && subscribedPlan.price == 0">Subscribe</span>
</button>
<button class="btn btn-danger" ng-show="subscription.plan === plan.stripeId"
ng-click="cancelSubscription()">
<i class="fa fa-spinner fa-spin" ng-show="planChanging"></i>
<span ng-show="!planChanging">Cancel</span>
</button>
</div>
</div>
</td>
</tr>
</table>
</div>