var INFOMEDIA_MAP = "./Infopedia_Map2.xml";

var FOLDER_NAME;

function readFoldersByIE()
{
    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");     
    xmlDoc.async = false; 
    xmlDoc.load(INFOMEDIA_MAP);
    var folders = xmlDoc.selectNodes("//Folder/name");
    FOLDER_NAME = new Array(folders.length);

    for(var i = 0; i < folders.length; i++)
    {        
        FOLDER_NAME[i] = new Array(2);
        FOLDER_NAME[i][0] = folders[i].text + "box";
        FOLDER_NAME[i][1] = folders[i].text;        
    }
}

function readFoldersByNotIE()
{
    var resolver = function(prefix){
        return (prefix == 'xmlns') ? 'http://earth.google.com/kml/2.1' : false;
    }
    
    var xmlDoc = document.implementation.createDocument("","PAYMENT",null);
    xmlDoc.async = false; 
    xmlDoc.load(INFOMEDIA_MAP);
    var folders = xmlDoc.evaluate("//xmlns:Folder/xmlns:name", xmlDoc, resolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);

    FOLDER_NAME = new Array(folders.snapshotLength);    

    for(var i = 0; i < folders.snapshotLength; i++)
    {  
        FOLDER_NAME[i] = new Array(2);        
        FOLDER_NAME[i][0] = folders.snapshotItem(i).textContent + "box";
        FOLDER_NAME[i][1] = folders.snapshotItem(i).textContent;
    }
}

function readFolders()
{
    if (window.ActiveXObject)
    {        
        readFoldersByIE();
    }
    else readFoldersByNotIE();
}

function createFolders()
{
    var html;
    var Column = 4;

    html = "<table>";

    for(var i = 0; i <= (11 - 1) / Column; i++)
    {
        html += "<tr>";

        for(var j = 0; j <= Column - 1; j++)
        {
            html += "<td width='" + (100 / Column) + "%'>";

            if(i * Column + j < FOLDER_NAME.length)
            {
                html += "<input type='radio' name='category' value='" + (i * Column + j) + "' id='" + FOLDER_NAME[i * Column + j][0] + "' onclick='radioclick(this,\"" + FOLDER_NAME[i * Column + j][1] + "\")' />";
                html += "<font style='font-size: 8pt; font-family: Arial;'>" + FOLDER_NAME[i * Column + j][1] + "</font>";
            }
            else
            {
                html += "&nbsp;";
            }

            html += "</td>";            
        }

        html += "</tr>";
    }

    html += "</table>";
    
    document.write(html);
}

var gmarkers = [];

// Creates a marker at the given point with the given number label
function createMarker(categoryName, point, name, description) {
    description = "<h3>" + name + "</h3>" + description
	var infoTabs = [new GInfoWindowTab(name, description)];
	
    var marker = new GMarker(point); 
	marker.title = name;
    marker.mycategory = categoryName;
	
	GEvent.addListener
	(
	    marker,
	    "click",
	    function()
	    {
	        marker.openInfoWindowTabsHtml(infoTabs);
	    }
    );
	
	gmarkers.push(marker);
    return marker;
}

// == a checkbox has been clicked ==
function radioclick(box,category)
{
    for (var i=0; i < gmarkers.length; i++)
    {
        if (gmarkers[i].mycategory == category)
        {
            gmarkers[i].isHide=false;
        }
        else
        {
            gmarkers[i].isHide=true;
        }
    }
    
    map.closeInfoWindow();
    // == rebuild the side bar
    makeSidebar();
}

