﻿/*

    Javascript for Google Maps API 3 to show local produce suppliers
    

*/

// Global info window
var infowindow;


// Main Google Map initialisation
function load() {

// Initialise the map at the coordinates of the Mile Farm Shop
    var latlng = new google.maps.LatLng(53.93992190958113, -0.7748450708557075);

// Set other map options
    var myOptions = {
        zoom: 9,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);





// Get the local produce markers
// Make the URL unique with dummy parameter to stop caching if necessary
    downloadUrl("milefarmshop/xml/localproduce.xml", function(data) {
        var xml = parseXml(data);
        var markers = xml.documentElement.getElementsByTagName("marker");
//        alert(markers.length);
        for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("name");
            var produce = markers[i].getAttribute("produce");
            var point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
            var html = "<strong>" + name + "</strong><br />" + produce;

            // Add the marker
            addMarker(map, point, name, produce,i);

        }
    });



    // Add the Mile Farm Shop - as an icon to make it stand out
    var flag = 'milefarmshop/images/artwork/flag.png';
    var flagmarker = new google.maps.Marker({ position: latlng, map: map, title: "The Mile Farm Shop", icon: flag, zIndex:99 });



}



// Add the marker plus a listener for the infowindow
function addMarker(map, latlng, title, info,z) {
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: title,
        zIndex:z,
        flat:false,
        visible:true
    });

//    alert(title);

// Now add the listener for the infowindow
    google.maps.event.addListener(marker, 'click', function() {

        // Create a new info window if we don't already have one
        if (!infowindow) { infowindow = new google.maps.InfoWindow(); }

        // Set the infowindow properties        
        infowindow.setContent("<strong>" + title + "</strong><br />" + info);
        infowindow.open(map, marker);
    });

}



// Function to load XML map data
function downloadUrl(url, callback) {
    var request = window.ActiveXObject ?
     new ActiveXObject('Microsoft.XMLHTTP') :
     new XMLHttpRequest;

    request.onreadystatechange = function() {
        if (request.readyState == 4) {
            request.onreadystatechange = doNothing;
            callback(request.responseText, request.status);
        }
    };
    request.open('GET', url, true);
    request.send(null);
}




// Parse the XML data
function parseXml(str) {
    if (window.ActiveXObject) {
        var doc = new ActiveXObject('Microsoft.XMLDOM');
        doc.loadXML(str);
        return doc;
    } else if (window.DOMParser) {
        return (new DOMParser).parseFromString(str, 'text/xml');
    }
}

function doNothing() { }
