﻿// JScript File
function ClearMapLabelStyles()
{
    var lbls = document.getElementsByTagName("label");
    var total = lbls.length - 1;
    
    for (i = 0; i <= total; i++)
    {
        lbls.item(i).className = "";
    }

}

function initialize() 
{
    if (GBrowserIsCompatible()) 
    {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        map.setUIToDefault();
    }
}

var m_intZoomLevel = 14;
var m_gmap = null;
var m_strCategory = '';

function DisplayMap(Address, ZoomLevel, CtlID, Category)
{
    if ( (Category != 'Attractions') && (Category != 'Monuments') )
    {
        ClearMapLabelStyles();
    }
    
    var cID = document.getElementById(CtlID);
    if (cID != null)
    {
        cID.className = "map-place-selected";
    }
    ShowMap(Address, ZoomLevel, Category);
}
        
function ShowMap(Address, ZoomLevel, Category)
{
    if (GBrowserIsCompatible()) 
    {
        
        m_intZoomLevel = ZoomLevel;
        m_strCategory = Category;

        // Create new geocoding object
        geocoder = new GClientGeocoder();
        
        // Retrieve location information, pass it to addToMap()
        geocoder.getLocations(Address, AddToMap);
    }    
}

function AddToMap(response)
{
    //var map = new GMap2(document.getElementById("map_canvas"));
    
    // Retrieve the object
    place = response.Placemark[0];

    // Retrieve the latitude and longitude
    point = new GLatLng(place.Point.coordinates[1],
                        place.Point.coordinates[0]);
                        
    LoadMap("../XML/GMapsData/tourist-cities-delhi.xml", "iconImagePath", point, m_intZoomLevel);

    // Center the map on this point
    //map.setCenter(point, m_intZoomLevel);
    
    /*
    // Add markers to the map
    // Create our "tiny" marker icon
    var tinyIcon = new GIcon();
    tinyIcon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
    tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
    tinyIcon.iconSize = new GSize(12, 20);
    tinyIcon.shadowSize = new GSize(22, 20);
    tinyIcon.iconAnchor = new GPoint(6, 20);
    tinyIcon.infoWindowAnchor = new GPoint(5, 1);

    // Set up our GMarkerOptions object literal
    markerOptions = { icon:tinyIcon };

    var strCords = GetPoints(response.name);
    
    for (var i = 0; i < strCords.length; i++) 
    {
        var pts = strCords[i].split(',');
        var point = new GLatLng(pts[0], pts[1]);
        map.addOverlay(new GMarker(point, markerOptions));
    }
    */
}

function GetPoints(Address)
{
    if (Address == 'Delhi, India')
    {
        var strCord = new Array();
        strCord[0]="28.656794,77.241873"; // Lal Qila
        strCord[1]="28.55389,77.260568"; // Lotus Temple
    }
    return strCord;
}

function h()
{
    alert('hello');
}







function LoadMap(xmlfile, imagepath, point, ZoomLevel)
{
    if (!GBrowserIsCompatible()) 
    {
        alert("Sorry, the Google Maps API is not compatible with this browser");
        return;
    }
	
    // create the map
    try 
    {
		if (m_gmap == null) 
		{
			var map = new GMap2(document.getElementById("map_canvas"));
			m_gmap = map;
		} 
		else 
		{
			var map = m_gmap;
			map.clearOverlays();
		}
        
        try 
        {
            var uiOptions = map.getDefaultUI();
            uiOptions.zoom.scrollwheel = false;
            map.setUI(uiOptions);
            map.setCenter(point, ZoomLevel); // set to center
        }
        catch (err) 
        {
        }
        if ( (m_strCategory != null) && (m_strCategory != '') )
        {
            ReadMapXMLData(map, xmlfile, GetGIcon());
        }
    }
    catch (err) 
    {
        alert(err);
    }
}

function GetGIcon()
{
    var tinyIcon = new GIcon();
    var imgPath = '';
    if (m_strCategory == 'Attractions')
    {
        imgPath = "../Images/GMap/Icons/iconb.png";
    }
    else if (m_strCategory == 'Monuments')
    {
        imgPath = "../Images/GMap/Icons/icong.png";
    }
    else //if (m_strCategory == 'Monuments')
    {
        imgPath = "../Images/GMap/Icons/iconr.png";
    }
    tinyIcon.image = imgPath;
    //tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
    tinyIcon.iconSize = new GSize(12, 20);
    tinyIcon.shadowSize = new GSize(22, 20);
    tinyIcon.iconAnchor = new GPoint(6, 20);
    tinyIcon.infoWindowAnchor = new GPoint(5, 1);

    // Set up our GMarkerOptions object literal
    markerOptions = { icon:tinyIcon };
    return tinyIcon;
}

