var myMap;
var RevertOn = false;
var clickDisable = false;
function GetMap(MAPid, lat, lng) {
    myMap = new MQA.TileMap(document.getElementById(MAPid), 3, new MQA.LatLng(lat, lng), "map");
    // Create a new Large Zoom control
    myLZControl = new MQA.LargeZoomControl(myMap);
    //tell the map to display the control we just attached
    myMap.addControl(myLZControl, new MQA.MapCornerPlacement(MQA.MapCorner.TOP_LEFT, new MQA.Size(05, 25)));
    //Create a map view type control
    myVControl = new MQA.ViewControl(myMap);
    /*
    Display control - use the Corner placement constant to specify
    which corner, plus an MQA.Size object to specify X and Y "indent"
    offset
    */
    myMap.addControl(myVControl, new MQA.MapCornerPlacement(MQA.MapCorner.BOTTOM_RIGHT, new MQA.Size(20, 20)));
    DisplayPOI();
    SetEvents();
}

function DisplayPOI() {
    var arrLatLng = new Array();
    var latLon;
    var myIcon;
    var iconNo;
    var length = arrRestaurants.length;
    var nextIndex = 0;
    var contentHtml;
    var titleHTML;
    var stackCount = 1;
    var stackedRestaurantIndex = new Array();
    var stackExists = false;
    var stackedPOIHTML = "";
    
    myMap.getInfoWindow().setMinWidth(200);
    for (var i = 0; i < length; i++)
     {
        latLon = new MQA.LatLng(arrRestaurants[i].lat, arrRestaurants[i].lng);
        myPoint = new MQA.Poi(latLon);
        myIcon = new MQA.Icon("../../PublishingImages/poi.jpg", 19, 19);
        myPoint.setIcon(myIcon);
        var s = i + 1 + "";
        myPoint.setLabel(s); 
        myPoint.labelClass = "modmq-poi-label";
        myPoint.setLabelVisible(true);
        contentHtml = arrRestaurants[i].street + "<br/>" + arrRestaurants[i].address + "<br/>" + arrRestaurants[i].phone + "<br/><br/><a style='color:#000000;font-weight:normal;text-decoration: underline' title='' alt='' href='LocationLanding.aspx?RestaurantId=" + arrRestaurants[i].ID + "&Tab=1&OnlineEnabled=" + arrRestaurants[i].isonlineenabled + "'>" + drivingDirectionResource +"</a>";
        titleHTML = "<a style='color:#006643;font-weight:bold;text-decoration: underline' title='' alt='' href='LocationLanding.aspx?RestaurantId=" + arrRestaurants[i].ID + "&Tab=0&OnlineEnabled=" + arrRestaurants[i].isonlineenabled + "'>" + arrRestaurants[i].name + "</a>";
        
        myPoint.setValue('key', 'POI' + i);
        nextIndex = i + 1;
     	
     	if(nextIndex < length)
     	{
	     	if(arrRestaurants[i].lat == arrRestaurants[i+1].lat && arrRestaurants[i].lng == arrRestaurants[i+1].lng)
	     	{
	     		if(stackExists == false)
	     		{
	     			stackedRestaurantIndex.push(i);
	     			stackExists = true;
	     		}
	     		stackedRestaurantIndex.push(nextIndex);
	     		stackCount++;
	     		myPoint.setRolloverEnabled(false);
	     		myMap.addShape(myPoint);
		        arrLatLng.push(latLon);
	     		continue;
	     	}
     	}
     	
     	if(stackExists == true)
     	{
     		contentHtml = "";
     		for (var j = 0; j < stackCount; j++)
     		{
     			var index = stackedRestaurantIndex[j];
     			contentHtml = arrRestaurants[index].street + "<br/>" + arrRestaurants[index].address + "<br/>" + arrRestaurants[index].phone + "<br/><br/><a style='color:#000000;font-weight:normal;text-decoration: underline' title='' alt='' href='LocationLanding.aspx?RestaurantId=" + arrRestaurants[index].ID + "&Tab=1&OnlineEnabled=" + arrRestaurants[index].isonlineenabled + "'>" + drivingDirectionResource +"</a>" + "<br/><br/>";
        		titleHTML = "<a style='color:#006643;font-weight:bold;text-decoration: underline' title='' alt='' href='LocationLanding.aspx?RestaurantId=" + arrRestaurants[index].ID + "&Tab=0&OnlineEnabled=" + arrRestaurants[index].isonlineenabled + "'>" + arrRestaurants[index].name + "</a>";
        		
        		stackedPOIHTML += titleHTML + "<br/>" + contentHtml;
     		}
     		myPoint.setInfoTitleHTML("&nbsp;");
			myPoint.setInfoContentHTML(stackedPOIHTML);
     		stackExists = false;
     		stackCount = 1;
     		stackedPOIHTML = "";
     		stackedRestaurantIndex = new Array();
     	}
     	else
     	{
	     	myPoint.setInfoTitleHTML(titleHTML);
			myPoint.setInfoContentHTML(contentHtml);
		}
        myPoint.setRolloverEnabled(false);
        MQA.EventManager.addListener(myPoint,"mouseover",onMouseOver);
		MQA.EventManager.addListener(myPoint,"mouseout",onMouseOut);
        myMap.addShape(myPoint);
        arrLatLng.push(latLon);
    }
    myMap.bestFit();
}

function onMouseOver() {
    this.showInfoWindow()
}
function onMouseOut(e) {
    var info = myMap.getInfoWindow();
    info.hide();
    info.onClickedClosed(e);
}
function PrintMap() {
    myMap.showStaticMap();
    window.print();
    myMap.hideStaticMap();
}

function SetEvents() {
    MQA.EventManager.addListener(myMap, 'click', onMapClick);
    MQA.EventManager.addListener(myMap, 'zoomend', EnableRevert);
    MQA.EventManager.addListener(myMap, 'maptypechanged', EnableRevert);
    MQA.EventManager.addListener(myMap, 'moveend', EnableRevert);
    MQA.EventManager.addListener(myPoint, 'click', DoNothing);
}
function DoNothing(e) {
    clickDisable = true;
}
function onMapClick(e) {
    if (clickDisable == false) {
        //Re-centre and zoom
        myMap.setCenter(e.ll, myMap.getZoomLevel() + 1);
        EnableRevert();
    }
    clickDisable = false;
}

function EnableRevert() {
    var revertButton = document.getElementById('revertIcon');
    revertButton.className = "mqReverton";
    RevertOn = true;
}

function DisableRevert() {
    var revertButton = document.getElementById('revertIcon');
    revertButton.className = "mqRevert";
    RevertOn = false;
}

function RevertMap() {
    if (RevertOn) {
        var arrLatLng = new Array();
        var newCenterLL = new MQA.LatLng(arrRestaurants[0].lat, arrRestaurants[0].lng);
        arrLatLng.push(newCenterLL);
        myMap.bestFitLL(arrLatLng, true, 6, 11);
        myMap.setMapType("map");
        myMap.setCenter(newCenterLL);
        //disable Revert button       
        DisableRevert();
    }
}

function RevertHover() {
    if (RevertOn) {
        var revertButton = document.getElementById('revertIcon');
        revertButton.className = "mqReverton_hover";
    }
}

function RevertHoverOut() {
    if (RevertOn) {
        var revertButton = document.getElementById('revertIcon');
        revertButton.className = "mqReverton";
    }
}