45 lines
		
	
	
		
			No EOL
		
	
	
		
			1.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			45 lines
		
	
	
		
			No EOL
		
	
	
		
			1.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <div class="container">
 | |
|   <div class="row" ng-show="errorMessage">
 | |
|     <div class="col-md-12">
 | |
|       <div class="alert alert-danger">{{ errorMessage }}</div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="row" ng-hide="planLoading">
 | |
|     <div class="col-md-4" ng-repeat='plan in plans'>
 | |
|       <div class="panel" ng-class="{'panel-success': subscription.plan == plan.stripeId, 'panel-default': subscription.plan != plan.stripeId}">
 | |
|         <div class="panel-heading">
 | |
|           {{ plan.title }}
 | |
|           <span class="pull-right" ng-show="subscription.plan == plan.stripeId">
 | |
|             <i class="icon-ok"></i>
 | |
|             Subscribed
 | |
|           </span>
 | |
|         </div>
 | |
|         <div class="panel-body">
 | |
|           {{ plan.privateRepos }} Private Repositories<br>
 | |
|           <button class="btn btn-primary" ng-hide="subscription" ng-click="subscribe(plan.stripeId)">Subscribe</button>
 | |
|           <button class="btn" ng-show="subscription && (subscription.plan != plan.stripeId)" ng-click="subscribe(plan.stripeId)">Change</button>
 | |
|           <button class="btn btn-danger" ng-show="subscription.plan == plan.stripeId" ng-click="cancel()">Cancel</button>      
 | |
|         </div>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="row" ng-hide="planLoading">
 | |
|     <div class="col-md-6">
 | |
|       <div class="panel panel-default">
 | |
|         <div class="panel-heading">
 | |
|           Plan Usage
 | |
|         </div>
 | |
|         <div class="panel-body">
 | |
|           <b>{{ subscription.usedPrivateRepos }}</b> of {{ subscribedPlan.privateRepos }} private repositories used
 | |
|           <div class="progress">
 | |
|             <div class="progress-bar" role="progressbar" aria-valuenow="{{ subscription.usedPrivateRepos }}" aria-valuemin="0" aria-valuemax="{{ subscribedPlan.privateRepos }}" style="width: {{ planUsagePercent }}%;">
 | |
|             </div>
 | |
|           </div>
 | |
|         </div>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
|   <div class="loading" ng-show="planLoading">
 | |
|     <div class="spin"></div>
 | |
|   </div>
 | |
| </div> |