Merge branch 'master' of ssh://bitbucket.org/yackob03/quay

endpoints/api/billing.py

@@ -36,7 +36,9 @@ def get_card(user):
         card_info = {
           'owner': default_card.name,
           'type': default_card.type,
-          'last4': default_card.last4
+          'last4': default_card.last4,
+          'exp_month': default_card.exp_month,
+          'exp_year': default_card.exp_year
         }
 
   return {'card': card_info}

static/css/quay.css

@@ -478,6 +478,18 @@ i.toggle-icon:hover {
   color: black;
 }
 
+.billing-options-element .current-card .expires:before {
+  content: "Expires:";
+  color: #aaa;
+  font-size: 12px;
+}
+
+
+.billing-options-element .current-card .expires {
+  margin-left: 20px;
+  font-size: 12px;
+}
+
 .billing-options-element .current-card img {
   margin-right: 10px;
   vertical-align: middle;

static/directives/billing-options.html

@@ -7,10 +7,18 @@
     <div class="panel-body">
       <div class="quay-spinner" ng-show="!currentCard || changingCard"></div>
       <div class="current-card" ng-show="currentCard && !changingCard">
+        <div class="alert alert-warning" ng-if="currentCard.last4 && isExpiringSoon(currentCard)">
+          Your current credit card is expiring soon!
+        </div>
+
         <img ng-src="{{ '/static/img/creditcards/' + getCreditImage(currentCard) }}" ng-show="currentCard.last4">
         <span class="no-card-outline" ng-show="!currentCard.last4"></span>
 
         <span class="last4" ng-show="currentCard.last4">****-****-****-<b>{{ currentCard.last4 }}</b></span>
+        <span class="expires" ng-show="currentCard.last4">
+          {{ currentCard.exp_month }} / {{ currentCard.exp_year }}
+        </span>
+
         <span class="not-found" ng-show="!currentCard.last4">No credit card found</span>
       </div>
 

static/js/app.js

@@ -3293,6 +3293,13 @@ quayApp.directive('billingOptions', function () {
         PlanService.unregisterListener(this);
       });
 
+      $scope.isExpiringSoon = function(cardInfo) {
+        var current = new Date();
+        var expires = new Date(cardInfo.exp_year, cardInfo.exp_month, 1);
+        var difference = expires - current;
+        return difference < (60 * 60 * 24 * 60 * 1000 /* 60 days */);
+      };
+
       $scope.changeCard = function() {
         var previousCard = $scope.currentCard;
         $scope.changingCard = true;