function shuffle(arr) {
	for(var rnd, tmp, i=arr.length; i; rnd=parseInt(Math.random()*i), tmp=arr[--i], arr[i]=arr[rnd], arr[rnd]=tmp);
}

jQuery.preloadImages = function()
{
  for(var i = 0; i<arguments.length; i++)
  {
    jQuery("<img>").attr("src", arguments[i]);
  }
}

$(document).ready(function() {
	$('.site-navigation a').hover(function () {
			$(this).parent().addClass('hover');
		}, function () {
			$(this).parent().removeClass('hover');
	});

	var imagePointsX = [24, 40, 72, 87, 116, 194, 199, 233, 250, 285, 307, 333, 363, 377, 413, 423, 504, 520, 546, 572, 595, 625, 650, 687, 705, 739, 751, 830, 840, 874, 896, 919, 952, 963];
	var imagePointsY = [73, 137, 69, 126, 62, 68, 126, 77, 138, 81, 142, 80, 137, 75, 125, 62, 61, 130, 71, 140, 76, 142, 77, 136, 70, 119, 56, 53, 120, 64, 135, 70, 140, 73];
	var imagePoints = [];
	
	var point = 0;
	for (point in imagePointsX) {
		imagePoints[point] = [imagePointsX[point], imagePointsY[point]];
	}
	
	var perchPoints = [];
	var pagePadding = 50;
	var pageWidth = $(document).width();
	var imageOffset = 0;
	var x = 0;
	var y = 0;
	
	while (imageOffset < pageWidth) {
		for (point in imagePoints) {
			x = imagePoints[point][0];
			y = imagePoints[point][1];
			
			if (pagePadding < x + imageOffset && x + imageOffset < pageWidth - pagePadding) {
				perchPoints.push([x + imageOffset, y]);
			}
		}
		imageOffset += 979;
	}
	shuffle(perchPoints);
	var birdCount = 0;
	var offsetX = 0;
	$('.comment-list li').each(function () {
		if ($('.comment-list li').index(this) < perchPoints.length) {
			if (perchPoints[birdCount][0]>(pageWidth/2)) {
				offsetX = 262;
				$(this).addClass('screen-right');
			} else {
				offsetX = 38;
				$(this).addClass('screen-left');
			}
			$(this).css("left", perchPoints[birdCount][0]-offsetX);
			$(this).css("bottom", 163-perchPoints[birdCount][1]);
			birdCount += 1;
		} else {
			$(this).addClass('hidden');
		}
	});
	
	// Format a message about the number of comments being displayed
	if (birdCount > 0) {
		commentDisplay = 'Displaying <strong>' + String(birdCount) + '</strong> of <strong>';
		commentDisplay += String($('.comment-list li').length) + '</strong> comments.';
		commentDisplay +=  ' Click a bird to view the comment.';
		commentPost = 'Post a comment'
	} else {
		commentDisplay = 'No comments to display.';
		commentPost = 'Post the first comment'
	}
	
	// Add the links to the comment instructions and action links
	$('.comments-instructions').add('.comments-actions').remove();
	content = '<div class="comments-instructions">' + commentDisplay + '</div>';
	content += '<ul class="comments-actions">';
	if (birdCount > 0) {
		content += '<li class="comments-list"><a class="comments-list">View all comments as a list</a></li>';
		content += '<li class="comments-first"><a class="comments-first">Jump to the first comment</a></li>';
	}
	content += '<li class="comments-post"><a class="comments-post">' + commentPost + '</a></li></ul>';
	$('.comments-title').after(content);

	
	// Bird click status
	var birdClickStatus = 0;  // 0 = unclicked, 1 = clicked
	
	// Click bindings for comments
	function birdClick(li) {
		if (birdClickStatus == 0) {
			$('.site-footer').addClass('bird-click');
		}
		birdClickStatus = 1;
		$('.comment-list li').removeClass('hover');
		$('.comment-list li').removeClass('click');
		$(li).addClass('click');
	}
	
	function birdUnclick() {
		birdClickStatus = 0;
		$('.site-footer').removeClass('bird-click');
		$('.comment-list li').removeClass('hover');
		$('.comment-list li').removeClass('click');
	}
	
	$('.site-footer').unbind('click').click(function(e) {
		if ($(e.target).is('.bird') && commentList == 0) {
			birdClick($(e.target).parent());
		} else if ($(e.target).is('.comment-next')) {
			birdClick($(e.target).parent().parent().parent().next().filter(':first'));
		} else if ($(e.target).is('.comment-prev')) {
			birdClick($(e.target).parent().parent().parent().prev().filter(':first'));
		} else if ($(e.target).is('.comments-first')) {
			birdClick($('.comment-list li:first'));
		} else {
			birdUnclick();
		}
	});
	
	// Hover over a bird
	$('.comment-list li .bird').hover(function () {
		if (birdClickStatus == 0 && commentList == 0) {
			$(this).parent().addClass('hover');
		}
	}, function () {
		$(this).parent().removeClass('hover');
	});

	// Comment form
	$('.comment-form').hide();
	$('.comments-post').toggle(function () {
		birdUnclick();
		$('.comments-post').children().text('Hide the comment form');
		$('.comment-form').show();
	}, function () {
		$('.comments-post').children().text(commentPost);
		$('.comment-form').hide();
	});

	var commentList = 0;
	// Comment list
	$('.comments-list').toggle(function () {
		commentList = 1;
		birdUnclick();
		// Wrap the number on the bird in a span so it can be hidden
		$('.bird').not('.nav-bird').each( function () {
			$(this).html('<span>' + $(this).text() + '</span>');
		});
		$('.comments-first').add('.comments-post').hide()
		$('.comments-instructions').text('Displaying all comments.');
		$('.comments-list').children().text('View comments on the wire');
		$('.comment-list').addClass('comments-all');
		$('.comment-form').show();
	}, function () {
		commentList = 0;
		// Unwrap the number on the bird so that the span does not interfere with the click action
		$('.bird').not('.nav-bird').each( function () {
			$(this).text($(this).children().text());
		});
		$('.comments-first').add('.comments-post').show()
		$('.comments-instructions').html(commentDisplay);
		$('.comments-list').children().text('View all comments as a list');
		$('.comment-list').removeClass('comments-all');
		$('.comment-form').hide();
	});
	
	//Preload images
	$.preloadImages(
		"http://media.mattyoder.com/images/birds/medium/green-left.png",
		"http://media.mattyoder.com/images/birds/medium/green-right.png",
		"http://media.mattyoder.com/images/birds/medium/orange-left.png",
		"http://media.mattyoder.com/images/birds/medium/orange-right.png",
		"http://media.mattyoder.com/images/birds/medium/purple-left.png",
		"http://media.mattyoder.com/images/birds/medium/purple-right.png",
		"http://media.mattyoder.com/images/birds/medium/red-left.png",
		"http://media.mattyoder.com/images/birds/medium/red-right.png",
		"http://media.mattyoder.com/images/birds/medium/yellow-left.png",
		"http://media.mattyoder.com/images/birds/medium/yellow-right.png",
		"http://media.mattyoder.com/images/comment/background-large.png",
		"http://media.mattyoder.com/images/comment/background.png",
		"http://media.mattyoder.com/images/comment/name-background-left.png",
		"http://media.mattyoder.com/images/comment/name-background.png",
		"http://media.mattyoder.com/images/comment/name-triangle.png",
		"http://media.mattyoder.com/images/triangle-left.png"
	);

});