{% extends "oscar/checkout/payment_details.html" %}
{% load i18n %}

{% block extrahead %}
<script type='text/javascript'>
window.onAmazonLoginReady = function() {
    amazon.Login.setClientId('{{ amazon_payments_client_id }}');
};
</script>
<script type='text/javascript' src='https://static-na.payments-amazon.com/OffAmazonPayments/us{% if not amazon_payments_is_live %}/sandbox{% endif %}/js/Widgets.js?sellerId={{ amazon_payments_seller_id }}'></script>
{% endblock extrahead %}

{% block payment_details %}
    <div id="walletWidgetDiv"></div>
    <script type="text/javascript">
    new OffAmazonPayments.Widgets.Wallet({
        sellerId: '{{ amazon_payments_seller_id }}',
        agreementType: 'BillingAgreement',
        amazonBillingAgreementId: '{{ amazon_payments_billing_agreement_id }}',
        design: {
            size : {width:'400px', height:'260px'}
        },
        onError: function(error) {
            if (!(document.getElementById('amazon_error_code').value || document.getElementById('amazon_error_message').value)){
                document.getElementById('amazon_error_code').value = error.getErrorCode();
                document.getElementById('amazon_error_message').value = error.getErrorMessage();
                document.getElementById('amazon_place_order').submit();
            }
        }
    }).bind("walletWidgetDiv");
    </script>
    {% if basket.has_subscriptions %}
    <div class="clearfix"></div>
    <strong>Your order contains come subscription items. Please authorize us to charge the future payments for the subscription items to your Amazon account.</strong>
    <div id="consentDiv"></div>
    <script type="text/javascript">
    new OffAmazonPayments.Widgets.Consent({
        sellerId: '{{ amazon_payments_seller_id }}',
        agreementType: 'BillingAgreement',
        amazonBillingAgreementId: '{{ amazon_payments_billing_agreement_id }}',
        design: {
            size : { 
                width:'400px', 
                height:'140px'
            }
        },
        onError: function(error) {
            if (!(document.getElementById('amazon_error_code').value || document.getElementById('amazon_error_message').value)){
                document.getElementById('amazon_error_code').value = error.getErrorCode();
                document.getElementById('amazon_error_message').value = error.getErrorMessage();
                document.getElementById('amazon_place_order').submit();
            }
        }
    }).bind("consentDiv");
    </script>
    {% endif %}
{% endblock payment_details %}

{% block place_order %}
<form method="post" class="text-right" style="padding:30px 0;">
    {% csrf_token %}
    <input type="hidden" id="amazon_error_code" name="amazon_error_code" value="" />
    <input type="hidden" id="amazon_error_message" name="amazon_error_message" value="" />
    <input type="submit" class="btn btn-primary" name="action" id="place_order" value="Continue" />
</form>
{% endblock place_order %}