/*
 * jQuery eXPanding Gallery plugin (xpg)
 *
 * Fier Concept & Design B.V. Utrecht
 * Auteur: G. Stevens
 *
 * versie: 0.34 -  9 Februari 2009 
 * 
*/

var oFontSize;
var oMarginTop;
var oMarginTopNum;
var oDivWidth; 
var oDivHeight;
var oDivWidthNum;
var oDivHeightNum ;
var oImgWidth;
var oImageWidthNum;
var oImgHeight;
var oImageHeightNum;
	
var mpx;
var mpx_img;
var mpx_fontSize;
var duration_in;
var duration_out;

// parameters for auto rotation
var timerId;
var stopped = false;

jQuery.fn.xpg = function(options) {
	var defaults = {
		mpx: 1.3,// multiplier for element size
		mpx_img: 1.3,// multiplier for contained image size
		mpx_fontSize: 2, // multiplier for font size
		duration_in: 300,
		duration_out: 300,
		auto: false
	};  
	// Extend our default options with those provided.
	var opts = jQuery.extend(defaults, options);
		
	
	mpx = opts['mpx'];
	mpx_img = opts['mpx_img'];
	mpx_fontSize = opts['mpx_fontSize'];
	duration_in = opts['duration_in'];
	duration_out = opts['duration_out'];	  
		
	oFontSize = jQuery(".element").css('font-size');
	oMarginTop = jQuery(".element").css('margin-top');
	oMarginTopNum = parseFloat(oMarginTop, 10);
	
	// Original dimensions of containing div
	oDivWidth = jQuery(".element").css('width');
	oDivHeight = jQuery(".element").css('height');
	oDivWidthNum = parseFloat(oDivWidth, 10);
	oDivHeightNum = parseFloat(oDivHeight, 10);
	
	// Original dimensions of image
	oImgWidth = jQuery(this).find(".element img.resize").css('width');
	oImageWidthNum = parseFloat(oImgWidth, 10);			
	oImgHeight = jQuery(this).find(".element img.resize").css('height');
	oImageHeightNum = parseFloat(oImgHeight, 10);					
	
	// Auto rotation
	if (opts['auto'] == true) {
		// Automatic rotation	
		slideSwitch();
		timerId = setInterval( "slideSwitch()", 2500 );						
	}

	// Attach hover event to each ".element" in container
	jQuery(this).find('.element').hover(function(e) {	
		// Als er een element is dat d.m.v. auto-ration omhoog is gekomen,
		// en het is niet het huidige element, laat dit element dan
		// zakken.
		var $active = jQuery('.xpg-container .active');
		if (!jQuery(this).hasClass('active')) {
			$active = jQuery('.xpg-container .element.active');
			shrink($active);
		}		
		grow(this);
		stopped = true;					
	}, function() {		
		shrink(this);
		stopped = false;		
	});		
	// Continue the chain without modifying this element
	return this;		  
};

function startAutoRotation() {
	stopped = false;		
}

function stopAutoRotation() {	
	var $active = jQuery('.xpg-container .active');
	jQuery($active)
	//stops the event from happening in case of an abrupt mouseOut
	.stop()
	.css('overflow', 'visible')	
	.find("img.resize").animate({
		height: oImgHeight, 
		width: oImgWidth
	}, { queue:false, duration:300 });	
}

function slideSwitch() {
	var $active = jQuery('.xpg-container .element.active');
	if (stopped == true) return;	
	if (!$active.length) {
		// no current active element, make first element active
		$active = jQuery('.xpg-container .element:first');
		grow($active);
		$active.addClass('active');
	} else {
		$next = $active.next();
		$next.addClass('active');
		$active.removeClass('active');			
		shrink($active);
		grow($next);				
	}		
}

function grow($element) {
	jQuery($element)		
	//stops the event from happening in case of an abrupt mouseOut
	.stop()
	.animate({
		 width: (oDivWidthNum * mpx) +'px',			 		 
		 marginTop: (oMarginTopNum / mpx) + 'px'
	},{ queue:false, duration:duration_out })		
	.css('overflow', 'visible')				
	.find("img.resize").animate({
		width: (oImageWidthNum * mpx_img) + 'px',
		height: (oImageHeightNum * mpx_img) + 'px'				
	}, { queue:false, duration:duration_in });	
	// Show caption
	var index = jQuery($element).index();	
	$(".caption li").hide().eq(index).show();
}

function shrink($element) {
	jQuery($element)
	//stops the event from happening in case of an abrupt mouseOut
	.stop()
	.animate({		
		width: oDivWidth,	
		marginTop: oMarginTop			 		 		
	},{ queue:false, duration:duration_in })				
	.css('overflow', 'visible')			
	.find("img.resize").animate({
		height: oImgHeight, 
		width: oImgWidth
	}, { queue:false, duration:duration_out });	
	$(".caption li").hide();
}