{% extends request.ajax ? "layout_blank.html.twig" : "layout_default.html.twig" %}
{% set active_menu = 'invoices' %}

{% block meta_title %}{{ 'Processing Payment...'|trans }}{% endblock %}

    {% block breadcrumb %}
        <li class="breadcrumb-item"><a href="{{ 'invoice'|url }}">{{ 'Invoices'|trans }}</a></li>
        <li class="breadcrumb-item active" aria-current="page">Payment</li>
    {% endblock %}

{% block content %}

<div class="row">
    <div class="col-md-12">
        <div class="card mb-4">
            <div class="card-header">
                <h1>{{ 'Processing Payment...'|trans }}</h1>
                <p>{{ 'Thank you for your patience.'|trans }}</p>
            </div>
            <div class="card-body">
                {% if payment.type == 'html' %}
                    {{ payment.result|raw }}
                {% endif %}
                {% if payment.type == 'form' %}
                    <h2>{{ 'Redirecting to Payment Gateway...'|trans }}</h2>
                    <form method="post" action="{{ payment.service_url }}" name="payment_form">
                            {% for key, value in payment.result %}
                                <input type="hidden" name="{{ key }}" value="{{ value }}" />
                            {% endfor %}
                        <input class="btn btn-primary" type="submit" value="{{ 'Please click here to continue if this page does not redirect automatically in 5 seconds'|trans }}" id="payment_button"/>
                    </form>

                    <script>
                        document.addEventListener('DOMContentLoaded', function() {
                            document.getElementById('payment_button').style.display = 'none';
                            document.forms["payment_form"].submit();
                        });
                    </script>
                {% endif %}
            </div>
        </div>
    </div>
</div>
{% endblock %}
