@extends('layouts.master')
@section('content')

@php
   $backButtonStyle = false;
@endphp

 <!-- <meta http-equiv="refresh" content="5; URL=http://localhost/yummyweb/web/order/order_detail/"> -->
 <div class="filter-div view-order-detail">
    <div class="container">


       <div class="row">
          <div class="col-md-8 col-md-offset-2">
             <div class="filter-info-right">

                  @if (session('order_error_msg'))
                      <div class="alert alert-danger" role="alert">
                          {!! session('order_error_msg') !!}
                          @php
                           session()->forget('order_error_msg');
                           $backButtonStyle = true;
                          @endphp
                      </div>
                   @endif

                  @if (session('order_success_msg'))
                      <div class="alert alert-success" role="alert">
                           {!! session('order_success_msg') !!}
                           @php
                            session()->forget('order_success_msg');
                            $backButtonStyle = true;
                           @endphp
                      </div>
                 @endif

                <div class="dashboard-box">
        @php

              $currentDate = date(DB_DATETIME);
                  $createdOn= (date(DB_DATETIME, strtotime($result->created_at)));
                  $to_time = strtotime($currentDate);
                  $from_time = strtotime($createdOn);
                  $timeElapsed = round(abs($to_time - $from_time) / 60, 2);
              $oPrefix = "";
        @endphp
              @if ($result->order_prefix != "")
              @php
                  $oPrefix = ($result->order_from == "web" || $result->order_from == "android" || strtolower($result->order_from) == "ios")
                  ? "W" : (($result->order_from == "kiosk") ? "K" : '');
              @endphp

              @endif
        @php

              $orderNumber = $result->order_prefix . $oPrefix . $result->order_number;

        @endphp
                   <h3><i class="fa fa-cutlery"></i> {{ __('front_site.order_no')}}: #{{ $orderNumber }}</h3>

                  @if ($result->payment_status == '0' && $timeElapsed <= 2)
                     <a id="hideMe" href="javascript:void(0);" onclick="window.location.reload();" class="btn btn-success btn_back @if ($backButtonStyle) {{ "btn_back_msg" }} @endif " style="right:30px;">
                       {{ __('front_site.reverify_payment') }}
                     </a>
                 @endif
                   <div class="dashboard-info">
                      <div class="div_acc">
                         <div class="order-details">
                            @if ($result->is_guest != '1')
                               <a href="{{ route('front.customer-dashboard')}}" class="btn btn-success btn_back
                                @if ($backButtonStyle)
                                   {{ "btn_back_msg" }}
                                @endif
                             "> {{ __('front_site.back')}}</a>
                          @endif
                            <div class="order-boxx">
                               <div class="order-boxx-new">
                                  <!--------------------MAP--------------------------->
                                 @if ($result->delivery_type == 0)
                                     <div class="map_div" style="height:300px;position:relative;">
                                        <div id='map' class='map'>
                                           <div class='tt-overlay-panel -left-top -medium js-foldable'>
                                              <div class='tt-form-label'>
                                                 Travel mode
                                                 <select class='js-category-select tt-select'>
                                                    <option value='pedestrian'>Pedestrian</option>
                                                    <option value='car'>Car</option>
                                                    <option value='truck'>Truck</option>
                                                    <option value='bicycle'>Bicycle</option>
                                                    <option value='bus'>Bus</option>
                                                    <option value='van'>Van</option>
                                                    <option value='motorcycle'>Motorcycle</option>
                                                    <option value='taxi'>Taxi</option>
                                                 </select>
                                              </div>
                                           </div>
                                        </div>
                                     </div>
                               @endif
                                  <!---------------------MAP------------------------->
                                  <ul>
                                     <li>
                                        <h3> {{ $result->store_name }}</h3>
                                        <p><i class="fa fa-map-marker"></i>{{ $result->store_address }}</p>
                                     </li>
                                     <li>
                                        <h3>{{ __('front_site.date_of_booking') }}</h3>
                                        <p><i class="fa fa-calendar"></i>{{ date('d-M-Y H:i:s', strtotime($result->created_at)) }}</p>
                                     </li>
                                  </ul>
                                  <ul>
                                     <li>
                                        <h3>
                                           @if ($result->delivery_type == 1)
                                             {{ __('front_site.pickup')}} {{ __('front_site.date') }}/ {{ __('front_site.time') }}
                                           @else
                                             {{ __('front_site.delivery') }} {{ __('front_site.date') }}/ {{ __('front_site.time') }}
                                          @endif
                                        </h3>
                                        <p>{{ date('d-M-Y', strtotime($result->date)) }}

                                          @if ($result->time == "asap")
                                            @php
                                                 $label = " -- " . date('h:i', strtotime($result->created_at)) . "(+" . $result->delivery_pickup_time . __('front_site.min').")  ";
                                            @endphp

                                          @elseif (strchr($result->time, ":"))
                                          @php
                                               $label = " (" . $result->time . ")";
                                          @endphp

                                          @else
                                          @php
                                               $label = " (" . $result->time . __('front_site.min').")";
                                          @endphp

                                          @endif
                                          {{ $label }}

                                          @if($result->time != "asap")
                                          <span class='label label-warning font-12 py-1' >{!! __('front_site.pre_order') !!}</span>
                                          @endif
                                        </p>
                                     </li>
                                     <li>
                                        <h3>{{ __('front_site.delay') }}</h3>
                                        @if ($result->delay_time == 0)
                                           <p>{!! __('front_site.no') !!}</p>
                                       @else
                                           <p>{{ $result->delay_time }} {!! __('front_site.min') !!}</p>
                                       @endif
                                     </li>
                                  </ul>
                               </div>
                               <div class="order-boxx-new">
                                  <ul>
                                     <li>
                                        <h3>  {{ __('front_site.payment_method') }}</h3>

                                        <p>  {{ isset($result->payment_method) ? strtoupper($result->payment_method) : "" }}</p>
                                     </li>

                                     <li>
                                        <h3> {{ __('front_site.payment_status') }}</h3>
                                        <p><span class="label {{ paymentStatusClass($result->payment_status) }}"> {{ paymentStatus($result->payment_status) }}</span></p>

                                     </li>
                                  </ul>
                               </div>
                               @if ($result->delivery_type == 0)
                                  <div class="order-boxx-new">
                                     <ul>
                                        <li>
                                           <h3>{!! __('front_site.port_code') !!}</h3>

                                           <p>{{ $result->port_code }}</p>
                                        </li>

                                        <li>
                                           <h3> {!! __('front_site.leave_outside') !!}</h3>
                                           <p> {{ ($result->leave_outside == '1') ? __('front_site.yes') : __('front_site.no') }}</p>
                                        </li>
                                     </ul>
                                  </div>
                               @endif
                               <!-- <div class="order-boxx-new">
                                  <ul>
                                     <li>
                                        <h3>Comment</h3>

                                        <p>{{ $result->description}}</p>
                                     </li>

                                     <li>

                                     </li>
                                  </ul>
                               </div>-->
                               <div class="details-order">
                                  <h3> {{ __('front_site.order_details') }}
                                    <span class=" label {{ orderStatusClass($result->status) }}">{{ orderStatus($result->status) }}</span>

                                  </h3>
                                  <div class="table-responsive">
                                     <table class="table table-striped dataTable no-footer" id="DataTables_Table_0">
                                        <thead>
                                           <tr class="font-16">
                                              <th width="10%"> </th>
                                              <th>{!! __('front_site.product') !!}</th>
                                              <th>{!! __('front_site.qty_price') !!}</th>
                                              <th style="text-align: right;">{!! __('front_site.total_price') !!}</th>
                                           </tr>
                                        </thead>
                                        <tbody>
                                            @if($result->order_items)
                                          @foreach ($result->order_items as $item)
                                              <tr>
                                                 <td class="img_boxx">

                           @if($item->is_half==1)
                <img src="{{ asset('site/img/2in1-pizza.jpg') }}" alt="product-1" class="img-responsive img-order" />
              @else
                <img src="{{ getImagePath($item->item_image, 'product') }}" class="img-responsive img-order">
              @endif
                         </td>
                                                 <td width="55%">
                                                   @php
                                                       $halfPizzaData=[];
                                                   @endphp
                          @if($item->is_half==1)
                                       @php
                                           $halfPizzaData=json_decode($item->item_json);
                                       @endphp
                                          {{ $halfPizzaData[0]->item_name ." + ".$halfPizzaData[1]->item_name}}
                                       @else
                                          {{  $item->item_name }}
                                       @endif

                                                    @if ($item->variation)
                                                         <b>({{ $item->variation_name}})</b>
                                                    @endif
                                                    <span>
                                                    {{--new items and removed items--}}
                                                       @if (!empty($item->items))
                                                            <br>
                                                            <b class="green">{{ __('orders.add') }}:</b>
                                                            {{ implode(',', collect($item->items)->pluck('extra_name')->toArray()) }}
                                                            <br>
                                                       @elseif (!empty($item->extra_ingredient))
                                                           <br>
                                                           <b class="green">{{ __('orders.add') }}:</b>
                                                            {!! $item->extra_ingredient !!}
                                                           <br>
                                                       @endif
                                                    </span>
                                                     <span>
                                                        @if(!empty($item->removed_ingredients))
                                                             <b class="red">{{ __('orders.remove') }}:</b>
                                                             {{ implode(',', collect($item->removed_ingredients)->pluck('name')->toArray()) }}
                                                             <br>
                                                         @elseif (!empty($item->removed_ingredient))
                                                             <b class="red">{{ __('orders.remove') }}:</b>
                                                             {!! $item->removed_ingredient !!}
                                                             <br>
                                                         @endif
                                                    </span>
                                                     {{--new items and removed items end --}}
                                                   {{-- @if ($item->removed_ingredients)
                                                    @php
                                                        $removedd=[];
                                                    @endphp
                                                        <span>
                                                            <b class="red"> {{ __('orders.remove') }}: </b>
                                                            @foreach ($item->removed_ingredients as $removed)
                                                                @php
                                                                    $removedd[]=$removed->name;
                                                                @endphp
                                                           @endforeach
                                                           {{ $item->removed_ingredient ?? implode(",",$removedd) }}
                                                        </span>
                                                    @endif--}}
                          @if($item->is_half == 1 && ($halfPizzaData[0]->removed_ing !='' || $halfPizzaData[1]->removed_ing !=''))
                  <br> <b class="red">{{  __('orders.remove') . "(".$halfPizzaData[0]->item_name  .")" }}: </b>
                                  {{$halfPizzaData[0]->removed_ing}} <br>
                  <b class="red">{{  __('orders.remove') ."(".$halfPizzaData[1]->item_name .")"}}: </b>
                                  {{$halfPizzaData[1]->removed_ing}}
                @endif


                                                   @if ($item->is_half == 1)
                                                       <span>
                                                          <br><b class="red">{!! __('front_site.half_pizza') !!}</b>
                                                       </span>
                                                    @endif
                                                    @if($item->is_offer_item ==1 && $item->item_json !="")
                                                    <br>
                                                    @php
                                                      $offerItems=json_decode($item->item_json);
                                                      $i=0;
                                                    @endphp
                                                    @foreach ($offerItems as $oItem)
                                                        <b>&bull; {{ $oItem->item_name }}
                                                          @if($oItem->variation_name !="")
                                                            {{ "(".$oItem->variation_name.")" }}
                                                          @endif
                                                        </b>
                                                        @if($oItem->extra_name !="")
                                                        <br>
                                                            <b class="green">{{ __('orders.add') }} : </b>{{ $oItem->extra_name }}
                                                        @endif
                                                      <br>
                                                    @endforeach
                                                  @endif
                                                 </td>
                                                 <td style="vertical-align: top;">
                                                   @php
                                                         $item_price = ($item->variation_id >0)?$item->variation_price:$item->price;
                                                   @endphp
                                                   {{ numberFormat($item_price) ." x ".$item->quantity ." = ". numberFormat(($item_price)*$item->quantity)}}
                                                    @if ($item->items)
                                                       @foreach ($item->items as $extra)
                                                          <br>
                                                          {{ numberFormat($extra['extra_price']) ." x ". $item->quantity ." = ". numberFormat($extra['extra_price'] * $item->quantity)}}

                                                        @endforeach
                                                    @endif
                                                    @if($item->is_offer_item ==1 && $item->extra_ingredient_price !="")
                                                   <br> {{ numberFormat($item->extra_ingredient_price) ." x ".$item->quantity ." = ". numberFormat($item->extra_ingredient_price*$item->quantity)}}
                                                    @endif
                                                 </td>
                                                 <td align="right">
                                                    <p class="price_tag">
                                                        {{ numberFormat($item->total_price)}}
                                                    </p>
                                                    <br>
                                                 </td>
                                              </tr>
                                          @endforeach
                                          @endif
                                        </tbody>
                                        <thead></thead>
                                     </table>
                                  </div>
                               </div>
                               <div class="">
                                  <div class="table-responsive">
                                     <table class="table dataTable" id="DataTables_Table_1">
                                        <tbody>

                                           <tr class="font-16">
                                             <td class="pb-0"></td>
                                             <td class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.subtotal') }}:</strong></td>
                                             <td class="font-medium pb-0 text-right">  {{ numberFormat($result->sub_total)}}</td>
                                           </tr>
                                           <tr class="font-16">
                                             <td class="pb-0"></td>
                                              <td class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.vat') }}:</strong></td>
                                              <td class="font-medium pb-0 text-right">
                                                    {{ numberFormat($result->total_tax)}}
                                              </td>
                                           </tr>
                                           <tr class="font-16">
                                             <td class="pb-0"></td>
                                              <td  class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.delivery_charges') }}:</strong></td>
                                              <td  class="font-medium pb-0 text-right">
                                                {{ numberFormat($result->delivery_fee) }}
                                              </td>
                                           </tr>
                                           @if ($result->tip > 0)
                                              <tr class="font-16">
                                                <td class="pb-0"></td>
                                                 <td class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.rider_tip') }}:</strong></td>
                                                 <td class="font-medium pb-0 text-right">
                                                   {{ numberFormat($result->tip)}}
                                                 </td>
                                              </tr>
                                          @endif
                                           <tr class="font-16">
                                             <td class="pb-0"></td>
                                                                                            <td class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.promo_discount') }}:</strong></td>
                                              <td class="font-medium pb-0 text-right">

                                                    @php
                                                        $promo_value=0
                                                    @endphp
                                                     @if ($result->promo_code_value >0)
                                                     @php
                                                         $promo_value=$result->promo_code_value;
                                                     @endphp
                                                    {{ "- " . numberFormat($promo_value)}}
                                                    @else
                                                        {{ 'N/A'}}
                                                    @endif

                                              </td>
                                           </tr>
                                            @if ($result->round_off != 0)
                                                <tr class="font-16">
                                                   <td class="pb-0"></td>
                                                    <td class="font-medium pb-0 text-right" colspan="2"><strong> {{ __('front_site.round_off') }}:</strong></td>
                                                    <td class="font-medium pb-0 text-right">
                                                            {{ ($result->round_off < 0) ? ' - ' : '' }}{{ numberFormat(abs($result->round_off)) }}
                                                    </td>
                                                </tr>
                                            @endif
                                           <tr class="font-16">
                                             <td class="pb-0"></td>
                                              <td  class="font-semi pb-0 text-right" colspan="2">
                                                <strong> {{ __('front_site.total') }}:</strong>
                                              </td>
                                              <td class=" pb-0 text-right font-semi" >
                                                        @php
                                                            $totalPrice=$result->total_price;
                                                        @endphp
                                                    {{ numberFormat($totalPrice)}}

                                              </td>
                                           </tr>
                                        </tbody>
                                     </table>
                                  </div>
                               </div>
                            </div>
                         </div>
                      </div>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </div>
 </div>
 {{-- <script src='https://api.tomtom.com/maps-sdk-for-web/cdn/5.x/5.63.1/maps/maps-web.min.js'></script> --}}
 {{-- <script src='https://api.tomtom.com/maps-sdk-for-web/cdn/5.x/5.63.1/services/services-web.min.js'></script> --}}
 <script src='{{ asset('site/components/tomtom/maps-web.min.js') }}'></script>
 <script src='{{ asset('site/components/tomtom/services-web.min.js') }}'></script>
 <script type='text/javascript' src="{{ asset('site/js/map/mobile-or-tablet.js')}}"></script>
 <script type='text/javascript' src="{{ asset('site/js/map/tail-selector.js')}}"></script>
 <script type='text/javascript' src="{{ asset('site/js/map/tail.select.min.js')}}"></script>
 <script type='text/javascript' src="{{ asset('site/js/map/formatters.js')}}"></script>
 {{-- <script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js'></script> --}}
 <script src='{{ asset('site/components/moment/moment.min.js') }}'></script>
 <script type='text/javascript' src="{{ asset('site/js/map/foldable.js')}}" ></script>
 <script type='text/javascript'  src="{{ asset('site/js/map/info-hint.js')}}"></script>

 @if ($result->delivery_type == 0)
    <script type='text/javascript'>
       //SHOW STORE,USER and Deliveryboy location
       // Define your product name and version.
       tt.setProductInfo('<your-product-name>', '<your-product-version>');
       var map = tt.map({
          key: "{{  config('constants.TOMTOM_API_KEY') }}",
          container: 'map',
          style: 'tomtom://vector/1/basic-main',
          dragPan: !isMobileOrTablet(),
          // center: [-99.98580752275456, 33.43211082128627],
          center: ["{{ $result->store_long }}", "{{ $result->store_lat}}"], //India
          zoom: 9
       });
       map.addControl(new tt.FullscreenControl());
       map.addControl(new tt.NavigationControl());


       function createMarker(icon, position, color, popupText) {
          var markerElement = document.createElement('div');
          markerElement.className = 'marker';

          var markerContentElement = document.createElement('div');
          markerContentElement.className = 'marker-content';
          markerContentElement.style.backgroundColor = color;
          markerElement.appendChild(markerContentElement);

          var iconElement = document.createElement('div');
          iconElement.className = 'marker-icon';
          iconElement.style.backgroundImage =
             'url(https://api.tomtom.com/maps-sdk-for-web/5.x/assets/images/' + icon + ')';
          markerContentElement.appendChild(iconElement);

          var popup = new tt.Popup({
             offset: 30
          }).setText(popupText);
          // add marker to map
          new tt.Marker({
                element: markerElement,
                anchor: 'bottom'
             })
             .setLngLat(position)
             .setPopup(popup)
             .addTo(map);
       }

       function get_markers() {
          var oid = '{{ $result->id }}';

          $.ajax({
             type: 'POST',
             // async: false,
            // url: "web/order/get_all_locations",
             url: "{{ route('front.get-lat-long')}}",
             data: {
                orderId: oid,
                _token:token
             },
             success: function(response) {
               // console.log(response);
                var res =(response);
                // // validateResult(result);
                // var loc=res.longitude+','+res.latitude+':'+res.boylng+','+res.boylat;
                // result = loc;
                createMarker('accident.colors-white.svg', [res.store_long, res.store_lat], '#5327c3', 'Store: ' + res.store_address);
                if (res.fullName != null) {
                   createMarker('accident.colors-white.png', [res.boy_long, res.boy_lat], '#c30b82', 'Delivery Boy: ' + res.fullName);
                }
                createMarker('accident.colors-white.jpg', [res.user_long, res.user_lat], '#c31a26', 'Delivery Address: ' + res.user_address);

             }
          }); //ajax

          //Draw Routes
          var routeColors = {
             pedestrian: '#ff0000',
             car: '#f66606',
             truck: '#f06368',
             bicycle: '#666666',
             bus: '#004b7f',
             van: '#008d8d',
             motorcycle: '#e94743',
             taxi: '#5fb935'
          };
          var travelMode = 'motorcycle';
          var travelModeSelector = tail.select('.js-category-select', {
             classNames: 'tt-fake-select',
             hideSelected: true
          });
          var errorHint = new InfoHint('error', 'bottom-center', 5000).addTo(document.getElementById('map'));
          var loadingHint = new InfoHint('info', 'bottom-center').addTo(document.getElementById('map'));

         new Foldable('.js-foldable', 'top-right');
          map.on('load', function() {
             travelModeSelector.on('change', handleTravelModeChange);
             performCalculateRouteRequest();
          });

          function handleTravelModeChange(event) {
             travelMode = event.key;
             performCalculateRouteRequest();
          }

          function performCalculateRouteRequest() {
             removeLayer();
             var oid = '{{ $result->id }}';
             var result = [];
             $.ajax({
                type: 'POST',
                async: false,
               // url: "web/order/get_location",
                url: "{{ route('front.get-lat-long')}}",
                data: {
                   orderId: oid,
                   _token:token
                },
                success: function(response) {
                  var res = (response);
                  destinationLat=(res.boy_lat)?res.boy_lat:res.store_lat;
                  destinationLong=(res.boy_lat)?res.boy_long:res.store_long;
                  var loc = res.user_lat + ',' + res.user_long + ':' + destinationLat + ',' + destinationLong;
                  result = loc;
                 // console.log(result);
                }
             }); //ajax
             loadingHint.setMessage('Loading...');
             tt.services.calculateRoute({
                   key: "{{ config('constants.TOMTOM_API_KEY') }}",
                   traffic: false,
                   locations: '4.91015,52.37173:4.89805,52.36357',
                   //  locations: result,
                   travelMode: travelMode
                })
                .go()
                .then(function(response) {
                   loadingHint.hide();

                   var geojson = response.toGeoJson();

                   map.addLayer({
                      'id': 'route',
                      'type': 'line',
                      'source': {
                         'type': 'geojson',
                         'data': geojson
                      },
                      'paint': {
                         'line-color': routeColors[travelMode],
                         'line-width': 6
                      }
                   });

                   var bounds = new tt.LngLatBounds();
                   geojson.features[0].geometry.coordinates.forEach(function(point) {
                      bounds.extend(tt.LngLat.convert(point));
                   });
                   map.fitBounds(bounds, {
                      duration: 0,
                      padding: 50
                   });

                })
                .catch(function(err) {
                   loadingHint.hide();
                   errorHint.setMessage(err.message);
                });
          }

          function removeLayer() {
             if (!map.getLayer('route')) {
                return;
             }
             map.removeLayer('route');
             map.removeSource('route');
          }
       }

       //get_markers
       //Refresh map after each 30seconds
      window.setInterval(function() {
          //   /// call your function here
          get_markers();
       }, 3000);
        /** Hide re-verify button after 10 sec */


    </script>
@endif
<script>
     window.setTimeout(function() {
      if ($('#hideMe').length > 0) {
         window.location.reload();
      }
      }, 10000);
   </script>
@endsection