/**
* To Manage Fleet
* @module Inventory
*/



/**
* This class contains functions related to show device details and their state (Operational/Non-operational/Disabled/Archive/All")
* @class ShowDealerMap
* @constructor
*/


var ccplMap = null,
    geoCoder,
    defaultLat,
    defaultLng,
    marker;

var displayDisplay = "";        //route direction display
//var routeDirectionsService = new google.maps.DirectionsService();           //direction google map api

//initialize markers
var sourceMarker = '../../Scripts/map_api/icons/red_s.png';                 //marker for source 
var destinationMarker = '../../Scripts/map_api/icons/red_d.png';            //marker for destination

var markers = [];      //array of source and destination markers

var vLatVal = "";
var vLongVal = "";

var marker1 = ""; var searchBox = null, placeLocationMarkerArray = [];
var copyResulElsForGeoCoder = [];
//========================================== map functionality ============================================//


/** 
* This function is used to Get dealer Lat long and set it into Hidden field 
* @method initMap
* @param {String} id Id Of Map
* @for ShowDealerMap
*/
function initMap(id) {
    var markers = [];

    ccplMap = new google.maps.Map(document.getElementById(id), {
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        //center: new google.maps.LatLng(vLatVal, vLongVal),
        zoom: 12
    });

    // Create the search box and link it to the UI element.
    //var input = /** @type {HTMLInputElement} */(
    //    document.getElementById('searchLocationTool'));
    //ccplMap.controls[google.maps.ControlPosition.TOP_CENTER].push(input);

    //searchBox = new google.maps.places.SearchBox(
    //  /** @type {HTMLInputElement} */(input));

    SetDefaultLatAndLong();

    //setTimeout(function () {
    //placeLocationOnMap();
    //}, 1000);



    // Create the search box and link it to the UI element.
    //var input = /** @type {HTMLInputElement} */(
    //    document.getElementById('pac-input'));
    //ccplMap.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

    //var searchBox = new google.maps.places.SearchBox(
    //  /** @type {HTMLInputElement} */(input));

    // Listen for the event fired when the user selects an item from the
    // pick list. Retrieve the matching places for that item.
    //google.maps.event.addListener(searchBox, 'places_changed', function () {
    //    var places = searchBox.getPlaces();

    //    if (places.length == 0) {
    //        return;
    //    }
    //    for (var i = 0, marker; marker = markers[i]; i++) {
    //        marker.setMap(null);
    //    }

    //    // For each place, get the icon, place name, and location.
    //    markers = [];
    //    var bounds = new google.maps.LatLngBounds();
    //    for (var i = 0, place; place = places[i]; i++) {
    //        var image = {
    //            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.
    //        var marker = new google.maps.Marker({
    //            map: ccplMap,
    //            icon: image,
    //            title: place.name,
    //            position: place.geometry.location,
    //            draggable: true,
    //        });
    //        vLatVal = marker.position.lat();
    //        vLongVal = marker.position.lng();
    //        markers.push(marker);
    //        bounds.extend(place.geometry.location);
    //    }
    //    console.log(bounds);
    //    var ccplMap = new google.maps.Map(document.getElementById(id), {
    //        mapTypeId: google.maps.MapTypeId.ROADMAP,
    //        center: new google.maps.LatLng(vLatVal, vLongVal),
    //        zoom: 12
    //    });
    //    ccplMap.fitBounds(bounds);
    //    var ccplMap = new google.maps.Map(document.getElementById(id), {
    //        mapTypeId: google.maps.MapTypeId.ROADMAP,
    //        center: new google.maps.LatLng(vLatVal, vLongVal),
    //        zoom: 12
    //    });
    //    var marker = new google.maps.Marker({
    //        position: ccplMap.getCenter(),
    //        map: ccplMap,
    //        draggable: true,
    //        title: 'Click to zoom'
    //    });
    //    //ccplMap.controls[google.maps.ControlPosition.TOP_LEFT].push(input);
    //    google.maps.event.addListener(marker, 'dragend', function (e) {
    //        vLatVal = e.latLng.lat();
    //        vLongVal = e.latLng.lng();
    //    });
    //});


    // Bias the SearchBox results towards places that are within the bounds of the
    // current map's viewport.
    //google.maps.event.addListener(ccplMap, 'bounds_changed', function () {
    //    var bounds = ccplMap.getBounds();
    //    searchBox.setBounds(bounds);
    //    console.log(bounds);
    //});

}

