﻿var map = null;

var selectedID = null;
//Setup additional storage for shapes
VEShape.prototype.GUID = "";

function DoCenterZoom(txtMapLat, txtMapLon, zoomlevel) {
    var lat = txtMapLat;
    var lon = txtMapLon;
    map.SetCenterAndZoom(new VELatLong(lat, lon), zoomlevel);
}

function AddPushpin(dealer) {
    var latLong3 = new VELatLong(dealer.latitude, dealer.longitude);
    var pin = new VEShape(VEShapeType.Pushpin, latLong3);
    pin.SetTitle(dealer.name);
    pin.SetDescription(dealer.description);
    //var icon = "<div style='font-size:12px;font-weight:bold;border:solid 2px Black;background-color:Aqua;width:50px;'>Custom</div>";
    var spec = new VECustomIconSpecification();
    spec.Image = '/JEDE/images/pushpin.png';
    spec.ImageOffset = new VEPixel(-24, -34);
    spec.TextContent = " ";
    pin.SetCustomIcon(spec);
    //Store database id on object
    pin.GUID = dealer.id;
    map.AddShape(pin);

    //var pinID = pin.GetID();
    //var dealerID = dealer.id;
    //IDMap.setItem(pin.GetID(), dealer.id);
}

function OverShapeHandler(e) {
    if (e.elementID != null) {
        var shape = map.GetShapeByID(e.elementID);
        if (shape.GUID != null) {
            selectedID = shape.GUID;
        }
    }
}

function OutShapeHandler(e) {
    selectedID = null;
}

function MouseSelect(e) {
    if (selectedID != null) {
        var dealerDiv = document.getElementById("DealerDiv_" + selectedID);
        if (dealerDiv != null) {
            SelectDealer(dealerDiv);
        }
    }
}

function GetMap() {
    map = new VEMap('DealerMapDiv');
    map.LoadMap();
    map.SetScaleBarDistanceUnit(VEDistanceUnit.Kilometers);
    AddDealersToMap();
    SetDefaultDealer();
    
        
    map.AttachEvent("onclick", MouseSelect);
    map.AttachEvent("onmouseover", OverShapeHandler);
    map.AttachEvent("onmouseout", OutShapeHandler);
}

function AddDealersToMap() {

    var dealers = GetDealers();
    if (dealers != null) {
        for (var i = 0; i < dealers.length; i++) {
            if (dealers[i].name != "default")
                AddPushpin(dealers[i]);
        }
    }

}

function SetDefaultDealer() {
    var dealers = GetDealers();
    var selectedDealerId = GetSelectedDealer();
    
    if (selectedDealerId != null) {
        for (var i = 0; i < dealers.length; i++) {
            if (dealers[i].id == selectedDealerId) {

                var dealerDiv = document.getElementById("DealerDiv_" + selectedDealerId);
                if (dealerDiv != null) {
                    SelectDealer(dealerDiv);
                }
                break;
            }
        }   
    }
    else {
        var defaultDealer = null;
        if (dealers != null && dealers.length > 0) {
            for (var i = 0; i < dealers.length; i++) {
                if (dealers[i].name == "default") {
                    defaultDealer = dealers[i];
                }
            }
            if (defaultDealer == null)
                defaultDealer = dealers[0];
        }

        if (defaultDealer != null)
            DoCenterZoom(defaultDealer.latitude, defaultDealer.longitude, defaultDealer.zoomlevel);
    }
    
    
}

function SelectDealer(dealerDiv) {

    if (dealerDiv != null) {

        var listDiv = document.getElementById("DealerListDiv");

        //Unselect all in list (changing css class)
        for (i = 0; i < listDiv.childNodes.length; i++) {
            for (j = 0; j < listDiv.childNodes[i].childNodes[1].childNodes.length; j++) {
                listDiv.childNodes[i].childNodes[1].childNodes[j].className = "DealerListItem";
            }
        }
        //Set selected css class
        dealerDiv.className = "DealerListItemSelected";
        
        //Find dealer and zoom in dealer on map
        var dealerid = dealerDiv.id.substring(10);  //ID always starts with "DealerDiv_" (10 chars)
        var dealers = GetDealers();
        for (i = 0; i < dealers.length; i++) {

            if (dealers[i].id == dealerid) {
                DoCenterZoom(dealers[i].latitude, dealers[i].longitude, dealers[i].zoomlevel);
                break;
            }
        }

        StoreSelectedDealer(dealerid);
    }

}