//Represents a KML feed. Used internally by KMLHandler. 
function KMLFeed(map, url, title)
{
    this.map = map; 
    this.url = url; 
    this.overlays = new Object(); 
    // Triggers whenever the map is moved or zoomed. 
    // Also manually invoked when the feed is first created to initially populate 
    // the feed. 
    this.onMapChange = function()
    { 
        // Trigger fetching the new map 
        url = this.url; 

        // Read the data
        GDownloadUrl
        (
            url,
            function(kmldoc)
            {
                // var first = 1;
                var doc = GXml.parse(kmldoc);
                // Populate with elements in the updated feed 
                var categories = doc.documentElement.getElementsByTagName("Folder");
                for(var c = 0; c < categories.length; c++)
                {
                    catName = categories[c].getElementsByTagName("name");
                    catName = catName[0].childNodes[0].nodeValue;
                    var placemarks = categories[c].getElementsByTagName("Placemark");
                    for(var i = 0; i < placemarks.length; i++)
                    {
                        var coords = placemarks[i].getElementsByTagName("coordinates");
                        coords = coords[0].childNodes[0].nodeValue;
                        coords = coords.split(","); 
                        var point = new GPoint(parseFloat(coords[0]), parseFloat(coords[1]));

                        var name = placemarks[i].getElementsByTagName("name");
                        var description = placemarks[i].getElementsByTagName("description");
                        var marker = createMarker(catName, point, name[0].childNodes[0].nodeValue, description[0].childNodes[0].nodeValue);
                    }
                }

				var radiob = "";
                // var radiob=document.getElementById("Military Buildingsbox");
                // radiob.checked = true;
                // radioclick(radiob, "Military Buildings");
                if (title != "")
                {
                    var catestr = getcate(title);
                    if (catestr != "")
                    {
                        radiob=document.getElementById(catestr + "box");
                        //alert(catestr);
                        radiob.checked = true;
                        radioclick(radiob, catestr); 
                    }
                    showMarker(title);             
                }
                else
                {
                    radiob=document.getElementById(FOLDER_NAME[0][0]);
                    //alert(catestr);
                    radiob.checked = true;
                    radioclick(radiob, FOLDER_NAME[0][1]);
                }
            }
        );
    }
    
    //Fetch the feed for the first time 
    this.onMapChange(); 
} 

function getcate(title)
{
    if (title != "")
    {
        for (var i = 0; i < gmarkers.length; i++)
        {
            if (gmarkers[i].title == title)
            {
                return  gmarkers[i].mycategory;
            }
        }
    }

    return "";
}

function showMarker(title)
{
    if (title != "")
    {
        for (var i = 0; i < gmarkers.length; i++)
        {
            if (gmarkers[i].title == title)
            {
                map.addOverlay(gmarkers[i]);
                myclick(i);
            }
            else
            {
                map.removeOverlay(gmarkers[i]);
            }
        }
    }
}

function myclick(i)
{
    GEvent.trigger(gmarkers[i],"click");
}

// == rebuilds the sidebar to match the markers currently displayed ==
function makeSidebar()
{
    var html = '<div style="overflow: auto; height: 480px; width: 150px; font-size: 8pt; font-family: Arial;">';
    
    for (var i = 0; i < gmarkers.length; i++)
    {
        if (gmarkers[i].isHide == false)
        {
            var stitle = gmarkers[i].title.replace(/'/g,"\\'");
            html += '<a href="javascript:showMarker(\'' + stitle + '\')">' + gmarkers[i].title + '</a><br>';
        }
    }

    html += '</div>';
    document.getElementById("side_bar").innerHTML = html;
}

//A KMLHandler handles (fetching, updating) KML feeds for a map
function KMLHandler(map)
{
    this.map = map;
    this.feeds = [];
    this.addFeed = function(url, title)
    {
        //Add the feed to the feeds array
        this.feeds[url] = new KMLFeed(this.map, url, title);
    }

    this.removeFeed = function(url)
    {
        //Remove the feed from the feeds array
        this.feeds[url].destroy();
        delete this.feeds[url];
    }
}

function Load(title)
{
    if (GBrowserIsCompatible())
    {
        map = new GMap2(document.getElementById("map"));
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(1.3550,103.8250), 11);
        var khandler = new KMLHandler(map); 
        khandler.addFeed(INFOMEDIA_MAP, title);
    }
    else
    {
        alert("Sorry, the Google Maps API is not compatible with this browser");
    }
}

var map;

readFolders();