function ReadMapXMLData(map, xmlFile, gicon)
{	
    if (xmlFile != null && xmlFile != "") 
    {   
        var xmlDoc = ImportXML(xmlFile);   
        //alert(xmlDoc.getElementsByTagName("marker"));
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");
        map.clearOverlays();

        for (var i = 0; i < markers.length; i++) 
        {
            // obtain the attribues of each marker
            var category = markers[i].getAttribute("category"); 
            //alert(category.toLowerCase == m_strCategory.toLowerCase);
            if (category.toLowerCase == m_strCategory.toLowerCase)
            {
                var lat = parseFloat(markers[i].getAttribute("lat"));
                var lng = parseFloat(markers[i].getAttribute("lng"));
                var point = new GLatLng(lat, lng);
                
                var name = markers[i].getAttribute("name");
                var website = markers[i].getAttribute("website");
                                        
                var image1 = markers[i].getAttribute("image");
                var desc = ''; //markers[i].getAttribute("districtDesc");
                
                //var show = markers[i].getAttribute("show");
                
                var html = GetHTML(name, website, image1, desc, category);
                
                // create the marker
                //if (show == null) 
                //{
                    var marker = createMarker(point, name, html, gicon, category);
                    map.addOverlay(marker);
                //}
            }
        }
    }
}





function ImportXML(XMLFile)
{
    var moz = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined');
    var ie = (typeof window.ActiveXObject != 'undefined');

    if (moz)
    {
        var xmlDoc = document.implementation.createDocument("","",null); 
        xmlDoc.async = "false";
        xmlDoc.load(XMLFile);
        return xmlDoc;
    }

    else if (ie)
    {
        var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";       
        xmlDoc.load(XMLFile);
        return xmlDoc;                                 
    }

    

}









function GetHTML(name, website, image, desc, category)
{
    var html = "<span style='margin-bottom: 20px;text-decoration: none;font-size: 1em;line-height: 16pt;word-spacing: 1pt;'>";
    
    html = html + "<table border='0'>";
    if (name == null) {
        name = "";
        
    }
    var namehtml = "";
    
    namehtml = "<a href='" + website + "' style='color:#986010'><b>" + name + "</b></a>";
    
    var imghtml = "";
    
    if (image != "" && image != null) {
        imghtml = "<img src='../Images/GMap/" + image + "' width=\"70\" border=\"0\" /><br/>";
    }
    
    if (imghtml != "") {
        html = html + "<tr>";
        html = html + "<td width='80px'>";
        html = html + imghtml;
        html = html + "</td>";
        html = html + "<td width='220' align='left'>";
        html = html + namehtml;
        html = html + "</td>";
        html = html + "</tr>";
    }
    else {
        html = html + "<tr>";
        html = html + "<td width='300'>";
        html = html + namehtml;
        html = html + "</td>";
        html = html + "</tr>";
    }
    
    html = html + "</table>";
    
    html = html + "</span>";
    
    return html;
}



function createMarker(point, name, html, gicon, category){
    var marker = new GMarker(point, {icon: gicon, title: name});
    // === Store the category and name info as a marker properties ===
    marker.mycategory = category;
    marker.myname = name;
    var opts = {
        maxWidth: 300
    };
    GEvent.addListener(marker, "click", function(){
        marker.openInfoWindowHtml(html, opts);
    });
    return marker;
}




/*
XML.load = function(url) {
    var xmldoc = XML.newDocument();
    xmldoc.async = false;  
    xmldoc.load(url);
    return xmldoc;  
  };


XML.newDocument = function(rootTagName, namespaceURL) {
    if (!rootTagName) rootTagName = "";
    if (!namespaceURL) namespaceURL = "";

    if (document.implementation && document.implementation.createDocument) {
        // This is the W3C standard way to do it
        return document.implementation.createDocument(namespaceURL, 
                       rootTagName, null);
    }
    else { // This is the IE way to do it
        // Create an empty document as an ActiveX object
        // If there is no root element, this is all we have to do
        var doc = new ActiveXObject("MSXML2.DOMDocument");

        // If there is a root tag, initialize the document
        if (rootTagName) {
            // Look for a namespace prefix
            var prefix = "";
            var tagname = rootTagName;
            var p = rootTagName.indexOf(':');
            if (p != -1) {
                prefix = rootTagName.substring(0, p);
                tagname = rootTagName.substring(p+1);
            }

            // If we have a namespace, we must have a namespace prefix
            // If we don't have a namespace, we discard any prefix
            if (namespaceURL) {
                if (!prefix) prefix = "a0"; // What Firefox uses
            }
            else prefix = "";

            // Create the root element (with optional namespace) as a
            // string of text
            var text = "<" + (prefix?(prefix+":"):"") + tagname +
                (namespaceURL
                 ?(" xmlns:" + prefix + '="' + namespaceURL +'"')
                 :"") +
                "/>";
            // And parse that text into the empty document
            doc.loadXML(text);
        }
        return doc;
    }
}; 

*/