jQuery(function ($) {
    var show_error, stripeResponseHandler;

    $(function() {
        var $form = $('#new_chapter_payment');
        $form.submit(function(event) {
            // Disable the submit button to prevent repeated clicks:
            $form.find('.submit').prop('disabled', true);
            $form.find('.submit').prop('value', 'Submitting Payment...');
            // Request a token from Stripe:
            Stripe.card.createToken($form, stripeResponseHandler);

            // Prevent the form from being submitted:
            return false;
        });
    });

    stripeResponseHandler = function (status, response) {
        var $form, token;
        $form = $("#new_chapter_payment");
        console.log("Handling Stripe Response");

        if (response.error) {
            console.log("Handling stripe error: " + response.error.message);
            show_error(response.error.message);
            $form.find("input[type=submit]").prop("disabled", false);
            $form.find('.submit').prop('value', 'Submit Payment');
        } else {
            console.log("Stripe Success! Inserting token into form.");
            token = response.id;
            $form.append($("<input type=\"hidden\" name=\"chapter_payment[card_token]\" />").val(token));
            $form.get(0).submit();
        }
        return false;
    };

    show_error = function (message) {
        console.log(message);
        swal({
            title: "Error",
            text: message,
            type: "error",
            confirmButtonText: "OK"
        });
        return false;
    };
});