Merge pull request #2420 from stveep/stripe-admin-2

Stripe admin 2

app/assets/javascripts/admin/all.js

@@ -36,6 +36,7 @@
 //= require ./orders/orders
 //= require ./order_cycles/order_cycles
 //= require ./payment_methods/payment_methods
+//= require ./payments/payments
 //= require ./product_import/product_import
 //= require ./products/products
 //= require ./resources/resources

app/assets/javascripts/admin/payments/controllers/payment.js.coffee

@@ -0,0 +1,10 @@
+angular.module("admin.payments").controller "PaymentCtrl", ($scope, Payment, StatusMessage) ->
+  $scope.form_data = Payment.form_data
+  $scope.submitted = false
+  $scope.StatusMessage = StatusMessage
+
+  $scope.submitPayment = () ->
+    return false if $scope.submitted
+    $scope.submitted = true
+    StatusMessage.display 'progress', t("spree.admin.payments.source_forms.stripe.submitting_payment")
+    Payment.purchase()

app/assets/javascripts/admin/payments/directives/stripe_elements.js.coffee

@@ -0,0 +1,36 @@
+angular.module('admin.payments').directive "stripeElements", ($injector, AdminStripeElements) ->
+  restrict: 'E'
+  template: "<label for='card-element'>\
+             <div id='card-element'></div>\
+             <div id='card-errors' class='error'></div>\
+             </label>"
+
+  link: (scope, elem, attr)->
+    if $injector.has('stripeObject')
+      stripe = $injector.get('stripeObject')
+
+      card = stripe.elements().create 'card',
+        hidePostalCode: false
+        style:
+          base:
+            fontFamily: "Roboto, Arial, sans-serif"
+            fontSize: '16px'
+            color: '#5c5c5c'
+            '::placeholder':
+              color: '#6c6c6c'
+      card.mount('#card-element')
+
+      # Elements validates user input as it is typed. To help your customers
+      # catch mistakes, you should listen to change events on the card Element
+      # and display any errors:
+      card.addEventListener 'change', (event) ->
+        displayError = document.getElementById('card-errors')
+        if event.error
+          displayError.textContent = event.error.message
+        else
+          displayError.textContent = ''
+
+        return
+
+      AdminStripeElements.stripe = stripe
+      AdminStripeElements.card = card

app/assets/javascripts/admin/payments/payments.js.coffee

@@ -0,0 +1 @@
+angular.module("admin.payments", ['ofn.admin'])

app/assets/javascripts/admin/payments/services/payment.js.coffee

@@ -0,0 +1,47 @@
+angular.module('admin.payments').factory 'Payment', (AdminStripeElements, currentOrderNumber, paymentMethods, PaymentMethods, PaymentResource, StatusMessage, $window)->
+  new class Payment
+    order: currentOrderNumber
+    form_data: {}
+
+    paymentMethodType: ->
+      PaymentMethods.byID[@form_data.payment_method].method_type
+
+    preprocess: ->
+      munged_payment = {}
+      munged_payment["payment"] = {payment_method_id: @form_data.payment_method, amount: @form_data.amount}
+      munged_payment["order_id"] = @order
+      # Not tested with Gateway other than Stripe. Could fall back to Rails for this?
+      # Works ok without extra source_attrs for Cash, Bank Transfer etc.
+      switch @paymentMethodType()
+        when 'gateway'
+          angular.extend munged_payment.payment, {
+            source_attributes:
+              number: @form_data.card_number
+              month: @form_data.card_month
+              year: @form_data.card_year
+              verification_value: @form_data.card_verification_value
+          }
+        when 'stripe'
+          angular.extend munged_payment.payment, {
+            source_attributes:
+              gateway_payment_profile_id: @form_data.token
+              cc_type: @form_data.cc_type
+              last_digits: @form_data.card.last4
+              month: @form_data.card.exp_month
+              year: @form_data.card.exp_year
+          }
+      munged_payment
+
+    purchase: ->
+      if @paymentMethodType() == 'stripe'
+        AdminStripeElements.requestToken(@form_data, @submit)
+      else
+        @submit()
+
+    submit: =>
+      munged = @preprocess()
+      PaymentResource.create({order_id: munged.order_id}, munged, (response, headers, status)=>
+        $window.location.pathname = "/admin/orders/" + munged.order_id + "/payments"
+      , (response) ->
+        StatusMessage.display 'error', t("spree.admin.payments.source_forms.stripe.error_saving_payment")
+      )

app/assets/javascripts/admin/payments/services/stripe_elements.js.coffee

@@ -0,0 +1,38 @@
+angular.module("admin.payments").factory 'AdminStripeElements', ($rootScope, StatusMessage) ->
+  new class AdminStripeElements
+
+    # These are both set from the AdminStripeElements directive
+    stripe: null
+    card: null
+
+    # New Stripe Elements method
+    requestToken: (secrets, submit) ->
+      return unless @stripe? && @card?
+
+      cardData = @makeCardData(secrets)
+
+      @stripe.createToken(@card, cardData).then (response) =>
+        if(response.error)
+          StatusMessage.display 'error', response.error.message
+        else
+          secrets.token = response.token.id
+          secrets.cc_type = @mapCC(response.token.card.brand)
+          secrets.card = response.token.card
+          submit()
+
+    # Maps the brand returned by Stripe to that required by activemerchant
+    mapCC: (ccType) ->
+      switch ccType
+        when 'MasterCard' then return 'master'
+        when 'Visa' then return 'visa'
+        when 'American Express' then return 'american_express'
+        when 'Discover' then return 'discover'
+        when 'JCB' then return 'jcb'
+        when 'Diners Club' then return 'diners_club'
+
+    # It doesn't matter if any of these are nil, all are optional.
+    makeCardData: (secrets) ->
+      {'name': secrets.name,
+      'address1': secrets.address1,
+      'city': secrets.city,
+      'zipcode': secrets.zipcode}

app/assets/javascripts/admin/resources/resources/payment_resource.js.coffee

@@ -0,0 +1,5 @@
+angular.module("admin.resources").factory 'PaymentResource', ($resource) ->
+  $resource('/admin/orders/:order_id/payments.json', {order_id: "@order_id"}, {
+    'create':
+      method: 'POST'
+  })