// created google search box by google prediction api
function onGoogleSearch() {
    // reset search box and sugesstion list div
    $("#sugList-holder").css('visibility', 'hidden');
    $("#sugList").html("");



    // function on search box.
    $("#searchLocationTool").keydown(function (e) {

        // up key
        if (e.keyCode == 38) {
            var currEle = $('#sugList li.key-highlight');
            $(currEle).removeClass("key-highlight");
            if ($(currEle).index() < 1) {
                $('#sugList li:last').addClass("key-highlight");
            }
            else {
                $(currEle).prev().addClass("key-highlight");
            }
        }
            // down key
        else if (e.keyCode == 40) {
            var currEle = $('#sugList li.key-highlight');
            $(currEle).removeClass("key-highlight");
            if ($(currEle).index() > 3) {
                $('#sugList li:first').addClass("key-highlight");
            }
            else {
                $(currEle).next().addClass("key-highlight");
            }
        }
            // enter key
        else if (e.keyCode == 13) {
            var currEle = $('#sugList li.key-highlight')[0];
            var placeId = $(currEle).attr("placeid");
            var selLoc = $(currEle).attr("location");
            drawMarker(placeId, selLoc);
            $("#sugList").html("");
        }

        else {
            var displaySuggestions = function (predictions, status) {
                if (status != google.maps.places.PlacesServiceStatus.OK) {
                    console.log(status);
                    return;
                }
                predictions.forEach(function (prediction) {
                    var loc = prediction.description.split(' ').join('_');

                    var str = '<li  class="list-item" location=' + loc + '  placeid=' + prediction.place_id + ' onclick= drawMarker("' + prediction.place_id + '","' + loc + '")> <i></i> &nbsp;' + prediction.description + '</li>';
                    $('#sugList').append(str);
                    //console.log($('#sugList'));
                });

                $("#sugList").css('visibility', 'visible');
                $("#sugList li:first").addClass("key-highlight");
            };



            var stxt = $("#searchLocationTool").val();
            //console.log(stxt);
            if (stxt.length <= 1) {

                //$("#sugList-holder").css('visibility', 'hidden');
                $("#sugList").html("");
            }

            if (stxt.length > 1) {
                if (stxt.length % 2 == 0) {
                    $("#sugList").html("");
                    var service = new google.maps.places.AutocompleteService();
                    service.getQueryPredictions({ input: stxt }, displaySuggestions);
                }
            }
        }

    });
}


// place the marker by suggestion.
function drawMarker(placeId, selectedLoc) {
    $("#searchLocationTool").val(selectedLoc.split('_').join(' '));

    //infoWindow = new google.maps.InfoWindow();
    var service = new google.maps.places.PlacesService(ccplMap);
    service.getDetails({
        placeId: placeId,
        fields: ["name", "address_component", "formatted_address", "geometry.location"]
    }, function (result, status) {
        if (status != google.maps.places.PlacesServiceStatus.OK) {
            alert(status);
            return;
        }
      
        //remove breakdown location marker
        if (marker) {
            marker.setMap(null);
            marker = "";
        }

        // Address cration
        //console.log(result);


        var bounds = new google.maps.LatLngBounds();
        // Create a marker for each place.
        var markerLocation = new google.maps.Marker({
            map: ccplMap,
            place: {
                placeId: placeId,
                location: result.geometry.location
            },
            //draggable: true,
            title: result.formatted_address,
            //  position: places[0].geometry.location
        });

        //google.maps.event.addListener(markerLocation, 'dragend', function (e) {
        //    vLatVal = e.latLng.lat();
        //    vLongVal = e.latLng.lng();
        //});
        //breakdownLocationLatLng = markerLocation.place.location;

        //placeLocationMarkerArray.push(markerLocation);
        bounds.extend(result.geometry.location);

        ccplMap.fitBounds(bounds);

        $("#sugList").html("").css('visibility', 'hidden');
        console.log(result.geometry.location)

        vLatVal = result.geometry.location.lat();
        vLongVal = result.geometry.location.lng();
        console.log(vLatVal)
    });


}


/** 
* This function is used to Get dealer Lat long and set it into Hidden field 
* @method getDelearLatLong
* @for ShowDealerMap
*/
function getDelearLatLong() {
    console.log("getDelearLatLong",vLatVal)
    $("#hdnDealerDefaultLatitude").val(vLatVal);
    $("#hdnDealerDefaultLongitude").val(vLongVal);
    closeWindow("#divShowDealerLocation");
}

//==================================== end map functionality =============================================//
$(document).ready(function () {
    setTimeout(function () {
        initMap("divMapContainer");

    }, 1000);

    onGoogleSearch();
});

/** 
* This function set marker object and Add Dragend Event in Maps
* @method getSetMarker
* @for ShowDealerMap
*/
function SetDefaultLatAndLong() {
    var DealerState = $("#ddState option:selected").text();
    var DealerCity = $("#ddCity option:selected").val();
    var address = DealerState + "," + DealerCity;
    console.log("VVVV", $("#hdnDealerDefaultLongitude").val());
    if ($("#hdnDealerDefaultLatitude").val() == "" || $("#hdnDealerDefaultLatitude").val() == "0") {
       
        setMapCenterToAddress(address);
    }
    else {
        vLatVal = $("#hdnDealerDefaultLatitude").val();
        vLongVal = $("#hdnDealerDefaultLongitude").val();
        var dealerLatLong = new google.maps.LatLng(vLatVal, vLongVal);
        ccplMap.setCenter(dealerLatLong);
        getSetMarker();
    }
}


