{% load i18n %}

<div class="form-horizontal stripe-container" id="stripe-checkout">
    <noscript>
        <div class="alert alert-warning">
            {% trans "For a credit card payment, please turn on JavaScript." %}
        </div>
    </noscript>
    {% if request.session.payment_stripe_token %}
        <p>{% blocktrans trimmed %}
            You already entered a card number that we will use to charge the payment amount.
        {% endblocktrans %}</p>
        <dl class="dl-horizontal">
            <dt>{% trans "Card type" %}</dt>
            <dd id="stripe_card_brand_display">{{ request.session.payment_stripe_brand }}</dd>
            <dt>{% trans "Card number" %}</dt>
            <dd>
                **** **** **** <span id="stripe_card_last4_display">{{ request.session.payment_stripe_last4 }}</span>
                <button class="btn btn-xs btn-default" id="stripe_other_card" type="button">
                    {% trans "Use a different card" %}
                </button>
            </dd>
        </dl>
        <p>
        </p>
    {% else %}
        <p>
            {% blocktrans trimmed %}
                Please continue below to start the credit card payment.
            {% endblocktrans %}
        </p>
    {% endif %}
    <p class="help-block">
        {% blocktrans trimmed %}
            Your payment will be processed by Stripe, Inc. Your credit card data will be transmitted directly to
            Stripe and never touches our servers.
        {% endblocktrans %}
    </p>
    <input type="hidden" name="stripe_token" value="{{ request.session.payment_stripe_token }}" id="stripe_token"/>
    <input type="hidden" name="stripe_card_last4" value="{{ request.session.payment_stripe_last4 }}"
            id="stripe_card_last4"/>
    <input type="hidden" name="stripe_card_brand" value="{{ request.session.payment_stripe_brand }}"
            id="stripe_card_brand"/>
    <input type="hidden" id="organizer_name" value="{{ event.organizer.name }}"/>
    <input type="hidden" id="event_name" value="{{ event.name }}"/>
    <input type="hidden" id="stripe_currency" value="{{ event.currency }}"/>
    <input type="hidden" id="event_name" value="{{ event.name }}"/>
    {% if order %}
        <input type="hidden" id="stripe_email" value="{{ order.email }}"/>
    {% else %}
        <input type="hidden" id="stripe_email" value="{{ request.session.email }}"/>
    {% endif %}
</div>

