{!! Form::open(array('route' => $route, 'method' => 'POST' ,'id' => 'ajaxSaveAddress')) !!}

    <div class="error-msg"></div>
    <!-----NEW------------->
    <div class="form-group clearfix">
        @if(session('is_guest') == "")
        <div class="row">
            <div class="col-md-12" style="padding:0; margin-bottom:15px;">
                {!! Form::label("location", __('front_site.address_type'), ['class'=>'control-label']) !!}
                {!! Form::text("type", $result->type, ['class'=>'form-control','id'=>'type','placeholder'=>__('v2/front_site.address_type') ." " . __('v2/front_site.address_type_example')]) !!}
            </div>
        </div>
        <div class="row">
            <div class="col-md-12" style="padding:0;">
                {!! Form::checkbox('default', '1', ($result->is_default==1)?true:false, ['class'=>'custom-control-input address_check']) !!}
                {!! Form::label("default", __('v2/front_site.set_as_default_address'), ['class'=>'custom-control-label']) !!}

            </div>
        </div>
        @endif
    </div>

    <div class="form-group">
        <div class="row" id="container-div" style="height:100%;">
            {!! Form::text('address', $result->address, ['class'=>'input-location form-control','id'=>'address-new','placeholder'=>__('v2/front_site.enter_location'),'style'=>'margin-bottom: 12px']) !!}
            {!! Form::hidden('latitude',$result->latitude, ['id'=>'latitude']) !!}
            {!! Form::hidden('longitude',$result->longitude, ['id'=>'longitude']) !!}
            {!! Form::hidden('address_id',$result->id, ['id'=>'address_id']) !!}
            {!! Form::label("location", __('v2/front_site.address'), ['class'=>'control-label col-md-3 col-sm-3 col-xs-12','style'=>'margin-top:0','margin-bottom:10px']) !!}

            <div id="map" class="maps"></div>
        </div>
    </div>
    <!------- NEW ------->
    <div class="form-group">
        <div class="row">
            <div class="col-lg-12" style="padding:0;">
                <button type="submit" class="btn wide btn-default address-sub">{{ __('v2/front_site.save')}}</button>
            </div>
        </div>

    </div>
    {!! Form::close() !!}