/** 
* This function set center and zoom of map when state or city change
* @method setMapCenterToAddress
* @param {String} address address to show on map
* @for ShowDealerMap
*/
function setMapCenterToAddress(address) {
    //geoCoder = new google.maps.Geocoder();
    //geoCoder.geocode({ 'address': address }, function (results, status) {
    //    if (status == google.maps.GeocoderStatus.OK) {
    //        ccplMap.setCenter(results[0].geometry.location);
    //        defaultLat = results[0].geometry.location.lat();
    //        defaultLng = results[0].geometry.location.lng();
    //        vLatVal = defaultLat;
    //        vLongVal = defaultLng;
    //        $("#hdnDealerDefaultLatitude").val(vLatVal);
    //        $("#hdnDealerDefaultLongitude").val(vLongVal);
    //        getSetMarker();
    //    }
    //});

    callHereAPIForGeoCoder(address);

    if (copyResulElsForGeoCoder[0].status == "OK") {
        ccplMap.setCenter(copyResulElsForGeoCoder[0].displayPosition);
        defaultLat = copyResulElsForGeoCoder[0].displayPosition.Latitude;
        defaultLng = copyResulElsForGeoCoder[0].displayPosition.Longitude;
        vLatVal = defaultLat;
        vLongVal = defaultLng;
        $("#hdnDealerDefaultLatitude").val(vLatVal);
        $("#hdnDealerDefaultLongitude").val(vLongVal);
        getSetMarker();
    }

}

/** 
* This function set marker object and Add Dragend Event in Maps
* @method getSetMarker
* @for ShowDealerMap
*/
function getSetMarker() {

    //remove breakdown location marker
    if (marker) {
        marker.setMap(null);
        marker = "";
    }

    marker = new google.maps.Marker({
        position: ccplMap.getCenter(),
        map: ccplMap,
        draggable: true,
        title: 'Click to zoom'
    });
    google.maps.event.addListener(marker, 'dragend', function (e) {
        vLatVal = e.latLng.lat();
        vLongVal = e.latLng.lng();
    });
}

/** 
* This function get location from given lattitude and longitude
* @method getLocationByLatLng
* @for ShowDealerMap
*/
function getLocationByLatLng() {
  
    var lattitude = $("#textLat").val();
    var longitude = $("#textLng").val();

    ccplMap.setCenter(new google.maps.LatLng(lattitude, longitude));
    getSetMarker();

    vLatVal = lattitude;
    vLongVal = longitude;
}

/** 
* This function show hide search by lat lng div on radio button click
* @method onRadioButtonCheckChange
* @for ShowDealerMap
*/
function onRadioButtonCheckChange($this) {
    var inputId = $this;
    if (inputId == "radio_latLng") {
        $("#div_searchByLatLng").show();
        $("#searchLocationTool").hide();
        $("#sugList").html("");
        $("#searchLocationTool").val("");
    } else if (inputId == "radio_Address") {
        $("#div_searchByLatLng").hide();
        $("#searchLocationTool").show();
        $("#sugList-holder").css('visibility', 'visible');
    }
}




//------------------- implementing HERE API For Geocoder ------------------------------

function callHereAPIForGeoCoder(details) {
  
    console.log(data);
    var resultElsForGeoCoder = [];
    var searchtext = details;
    var url = "https://geocoder.ls.hereapi.com/6.2/geocode.json?";
    url += "&apiKey=DW3-YCFFZtJzlAQpTfVPoXADcZpEeZe3t8h6ganVsqo";
    url += "&searchtext=" + searchtext;


    var request = GetDataHerefromAPI("get", url);
    if (request) {
        request.onload = function (data) {
            var res = JSON.parse(data.target.response);
            //var response = (res.response.route[0].summary);
            resultElsForGeoCoder.distance = (res.Response.View[0].Result[0].Location.MapView);
            resultElsForGeoCoder.displayPosition = res.Response.View[0].Result[0].Location.DisplayPosition;
            resultElsForGeoCoder.status = "OK";

            copyResulElsForGeoCoder.push(resultElsForGeoCoder);
        }
        request.send();
    }
}

function GetDataHerefromAPI(method, url) {
    var xhr = new XMLHttpRequest();
    xhr.withCredentials = false;
    if ("withCredentials" in xhr) {
        xhr.open(method, url, false);
    } else if (typeof XDomainRequest != "undefined") {
        xhr = new XDomainRequest();
        xhr.open(method, url);
    } else {
        xhr = null;
    }
    return xhr;
}