[ongoing] coupon validation and usage directive

app/assets/javascripts/directives/coupon.coffee.erb

@@ -0,0 +1,41 @@
+Application.Directives.directive 'coupon', [ 'Coupon', 'growl', '_t', (Coupon, growl, _t) ->
+  {
+    restrict: 'E'
+    scope:
+      show: '='
+    templateUrl: '<%= asset_path "shared/_coupon.html" %>'
+    link: (scope, element, attributes) ->
+
+      # default: do not enable code input
+      scope.input = false
+
+      # default: coupon code is not valid
+      scope.valid = false
+
+      # for dirty checking and request response waiting
+      scope.pending = true
+
+      # binding for the code inputed
+      scope.couponCode = null
+
+
+      scope.closeAlert = (index) ->
+        scope.alerts.splice(index, 1);
+
+      ##
+      # Callback to validate the code
+      ##
+      scope.validateCode = ->
+        unless scope.couponCode == ''
+          Coupon.validate {code: scope.couponCode}, (res) ->
+            scope.valid = true
+            growl.success(res.percent_off+' % de réduction')
+            console.info(res)
+          , (err) ->
+            scope.valid = false
+            growl.error(_t(err.data.status))
+            console.error(err)
+  }
+]
+
+

app/assets/javascripts/services/coupon.coffee

@@ -5,4 +5,7 @@ Application.Services.factory 'Coupon', ["$resource", ($resource)->
     {id: "@id"},
     update:
       method: 'PUT'
+    validate:
+      method: 'POST'
+      url: '/api/coupons/validate'
 ]

app/assets/templates/machines/reserve.html.erb

@@ -78,6 +78,8 @@
           <div class="clear"><a class="pull-right m-b-sm text-u-l ng-scope m-r-sm" href="#" ng-click="removeMachineSlot(machineSlot, $event)" ng-if="machineSlot.isValid" translate>{{ 'remove_this_slot' }}</a></div>
         </div>
 
+        <coupon show="machineSlotsValid() && (!plansAreShown || selectedPlan)"></coupon>
+
         <span ng-hide="fablabWithoutPlans">
           <div ng-if="machineSlotsValid() && !ctrl.member.subscribed_plan" ng-show="!plansAreShown">
             <p class="font-sbold text-base l-h-2x" translate>{{ 'to_benefit_from_attractive_prices' }}</p>

app/assets/templates/shared/_coupon.html.erb

@@ -0,0 +1,20 @@
+<div class="form-group m-b-lg" ng-show="show">
+  <a ng-click="input = true" ng-hide="input" class="b-b">J'ai un code promo !</a>
+
+  <div ng-show="input">
+    <label for="coupon_code">Code : </label>
+    <div class="input-group">
+      <input type="text"
+             class="form-control"
+             name="coupon_code"
+             ng-model="couponCode"
+             id="coupon_code"
+             ng-model-options='{ debounce: 1000 }'
+             ng-change='validateCode()'/>
+      <span class="input-group-addon" ng-class="{'label-success': valid, 'label-danger text-white': !valid}">
+        <i class="fa fa-times" ng-hide="valid"></i>
+        <i class="fa fa-check" ng-show="valid"></i>
+      </span>
+    </div>
+  </div>
+</div>

config/routes.rb

@@ -69,9 +69,8 @@ Rails.application.routes.draw do
     resources :prices, only: [:index, :update] do
       post 'compute', on: :collection
     end
-    resources :coupons do
-      post 'validate' => 'coupons#validate'
-    end
+    resources :coupons
+    post 'coupons/validate' => 'coupons#validate'
 
     resources :trainings_pricings, only: [:index, :update]