<script src="https://maps.google.com/maps/api/js?key={!! \Config::get('constants.GOOGLE_MAP_KEY') !!}&callback=init&libraries=places" defer></script>
<script type="text/javascript">
    $("#ajaxSaveAddress").submit(function (e)
    {
        e.preventDefault(); // avoid to execute the actual submit of the form.

        var form = $(this);
        var isGuest = "{!! session('is_guest') !!}"
        if(isGuest !=""){
            var lattitude = $('#latitude').val();
            var longitude = $('#longitude').val();
            var addressText = $('#address-new').val();
            var address = `<div class="col-md-4 address_div">
                    <input type="radio" name="address" hidden="" checked="" class="activeAdd selectedAdd" value="${addressText}">
                    <input type="hidden" name="latitude" value="${lattitude}">
                    <input type="hidden" name="longitude" value="${longitude}">
                    <div class="radio">
                    <label>
                    <input type="radio" class="delivery check_delivery_address" checked name="address"  value="${addressText}" >
                    </label>
                    <strong>
                    Address
            1</strong>
            </div>
            <ul class="list-unstyled">
                    <li>
                    <p>${addressText}</p>
                    </li>
                    </ul>
                    </div>`;
            $('#all_address').html(address);
            $('#addressModal .close').trigger("click");
            return false;
        }
        var url = form.attr('action');
        $.ajax({
            type: "POST",
            url: url,
            data: form.serialize(), // serializes the form's elements.
            dataType: "JSON",
            beforeSend: function () {
                $('.error-msg').removeClass('alert-danger').removeClass('alert-success').hide();
                $('.back-drop').fadeIn(100, 'linear');
                $('.loader').fadeIn(100, 'linear');
            },
            success: function (data)
            {
                if (data.status == 0) {
                    $('.error-msg').html(data.message).addClass('alert alert-danger').show();
                    setTimeout(function () {
                        $('.error-msg').fadeOut(1000);
                    }, 3000);
                }

                if (data.status == 1) {
                    $('.error-msg').html(data.message).addClass('alert alert-success').show();
                    $(".all_address").load(location.href + " .all_address");
                    $(".order_address").load(location.href + " .order_address");
                }
                setTimeout(function () {
                    $('.back-drop').fadeOut(100, 'linear');
                    $('.loader').fadeOut(100, 'linear');
                }, 200);

                if (data.status == 1)
                {
                    setTimeout(function () {
                        $('#addressModal .close').trigger("click");
                    }, 1000);
                }
            }
        });
    });

    $("#address-new").keydown(function (e)
    {
        if (e.keyCode == 13) {
            e.preventDefault();
        }
    });

    /**
     * function is used to delete marker.
     *
     * @param markers
     */
    function deleteMarkers(markers)
    {
        for (let i = 0; i < markers.length; i++) {
            markers[i].setMap(null);
        }
        markers = [];
    }

    /**
     * function is used to plot location on map.
     *
     * @param coord
     * @param markers
     */
    function createMarker(coord, markers)
    {
        if (markers.length > 0) {
            deleteMarkers(markers);
        }
        var pos = new google.maps.LatLng(coord.lat(), coord.lng());
        var marker = new google.maps.Marker({
            map: map,
            position: pos,
            icon: 'https://maps.google.com/mapfiles/ms/icons/red-dot.png',
            draggable: false
        });
        markers.push(marker);
    }

    var map;
    var latlng;
    var zoom = 11;
    // LOCATION IN LATITUDE AND LONGITUDE.

    function init()
    {
       @if(isset($result->latitude) && isset($result->longitude))
        latlng = new google.maps.LatLng("{{ $result->latitude }}", "{{ $result->longitude}}");
        zoom = 13;
        @else
        latlng = new google.maps.LatLng("{{ $store->latitude }}", "{{ $store->longitude}}");
       @endif

        var mapOptions = {
            center: latlng,
            mapTypeControl : false,
            zoom: zoom,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var markers = [];
        var marker = '';
        map = new google.maps.Map(document.getElementById("map"), mapOptions);
        marker = new google.maps.Marker({
            map: map,
            position: latlng,
            icon: 'https://maps.google.com/mapfiles/ms/icons/red-dot.png',
            draggable: true
        });
        markers.push(marker);

        /* on click plot location on map */
        // map click event //
        google.maps.event.addListener(map, 'click', function(e)
        {
            //deleteMarkers(markers);
            var latlng = new google.maps.LatLng(e.latLng.lat(), e.latLng.lng());
            var geocoder = geocoder = new google.maps.Geocoder();
            geocoder.geocode({
                'latLng': latlng
            }, function(results, status)
            {
                if (status == google.maps.GeocoderStatus.OK)
                {
                    if (results[0])
                    {
                        document.getElementById('address-new').value = results[0].formatted_address;
                        $('#latitude').val(e.latLng.lat());
                        $('#longitude').val(e.latLng.lng());
                        createMarker(e.latLng, markers);
                    }
                }
            });
        });

        var input = document.getElementById('address-new');
        var autocomplete = new google.maps.places.Autocomplete(input);
        google.maps.event.addListener(autocomplete, 'place_changed', function ()
        {

            var place = autocomplete.getPlace();
            //alert(place.formatted_address + ' ' + place.geometry.location.lat() + ' ' + place.geometry.location.lng());
            map.setCenter(place.geometry.location);
            map.setZoom(12);
            document.getElementById('address-new').value = place.formatted_address;
            $('#latitude').val(place.geometry.location.lat());
            $('#longitude').val(place.geometry.location.lng());
        });
    }
</script>