{% extends 'base.html.twig' %}

{% block javascript %}
<script src="https://js.stripe.com/v3/"></script>
{% endblock %}

{% block title %}Paiement de ma commande - La Boutique Française{% endblock %}

{% block content %}
<h2> Mon récapitulatif</h2>
<p> Vérifier vos informations avant de payer votre commande.</p>
<hr>
<div class="row">
    <div class="col-md-6">
    <strong>Mon adresse de livraision<br></strong><br>
<div class="form-check">
    {{delivery|raw}}
    </div>

    <hr>
    <strong>Mon transporteur</strong><br>
    <div class="form-check mt-4">
    {{carrier.name}}<br>
    {{carrier.description}}<br>
    {{(carrier.price /100)|number_format(2,',','.')}} €
    </div>
    </div>
<div class="col-md-6">
<div class="text-center">
    <b> Ma commande</b><br>
    
</div>
<div class="order-summary">
{% set total=null%}
{% for key,product in cart %}
<div class="row {% if key>0 %} mt-2 {% endif %} ">
    <div class="col-2"> 
        <img src="/uploads/{{product.product.illustration}}" alt="{{product.product.illustration}}" height="75px">
    </div>
    <div class="col-8 my-auto">
    {{ product.product.name}}<br>
    <small>
    {{product.product.subtitle}}
    <br>
    x {{product.quantity}}
    </small>
    </div>
    <div class="col-2 my-auto">
        {{(product.product.price * product.quantity /100)|number_format(2,',','.') }}€
    </div>
</div>
{% set total= total + (product.product.price * product.quantity) %}
{% endfor %}
</div>

<hr>
<strong>Sous-Total:</strong> {{(total /100)|number_format(2,',','.') }} € <br>
<strong>Livraison:</strong> {{(carrier.price/100)|number_format(2,',','.') }} €
<hr>
<strong>Total:</strong> {{((total /100)+(carrier.price/100))|number_format(2,',','.') }} € <br>

<a  class="btn btn-success btn-block mt-3" id="checkout-button">Payer | {{((total /100)+(carrier.price/100))|number_format(2,',','.') }} €</a>
</div>
</div>
{% endblock %}

{% block script %}

<script type="text/javascript">
        var stripe = Stripe("pk_test_51OeCoOLne9zIBO1L5LRYMjNRFSnG3IrR3OJYkpfY0zsCuKpaaTjzOziWQc04rIsK3yF5uM4BHGSBr8WFenmRwITx00egPbXERI");
        var checkoutButton = document.getElementById("checkout-button");
        checkoutButton.addEventListener("click", function () {
            fetch("/commande/create-session/{{ reference }}", {
                method: "POST",
            })
                .then(function (response) {
                    return response.json();
                })
                .then(function (session) {
                    if (session.error == 'order') {
                        window.location.replace('{{ path('app_order') }}');
                    } else {
                        return stripe.redirectToCheckout({ sessionId: session.id });
                    }
                })
                .then(function (result) {
                    if(result.error) {
                        alert(result.error.message);
                    }
                })
                .catch(function (error) {
                    console.error("Error:", error);
                });
        });
    </script>

{% endblock %}