{% load url from future %}

<div class="change-card">
    <h2>Current Card</h2>
    <p class="lead">
        {% if request.user.customer.card_kind and request.user.customer.card_last_4 %}
            Current card on file is a <strong>{{ request.user.customer.card_kind }}</strong>
            ending in the digits <strong>{{ request.user.customer.card_last_4 }}</strong>.
        {% else %}
            You do not currently have a card on file.
        {% endif %}
    </p>
    
    {% if error %}
        <div class="alert alert-error">{{ error }}</div>
    {% endif %}
    
    <form action="{% url 'payments_ajax_change_card' %}" data-stripe-key="{{ STRIPE_PUBLIC_KEY }}" class="form ajax" data-replace-closest=".change-card" method="POST">
        {% csrf_token %}
        <input name="stripe_token" type="hidden" />
        <a href="" class="btn btn-primary change-card">{% if request.user.customer.card_kind %}Change{% else %}Add{% endif %} Card</a>
    </form>
</div>
