﻿// JScript File

var gMap;
var gInfoWindow;
var jogXMLHttpRequest;

// The jogMarkers array is an array of objects that describe the jog points
// to display on the map. Each object in the array has the following properties:
//      latitude        - decimal: latitude
//      longitude       - decimal: longitude
//      elapsedTime     - integer: elapsed time in milliseconds from the start of the jog
//      elapsedTimeMins - string: elapsed time display string, e.g. 0:28:35
//      pointType       - string: ptStart, ptStop, ptPause, ptResume ptInterval
//      marker          - GMarker: The map overlay object associated with this jog log
var jogMarkers = new Array();


function initGoogleMap() {
    var divMap = document.getElementById("divMap");
    if (divMap !== null) {
        var latLng = new google.maps.LatLng(0, 0);
        var mapOptions = {
            zoom: 1,
            center: latLng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        gMap = new google.maps.Map(divMap, mapOptions);
        gInfoWindow = new google.maps.InfoWindow();        
    }
}

function displayJog() {
    var i;
    var jogMarker;
    var point;    

    var blueIcon = "http://www.google.com/intl/en_us/mapfiles/ms/micons/blue-dot.png";
    var greenIcon = "http://www.google.com/intl/en_us/mapfiles/ms/micons/green-dot.png";
    var redIcon = "http://www.google.com/intl/en_us/mapfiles/ms/micons/red-dot.png";
                
    var markerIcon;

    var intervalSize;
    if (g_displayUnits === "duKm")
        intervalSize = 0.5;
    else
        intervalSize = 0.25;

    var nextInterval = intervalSize;


    var jogLogCoordinates = new Array();
    for (i = 0; i < jogMarkers.length; i++) {    
        jogMarker = jogMarkers[i];

        if ((jogMarker.latitude == 0) || (jogMarker.longitude == 0))
            continue;
            
        // Pick an icon based on the point type
        if (    (jogMarker.pointType === "s") ||
                (jogMarker.pointType === "r")) {
            markerIcon = greenIcon;
        }
        else if (   (jogMarker.pointType === "x") ||
                    (jogMarker.pointType === "p")) {
            markerIcon = redIcon;
        }
        else {
            markerIcon = blueIcon;
        }

        point = new google.maps.LatLng(jogMarker.latitude, jogMarker.longitude);
                          
        if ((jogMarker.pointType !== "r" /*Gap between pause/resume */)) {
            jogLogCoordinates[jogLogCoordinates.length] = new google.maps.LatLng(jogMarker.latitude, jogMarker.longitude);
        }

        var isIntervalCrossed = false;
        var distance;
        if (g_displayUnits === "duKm")
            distance = jogMarker.totalDistanceKm;
        else
            distance = jogMarker.totalDistanceMiles;

        isIntervalCrossed = distance >= nextInterval;
        if (isIntervalCrossed) {
            // Calculate the next interval (number of intervals crossed so far, times the interval size, plus the interval size to move to the next one)
            nextInterval = Math.floor(distance / intervalSize) * intervalSize + intervalSize;
        }

        var showMarker = ((jogMarker.pointType !== "i") || isIntervalCrossed);
        
        if (showMarker) {
            jogMarker.marker = new google.maps.Marker({
                position: point,
                map: gMap,
                icon: markerIcon
            });

            google.maps.event.addListener(jogMarker.marker, "click", function (event) {
                gInfoWindow.setContent(getBalloonHtml(this));
                gInfoWindow.setPosition(event.latLng);
                gInfoWindow.open(gMap);
            });                            
        }                                            
    }

    var polyline = new google.maps.Polyline({
        path: jogLogCoordinates,
        strokeColor: "#C000C0",
        strokeOpacity: 1.0,
        strokeWeight: 2.5
    });

    polyline.setMap(gMap);
          
    zoomAndCenterMap();
}

function getBalloonHtml(marker) {
    var i;
    var jogMarker;
    var result;

    result = "";    
    for (i = 0; i < jogMarkers.length; i++) {    
        jogMarker = jogMarkers[i];
        if (jogMarker.marker == marker) {
            result = "<table>";
            result += "<tr>";
            result += "  <td><b>Elapsed Time:</b></td><td>" + jogMarker.elapsedTimeMins + "</td>";
            result += "</tr>";

            result += "<tr>";
            result += "  <td><b>Distance:</b></td><td>";
            if (g_displayUnits === "duKm")
                result += jogMarker.totalDistanceKm.toFixed(2) + " km";
            else
                result += jogMarker.totalDistanceMiles.toFixed(2) + " mi";
            result += "  </td>";
            result += "</tr>";

            result += "<tr>";
            result += "  <td><b>Speed:</b></td><td>";
            if (g_displayUnits === "duKm")
                result += jogMarker.speedKmPerHour.toFixed(1) + " km/h";
            else
                result += jogMarker.speedMilesPerHour.toFixed(1) + " mph";
            result += "  </td>";
            result += "</tr>";

            result += "<tr>";
            result += "  <td><b>Pace:</b></td><td>";
            if (g_displayUnits === "duKm")
                result += jogMarker.paceMinutesPerKm.toFixed(1) + " min/km";
            else
                result += jogMarker.paceMinutesPerMile.toFixed(1) + " min/mi";
            result += "  </td>";
            result += "</tr>";

            result += "<tr>";
            result += "  <td><b>Elevation:</b></td><td>";
            if (g_displayUnits === "duKm")
                result += jogMarker.altitudeMeters.toFixed(1) + " m";
            else
                result += jogMarker.altitudeFeet.toFixed(1) + " ft";
            result += "  </td>";
            result += "</tr>";
            result += "</table>";

            break;
        }                
    }
    
    return result;
}

function doJogReadyStateChange() {    
	// only if XMLHttpRequest shows "loaded"
	if (jogXMLHttpRequest.readyState == READYSTATE_COMPLETE) {
		// only if "OK"
		if (jogXMLHttpRequest.status == 200) {
            //element.innerHTML = relatedXMLHttpRequest.responseText;
            //alert(jogXMLHttpRequest.responseText);
            initJogMarkers(jogXMLHttpRequest.responseXML);
            displayJog();
            stopAjaxLoader();
		}
		else {
			alert("There was a problem retrieving the jog:\n" + jogXMLHttpRequest.statusText);
		}
	}
}

function fetchJog(jogID, syncID) {
    jogXMLHttpRequest = CreateXMLHttpRequest(); 
	if (jogXMLHttpRequest != null) {    
	    var url = "JogXml.aspx?JogID=" + jogID + "&SyncID=" + syncID + "&MaxJogLogs=1000";
    	    
        startAjaxLoader();    	    
    	jogXMLHttpRequest.onreadystatechange = doJogReadyStateChange;		
	    jogXMLHttpRequest.open("GET", url, true); // asynchronous
	    jogXMLHttpRequest.send("");
    			    			
	    //doJogReadyStateChange();	// For synchronous calls, IE calls
									// onreadystatechange but Firefox does not
									// even if you set the onreadystatechange.
    }
}

function initJogMarkers(domDocument) {   
    // First check if the document contains
    var root = domDocument.documentElement;
    
    if (root.tagName == "error")
        alert(root.firstChild.nodeValue);
    else if (root.tagName == "Jog") { 
        // Get all of the JogLog elements    
        var jogLogs = domDocument.getElementsByTagName("jl");
        var jogLog;
        var iJogLog;
                    
        jogMarkers = new Array();      
        for (iJogLog = 0; iJogLog < jogLogs.length; iJogLog++) {
            jogLog = jogLogs[iJogLog];
            //alert(getChildElementValue(jogLog, "JogLogID"));

            var jogMarker = new Object();
            jogMarkers[iJogLog] = jogMarker;
            jogMarker.latitude = parseFloat(getChildElementValue(jogLog, "la"));
            jogMarker.longitude = parseFloat(getChildElementValue(jogLog, "lo"));
            jogMarker.elapsedTime = parseInt(getChildElementValue(jogLog, "et"));
            jogMarker.elapsedTimeMins = getChildElementValue(jogLog, "em");
            jogMarker.totalDistanceKm = parseFloat(getChildElementValue(jogLog, "dk"));
            jogMarker.totalDistanceMiles = parseFloat(getChildElementValue(jogLog, "dm"));
            jogMarker.speedKmPerHour = parseFloat(getChildElementValue(jogLog, "sk"));
            jogMarker.speedMilesPerHour = parseFloat(getChildElementValue(jogLog, "sm"));
            jogMarker.paceMinutesPerKm = parseFloat(getChildElementValue(jogLog, "pk"));
            jogMarker.paceMinutesPerMile = parseFloat(getChildElementValue(jogLog, "pm"));
            jogMarker.altitudeMeters = parseFloat(getChildElementValue(jogLog, "al"));
            jogMarker.altitudeFeet = parseFloat(getChildElementValue(jogLog, "af"));
            jogMarker.pointType = getChildElementValue(jogLog, "pt");            
        }
    }
    else
        alert("Unexpected response from server: " + root.tagName);
}

function zoomAndCenterMap() {
    // Pick a "nice" zoom level that contains all the points
    // and center on the middle of the jog.
    
    // Determine the bounding box of the jog logs
    var minLatitude = "";
    var minLongitude = "";
    var maxLatitude = "";
    var maxLongitude = "";
    var jogMarker;
       
    for (i = 0; i < jogMarkers.length; i++) {
        jogMarker = jogMarkers[i];

        if ((jogMarker.latitude == 0) || (jogMarker.longitutde == 0))
            continue;        
        
		if ((minLatitude === "") || (jogMarker.latitude < minLatitude)) 
			minLatitude = jogMarker.latitude;
		if ((minLongitude === "") || (jogMarker.longitude < minLongitude)) 
			minLongitude = jogMarker.longitude;
		if ((maxLatitude === "") || (jogMarker.latitude > maxLatitude)) 
			maxLatitude = jogMarker.latitude;
		if ((maxLongitude === "") || (jogMarker.longitude > maxLongitude)) 
			maxLongitude = jogMarker.longitude;
        
    }
    
    
    // Suggest a zoom level
    var suggestedZoomLevel = 0;
    var midLatitude = 0.0;
    var midLongitude = 0.0;
    
	if (	(minLatitude !== "") &&
			(minLongitude !== "") &&
			(maxLatitude !== "") &&
			(maxLongitude !== "")) {
		var width = maxLongitude - minLongitude;		
		var height = maxLatitude - minLatitude;

		if ((width > 200.0) || (height > 200.0))
		    suggestedZoomLevel = 0;
		else if ((width > 100.0) || (height > 100.0))
		    suggestedZoomLevel = 1;
		else if ((width > 75.0) || (height > 75.0))
		    suggestedZoomLevel = 2;
		else if ((width > 50.0) || (height > 50.0))
		    suggestedZoomLevel = 3;
		else if ((width > 25.0) || (height > 25.0))
		    suggestedZoomLevel = 4;
		else if ((width > 10.0) || (height > 10.0))
		    suggestedZoomLevel = 5;
		else if ((width > 4.0) || (height > 4.0))
		    suggestedZoomLevel = 6;
		else if ((width > 2.0) || (height > 2.0))
		    suggestedZoomLevel = 7;
		else if ((width > 0.75) || (height > 0.75))
		    suggestedZoomLevel = 8;
		else if ((width > 0.35) || (height > 0.35))
		    suggestedZoomLevel = 9;		    
		else if ((width > 0.15) || (height > 0.15))
		    suggestedZoomLevel = 10;
		else if ((width > 0.13) || (height > 0.13))
		    suggestedZoomLevel = 11;
		else if ((width > 0.05) || (height > 0.05))
		    suggestedZoomLevel = 12;
		else if ((width > 0.02) || (height > 0.02))
		    suggestedZoomLevel = 13;
		else if ((width > 0.0075) || (height > 0.0075))            
		    suggestedZoomLevel = 14;
		else
		    suggestedZoomLevel = 15;
			
		midLatitude = (minLatitude + ((maxLatitude - minLatitude) / 2));
		midLongitude = (minLongitude + ((maxLongitude - minLongitude) / 2));
	}
    
    /*alert(midLatitude);
    alert(midLongitude);
    alert(suggestedZoomLevel);*/
    gMap.setCenter(new google.maps.LatLng(midLatitude, midLongitude));
    gMap.setZoom(suggestedZoomLevel);
}

function startAjaxLoader() {
    var spanAjaxLoader = document.getElementById("ctl00_ContentPlaceHolder1_spanAjaxLoader");
    if (spanAjaxLoader != null) {
        spanAjaxLoader.style.display = "inline";
    }
}

function stopAjaxLoader() {
    var spanAjaxLoader = document.getElementById("ctl00_ContentPlaceHolder1_spanAjaxLoader");
    if (spanAjaxLoader != null) {
        spanAjaxLoader.style.display = "none";
    }
}

