/*	soeu.js | SO.eu
**	Lodewijk Schutte | Low
**	v1.1 | 20100224
**	---------------------------------------------------------------------- */

/*	jQuery Shuffle
**	---------------------------------------------------------------------- */

(function($){

	$.fn.shuffle = function() {
		return this.each(function(){
			var items = $(this).children();
			return (items.length) ? $(this).html($.shuffle(items)) : this;
		});
	}
	
	$.shuffle = function(arr) {
		for(var j, x, i = arr.length; i; j = parseInt(Math.random() * i), x = arr[--i], arr[i] = arr[j], arr[j] = x);
		return arr;
	}
	
})(jQuery);


/*	Scalable backgrounds
**	---------------------------------------------------------------------- */

var SO = new Object;

SO.Flex = function(){
	
	/**
		CONFIGURATION:
		Define the size of our background image
	*/
	var bgImageSize = {
		width : 1152,
		height : 864
	};
	
	/**
		Declare and define variables
	*/ 
	var imageID = 'expando',
		tallClass = 'tall',
		wideClass = 'wide',
		$bgImage, $wrapper, img, url, imgAR;
		
	/**
		Are we dealing with ie6?
	*/
	var ie6 = ($.browser.msie && parseInt($.browser.version, 10) <= 6);
	
	/**
		Set up the action that happens on resize
	*/
	var resize = function() {
		var win = {
			height : $(window).height(),
			width : $(window).width()
		};

		// The current aspect ratio of the window
		var winAR = win.width / win.height;

		// Determine if we need to show the image and whether it needs to stretch tall or wide
		if (win.width < bgImageSize.width && win.height < bgImageSize.height) {
			$('body')
				.removeClass(wideClass)
				.removeClass(tallClass);
		} else if ((win.w < bgImageSize.width && win.height >= bgImageSize.height) || (winAR < imgAR)) {
			$('body')
				.removeClass(wideClass)
				.addClass(tallClass);
			// Center the image
			$bgImage.css('left', Math.min(((win.width - bgImageSize.width) / 2), 0));
		} else if (win.width >= bgImageSize.width) {
			$('body')
				.addClass(wideClass)
				.removeClass(tallClass);
			$bgImage.css('left', 0);
		}
		
		// Need to fix the height of the wrapper for IE6
		if (ie6) {
			$wrapper.css('height', win.height);
		}
	};
	
	return {
		
		/*
			Sets up the basic functionality
		*/
		initialize : function() {
			
			// No need for any of this if the screen isn't bigger than the background image
			if (screen.availWidth <= bgImageSize.width || screen.availHeight <= bgImageSize.height) {
				return;
			}
			
			// Parse out the URL of the background image and drop out if we don't have one
			url = $('body').css('background-image').replace(/^url\(("|')?|("|')?\);?$/g, '') || false;	
			if (!url || url === "none" || url === "") {
				return;
			}
			
			// Get the aspect ratio of the image
			imgAR = bgImageSize.width / bgImageSize.height;

			// Create a new image element
			$bgImage = $('<img />')
						.attr('src', url)
						.attr('id', imageID);
						
			// Create a wrapper and append the image to it.
			// The wrapper ensures we don't get scrollbars.
			$wrapper = $('<div></div>')
							.css({
								'overflow' : 'hidden',
								'width' : '100%',
								'height' : '100%',
								'z-index' : '-1'
							})
							.append($bgImage)
							.appendTo($('body'));
							
			// IE6 Doesn't do position: fixed, so let's fake it out.
			// We'll apply a class which gets used in the CSS to emulate position: fixed
			// Otherwise, we'll simply used position: fixed.
			if (ie6) {
				$wrapper.addClass('ie6fixed');
			} else {
				$wrapper.css({
					'position' : 'fixed',
					'top' : 0,
					'left' : 0
				});
			}
			
			// Set up a resize listener to add/remove classes from the body 
			$(window).bind('resize', resize);

			// Set it up by triggering a resize
			$(window).trigger('resize');
		}
	};
}();

SO.backgrounds = {
	current: 0,
	swap: function() {
		SO.backgrounds.current++;
		
		if (SO.backgrounds.current >= SO.images.length)
			SO.backgrounds.current = 0;
			
		$('body').css('background-image', 'url('+SO.images[SO.backgrounds.current]+')');
		$('#expando').attr('src', SO.images[SO.backgrounds.current]);
	},
	init : function() {
		SO.Flex.initialize();
		
		if (typeof SO.images != 'object') return;
		
		for (var i in SO.images) {
			var tmp = new Image();
			tmp.src = SO.images[i];
		}
		
		window.setInterval(SO.backgrounds.swap, SO.interval);
	}
};

$(document).ready(SO.backgrounds.init);

(function($){
	$(function(){
		$('div.images').each(function(){
			var that = this;
			$('a.thumb', this).click(function(e){
				e.preventDefault();
				$('img.main', that).replaceWith($('<img/>').addClass('main').attr('src', $(this).attr('href')));

			});
		});
	})
})(jQuery);


