<?php if (isset($component)) { $__componentOriginalc6e081c8432fe1dd6b4e43af4871c93447ee9b23 = $component; } ?>
<?php $component = $__env->getContainer()->make(App\View\Components\MasterLayout::class, ['assets' => $assets ?? []]); ?>
<?php $component->withName('master-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
    <div>
        <?php $id = $id ?? null;?>
        <div class="row">
            <div class="col-lg-12">
                <div class="card card-block card-stretch">
                    <div class="card-body p-0">
                        <div class="d-flex justify-content-between align-items-center p-3">
                            <h5 class="font-weight-bold"><?php echo e($pageTitle); ?></h5>
                            <div class="float-right">
                                <div class="row align-items-center">
                                    <div class="col-md-4">
                                        <?php echo Form::label('status_filter', __('message.filter_order')); ?>

                                        <?php echo Form::open(['route' => 'ordermap', 'method' => 'GET', 'id' => 'filterForm']); ?>

                                            <div class="form-group mb-0">
                                                <?php echo Form::select('status_filter', [
                                                    'create' => __('message.accepted'),
                                                    'courier_assigned' => __('message.assigned'),
                                                    'courier_arrived' => __('message.arrived'),
                                                    'courier_picked_up' => __('message.picked_up'),
                                                    'courier_departed' => __('message.departed'),
                                                ], $selectedStatus, ['class' => 'form-control select2js', 'id' => 'status_filter']); ?>

                                            </div>
                                        <?php echo Form::close(); ?>

                                    </div>
                                    <div class="col-md-3 pr-2 mt-3">
                                        <div class="d-flex">
                                            <button type="submit" form="filterForm" class="btn btn-sm btn-primary"><?php echo e(__('message.apply')); ?></button>
                                            <a href="<?php echo e(route('ordermap')); ?>" class="btn btn-sm btn-success text-dark ml-2"><?php echo e(__('message.reset')); ?></a>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group ml-12">
                                            <img src="<?php echo e(asset("images/ic_pickup_pin.png")); ?>" alt="Pickup Pin Icon">
                                            <label for="pickup-pin"><?php echo e(__('message.pickup_location')); ?></label>
                                            <img src="<?php echo e(asset("images/ic_drop_pin.png")); ?>" alt="Drop Pin Icon">
                                            <label for="delivery-pin"><?php echo e(__('message.delivery_location')); ?></label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">
                        <div class="row" style="padding:10px">
                            <div style="height: 700px;width: 1600px;" id="map"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <?php $__env->startSection('bottom_script'); ?>
        <script>
            var map;
            var markers = [];
            var infoWindow;

            function initMap() {
                var myLatlng = {lat: 22.316258503105992, lng: 70.83204484790207};
                map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 4,
                    center: myLatlng
                });

                infoWindow = new google.maps.InfoWindow();

                <?php $__currentLoopData = $pickupPoints; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $pickupPoint): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    var pickupLatLng = {lat: <?php echo e($pickupPoint['latitude']); ?>, lng: <?php echo e($pickupPoint['longitude']); ?>};
                    addMarker(pickupLatLng, '<?php echo e($pickupPoint['address']); ?>', '<?php echo e(asset("images/ic_pickup_pin.png")); ?>', '<?php echo e($pickupPoint['status']); ?>', '<?php echo e($pickupPoint['order_id']); ?>', '<?php echo e($pickupPoint['created_at']); ?>');
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>


                <?php $__currentLoopData = $deliveryPoints; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $deliveryPoint): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    var deliveryLatLng = {lat: <?php echo e($deliveryPoint['latitude']); ?>, lng: <?php echo e($deliveryPoint['longitude']); ?>};
                    addMarker(deliveryLatLng, '<?php echo e($deliveryPoint['address']); ?>', '<?php echo e(asset("images/ic_drop_pin.png")); ?>', '<?php echo e($deliveryPoint['status']); ?>', '<?php echo e($deliveryPoint['order_id']); ?>', '<?php echo e($deliveryPoint['created_at']); ?>');
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            }

            function addMarker(location, title, iconUrl, status, orderId, created_at) {
                var marker = new google.maps.Marker({
                    position: location,
                    map: map,
                    title: title,
                    icon: {
                        url: iconUrl,
                        scaledSize: new google.maps.Size(32, 32)
                    },
                    status: status,
                    orderId: orderId,
                    created_at: created_at
                });
                markers.push(marker);

                marker.addListener('click', function() {
                    var order_view = "<?php echo e(route('order.show', '' )); ?>/"+this.orderId;
                    var contentString = '<div class="map_driver_detail"><ul class="list-unstyled mb-0">'+
                                '<li><i class="fa fa-address-card" aria-hidden="true"></i>: '+this.orderId+'</li>'+
                                '<li><i class="fa fa-clock"></i>: '+this.created_at+'</li>'+
                                '<li><i class="fa fa-toggle-on"></i>: '+this.status+'</li>'+
                                '<li><a href="'+order_view+'"><i class="fa fa-eye" aria-hidden="true"></i> <?php echo e(__("message.view_form_title",[ "form" => __("message.order") ])); ?></a></li>'+
                                '</ul></div>';
                    infoWindow.setContent(contentString);
                    infoWindow.open(map, marker);
                });
            }

            function filterMarkers() {
                var selectedStatus = document.getElementById('status_filter').value;

                markers.forEach(function(marker) {
                    if (marker.status === selectedStatus || selectedStatus === 'all') {
                        marker.setMap(map);
                    } else {
                        marker.setMap(null);
                    }
                });
            }

            window.onload = function() {
                initMap();
                document.getElementById('status_filter').addEventListener('change', filterMarkers);
            };
        </script>
    <?php $__env->stopSection(); ?>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc6e081c8432fe1dd6b4e43af4871c93447ee9b23)): ?>
<?php $component = $__componentOriginalc6e081c8432fe1dd6b4e43af4871c93447ee9b23; ?>
<?php unset($__componentOriginalc6e081c8432fe1dd6b4e43af4871c93447ee9b23); ?>
<?php endif; ?>
<?php /**PATH /home/atharvatek/mxunzo.atharvatek.com/resources/views/order/map.blade.php ENDPATH**/ ?>