{%  extends "WebFrontBundle::layout.html.twig" %}

{% block styles %}
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/offers_styles.css") }}">
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/offers_responsive.css") }}">
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/select2.min.css")}}">
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/about_styles.css") }}">
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/about_responsive.css") }}">
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/login.css")}} ">
{% endblock %}

{% block body %}
    <!-- Home -->
    <div class="home">
        <div id="overlay" ></div>
        <div class="home_background parallax-window" data-parallax="scroll" data-image-src=""></div>
        <div class="home_content">
            <div class="home_title">{% trans %}Shopping Cart{% endtrans %}</div>
        </div>
        <style type="text/css">
            .home_background{
                background-image: url("{{ asset('assets/uploads/Fast Track Maroc Booking.jpg') }}") !important;
                background-position: center; /* Center the image */
                background-repeat: no-repeat; /* Do not repeat the image */
                background-size: cover;
            }
        </style>
    </div>
    <!-- Offers -->
    <!-- Contact -->
    <div class="contact_form_section">
        <div class="container" style="margin-top:8%;margin-bottom:3%;">
            <div class="row">
                {% if fasttracks|length==0 %}
                <div class="col-sm-3"></div>
                <div class="col-sm-6">
                <img style="width:100%" src="{{ asset("assets/images/cart-empty.jpg")}}">
                </div>
                {% else %}
                    <div class="col-sm-8 topblock">
                        <div class="row">
                            <div class="col-sm-8 block60">{% trans %}Item{% endtrans %}</div>
                            <div class="col-sm-2 block20">{% trans %}Price{% endtrans %}</div>
                            <div class="col-sm-2 block20">{% trans %}Actions{% endtrans %}</div>
                        </div>
                        <hr>
                        {% set total = 0 %}
                        {% set total_trans_all = 0 %}
                        {% for fasttrack in fasttracks %}
                            <div class="row">
                                <div class="col-sm-8 block60">
                                    <div class="row">
                                        <div class="col-sm-5">
                                            <img style="width:114%;" class="imgrespon" src="https://fasttrackmaroc.com/assets/uploads/offers/fast_track_vip_cmn.jpg">
                                        </div>
                                        {% if fasttrack.type=='depart' %}
                                            <div class="col-sm-7" style="padding-left: 26px;">
                                                <h5><strong>{{datas[fasttrack.pack]['namefstk']}} - {% trans %}Departure from{% endtrans %} {{datas[fasttrack.pack]['arprt']}}</strong></h5>
                                                    {% set chars = fasttrack.passagers|split('||') %}
                                                {% trans %} Names :{% endtrans %}
                                                    {% for char in chars %}
                                                    {% set names = char|split('//' ) %}
                                                    {% if names[1] is defined %}
                                                     {{names[0]}} {{names[1]}} 
                                                    {% endif %}
                                                    {% endfor %}
                                                    <br />

                                                {% trans %}Adults (12+ Years): {% endtrans %}{{fasttrack.nbr_passagers_dep}} <br />
                                                {% trans %}Child (0-1.99 Years): {% endtrans %}{{fasttrack.nbr_passagers_child_gt_dep}} <br />
                                                {% trans %}Child (2-12 Years): {% endtrans %}{{fasttrack.nbr_passagers_child_dep}} <br />
                                                {% trans %}Departure Date: {% endtrans %}{{fasttrack.date_fasttrack_dep}} <br />
                                                {% trans %}Departure Time: {% endtrans %}{{fasttrack.heure_fasttrack_dep}} <br />
                                                {% trans %}Special request: {% endtrans %}{{fasttrack.demande}} <br />

                                            </div>
                                        {% else %}
                                            <div class="col-sm-7" style="padding-left: 26px;">
                                                <h5><strong>{{datas[fasttrack.pack]['namefstk']}} - Arrival to {{datas[fasttrack.pack]['arprt']}}</strong></h5>

                                                    {% set chars = fasttrack.passagers|split('||' ) %}
                                                {% trans %}Names{% endtrans %} :
                                                    {% for char in chars %}

                                                    {% set names = char|split('//' ) %}

                                                    {% if names[1] is defined %}
                                                     {{names[0]}} {{names[1]}} 
                                                    {% endif %}
                                                        
                                                    {% endfor %}

                                                    <br />
                                                {% trans %}Adults (12+ Years): {% endtrans %}{{fasttrack.nbr_passagers_arriv}} <br />
                                                {% trans %}Child (0-1.99 Years): {% endtrans %}{{fasttrack.nbr_passagers_child_gt_arriv}} <br />
                                                {% trans %}Child (2-12 Years): {% endtrans %}{{fasttrack.nbr_passagers_child_arriv}} <br />
                                                {% trans %}Airline / Flight No.: {% endtrans %}{{fasttrack.num_vol_arriv}} <br />
                                                {% trans %}Arrival Date: {% endtrans %}{{fasttrack.date_fasttrack_arriv}} <br />
                                                {% trans %}Arrival Time: {% endtrans %}{{fasttrack.heure_fasttrack_arriv}} <br />
                                                {% trans %}Special request: {% endtrans %}{{fasttrack.demande}} <br />
                                            </div>
                                        {% endif %}
                                    </div>
                                </div>
                                {% set priceMAD = fasttrack.prix*10 %}
                                <div class="col-sm-2 block20">{{fasttrack.prix|round(2, 'floor')}} € ({{priceMAD|round(2, 'floor')}} MAD)</div>
                                <div class="col-sm-2 block20" >
                                    <a  href="/{{ locale }}/cart/item_delete/{{ loop.index }}" class="col-sm-2">
                                        <span class="button btn-danger" style="padding: 1px 1px 1px 7px;height: 25px;width: 25px;">
                                            <i class="fa fa-trash-o"></i>
                                        </span>
                                    </a>
                                      
                                    </div>
                            </div>


                            <!---------- partie transport --------------->
                            {% if fasttrack.transport!=null %}
                                <div class="row" >

                                    <div class="col-sm-8 block60">
                                        <div class="row" style="">
                                            <div class="col-sm-5">
                                            </div>
                                            <div class="col-sm-7" style="padding-left: 26px;border-top:1px solid #dedede">
                                                <h5><strong>{% trans %}Transfer Service: {% endtrans %}</strong></h5>
                                                {%  set total_trans=0 %}
                                                {% for trans in fasttrack.transport %}

                                                    {{ trans.getVehicule() }}<br>
                                                    {%  set total_trans=total_trans+trans.getPrix() %}
                                                {% endfor %}
                                                {% trans %}Adress :{% endtrans %} {{ fasttrack.adress_trans }}
                                            </div>
                                        </div>

                                    </div>
                                    {% set transMAD = total_trans*10 %}
                                    <div class="col-sm-2 block20" style="border-top:1px solid #dedede">{{total_trans|round(2, 'floor')}} € ({{transMAD|round(2, 'floor')}} MAD)</div>
                                    <div class="col-sm-2 block20" >

                                    </div>
                                </div>
                                {% set total_trans_all = total_trans_all + total_trans %}
                            {% endif %}

                            <!---------- fin partie transport --------------->


                            <hr>
                            {% set total = total + fasttrack.prix %}

                        {% endfor %}
                    </div>

                    <div class="col-sm-4 bottomblock">
                        <div class="total_checkout">
                            {% trans %}Summary{% endtrans %}
                            <hr>
                            {% set total = total + total_trans_all %}
                            {% set totalMAD = total*10 %}
                            {% trans %}Subtotal{% endtrans %}   :   {{total|round(2, 'floor')}} €  ({{totalMAD|round(2, 'floor')}} MAD)

                            <hr>

                            {% if total %}

                            <form id="checkoutorder"  method="post">
                                <input style="font-size: 9px; width: 70%; padding: 11px 9px; background-color: #28a745; background: #28a745;"  {% if is_granted('IS_AUTHENTICATED_FULLY') %} {% else %} data-toggle="modal" data-target="#myModal" {% endif %} class="btn btn-success" type="submit" value="{% trans %}Proceed to Chekout{% endtrans %}">
                                <input type="hidden" name="locale" value="{{ locale }}">
                            </form>

                            {% endif %}

                        </div>
                    </div>

                {% endif %}


            </div>
        </div>
        <!-- popup -->
    <!-- Modal -->
      <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog modal-lg">
        
          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">{% trans %}Please Login if you have already an account or Create a new one by Registering{% endtrans %}</h4>
              <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body row">
                <div class="col-sm-6">

                        <div id="formContent">
                            <!-- Tabs Titles -->
                            <style>
                                body {
                                    font-family: "Poppins", sans-serif;
                                    background-repeat: no-repeat; /* Do not repeat the image */
                                    background-size: cover;
                                }
                            </style>
                            <!-- Icon -->
                            <div class="fadeIn first">
                                <img src="/assets/images/logo fast.png" id="icon" alt="FastTrack Maroc logo">
                                <h3 style="color: #FF4500;"><b>{% trans %}Login Now{% endtrans %}</b></h3>
                            </div>
                                    <!-- Login Form -->
                            <form action="{{ path('fos_user_security_check') }}" method="post">

                                <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}" />
                                
                                <input type="text" id="login" class="fadeIn second" name="_username" required="required" autocomplete="username" placeholder="login">

                                <input type="password" id="password" class="fadeIn third" name="_password" required="required" autocomplete="current-password" placeholder="password">

                                <input type="hidden" name="go_to" value="/{{ locale }}/checkout/order" />
                                <input type="hidden" name="back_to" value="/login" />

                                <label class="container">Remember me
                                    <input type="checkbox" checked="checked" id="remember_me" name="_remember_me" value="on">
                                    <span class="checkmark"></span>
                                </label>

                                <input style="padding: 15px 35px;" type="submit" class="fadeIn fourth" name="_submit" value="Log in">

                            </form>

                            <!-- Remind Passowrd -->
                            <div id="formFooter">
                                <a class="underlineHover" href="{{ path('fos_user_resetting_request') }}">{% trans %}Forgot Password?{% endtrans %}</a>
                            </div>

                        </div>
                   
                </div>
                <div class="col-sm-6">
                    <div id="formContent">

                        <div class="fadeIn first">
                            <img src="/assets/images/logo fast.png" id="icon" alt="FastTrack Maroc logo">
                            <h3 style="color: #FF4500;"><b>Register Now</b></h3>
                        </div>

                        <form name="fos_user_registration_form" method="post" action="/register/" class="fos_user_registration_register">
                            <div id="fos_user_registration_form">
                                <div>
                                    <label for="fos_user_registration_form_prenom" class="required"> </label>
                                    <input type="text" id="fos_user_registration_form_prenom" name="fos_user_registration_form[prenom]" required="required" placeholder="Your First Name *">
                                </div>
                                <input type="hidden" name="goto" value="panier">
                                <div>
                                    <label for="fos_user_registration_form_nom" class="required"> </label>
                                    <input type="text" id="fos_user_registration_form_nom" name="fos_user_registration_form[nom]" required="required" placeholder="Your Last Name *">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_telephone" class="required"> </label>
                                    <input type="text" id="fos_user_registration_form_telephone" name="fos_user_registration_form[telephone]" required="required" placeholder="Phone Ex: 0033 689561423 *">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_email" class="required"> </label>
                                    <input type="email" id="fos_user_registration_form_email" name="fos_user_registration_form[email]" required="required" placeholder="Your email *">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_entreprise" class=""> </label>
                                    <input type="text" id="fos_user_registration_form_entreprise" name="fos_user_registration_form[entreprise]" placeholder="Company Name">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_ice" class=""> </label>
                                    <input type="text" id="fos_user_registration_form_ice" name="fos_user_registration_form[ice]" placeholder="Enter your Company ICE">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_plainPassword_first" class="required"> </label>
                                    <input type="password" id="fos_user_registration_form_plainPassword_first" name="fos_user_registration_form[plainPassword][first]" required="required" placeholder="Your Password *">
                                </div>
                                <div>
                                    <label for="fos_user_registration_form_plainPassword_second" class="required"> </label>
                                    <input type="password" id="fos_user_registration_form_plainPassword_second" name="fos_user_registration_form[plainPassword][second]" required="required" placeholder="Re-enter your Password *">
                                </div>
                                <input type="hidden" name="go_to" value="/{{ locale }}/checkout/order" />
                                <input type="hidden" id="fos_user_registration_form__token" name="fos_user_registration_form[_token]" value="{{ csrf_token('registration') }}">
                            </div>
                            <div>
                                <input type="submit" value="Register">
                            </div>
                        </form>

                        </div>
                </div>
              </div>
            </div>
          </div>
          
        </div>
      </div>
<!-- popup -->
    </div>




{% endblock %}

{% block scripts %}
    <script src="{{ asset("assets/plugins/parallax-js-master/parallax.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/Isotope/isotope.pkgd.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/greensock/TweenMax.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/greensock/TimelineMax.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/scrollmagic/ScrollMagic.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/greensock/animation.gsap.min.js")}}"></script>
    <script src="{{ asset("assets/plugins/greensock/ScrollToPlugin.min.js")}}"></script>
    <script src="{{ asset("assets/js/select2.min.js")}}"></script>

{% endblock %}