function loadGPSLocations(data, responseCode) {
    if (data.length == 0) {
        document.getElementById('messages').innerHTML = 'There is no tracking data to view.';
    }
    else {
        if (GBrowserIsCompatible()) {

        	// create list of GPS data locations from our XML
            var xml = GXml.parse(data);

            // markers that we will display on Google map
            var markers = xml.getElementsByTagName("locations");

            // create new map and add zoom control and type of map control
	        var map = new GMap2(document.getElementById("map"));
	        map.addControl(new GSmallMapControl());
	        map.addControl(new GMapTypeControl());

	        // center map on our first marker
	        map.setCenter(new GLatLng(parseFloat(markers[0].getAttribute("latitude")),
	                                  parseFloat(markers[0].getAttribute("longitude"))), 11);

     		// interate through all our GPS data, create markers and add them to map
	        for (var i = 0; i < markers.length; i++) {
		        var point = new GLatLng(parseFloat(markers[i].getAttribute("latitude")),
	                                    parseFloat(markers[i].getAttribute("longitude")));

		        var marker = createMarker(point,
		                     markers[i].getAttribute("speed"),
		                     markers[i].getAttribute("direction"),
		                     markers[i].getAttribute("distance"),
		                     markers[i].getAttribute("locationMethod"),
		                     markers[i].getAttribute("gpsTime"));

				// add markers to map
		        map.addOverlay(marker);
	        }
        }
    }
}

function createMarker(point, speed, direction, distance, locationMethod, gpsTime) {
    var icon = new GIcon();
    icon.image = "images/coolblue_small.png";
    icon.shadow = "images/coolshadow_small.png";
    icon.iconSize = new GSize(12, 20);
    icon.shadowSize = new GSize(22, 20);
    icon.iconAnchor = new GPoint(6, 20);
    icon.infoWindowAnchor = new GPoint(5, 1);

    var marker = new GMarker(point,icon);

	// this describes how we got our location data, either by satellite or by cell phone tower
    var lm = "";
    if (locationMethod == "8") {
        lm = "Cell Tower";
    } else if (locationMethod == "327681") {
        lm = "Satellite";
    } else {
        lm = locationMethod;
    }

	// this creates the pop up bubble that displays info when a user clicks on a marker
    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(
        "<table border=0 style=\"font-size:95%;font-family:arial,helvetica,sans-serif;\">"
        + "<tr><td align=right>&nbsp;</td><td>&nbsp;</td><td rowspan=2 align=right>"
        + "<img src=images/" + getCompassImage(direction) + ".jpg alt= />"
        + "</td></tr>"
        + "<tr><td align=right>Speed:</td><td>" + speed +  " mph</td></tr>"
        + "<tr><td align=right>Distance:</td><td>" + distance +  " mi</td><td>&nbsp;</td></tr>"
        + "<tr><td align=right>Time:</td><td colspan=2>" + gpsTime +  "</td></tr>"
        + "<tr><td align=right>Method:</td><td>" + lm + "</td><td>&nbsp;</td></tr>"
        + "</table>"
        );
    });

    return marker;
}

// this chooses the proper image for our litte compass in the popup window
function getCompassImage(azimuth) {
    if ((azimuth >= 337 && azimuth <= 360) || (azimuth >= 0 && azimuth < 23))
            return "compassN";
    if (azimuth >= 23 && azimuth < 68)
            return "compassNE";
    if (azimuth >= 68 && azimuth < 113)
            return "compassE";
    if (azimuth >= 113 && azimuth < 158)
            return "compassSE";
    if (azimuth >= 158 && azimuth < 203)
            return "compassS";
    if (azimuth >= 203 && azimuth < 248)
            return "compassSW";
    if (azimuth >= 248 && azimuth < 293)
            return "compassW";
    if (azimuth >= 293 && azimuth < 337)
            return "compassNW";

    return "";
}