$(function() {
	
// INDEX MOSAIC
// ===================================
	
	// Init
	// ===========================
	$("#mosaic li").each(function() {
		$(this).find("div").hide();
		var $magazineImg = $(this).find( "img" );
		$(this).find("a").append( '<img src="' + $magazineImg.attr("src") + '" alt="' + $magazineImg.attr("alt") + '" width="120" height="160" style="display: none" />' );
	});

	// Animation
	// ===========================
	$("#mosaic li").hover( function() {
		$(this).css({ zIndex: "10" }).addClass('hover')
			.find("a").stop().animate({width: "120px", height: "160px"}, 150, function() {
				$(this).find("img").eq(1).fadeIn(250);
				$(this).parent().find("div").fadeIn(50);
			});
	}, function() {
		$(this).css({ zIndex: "1" }).removeClass('hover')
			.find("img").eq(1)
				.fadeOut(100)
			.parent()
				.stop().animate({width: "78px", height: "104px"}, 100)
			.parent().find("div")
				.hide();
	});

	// Replacement
	// =============================
	var visiblePositions = 18;
	var hiddenPositions = $("#mosaic li.screenrdr").length;
	
	randPosChange = function() {
		var randVisiblePos = Math.floor( Math.random()*visiblePositions );
		var randHiddenPos = Math.floor( Math.random()*hiddenPositions );
		
		if ( ! $("#mosaic li").eq( randVisiblePos ).hasClass("hover") ) {
			var visibleHtmlBuffer = $("#mosaic li").eq( randVisiblePos ).html();
			var hiddenHtmlBuffer = $("#mosaic li.screenrdr").eq(randHiddenPos).html();
			
			$("#mosaic li").eq( randVisiblePos ).fadeOut(750, function() {
				$("#mosaic li").eq( randVisiblePos ).html( hiddenHtmlBuffer );
				$("#mosaic li.screenrdr").eq(randHiddenPos).html( visibleHtmlBuffer );
				$(this).fadeIn(500);
			});
			
			//$("#mosaic li").eq( randVisiblePos ).html( $("#mosaic li.screenrdr").eq(randHiddenPos).html() );
			//$("#mosaic li.screenrdr").eq(randHiddenPos).html( mosaicHtmlBuffer );
		}
		setTimeout( function() { randPosChange() }, 5000 );
	}
	
	if ( hiddenPositions ) {
		setTimeout( function() { randPosChange() }, 5000 );
	}
	
// Navigation select
// =============================
	$("div.navselect").each(function() {
		var optionsHTML = '<select><option>' + $(this).find("h3").html() + '</option>';
		$(this).find("a").each(function() {
			optionsHTML += '<option value="' + $(this).attr('href') + '"' + ( $(this).parent().hasClass('sel') ? 'selected="selected"' : '' ) + '>' + $(this).html() + '</option>';
		});
		optionsHTML += "</select>";
		
		$(this)
			.find("h3")
				.addClass('screenrdr')
			.end().find("ul")
				.addClass('screenrdr');
		$(this).append( optionsHTML ).find("select")
			.change(function() {
				window.location.href = $(this).val();
			});
	});
	
// GALLERY
// =================================
	if ( $().scrollable ) {
		var actIndex = 0;
		
		var scrollableObj = $("div.scrollable > div").scrollable({
			size: 3,
			api: true
		});
		
		$("div.scrollable ul a").click(function(e) {
			e.preventDefault();
			$(this)
				.parent()
					.siblings("li.sel")
						.removeClass("sel")
					.end()
				.addClass("sel");

			$("div.bigpic img").fadeTo("normal", 0.5);
			var $trigger = $(this);
			var img = new Image();
			img.onload = function() {
				$("div.bigpic img").fadeTo("normal", 1).attr("src", $trigger.attr("href"));
				$("div.bigpic p").html( $trigger.find("img").attr("alt") );
			};
			img.src = $(this).attr("href");
		});
		
		$("div.bigpic a.prevPic").click(function(e) {
			e.preventDefault();
			actIndex = $("div.scrollable li").index( $("div.scrollable li.sel").get(0) );
			
			if ( actIndex ) {
				$("div.scrollable ul a").eq( actIndex-1 ).click();
				scrollableObj.prev();
			}
		});
		
		$("div.bigpic a.nextPic").click(function(e) {
			e.preventDefault();
			actIndex = $("div.scrollable li").index( $("div.scrollable li.sel").get(0) );
			
			if ( actIndex < $("div.scrollable li").length - 1 ) {
				$("div.scrollable ul a").eq( actIndex+1 ).click();
				scrollableObj.next();
			}
		});
	}
	
});