var map = null;
var latPosition;
var longPosition;


function getPosition() {
    var options = {
        enableHighAccuracy: true,
        timeout: 5000,
        maximumAge: 0
    };

    function success(pos) {
        crd = pos.coords;
        latPosition = crd.latitude;
        longPosition = crd.longitude;
        map.setCenter(new google.maps.LatLng(latPosition, longPosition));
    };

    function error(err) {
        console.warn('ERROR(' + err.code + '): ' + err.message);
    };
    navigator.geolocation.getCurrentPosition(success, error, options);
}

function initAutocomplete() {


    if (map) {
        return;
    }
    map = new google.maps.Map(document.getElementById('map'), {
        center: {
            lat: 4.0000000,
            lng: -72.0000000
        },
        zoom: 14,
        mapTypeId: 'roadmap'
    });

    // Create the search box and link it to the UI element.
    var input = document.getElementById('pac-input');
    var searchBox = new google.maps.places.SearchBox(input);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

    // Bias the SearchBox results towards current map's viewport.
    map.addListener('bounds_changed', function () {
        searchBox.setBounds(map.getBounds());
    });

    var markers = [];
    // Listen for the event fired when the user selects a prediction and retrieve
    // more details for that place.
    searchBox.addListener('places_changed', function () {
        var places = searchBox.getPlaces();

        if (places.length == 0) {
            return;
        }


        // Clear out the old markers.
        markers.forEach(function (marker) {
            marker.setMap(null);
        });
        markers = [];

        // For each place, get the icon, name and location.
        var bounds = new google.maps.LatLngBounds();
        places.forEach(function (place) {
            if (!place.geometry) {
                console.log("Returned place contains no geometry");
                return;
            }

            $('#pac-input').attr('data-lat', place.geometry.location.lat());
            $('#pac-input').attr('data-long', place.geometry.location.lng());
            $('#btnDirection').prop('disabled', false);

            var icon = {
                url: place.icon,
                size: new google.maps.Size(71, 71),
                origin: new google.maps.Point(0, 0),
                anchor: new google.maps.Point(17, 34),
                scaledSize: new google.maps.Size(25, 25)
            };

            // Create a marker for each place.
            markers.push(new google.maps.Marker({
                map: map,
                icon: icon,
                title: place.name,
                position: place.geometry.location
            }));

            if (place.geometry.viewport) {
                // Only geocodes have viewport.
                bounds.union(place.geometry.viewport);
            } else {
                bounds.extend(place.geometry.location);
            }
        });
        map.fitBounds(bounds);
    });

    getPosition();
}

$('#btn-open-modal-direction').click(function () {
    initAutocomplete();
});

$('#pac-input').click(function () {
    $('.pac-container').css('z-index', 1100);
    $('#pac-input').attr('data-lat', '');
    $('#pac-input').attr('data-long', '');
    $('#btnDirection').prop('disabled', true);

});

function helpDirection() {
    var displayAyuda = $('.content-target-aviso').attr('data-id');
    if (displayAyuda == 0) {
        $('.content-target-aviso').attr('data-id', 1);
        $('.content-target-aviso').css('display', "flex");
    } else {
        $('.content-target-aviso').attr('data-id', 0);
        $('.content-target-aviso').css('display', "none");
    }
}

function reloadMapa() {
    getPosition();
    initAutocomplete();
}