<?php $__env->startSection('content'); ?>
    <div class="container my-5 body-content">
        <div class="row">
            <div class="col-lg-3 col-sm-12">
                <?php echo $__env->make('account.sidebar', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
            </div>
            <div class="col-lg-9 col-sm-12">
                <div class="card">
                    <h5 class="card-header"><?php echo e(__('New Address')); ?></h5>
                    <div class="card-body">
                        <?php echo $__env->make('layouts.errors', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
                        <form action="<?php echo e(route('account.addresses.store')); ?>" method="POST">
                            <?php echo csrf_field(); ?>
                            <?php if(request()->has('_back')): ?>
                                <input type="hidden" name="_back" value="addresses">
                            <?php endif; ?>
                            <div class="row">
                                <div class="form-group col-md-6 mb-3">
                                    <label for="name">نام و نام‌خانوادگی گیرنده *</label>
                                    <input name="name" type="text" class="form-control" id="name" autofocus
                                           value="<?php echo e(old('name')); ?>">
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="mobile"><?php echo e(__('Mobile')); ?> *</label>
                                    <input type="text" name="mobile" class="form-control" id="mobile" dir="ltr"
                                           value="<?php echo e(old('mobile')); ?>">
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="province_id"><?php echo e(__('Province')); ?> *</label>
                                    <select name="province_id" class="form-control form-select" id="province_id">
                                        <option value=""><?php echo e(__('Please select')); ?></option>
                                        <?php $__currentLoopData = $provinces; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $province): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <option value="<?php echo e($province->id); ?>"
                                                <?php echo e(old('province_id') == $province->id ? 'selected' : ''); ?>>
                                                <?php echo e($province->name); ?>

                                            </option>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </select>
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="city_id"><?php echo e(__('City')); ?> *</label>
                                    <select name="city_id" class="form-control form-select" id="city_id">
                                        <option value=""><?php echo e(__('Select the province first')); ?></option>
                                    </select>
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="national_code"><?php echo e(__('National Code')); ?></label>
                                    <input name="national_code" type="text" class="form-control" id="national_code" dir="ltr"
                                           value="<?php echo e(old('national_code')); ?>">
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="postal_code"><?php echo e(__('Postal Code')); ?> *</label>
                                    <input name="postal_code" type="text" class="form-control" id="postal_code" dir="ltr"
                                           value="<?php echo e(old('postal_code')); ?>">
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="plaque"><?php echo e(__('Plaque')); ?></label>
                                    <input name="plaque" type="text" class="form-control" id="plaque" dir="ltr"
                                           value="<?php echo e(old('plaque')); ?>">
                                </div>
                                <div class="form-group col-md-6 mb-3">
                                    <label for="floor"><?php echo e(__('Floor')); ?></label>
                                    <input name="floor" type="text" class="form-control" id="floor" dir="ltr"
                                           value="<?php echo e(old('floor')); ?>">
                                </div>
                                <div class="form-group col-md-12 mb-3">
                                    <label for="address"><?php echo e(__('Address')); ?> *</label>
                                    <input name="address" type="text" class="form-control" id="address"
                                           value="<?php echo e(old('address')); ?>">
                                </div>
                                <div class="form-group col-md-12 mb-3">
                                    <label for="address"><?php echo e(__('Location')); ?></label>
                                    <input type="hidden" id="lat" name="lat" value="<?php echo e(old('lat')); ?>">
                                    <input type="hidden" id="lng" name="lng" value="<?php echo e(old('lng')); ?>">
                                    <div id="map" style="height: 300px; width: inherit;"></div>
                                    <?php if (! (old("lat") && old("lng"))): ?>
                                        <small>* <?php echo e(__('Click on the map to display the marker')); ?></small>
                                    <?php endif; ?>
                                </div>
                            </div>
                            <div>
                                <button type="submit" class="btn btn-primary"><?php echo e(__('Save')); ?></button>
                                <a href="<?php echo e(request()->has('_back') ? route('addresses.index') : route('account.addresses.index')); ?>"
                                   class="btn btn-danger float-end">
                                    <?php echo e(__('Cancel')); ?>

                                </a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('header'); ?>
    <link rel="stylesheet" href="<?php echo e(asset('leaflet/leaflet.css')); ?>" />
    <link rel="stylesheet" href="<?php echo e(asset('Leaflet.EasyButton/src/easy-button.css')); ?>">
<?php $__env->stopSection(); ?>
<?php $__env->startSection('footer'); ?>
    <script src="<?php echo e(asset('leaflet/leaflet.js')); ?>"></script>
    <script src="<?php echo e(asset('Leaflet.EasyButton/src/easy-button.js')); ?>"></script>
    <script>
        var default_lat = `<?php echo e(old("lat")); ?>` ? `<?php echo e(old("lat")); ?>` : `<?php echo e(config('leaflet.default_lat')); ?>`;
        var default_lng = `<?php echo e(old("lng")); ?>` ? `<?php echo e(old("lng")); ?>` : `<?php echo e(config('leaflet.default_lng')); ?>`;
        var map = L.map('map').setView([default_lat, default_lng], 12);
        map.scrollWheelZoom.disable()
        L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '',
            maxZoom: 18,
            tileSize: 512,
            zoomOffset: -1,
        }).addTo(map);

        L.easyButton( 'fa-search-location', function(){
            map.locate();
        }).addTo(map);

        var icon = new L.Icon.Default();
        icon.options.shadowSize = [0,0];

        var marker = L.marker([default_lat, default_lng],{
            draggable: true,
            icon : icon
        });

        map.on('click', function(e){
            updatePoints(e.latlng.lat,e.latlng.lng)
        });

        marker.on('moveend', function(e){
            updatePoints(e.target._latlng.lat,e.target._latlng.lng)
        });

        if(`<?php echo e(old("lat")); ?>` && `<?php echo e(old("lng")); ?>`) {
            marker.setLatLng([default_lat,default_lng]).addTo(map);
        } else {
            // map.locate();
        }

        function updatePoints(lat, lng) {
            $('#lat').val(lat);
            $('#lng').val(lng);
            map.setView([lat, lng]);
            marker.setLatLng([lat,lng]).addTo(map);
        }

        map.on('locationfound', onLocationFound);
        function onLocationFound(e) {
            updatePoints(e.latlng.lat, e.latlng.lng);
        }
        map.on('locationerror', onLocationError);
        function onLocationError(e) {
            iziToast.error({
                message: "شما دسترسی ما به GPS را محدود کرده‌اید، برای مکان‌یابی خودکار باید GPS را فعال کرده و دسترسی لازم را بدهید.",
                'position': 'topLeft'
            });
            if($('#lat').val() && $('#lng').val())
                updatePoints($('#lat').val(), $('#lng').val());
        }
    </script>
    <script>
        $('#province_id').on('change', function() {
            var select = $('#city_id');
            $('option', select).remove();
            if(this.value == "") {
                select.append("<option value=\"\"><?php echo e(__('Select the province first')); ?></option>");
                return;
            }
            else
                url = `<?php echo e(url('/province')); ?>` + '/' + this.value;
            $.ajax(url,
                {
                    success: function (data) {
                        select.append("<option value=\"\"><?php echo e(__('Please select')); ?></option>");
                        for(let i=0 ; i<data.length; i++) {
                            select.append(`<option value="${data[i].id}">${data[i].name}</option>`);
                        }
                    },
                    error: function (jqXhr, textStatus, errorMessage) {
                        alert('Error: ' + errorMessage);
                    }
                });
        });
        $( document ).ready(function() {
            <?php if(old('province_id') && old('city_id')): ?>
            var select = $('#city_id');
            $('option', select).remove();
            url = `<?php echo e(url('/province')); ?>` + '/' + `<?php echo e(old('province_id')); ?>`;
            $.ajax(url,
                {
                    success: function (data) {
                        city_id = `<?php echo e(old('city_id')); ?>`;
                        select.append("<option value=\"\"><?php echo e(__('Please select')); ?></option>");
                        for(let i=0 ; i<data.length; i++) {
                            select.append(`<option value="${data[i].id}" `+ (data[i].id == city_id ? "selected" : "") + `>${data[i].name}</option>`);
                        }
                    },
                    error: function (jqXhr, textStatus, errorMessage) {
                        alert('Error: ' + errorMessage);
                    }
                });
            <?php endif; ?>
        })
    </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/masomi/armshop/resources/views/account/address/create.blade.php ENDPATH**/ ?>