var map;
var raceData;
var markers = new Array();
var tweets = new Array();
var raceLegs = new Array();

function initializeMap() {
    var latlng = new google.maps.LatLng(47.921264, -117.095008);
    var myOptions = {
        zoom: 10,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById('myMap'), myOptions);
}

$(document).ready(function () {
    var userAgent = navigator.userAgent;

    // setup the map
    initializeMap();

    //get list of runners
    $.getJSON('/json.aspx?get=runners',
			 function (runnerData) {
			     $('.runners').append('#templateRunner', runnerData, { rendered: onRunnerRendered });
			 }
		  );

    function onRunnerRendered(runner) {
        $('.linkRunner', runner.nodes).click(function () {
            // get runner stats
            $.getJSON('/json.aspx?get=runner&runnerID=' + runner.data.RunnerID + '&ran=' + Math.floor(Math.random() * 100001),
				    function (runnerData) {
				        $('#runnerStats').empty().append('#templateRunnerInfo', runnerData);
				        $('#runnerStats').dialog({ title: runnerData.Name, autoOpen: true });
				    }
				);

            return false;
        });
    }

    $('#runnerStats').dialog({
        width: '350px',
        resizable: false,
        show: 'fade',
        autoOpen: false
    });

    $('#about').dialog({
        title: 'Welcome to 24Feet.com',
        width: '500px',
        resizable: false,
        show: 'fade',
        autoOpen: false
    });

    // add click handlers
    $('#logo').click(function () {
        $('#about').dialog('open');

        return false;
    });

    // detect iphone and android devices
    if (userAgent.indexOf('iPhone') != -1 || userAgent.indexOf('Android') != -1) {
        // hide list of runners, just show stats
        $('#runnerInfo').hide();
        // mobile logo & adjust location
        $('#logo img').attr('src', '/images/24feet-mobile.png');
        $('#logo').css('left', '15px');
    }

    // round
    $('#runnerInfo').addClass('ui-corner-all');
    $('.runner').mouseenter(function () {
        this.addClass('ui-state-hover');
    });

    $('#stats').addClass('ui-corner-all');

    // initial map update
    updateMapAndStats();

    // setup interval for map updates
    setInterval(updateMapAndStats, 300000);

});

