// JavaScript Document

var emailText = "enter email address";
var markersArray = [];
var currentInfoWindow;

$.preloadImages("/media/peelback-sprite.png");

$("document").ready(function() {

   $("#header dl.features dd").hide();
   $("#header dl.features dt").hide().filter(":first").addClass("current").show().next("dd").show();
   $.timer(8000, function (timer) {
       if ($("#header dl.features dt.current").nextAll("dt").filter(":first").size() == 0) {
           $("#header dl.features dt.current").fadeOut(500).next("dd").fadeOut(500);
           $("#header dl.features dt").filter(":first").fadeIn(500).addClass("current").next("dd").fadeIn(500);
       } else {
           $("#header dl.features dt.current").fadeOut(500).next("dd").fadeOut(500)
             .end().nextAll("dt").filter(":first").fadeIn(500).next("dd").fadeIn(500);
           $("#header dl.features dt.current").removeClass("current").nextAll("dt").filter(":first").addClass("current");
       }
   });   
   
   //hack - technically not valid XHTML in DOM
    $("div#peelback img").attr("frames", "7");

	$("div#peelback p").hide();
	$("div#peelback img").hide().fadeIn(1000,function() {
		$(this).addClass('animated-peelback-sprite');
	});
    $.timer(100, function (timer) {

        $("img.animated-peelback-sprite").each(function (i) {
            var numFrames = $(this).attr("frames");
            var top = String($(this).css("top"));
            var height = $(this).attr("height");
            var frameHeight = height / numFrames;
            top = top.split("p");
            top = top[0];
            top = top - frameHeight;
            if ((top * -1) / frameHeight >= (numFrames -1)) {
				$(this).removeClass('animated-peelback-sprite');
				$("div#peelback p").fadeIn(1000);
            }
            top = String(top) + 'px';
            $(this).css("top", top);
        });
    });
   
    if($("input.email-address").length > 0 && $("input.email-address").val().length == 0) {
        $("input.email-address").val(emailText);
    }
    
    $("input.email-address").focus(function() {
        if($("input.email-address").val() == emailText) {
            $("input.email-address").val("");
        }        
    }).blur(function() {
        if($("input.email-address").val().length == 0) {
            $("input.email-address").val(emailText);
        }    
    });
    
    $("#map-activities-select .year.default").addClass("selected");
    activityMapRender($("#map-activities-select .year.selected").text());
    $("#map-activities-select .year").click(function() {
        $("#map-activities-select .year").removeClass("selected");
        $(this).addClass("selected");
        activityMapRender($(this).text());
    });
   
});

function activityMapRender(selectedYear) {
    var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(43.95, -72.5),
        navigationControl: true,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.SMALL
        },
        mapTypeControl: false,
        scaleControl: true,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };
    var map = new google.maps.Map($("#map-activities").get(0), mapOptions);
    
    activityMapPlotLocations(map, selectedYear);
}
function activityMapPlotLocations(map, selectedYear) {
    
    var image = new google.maps.MarkerImage('/images/marker.png',
        new google.maps.Size(29, 34),
        new google.maps.Point(0,0),
        new google.maps.Point(14, 31));
    var shadow = new google.maps.MarkerImage('/images/marker-shadow.png',
        new google.maps.Size(33, 15),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 15));
    var shape = {
        coord: [1, 1, 1, 20, 18, 20, 18 , 1],
        type: 'poly'
    };
    
    jQuery.get("/xml/activity.xml", {}, function(data) {
        jQuery(data).find("marker").each(function() {
            
            var marker = jQuery(this);
            var activity = jQuery(this).find("activity");
            var location = marker.attr("name");
            var locationLat = marker.attr("lat");
            var locationLng = marker.attr("lng");
            var contentHtml;
            var activityInYearCount = 0;
            
            contentHtml = '<h3>' + location + '</h3>';
            contentHtml += '<ul>';
            
            $(activity).each(function (i) {
                var activityName = activity.find("name").eq(i).text();
                var activityUrl = activity.find("url").eq(i).text();
                var activityCount = activity.find("count").eq(i).text();
                var activityYear = activity.find("count").eq(i).attr("year");
                if (activityYear == selectedYear) {
                    var countLabel;
                    if (activityCount == 1) {
                        countLabel = " event";
                    } else {
                        countLabel = " events";
                    }
                    contentHtml += '<li>';
                    contentHtml += '<a href="' + activityUrl + '">';
                    contentHtml += activityName;
                    contentHtml += '</a>';
                    contentHtml += ' <span class="count">(' + activityCount + countLabel + ')</span>';
                    contentHtml += '</li>';
                    activityInYearCount++;
                }
            });
            contentHtml += '</ul>';
            if (activityInYearCount > 0) {
                var infowindow = new google.maps.InfoWindow({
                    content: contentHtml
                });
                var locationLatLng = new google.maps.LatLng(parseFloat(locationLat), parseFloat(locationLng));
                marker = new google.maps.Marker({
                    position: locationLatLng,
                    map: map,
                    shadow: shadow,
                    icon: image,
                    shape: shape,
                    title: location
                });
                markersArray.push(marker);
                google.maps.event.addListener(marker, 'click', function() {
                    if (currentInfoWindow) {
                        currentInfoWindow.close();
                    }
                    infowindow.open(map, marker);
                    currentInfoWindow = infowindow;
                });
            }
        });
    });
}