{%  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">Shopping Cart</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">Item</div>
                            <div class="col-sm-2 block20">Price</div>
                            <div class="col-sm-2 block20">Delete</div>
                        </div>
                        <hr>
                        {% set total = 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://www.fasttrackagadir.com/web/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']}} - Departure from {{datas[fasttrack.pack]['arprt']}}</strong></h5>
                                                    {% set chars = fasttrack.passagers|split('||') %}
                                                    Names :
                                                    {% for char in chars %}
                                                    {% set names = char|split('//' ) %}
                                                    {% if names[1] is defined %}
                                                     {{names[0]}} {{names[1]}} 
                                                    {% endif %}
                                                    {% endfor %}
                                                    <br />

                                                    Adults (12+ Years) {{fasttrack.nbr_passagers_dep}} <br />
                                                    Child (0-1.99 Years) {{fasttrack.nbr_passagers_child_gt_dep}} <br />
                                                    Child (2-12 Years) {{fasttrack.nbr_passagers_child_dep}} <br />
                                                    Departure Date {{fasttrack.date_fasttrack_dep}} <br />
                                                    Departure Time {{fasttrack.heure_fasttrack_dep}} <br />
                                                    Special reqquest {{fasttrack.demande}} <br />
                                                    Sold By Airport Services <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('||' ) %}
                                                    Names :
                                                    {% for char in chars %}

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

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

                                                    <br />
                                                    Adults (12+ Years) {{fasttrack.nbr_passagers_arriv}} <br />
                                                    Child (0-1.99 Years) {{fasttrack.nbr_passagers_child_gt_arriv}} <br />
                                                    Child (2-12 Years) {{fasttrack.nbr_passagers_child_arriv}} <br />
                                                    Airline / Flight No. {{fasttrack.num_vol_arriv}} <br />
                                                    Arrival Date {{fasttrack.date_fasttrack_arriv}} <br />
                                                    Arrival Time {{fasttrack.heure_fasttrack_arriv}} <br />
                                                    Special reqquest {{fasttrack.demande}} <br />
                                                    Sold By Airport Services <br />
                                            </div>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="col-sm-2 block20">{{fasttrack.prix|round(2, 'floor')}} €</div>
                                <div class="col-sm-2 block20" >
                                    <a  href="/web/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></a>
                                        </span>
                                    </div>
                            </div>
                            <hr>
                            {% set total = total + fasttrack.prix %}
                        {% endfor %}
                    </div>

                    <div class="col-sm-4 bottomblock">
                        <div class="total_checkout">
                            Summary
                            <hr>
                            Subtotal   :   {{total|round(2, 'floor')}} €

                            <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="Proceed to Chekout">

                            </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">Please Login if you have already an account or Create a new one by Registering</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="/web/assets/images/logo fast.png" id="icon" alt="FastTrack Maroc logo">
                                <h3 style="color: #FF4500;"><b>Login Now</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="/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') }}">Forgot Password?</a>
                            </div>

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

                        <div class="fadeIn first">
                            <img src="/web/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="/web/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="Your Phone">
                                </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_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="/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 %}