clean up stripe form submission

payments/templates/verify_identity.html

@@ -79,7 +79,7 @@
             {% endif %}
 
             <button
-                id="codesy-submit"
+                id="codesy-submit-identity"
                 class="button success track-btn"
                 data-category="Stripe"
                 data-label="Authorize">Send to Stripe

static/js/stripe-app.js

@@ -1,74 +1,68 @@
-
-$(window).load(function () {
-    Stripe.setPublishableKey($('#codesy-html').data('stripe_key'));
-
-    function response_div(message){
-        $div= $(`
-            <div class="callout warning expanded" data-closable>
+function response_div(message){
+    $div= $(`<div id="stripe-response" class="callout warning expanded" data-closable>
                 <button class="close-button" data-close>&times;</button>
-                <p class="alert alert-error">
-                </p>
+                <p class="alert alert-error"></p>
             </div>`)
-        $div.find('p').text(message)
-        return $div
-    }
+    $div.find('p').text(message)
+    return $div
+}
+// remove any notification divs when any modal form closes
+$(window).on('closed.zf.reveal', ()=>$('#stripe-response').remove());
 
-    let stripeResponse = function (csrf_token) {
-        function prepare_data ({type, id, card, bank_account }){
-            switch (type) {
-                case 'card':
-                    ;( {last4: card_last4, brand: card_brand} = card)
-                    return {stripe_card: id, card_last4, card_brand}
-                    break;
-                case 'bank_account':
-                    return {stripe_bank_account: id}
-                    break;
-                default:
-                    return {}
-            }
-        }
+function make_codesy_submitter (account_type){
+    switch (account_type) {
+        case 'card':
+            return ({ id, card: {last4, brand} }) => ({stripe_card: id, card_last4: last4, card_brand: brand});
+            break;
+        case 'bankAccount':
+            return ({id}) => ({stripe_bank_account: id});
+            break;
+        default:
+            return ()=>{}
+    };
+}
 
-        return function (status, response) {
-            if (response.error) {
-                console.error(`Stripe failed to tokenize: ${response.error.message}`);
-                response_message = response.error.message
-            } else {
-                response_message = "Account information successfully submitted"
-                $.ajax({
-                    method: "PATCH",
-                    url: "/users/update/",
-                    beforeSend: (xhr, settings) => xhr.setRequestHeader('X-CSRFToken', csrf_token),
-                    data: prepare_data(response),
-                    success: (data, status, jqXHR) =>console.log("Updated user."),
-                    error: (err) => console.error(err)
-                });
-            }
-            $('#stripe-form').prepend(response_div(response_message))
-            $('#stripe-submit').text('Submit Account Information');
+function stripeResponse (csrf_token, type) {
+    const codesy_data = make_codesy_submitter(type)
+    return function (status, response) {
+        if (response.error) {
+            console.error(`Stripe failed to tokenize: ${response.error.message}`);
+            response_message = response.error.message
+        } else {
+            response_message = "Account information successfully submitted"
+            $.ajax({
+                method: "PATCH",
+                url: "/users/update/",
+                beforeSend: (xhr, settings) => xhr.setRequestHeader('X-CSRFToken', csrf_token),
+                data: codesy_data(response),
+                success: (data, status, jqXHR) => console.log("Updated user."),
+                error: console.error
+            });
         }
+        $('#stripe-response').remove()
+        $('#stripe-form').prepend(response_div(response_message))
+        $('#stripe-submit').text('Submit Account Information');
     }
+}
 
-    let handleResponse = new stripeResponse($('form input[name="csrfmiddlewaretoken"]').val())
-    let $form = $('#stripe-form')
-    let account_type = $form.attr('stripe-account-type')
+function set_holder_type($element) {
+    const holder_type = $("input[name=form_holder_type]:checked").val()
+    if (holder_type) $element.val(holder_type)
+}
 
-    $('#codesy-submit').click(function (e) {
-        // add account_holder_type for bank account and identity forms
-        let holder_type = $("input[name=form_holder_type]:checked").val()
-        if (holder_type) {
-            $('#type').val(holder_type)
-        }
-    });
+$(window).load(function () {
+    Stripe.setPublishableKey($('#codesy-html').data('stripe_key'));
+    const $form = $('#stripe-form')
+    const stripe_account_type = $form.attr('stripe-account-type')
+    const csrf_token_value = $form.find('input[name="csrfmiddlewaretoken"]').val()
+    const handleResponse = new stripeResponse(csrf_token_value, stripe_account_type)
+
+    $('#codesy-submit-identity').click( (e) => set_holder_type($('#type') );
 
     $('#stripe-submit').click(function (e) {
         e.preventDefault();
-        // add account_holder_type for bank account and identity forms
-        let holder_type = $("input[name=form_holder_type]:checked").val()
-        if (holder_type) {
-            $('#account_holder_type').val(holder_type)
-        }
+        set_holder_type($('#account_holder_type'))
         $('#stripe-submit').text('Submitting ... ');
-        Stripe[account_type].createToken($form, handleResponse);
+        Stripe[stripe_account_type].createToken($form, handleResponse);
     });
-
 })