var poiDisplaying = false;
//var poiListener = null;
var arrLatitude = new Array();
var arrLongitude = new Array();
var strLocation = new Array();
var strImageLocation = new Array();
var strUrlFormat = null;
var innerBubbleDiv = null;
//var _PANO_IMAGES_URL_POI = "http://localhost/360/pano_images";
var _PANO_IMAGES_URL_POI = "http://maps.afrigis.co.za/StreetView/pano_images/POI360";
//var _AfriGISEyeWS_URL = "http://maps.afrigis.co.za/AfriGISEyeWS/Ashx/";
var oResults = null;
var oMarker = new Array();
var oMarkerListener = new Array();
var objInfoWindowOpt = null;
var windowWidth = 500, windowHeight = 400;
var AfriGISEyeCaller = "";

    function DisplayPOI()
    {
        if (!poiDisplaying)
        {
            //g_map.centreAndScale(new AGCoord(-25.761774, 28.04772), 11);
            //AGEvent.addListener(g_map, "onclick", function(oOverlay, oCoord){alert(oCoord.latitude() + ", " + oCoord.longitude() + ", " + g_map.getZoomLevel()); });
            poiDisplaying = true;
            document.getElementById("btnPOI").innerHTML = "Points (360) <img  border='0' src='images/Tick3.gif'/>";
            // add marker in point of interest
            /*
            arrLatitude = new Array(-25.775344,-25.741299,-25.752959,-25.75325,-25.755823,-25.750837,-25.755,-25.862592,-25.751377,-25.75323);
            arrLongitude = new Array(28.175987,28.211586,28.188701,28.223048,28.230868,28.236079,27.87194,28.248657,28.219936,28.18788);
            strLocation = new Array("Voortrekkermonument","Union Buildings","Transvaal Museum","Loftus Versfeld","University of Pretoria","Hatfield Square","Hartebeespoort Dam","Irene Village Mall","That's It Guest House","Pretoria City Hall");
            strImageLocation = new Array("001 Voortrekkermonument.jpg","002 Union Buildings.jpg","003 Transvaal Museum.jpg","004 Loftus Versfeld.jpg","005 University of Pretoria.jpg","006 Hatfield Square.jpg","007 Hartbeespoort Dam.jpg","009 Irene Village Mall.jpg","010 That's It Guest House.jpg","011 Pretoria City Hall.jpg");
            */
            
            objInfoWindowOpt = new AGInfoDisplayOptions();
            objInfoWindowOpt.width = windowWidth;
            objInfoWindowOpt.height = windowHeight;
            
            //GetAfriGISEyeResult(_AfriGISEyeWS_URL + "GetPOIHandler.ashx", "ParsePOIResult");
            AfriGISEyeCaller = "POI";
            GetAfriGISEyeResult("ashx/GetJSONAfriGISEyeInfo.ashx?CallPage=GetPOIHandler.ashx");
        }
        else
        {
            poiDisplaying = false;
            /*if (poiListener != null)
            {
                AGEvent.removeListener(poiListener);
            }*/
            g_map.removeGroupOverlay("POI");
            document.getElementById("btnPOI").innerHTML = "Points (360)";
        }
    }
    
    function ClickedPOIHandler(latitude, longitude)
    {     
        //var oCoord = this.getCoord();   
        //var latitude = oCoord.latitude();
        //var longitude = oCoord.longitude();
        var oCoord = new AGCoord(latitude, longitude);
        CentreInfoBubble(oCoord);
        // find out the corresponding index
        var index = 0;
        for(var i=0;i<arrLatitude.length;i++)
        {
            if(arrLatitude[i] == latitude && arrLongitude[i] == longitude)
            {
                index = i;
                break;
            }
                
        }
       
        innerBubbleDiv = document.getElementById("bubbleHeader");
        if(!innerBubbleDiv)
        {
            innerBubbleDiv = document.createElement("div");
            innerBubbleDiv.setAttribute("id", "bubbleHeader");
            document.body.appendChild(innerBubbleDiv);
        }
        innerBubbleDiv.innerHTML = "<span class='POITitle'>AfriGIS Eye - Points of Interest (360)</span><br /><span class='POIHeader'>" + strLocation[index] + "</span>";
              
        //oMarker[index].bindInfoDisplay(document.getElementById('poi_div'),objInfoWindowOpt);
        g_map.openInfoDisplay(oCoord, document.getElementById('bubbleHeader'), objInfoWindowOpt);

        strUrlFormat = "";
        strUrlFormat = "1|";
        strUrlFormat +=  arrLatitude[index]+"|";
        strUrlFormat += arrLongitude[index]+"|";
        strUrlFormat += strLocation[index]+"|";
        strUrlFormat += "Street|";
        strUrlFormat += _PANO_IMAGES_URL_POI+"/"+strImageLocation[index];
        
        setTimeout("initPOIFlash();",0);
    }
    
    // Method called by FlashObject - NB! Only implement here!
    function getFirstNode() {
		return strUrlFormat;
	}
	
	/*function initPOIFlash()
	{
	    var so = new SWFObject("EyeClient.swf", "pano", "500", "350", "9.0", "#FFFFFF");
	    so.addParam("allowFullScreen","true");
	    so.addParam("allowScriptAccess","always");
	    so.write('flashObject');
	}*/

	function initPOIFlash()
	{
	    ClearSwf();
        var checkDiv = document.getElementById("flashObject");
        if(!checkDiv)
        {
            var bubbleDiv = document.createElement("div");
            bubbleDiv.setAttribute("id", "flashObject");
            innerBubbleDiv.appendChild(bubbleDiv);
        }
        checkDiv = null;        
	
		swfobject.embedSWF("EyeClient.swf", "flashObject", "500", "350", "9.0.0");			
	}
		
	function ClearSwf() {
		var c = document.getElementById("flashObject");
		if(c) 
		{
			swfobject.removeSWF("flashObject");
			c=null;
		}
	}

    function GetAfriGISEyeResult(url)
    {
        //url += "?format=json&jsoncallback=?"; 
        //url += "&" + Math.random().toString();
        
        /*var script = document.createElement("script");
        script.setAttribute("src", url);
        script.setAttribute("type", "text/javascript");
        document.body.appendChild(script);*/
        //var obj = eval("({\"result\":[{\"Info\":\"Voortrekkermonument\",\"File\":\"001 Voortrekkermonument.jpg\",\"Lon\":28.175987,\"Lat\":-25.775344},{\"Info\":\"Union Buildings\",\"File\":\"002 Union Buildings.jpg\",\"Lon\":28.211586,\"Lat\":-25.741299},{\"Info\":\"Transvaal Museum\",\"File\":\"003 Transvaal Museum.jpg\",\"Lon\":28.188701,\"Lat\":-25.752959},{\"Info\":\"Loftus Versfeld\",\"File\":\"004 Loftus Versfeld.jpg\",\"Lon\":28.223048,\"Lat\":-25.75325},{\"Info\":\"University of Pretoria\",\"File\":\"005 University of Pretoria.jpg\",\"Lon\":28.230868,\"Lat\":-25.755823},{\"Info\":\"Hatfield Square\",\"File\":\"006 Hatfield Square.jpg\",\"Lon\":28.236079,\"Lat\":-25.750837},{\"Info\":\"Hartebeespoort Dam\",\"File\":\"007 Hartbeespoort Dam.jpg\",\"Lon\":27.87194,\"Lat\":-25.755},{\"Info\":\"Irene Village Mall\",\"File\":\"009 Irene Village Mall.jpg\",\"Lon\":28.248657,\"Lat\":-25.862592},{\"Info\":\"That\'s It Guest House\",\"File\":\"010 That\'s It Guest House.jpg\",\"Lon\":28.219936,\"Lat\":-25.751377},{\"Info\":\"Pretoria City Hall\",\"File\":\"011 Pretoria City Hall.jpg\",\"Lon\":28.18788,\"Lat\":-25.75323}]})");
        
        $.getJSON(url, 
            function(json)
            {
                if(AfriGISEyeCaller == "POI")
                    ParsePOIResult(json);
                if(AfriGISEyeCaller == "SVTowns")
                    ParseSVTownsResult(json);    
            });
    }
    
    function ParsePOIResult(json)
    {        
        if(json.result[0].Error == null)
        {            
            for(var i=0; i<json.result.length;i++)
            {
                strLocation[i] = json.result[i].Info;
                strImageLocation[i] = json.result[i].File;
                arrLongitude[i] = json.result[i].Lon;
                arrLatitude[i] = json.result[i].Lat;
                
                var oLatlng = new AGCoord(arrLatitude[i], arrLongitude[i]);            
                imgObj=document.createElement("div");
                imgObj.innerHTML = "<img src ='Images/afrigisEye16x16whiteMatte.png' title=\"" + strLocation[i] + "\" onclick='ClickedPOIHandler(" + oLatlng + ");'/>";
                var myHTMLOptions = new AGHTMLOverlayOptions(new AGPoint(-8, -8),new AGSize(26,26));
                var myHTMLOverlay = new AGHTMLOverlay(imgObj, oLatlng, myHTMLOptions);
                g_map.addOverlay(myHTMLOverlay, "POI");
                AGEvent.addListener(myHTMLOverlay, "onclick", HookClickedPOIHandler);
            }
            
            /*for(var i=0;i<arrLatitude.length;i++)
            {
                // --- Marker method (AGHTMLOverlay currently used)---                
                var icon = new AGIcon();
                icon.image = "Images/afrigisEye16x16whiteMatte.png";
                icon.iconSize = new AGSize(16, 16);
                icon.iconAnchor = new AGPoint(-8, -8);
                icon.shadow = "Images/transparent.gif";
                var defaultMarkerOption1 = new AGMarkerOptions(icon, true);
                
                oMarker[i] = new AGMarker(new AGCoord(arrLatitude[i], arrLongitude[i]),defaultMarkerOption1);
                g_map.addOverlay(oMarker[i], "POI");
                poiListener = AGEvent.bind(oMarker[i], "onclick", oMarker[i], ClickedPOIHandler);
                // --- Marker method (AGHTMLOverlay currently used)---
            }*/
                
        }
        else 
        {
            alert(json.result[0].Error);
        }
    }
    function HookClickedPOIHandler(ocoord,caller) {
        
        ClickedPOIHandler(ocoord.latitude(), ocoord.longitude());
    }
    function CentreInfoBubble(oCoord)
    {
        var curZoomLevel = g_map.getZoomLevel();
        if(curZoomLevel > 15)
        {
            g_map.centreAndScale(oCoord, curZoomLevel);
        }
        else
        {            
            g_map.centreAndScale(oCoord, 16);
            curZoomLevel = 16;
        }
        var curMapSize = g_map.getSize();
        //calculation to place POI info window in the centre of the current viewable map
        var newCoord = null;
        var curWidth = curMapSize.width;
        var curHeight = curMapSize.height;
        if ((curWidth - windowWidth) > 0 && (curHeight - windowHeight > 0))
        {
            var newX = parseInt((curWidth - (windowWidth + (curWidth*0.1)))/2); // add 10% to width (leftwards shift) to compensate for map controls
            var newY = parseInt((curHeight - (windowHeight + (curHeight*0.2)))/2); // add 20% to height (downwards shift) to compensate for the bubble's stem
            newCoord = g_map.getCoordFromVisibleArea(new AGPoint(curWidth-newX, newY));
        }
        else
        {
            newCoord = g_map.getBoundingBox().getNorthEast();
        }

        g_map.centreAndScale(newCoord, curZoomLevel);
    }