//<![CDATA[
var map;
var oBrowser = "IE";
var j = 0;
var k = 0;
var gmarkers = [];
var markerState;
var glPan = new GLayer("com.panoramio.all");
var i = 0;
var gpolys = [];
var gmarkerspoly = [];

    function ToggleTreeCategory(node)
    {
        var CategoryID = node.getValue();
		switch (CategoryID) {
			case "10":
				toggleLayer('pan', node.isChecked());
			break;
			default:
			    var parent = node.getParentTreeNode();
			    if (parent != null && parent.getValue() == "3")
			    {
			        togglePolyline(node.isChecked(), CategoryID/10);
			    }
			    else
			    {
    				toggleCategory(node.isChecked(), CategoryID);
			    }
			break;
		}
    }

// The allowed region which the whole map must be within
var allowedBounds = new GLatLngBounds(new GLatLng(55.71,-5.25), new GLatLng(55.924,-5));

      // If the map position is out of range, move it back
      function checkBounds() {
        // Perform the check and return if OK
        if (allowedBounds.contains(map.getCenter())) {
          return;
        }
        // It`s not OK, so find the nearest allowed point and move there
        var C = map.getCenter();
        var X = C.lng();
        var Y = C.lat();

        var AmaxX = allowedBounds.getNorthEast().lng();
        var AmaxY = allowedBounds.getNorthEast().lat();
        var AminX = allowedBounds.getSouthWest().lng();
        var AminY = allowedBounds.getSouthWest().lat();

        if (X < AminX) {X = AminX;}
        if (X > AmaxX) {X = AmaxX;}
        if (Y < AminY) {Y = AminY;}
        if (Y > AmaxY) {Y = AmaxY;}
        map.setCenter(new GLatLng(Y,X));
      }

    if(navigator.userAgent.indexOf("Firefox") != -1)
    {
        oBrowser = "FF";
    }

	function querystring(key) 
		{ 
			var value = null; 
			for (var j=0;j<querystring.keys.length;j++) { 
					if (querystring.keys[j]==key) { 
						value = querystring.values[j]; 
						break; 
					} 
			} 
			return value; 
		} 

	querystring.keys = new Array(); 
	querystring.values = new Array(); 

	function querystring_parse() { 
		var query = window.location.search.substring(1); 
		var pairs = query.split("&"); 

		for (var j=0;j<pairs.length;j++) { 
			var pos = pairs[j].indexOf('='); 
			if (pos >= 0) { 
				var argname = pairs[j].substring(0,pos); 
				var value = pairs[j].substring(pos+1); 
				querystring.keys[querystring.keys.length] = argname; 
				querystring.values[querystring.values.length] = value; 
			} 
		} 
	} 
	querystring_parse(); 

    var CatID = querystring("cid");

    function checkQS()
    {
        if (CatID != "" && CatID != null){
            hideAllLayers();
			toggleSingleLayer(CatID);
		}
	}

    function Map_Load()
    {
        if (window.GBrowserIsCompatible && GBrowserIsCompatible())
        {
            map = new GMap2(document.getElementById("map"));
            map.addControl(new GLargeMapControl());
	    map.addControl(new GMapTypeControl());
            //map.setUIToDefault();
            map.addMapType(G_PHYSICAL_MAP);
            map.setMapType(G_HYBRID_MAP);
	    // ====== Restricting the range of Zoom Levels =====
	    // Get the list of map types      
	    var mt = map.getMapTypes();
	    // Overwrite the getMinimumResolution() and getMaximumResolution() methods
	    for (var i=0; i<mt.length; i++) {
	    	mt[i].getMinimumResolution = function() {return 11;}
	  	mt[i].getMaximumResolution = function() {return 17;}
	    }
            map.setCenter(new GLatLng(55.824482, -5.115863), 11);
	    GEvent.addListener(map, "move", function() {
		checkBounds();
	    });
		    var callbacks = {}
		    map.addControl(
		        new DragZoomControl(
		        {},
		        {buttonStartingStyle: {background: '#FFF', paddingTop: '4px', paddingLeft: '4px', border:'1px solid black'},
		        //paddingBottom:"2px",fontFamily:"Verdana",fontSize:"12px",fontWeight:"bold",border:"1px solid gray",cursor:"pointer"},
		        buttonHTML: "<img title='Drag Zoom In' src='/DesktopModules/CategoryMap/images/zoomin.gif'>",
		        buttonStyle: {width:'27px', height:'25px'},
		        buttonZoomingHTML: 'Drag a region on the map (click here to reset)',
		        buttonZoomingStyle: {background:'white',width:'75px', height:'100%'},
		        backButtonHTML: "<img title='Zoom Back Out' src='/DesktopModules/CategoryMap/images/zoomout.gif'>",
		        backButtonStyle: {display:'none',marginTop:'5px',width:'27px', height:'25px'},
		        backButtonEnabled: true,
		        overlayRemoveTime: 1500},
		        callbacks),
		        new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(70,10)));
		    loadAllCategories();
		loadPolys();
        }
    }

    function loadAllCategories(){
		var XmlRequest = GXmlHttp.create();
		var sUrl = "/DesktopModules/CategoryMap/GetAllCategoryData.ashx";
		XmlRequest.open("GET", sUrl, true);
		XmlRequest.onreadystatechange = function () {
		switch (XmlRequest.readyState) {
			case 4:
				var dom;
					if(oBrowser == "FF") {
						var parser = new DOMParser();
						dom = parser.parseFromString(XmlRequest.responseText, "text/xml");
					}
					else if(oBrowser == "IE") {
						dom = GXml.parse(XmlRequest.responseText);
					}
				var markers = dom.getElementsByTagName("marker");
				for (var i=0;i<markers.length;i++) {
					var oItem = markers[i];
					var imgurl = oItem.getAttribute("imgurl");
					var lnk = oItem.getAttribute("lnk");
					var html = "<div class=\"Normal\" style=\"height:200px;width:350px;overflow:auto;margin:10px;\">";
					html += "<strong>" + oItem.getAttribute("oname") + "</strong><br />";
//					if(imgurl != "")
//					{
//					    html += "<br /><img src='"+imgurl+"' /><br /><br />";
//					}
					html += oItem.getAttribute("odetail");
//					if(lnk != "")
//					{
//					    html += "<br /><br /><a href=\""+lnk+"\" target=\"_blank\" />View details for "+oItem.getAttribute("oname")+"</a><br /><br />";
//					}
					html += "</div>";
					var htmlmax = "<div class=\"Normal\" style=\"margin:10px;\">";
					htmlmax += "<strong>" + oItem.getAttribute("oname") + "</strong><br />";
//					if(imgurl != "")
//					{
//					    htmlmax += "<br /><img src='"+imgurl+"' /><br /><br />";
//					}
					htmlmax += oItem.getAttribute("odetail");
//					if(lnk != "")
//					{
//					    htmlmax += "<br /><br /><a href=\""+lnk+"\" target=\"_blank\" />View details for "+oItem.getAttribute("oname")+"</a><br /><br />";
//					}
					htmlmax += "</div>";
					var point = new GLatLng(parseFloat(oItem.getAttribute("lat")), parseFloat(oItem.getAttribute("lng")));
                    var marker = createMarker(point, html, oItem.getAttribute("oname"), htmlmax, oItem.getAttribute("catid"), gmarkers.length);
                    map.addOverlay(marker);
			    }
			break;
			}
		}
	XmlRequest.send(null);
    }

    function loadPolys(){
		var XmlRequest = GXmlHttp.create();
		var sUrl = "/DesktopModules/CategoryMap/GetAllPolyData.ashx";
		XmlRequest.open("GET", sUrl, true);
		XmlRequest.onreadystatechange = function () {
		switch (XmlRequest.readyState) {
			case 4:
				var dom;
					if(oBrowser == "FF") {
						var parser = new DOMParser();
						dom = parser.parseFromString(XmlRequest.responseText, "text/xml");
					}
					else if(oBrowser == "IE") {
						dom = GXml.parse(XmlRequest.responseText);
					}
				var lines = dom.getElementsByTagName("line");
				for (var a=0;a<lines.length;a++) {
				    var title = lines[a].getAttribute("oname");
				    var imgurl = lines[a].getAttribute("imgurl");
                    var lnk = lines[a].getAttribute("lnk");
                    var catId = lines[a].getAttribute("catid");
                    var colour = lines[a].getAttribute("colour");
                    var id = lines[a].getAttribute("id");
					var htmlmax = "<div class=\"Normal\" style=\"margin:10px;\">";
					htmlmax += "<strong>" + lines[a].getAttribute("oname") + "</strong><br />";
//					if(imgurl != "")
//					{
//					    htmlmax += "<br /><img src='"+imgurl+"' /><br /><br />";
//					}
					htmlmax += lines[a].getAttribute("odetail");
//					if(lnk != "")
//					{
//					    htmlmax += "<br /><br /><a href=\""+lnk+"\" target=\"_blank\" />View details</a><br /><br />";
//					}
					htmlmax += "</div>";
				    var points = lines[a].getElementsByTagName("point");
					var pts = [];
					var firstPoint;
                    for (var i = 0; i < points.length; i++) {
                       firstPoint = new GLatLng(parseFloat(points[1].getAttribute("lat")), parseFloat(points[1].getAttribute("lng")));
                       pts[i] = new GLatLng(parseFloat(points[i].getAttribute("lat")), parseFloat(points[i].getAttribute("lng")));
                    }
                    var poly = createPoly(pts, htmlmax, title, gpolys.length, id, colour, catId);
                    map.addOverlay(poly);
                    if(catId ==3)
                    {
                        var marker = createPolyStartMarker(firstPoint, title, catId, gmarkerspoly.length);
                        map.addOverlay(marker);
                    }

			    }
				setTimeout("checkQS()",1500);
			break;
			}
		}
	XmlRequest.send(null);
    }

    function createPoly(pts, html, title, index, id, colour, catId) {
        var poly;
        switch(colour){
            case "#7f00ff00": //green
                poly = new GPolyline(pts,"#00FF00", 3);
            break;
            case "#7f0000ff": //red
                poly = new GPolyline(pts,"#FF0000", 3);
            break;
            default: //blue
                poly = new GPolyline(pts,"#0000FF", 3);
            break;
        }
        if (catId == 6 | catId == 7)
        {
            poly.type = catId;
        }
        else
        {
            poly.type = id;
        }
	    GEvent.addListener(poly,'click',function(para){
	        showDetails(html);
            document.getElementById("details-close").innerHTML = "<img alt=\"Close details\" onclick=\"closeDetails('"+index+"', 'p')\" onmouseout=\"this.style.cursor='default'\" onmouseover=\"this.style.cursor='pointer'\" src=\"/DesktopModules/CategoryMap/images/cross.gif\" border=\"0\" />";
	    });
	    GEvent.addListener(poly,'mouseover',function(){
	        this.overlay = new MapTooltip(this, title);
	        map.addOverlay(this.overlay);
	    });
	    GEvent.addListener(poly,'mouseout',function(){
	        map.removeOverlay(this.overlay);
	    });
        i++;
	    gpolys[i] = poly;
        return poly;
    }

    function createPolyStartMarker(point, title, categoryid, index) {
		var baseicon = new GIcon();
		baseicon.shadow = "/DesktopModules/CategoryMap/images/shadowIcon.png";
		baseicon.iconSize = new GSize(20, 20);
		baseicon.shadowSize = new GSize(29, 24);
		baseicon.iconAnchor = new GPoint(10, 10);
		baseicon.infoWindowAnchor = new GPoint(17, 2);
		baseicon.infoShadowAnchor = new GPoint(18, 25);
		
		var mySingleIcon = new GIcon(baseicon);
		mySingleIcon.image = "/DesktopModules/CategoryMap/images/"+categoryid+".png";

        var marker = new GMarker(point, {icon:mySingleIcon, title:title});
        marker.type = categoryid;
        gmarkerspoly[k] = marker;
        k++;
        return marker;
    }

    function createMarker(point,html,title,max,categoryid,index) {
		var baseicon = new GIcon();
		baseicon.shadow = "/DesktopModules/CategoryMap/images/shadowIcon.png";
		baseicon.iconSize = new GSize(20, 20);
		baseicon.shadowSize = new GSize(29, 24);
		baseicon.iconAnchor = new GPoint(10, 10);
		baseicon.infoWindowAnchor = new GPoint(17, 2);
		baseicon.infoShadowAnchor = new GPoint(18, 25);
		
		var mySingleIcon = new GIcon(baseicon);
		mySingleIcon.image = "/DesktopModules/CategoryMap/images/"+categoryid+".png";

        var marker = new GMarker(point, {icon:mySingleIcon, title:title});
        marker.type = categoryid;
        GEvent.addListener(marker, "click", function() {
            var zoom = map.getZoom();
	    var pixels = map.getCurrentMapType().getProjection().fromLatLngToPixel(new GLatLng(point.y, point.x), zoom);
	    var _y = pixels.y;
	    var _x = parseInt(pixels.x + 30);
	    var _point = map.getCurrentMapType().getProjection().fromPixelToLatLng(new GPoint(_x, _y), zoom);
	    map.panTo(new GLatLng(_point.lat(), _point.lng()))

            setMarkerIcons(index);
            if(markerState == 1 && marker.getIcon().image == "/DesktopModules/CategoryMap/images/clicked.png"){ // details are open
                closeDetails(index);
            }
            else { // details are closed
                showDetails(max);
                document.getElementById("details-close").innerHTML = "<img alt=\"Close details\" onclick=\"closeDetails('"+index+"', 'm')\" onmouseout=\"this.style.cursor='default'\" onmouseover=\"this.style.cursor='pointer'\" src=\"/DesktopModules/CategoryMap/images/cross.gif\" border=\"0\" />";
                marker.setImage("/DesktopModules/CategoryMap/images/clicked.png");
            }

          //marker.openInfoWindowHtml(html, {maxWidth:'200', maxContent:max});
        });
        gmarkers[j] = marker;
        j++;
        return marker;
      }

    function showDetails(html) {
        markerState = 1;
        document.getElementById('details-container').style.display = 'block';
	document.getElementById('details-container').style.visibility = 'visible';
        document.getElementById("tree-container").style.display = 'none';
        document.getElementById("tree-container").style.visibility = 'hidden';
        document.getElementById("details").innerHTML = html;
    }
    
    function closeDetails(index, type) {
        document.getElementById('details-container').style.display = 'none';
	document.getElementById('details-container').style.visibility = 'hidden';
        document.getElementById("tree-container").style.display = 'block';
        document.getElementById("tree-container").style.visibility = 'visible';
        document.getElementById("details").innerHTML = "";
        if(type == 'm')
        {
            gmarkers[index].setImage(gmarkers[index].getIcon().image);
            markerState = 0;
        }
    }
      
    function toggleCategory(checked,categoryid) {
        if (checked) {
            show(categoryid);
        } else {
            hide(categoryid);
        }
    }

    function show(categoryid) {
        if(categoryid == 3)
        {
            for (var i=0; i<gpolys.length; i++) {
                if ((gpolys[i].type == "6") | (gpolys[i].type == "7")) {
                    return;
                }
                else
                {
                    gpolys[i].show();
                    gmarkerspoly[i].show();
                }
            }
        }
        else if(categoryid == 5)
        {
            for (var i=0; i<gpolys.length; i++) {
                if ((gpolys[i].type == "6") | (gpolys[i].type == "7")) {
                    gpolys[i].show();
                }
            }
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid | gmarkers[i].type == "8") {
                    gmarkers[i].show();
                }
            }
        }
        else if(categoryid == 6 | categoryid == 7)
        {
            for (var i=0; i<gpolys.length; i++) {
                if (gpolys[i].type == categoryid) {
                    gpolys[i].show();
                }
            }
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid) {
                    gmarkers[i].show();
                }
            }
        }
        else
        {
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid) {
                    gmarkers[i].show();
                }
            }
        }
        //document.getElementById("cbCategory_"+categoryid).checked = true;
      }

      function hide(categoryid) {
        if(categoryid == 3)
        {
            for (var i=0; i<gpolys.length; i++) {
                if ((gpolys[i].type == "6") | (gpolys[i].type == "7")) {
                    return;
                }
                else
                {
                    gpolys[i].hide();
                    gmarkerspoly[i].hide();
                }
            }
        }
        else if(categoryid == 5)
        {
            for (var i=0; i<gpolys.length; i++) {
                if ((gpolys[i].type == "6") | (gpolys[i].type == "7")) {
                    gpolys[i].hide();
                }
            }
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid | gmarkers[i].type == "8") {
                    gmarkers[i].hide();
                }
            }
        }
        else if(categoryid == 6 | categoryid == 7)
        {
            for (var i=0; i<gpolys.length; i++) {
                if (gpolys[i].type == categoryid) {
                    gpolys[i].hide();
                }
            }
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid) {
                    gmarkers[i].hide();
                }
            }
        }
        else
        {
            for (var i=0; i<gmarkers.length; i++) {
                if (gmarkers[i].type == categoryid) {
                    gmarkers[i].hide();
                }
            }
        }
        //document.getElementById("cbCategory_"+categoryid).checked = false;
        map.closeInfoWindow();
      }

    function setMarkerIcons(index) {
        for (var i=0; i<gmarkers.length; i++) {
            if (i != index) {
           	gmarkers[i].setImage(gmarkers[i].getIcon().image);
           }
        }
      }

    function toggleLayer(layername, checked){
	if(checked){
		if(layername == "pan"){
			map.addOverlay(glPan);
		}
	}
	else {
		if(layername == "pan"){
    			map.removeOverlay(glPan);
		}
	}
    }

    function togglePolyline(checked,id) {
        if (checked) {
            showPoly(id);
        } else {
            hidePoly(id);
        }
    }

    function showPoly(id) {
        for (var i=0; i<gpolys.length; i++) {
            if (gpolys[i].type == id) {
                gpolys[i].show();
                gmarkerspoly[i].show();
            }
        }
    }

    function hidePoly(id) {
        for (var i=0; i<gpolys.length; i++) {
            if (gpolys[i].type == id) {
                gpolys[i].hide();
                gmarkerspoly[i].hide();
            }
        }
    map.closeInfoWindow();
    }
     
	//]]>