Uncommitted/unverified code (committing for historical purposes)

hosting/static/hosting/js/payment.js

@@ -178,8 +178,8 @@ $(document).ready(function () {
     }
 
     var $form_new = $('#payment-form-new');
-    $form_new.submit(payWithStripe_new);
-    function payWithStripe_new(e) {
+    $form_new.submit(payWithStripe);
+    function payWithStripe(e) {
         e.preventDefault();
 
         function stripeTokenHandler(token) {
@@ -199,12 +199,80 @@ $(document).ready(function () {
                 if (typeof window.processing_text !== 'undefined') {
                     process_text = window.processing_text
                 }
+lear
 
                 $form_new.find('[type=submit]').html(process_text + ' <i class="fa fa-spinner fa-pulse"></i>');
                 // Send the token to your server
                 stripeTokenHandler(result.token);
             }
         });
+
+        stripe.createPaymentMethod({
+          type: 'card',
+          card: cardNumberElement
+        }).then(function(result) {
+          if (result.error) {
+            showError(result.error.message);
+          } else {
+            // Send paymentMethod.id to server
+            fetch('/ajax/confirm_payment', {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json'
+              },
+              body: JSON.stringify({
+                payment_method_id: result.paymentMethod.id
+              })
+            }).then(function(result) {
+              // Handle server response (see Step 3)
+              result.json().then(function(json) {
+                handleServerResponse(json);
+              });
+            });
+          }
+        });
+
+        function showError(msg) {
+            var errorElement = document.getElementById('card-errors');
+            errorElement.textContent = msg;
+        }
+
+        function handleServerResponse(response) {
+          if (response.error) {
+            // Show error from server on payment form
+              showError(response.error.message);
+          } else if (response.requires_action) {
+            // Use Stripe.js to handle required card action
+            handleAction(response);
+          } else {
+            // Show success message
+          }
+        }
+
+        function handleAction(response) {
+          stripe.handleCardAction(
+            response.payment_intent_client_secret
+          ).then(function(result) {
+            if (result.error) {
+              // Show error in payment form
+            } else {
+              // The card action has been handled
+              // The PaymentIntent can be confirmed again on the server
+              fetch('/ajax/confirm_payment', {
+                method: 'POST',
+                headers: {
+                  'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({
+                  payment_intent_id: result.paymentIntent.id
+                })
+              }).then(function(confirmResult) {
+                return confirmResult.json();
+              }).then(handleServerResponse);
+            }
+          });
+        }
+
     }
 
     /* Form validation */