function updateMapAndStats() {
    // clear current markers
    var i = 0;
    for (i = 0; i < markers.length; i++) {
        markers[i].setMap(null);
    }

    for (i = 0; i < tweets.length; i++) {
	   tweets[i].setMap(null);
    }

    tweets = new Array();
    count = 0;

    // clear current polylines
    for (var i = 0; i < raceLegs.length; i++) {
        if (raceLegs[i])
            raceLegs[i].setMap(null);
    }

    $.getJSON('/json.aspx?get=raceupdate&' + 'msg=' + Math.floor(Math.random() * 100001),
	   function (data) {
		  raceData = data;

		  // important
		  $('.stats').empty();

		  if (raceData.TimeElapsedFormatted.indexOf('-') == -1) {
			 $('.stats').append('#templateStats', data);
		  } else {
			 $('.stats').append('#templateNoStart', data);
		  }

		  racePath = new Array();
		  for (var i = 1; i <= 36; i++) {
			 var polyColor = (i <= data.LastLeg) ? '#000' : '#11c';
			 var racePath = new google.maps.Polyline({
			     path: eval('leg' + i),
			     strokeColor: polyColor,
			     strokeOpacity: 0.6,
			     strokeWeight: 5
			 });

			 raceLegs[i] = racePath;

			 racePath.setMap(map);
		  }

		  // set map markers
		  setMarkers(map, pois, false);
	   }
    );

    function setMarkers(map, locations) {
	   markers = new Array();
	   for (var i = 0; i < locations.length; i++) {
		  var poi = locations[i];
		  var img = (poi[3] != 2) ? 'http://maps.google.com/mapfiles/ms/micons/yellow-dot.png' : 'http://maps.google.com/mapfiles/ms/micons/purple.png';

		  if (raceData.CurrentLeg == (i + 1)) {
			 img = '/images/location.gif';
		  }

		  var image = new google.maps.MarkerImage(img,
					 new google.maps.Size(32, 32),
					 new google.maps.Point(0, 0),
					 new google.maps.Point(16, 32));

		  var myLatLng = new google.maps.LatLng(poi[1], poi[2]);
		  markers[i] = new google.maps.Marker({
			 position: myLatLng,
			 map: map,
			 icon: image,
			 title: poi[0]
		  });

		  windowInfo(markers[i], i + 1);
	   }
    }

    function windowInfo(marker, leg) {
	   var infowindow = new google.maps.InfoWindow();

	   google.maps.event.addListener(marker, 'click', function () {
		  // get runner stats
		  $.getJSON('/json.aspx?get=leginfo&legnumber=' + leg,
				function (runnerData) {
					   infowindow.close();
					   infowindow.setContent('<div id="legInfo' + leg + '" style="z-index:5000;overflow:auto;width:340px;height:180px;"></div>');
					   infowindow.open(map, marker);
					   setTimeout(function() { $('#legInfo' + leg).append('#templateLegInfo', runnerData); }, 1000);
				    }
				);
	   });
    }

    var count = 0;

    $.getJSON('http://twitter.com/status/user_timeline/solarmatthew.json?count=50&since_id=98832444542820352&callback=?',
	   function (twitterData) {
	   	$.each(twitterData, function (key, tweet) {
	   		if (tweet.coordinates) {
	   			var img = 'images/tweet.png';

	   			var image = new google.maps.MarkerImage(img,
				  new google.maps.Size(32, 32),
				  new google.maps.Point(0, 0),
				  new google.maps.Point(16, 32));

	   			var dateFormatted = parseTwitterDate(tweet.created_at);
	   			var myLatLng = new google.maps.LatLng(tweet.coordinates.coordinates[1], tweet.coordinates.coordinates[0]);
	   			var marker = new google.maps.Marker({
	   				position: myLatLng,
	   				map: map,
	   				icon: image,
	   				title: 'Matt\'s Tweet'
	   			});

	   			tweets[count] = marker;
	   			count++;

	   			var infowindow = new google.maps.InfoWindow();

	   			google.maps.event.addListener(marker, 'click', function () {
	   				infowindow.close();
	   				infowindow.setContent('<b>Matt Tweeted:</b><br />' + tweet.text + '<br /><br /><i>' + dateFormatted + '</i>');
	   				infowindow.open(map, marker);
	   			});
	   		}
	   	});
	   }
    );

	   $.getJSON('http://twitter.com/status/user_timeline/mikecpeck.json?count=50&since_id=98832444542820352&callback=?',
	   function (twitterData) {
	   	$.each(twitterData, function (key, tweet) {
	   		if (tweet.coordinates) {
	   			var img = 'images/tweet.png';

	   			var image = new google.maps.MarkerImage(img,
				  new google.maps.Size(32, 32),
				  new google.maps.Point(0, 0),
				  new google.maps.Point(16, 32));
				  
	   			var myLatLng = new google.maps.LatLng(tweet.coordinates.coordinates[1], tweet.coordinates.coordinates[0]);
	   			var marker = new google.maps.Marker({
	   				position: myLatLng,
	   				map: map,
	   				icon: image,
	   				title: 'Mike\'s Tweet'
	   			});

	   			tweets[count] = marker;
	   			count++;
	   			
	   			var infowindow = new google.maps.InfoWindow();

	   			var dateFormatted = parseTwitterDate(tweet.created_at);
				 google.maps.event.addListener(marker, 'click', function () {
	   				infowindow.close();
	   				infowindow.setContent('<b>Mike Tweeted:</b><br />' + tweet.text + '<br /><br /><i>' + dateFormatted + '</i>');
	   				infowindow.open(map, marker);
	   			});
	   		}
	   	});
	   }
    );
}

function parseTwitterDate(text) {
	var newtext = text.replace(/(\+\S+) (.*)/, '$2 $1');
	var date = new Date(Date.parse(newtext)).toLocaleDateString();
	var time = new Date(Date.parse(newtext)).toLocaleTimeString();
	return date + ' • ' + time;

}