/* START: History Timeline Functions (uses jquery) */
$(document).ready(function() {

    // shared
    var thumbWidth = 63;
    var visible = 7; // set this to 1 less than true value of 8, makes the nav math simpler later on

    // canada
    var cCurrent = 1;
    var cMaxCurrent;
    var cTotal;

    // usa + intl
    var uCurrent = 1;
    var uMaxCurrent;
    var uTotal;

	
	// initial states
	$('#canada #nav_left img').hide();
	$('#usa-intl #nav_left img').hide();
	
	// canada
	cTotal = $('#canada .thumb').length;
	cMaxCurrent = cTotal - visible;
	
	// usa + intl
	uTotal = $('#usa-intl .thumb').length;
	
	uMaxCurrent = uTotal - visible;
	
	$("div.timeline").delegate('div.arrow', 'click', function(e) {
		e.preventDefault();
		arrowClick($(this).parents('.timeline').attr('id'), this.id);
	});
	
	$("div.timeline").delegate('div.thumb', 'click', function(e) {
	    e.preventDefault();
		thumbClick($(this).parents('.timeline').attr('id'), this.id);
	});
	
	/**
	 * Handle clicks on arrows.
	 * @param conId id of container
	 * @param arrowId id of arrow
	 * @return 
	 */
	function arrowClick(conId, arrowId) {

		var numPlaces;
		var thisCurrent;
		var thisMaxCurrent;
		var thisTotal;
		
		if (conId == 'canada') {
			thisCurrent = cCurrent;
			thisMaxCurrent = cMaxCurrent;
			thisTotal = cTotal;
		} else if (conId == 'usa-intl') {
			thisCurrent = uCurrent;
			thisMaxCurrent = uMaxCurrent;
			thisTotal = uTotal;
		}

		if (arrowId == 'nav_left') { // left arrow 

			if (thisCurrent > 1) {

				// determine the number of thumbnails to advance
				if ( thisCurrent < 5 ) {
					numPlaces = thisCurrent - 1;
				} else {
					numPlaces = 2;
				}

				$('#' + conId + ' .thumbs').animate({ left: "+=" + (thumbWidth * numPlaces) }, 500, null, function() {});

				if (conId == 'canada') {
					cCurrent -= numPlaces;
				} else if (conId == 'usa-intl') {
					uCurrent -= numPlaces;
				}

				updateNavArrows(conId);	

			}

		} else { // right arrow

			if (thisCurrent < thisMaxCurrent) {

				// determine the number of thumbnails to advance
				if ( (thisTotal - (thisCurrent + visible)) < 4 ) {
					numPlaces = thisTotal - (thisCurrent + visible);
				} else {
					numPlaces = 2;
				}

				$('#' + conId + ' .thumbs').animate({ left: "-=" + (thumbWidth * numPlaces) }, 500, null, function() {});
				
				if (conId == 'canada') {
					cCurrent += numPlaces;
				} else if (conId == 'usa-intl') {
					uCurrent += numPlaces;
				}

				updateNavArrows(conId);

			}

		}

	}

	/**
	 * Handle clicks on thumbs.
	 * @param conId id of container
	 * @param thumbId id of thumb
	 * @return 
	 */
	function thumbClick(conId, thumbId) {

		var tmp = thumbId.substring(1);
		//console.log('thumb: ' + t);

		$('#' + conId + ' .current').fadeOut(null, function(){

			$('#' + conId + ' .current').addClass('entry');
			$('#' + conId + ' .current').removeClass('current');
			$('#' + conId + ' #' + tmp).addClass('current');
			$('#' + conId + ' #' + tmp).fadeIn();

		});

	}

	function updateNavArrows(c) {
		
		if (c == 'canada') {
			tmpCurrent = cCurrent;
			tmpMaxCurrent = cMaxCurrent;
		} else if (c == 'usa-intl') {
			tmpCurrent = uCurrent;
			tmpMaxCurrent = uMaxCurrent;
		}
		// hide the left nav arrow if there's nowhere to go
		if (tmpCurrent == 1) {
			$('#' + c + ' #nav_left img').hide();
		} else {
			$('#' + c + ' #nav_left img').show();
		}

		// hide the right nav arrow if there's nowhere to go
		if (tmpCurrent == tmpMaxCurrent) {
			$('#' + c + ' #nav_right img').hide();
		} else {
			$('#' + c + ' #nav_right img').show();
		}

	}
	
});

/* END: History Timeline Functions (uses jquery) */