/* =========================================================
// ivo.imagegallery.js
// Datum: 2007-08-15
// Firma: Spin Webdesign Curacao
// Autor: Ivo Lenting
// Mail: ivo.lenting@gmail.com
// Web: http://www.spin-webdesign.com
// Version 1.0

// BASES ON:
// jquery.innerfade.js
// Datum: 2007-01-29
// Firma: Medienfreunde Hofmann & Baldes GbR
// Autor: Torsten Baldes
// Mail: t.baldes@medienfreunde.com
// Web: http://medienfreunde.com
// based on the work of Matt Oakes http://portfolio.gizone.co.uk/applications/slideshow/
// Version 1.1



/*
How to use:

var smallImages = [];
smallImages.push('images/img_marriot_01.jpg');
smallImages.push('images/img_marriot_02.jpg');
smallImages.push('images/img_marriot_03.jpg');

var bigImages = [];
bigImages.push('images/img_marriot_01_big.jpg');
bigImages.push('images/img_marriot_02_big.jpg');
bigImages.push('images/img_marriot_03_big.jpg');

var settings = { 
	speed: 3000,   				 //TIME in miliseconds to fade
	timeout: 10000, 				//TIME in miliseconds to wait for next fade
	containerheight: 'auto', 			//CSS height of big image area
	nextimagebutton: 'nextimage', 		//id of the next button (without #)
	previousimagebutton: 'previousimage', 	//id of the previous buttons (without #)
	smallImages: smallImages, 		// all the small images in an array
	bigImages: bigImages, 			// all the big images in an array
	bigImageSection: 'galimage', 		//id of the section for the big image
	pagessection: 'menu_left_footer', 	//id of the section for the page numbers
	maxImages: 8 				//maximum number of pictures for a page
};	

//Always do the init on the id of the thumbnails section				
$('#thumbs').initGallery(settings);
*/


// ========================================================= */

(function($) {
var ELMS = [];

//General fade function from jquery innerfade
$.fn.innerfade = function(options) {
	this.each(function(){
		var settings = {
			runningclass: 'innerfade'
		};
		if(options)
			$.extend(settings, options);
			
		settings.timeoutId = null;
		settings.elements = null;
		settings.last = null;
		settings.current = null;
	
		var elements = $(this).children();
		var objList = this;
		if (elements.length > 1) {
		
			$(this).css('position', 'relative');
			$(this).css('height', settings.containerheight);
			$(this).addClass(settings.runningclass);
			
			for ( var i = 0; i < elements.length; i++ ) {
				$(elements[i]).css('position', 'absolute');
				$(elements[i]).hide();
			};

			current = 0;
			var id = setTimeout(function(){
				$.innerfade.next(objList);
			}, settings.timeout);
			$(elements[0]).show();
					
			settings.timeoutId = id;
			settings.elements = elements;
			settings.last = 0;
			settings.current = current;
			
			this.$settings = settings;
			ELMS.push(this);	
		}
	});
};

//Returns the current settings
function getSettings(objItem) {
	for (var i = 0; i < ELMS.length; i++) {
		if (ELMS[i] == objItem) {
			return objItem.$settings;
		}
	}
	return null;
}

//Change an item in the settings
function setSettings(objItem, key, value) {
	for (var i = 0; i < ELMS.length; i++) {
		if (ELMS[i] == objItem) {
			objItem.$settings[key] = value;
		}
	}
}

//Remove all the three area's from the page
function clearPage(settings) {
	$('#'+settings.pagessection+" ul").remove();
	$('#'+settings.thumbssection+" ul").remove();
	$('#'+settings.bigImageSection+" ul").remove();	
}

//Create the three area's and bind actions to them
function createPage(settings) {
	var active = "";
	var strList = "<ul>\n";

	//Create ul for page numbers
	for (var i=0;i<settings.pagecount;i++) {
		active = (settings.currentPage-1 == i) ? "active" : "";			
		strList += "<li id=\"page_"+i+"\" class=\""+active+"\"><a href=\"#\">"+(i+1)+"</a></li>\n";
	}
	strList += "</ul>\n";
	$('#'+settings.pagessection).prepend(strList);
	var frombackup = settings.from;
	
	//Create ul for thumbnails
	strList = "<ul>\n";	
	while (settings.from < settings.to) {
			strList += "<li><a href=\"javascript:;\"><img id=\"img_small_" + (settings.from+1) + "\" src=\""+settings.smallImages[settings.from]+"\" alt=\"Click to enlarge\" /></a></li>\n";
			settings.from++;	
	}
	strList += "</ul>\n";
	$("#"+settings.thumbssection).prepend(strList);
	settings.from = frombackup;
	
	//Create ul for big image
	strList = "<ul class=\"fade\" id=\"ivo_big_image\">\n";
	settings.from = frombackup;
	while (settings.from < settings.to) {
		strList += "<li><img id=\"img_big_" + (settings.from+1) + "\" src=\""+settings.bigImages[settings.from]+"\" alt=\"\" /></li>\n";
		settings.from++;
	}
	strList += "</ul>\n";	
	$('#'+settings.bigImageSection).prepend(strList);
	settings.from = frombackup;
	
	//Let the big images fade
	$('.fade').innerfade(settings);

	if (settings.firstCreation) {
		//Bind the following action(s) only once to a element
		$('#'+ settings.nextimagebutton).click(function(){
			$('.fade').nextFadeItem();
		});			
		$('#'+ settings.previousimagebutton).click(function(){
			$('.fade').previousFadeItem();
		});
	}
	//Always bind the following actions the the elements
	
	//Click on page number -> change page
	for (var i=0;i<settings.pagecount;i++) {
		$("#page_"+i).click(function(){
			var id = $(this).get(0).id.split("_").pop();
			id = parseInt(id);
			id++;
			$(".fade").gotoPage(id);
		});
	}
	//Click on thumbnail load big picture
	while (settings.from < settings.to) {
		$('#img_small_'+(settings.from+1)).click(function() {
			var id = $(this).get(0).id.split("_").pop();
			$(this).parent().addClass("active");
			id--;
			id -= frombackup;
			$('.fade').gotoFadeItem(id);
			
		});
		settings.from++;
	}
	return $('#ivo_big_image').get(0);
}

//Extend the general fade function
$.fn.extend({
	//load next fade item declaration
	nextFadeItem: function() {
	 this.each(function() {
			clearTimeout(getSettings(this).timeoutId);
			$.innerfade.next(this, 500);
		});
	},
	//load previous fade item declaration
	previousFadeItem: function() {
		this.each(function() {
			clearTimeout(getSettings(this).timeoutId);
			$.innerfade.previous(this, 500);
		});
	},
	//load specific fade item declaration
	gotoFadeItem: function(index) {
		this.each(function() {
			clearTimeout(getSettings(this).timeoutId);
			$.innerfade.getAt(this, 500,index);
		});
	}, 
	//linitialize the galery (should be called upon the thumbs area.
	initGallery: function(settings) {
		settings.pagecount = (Math.ceil(settings.smallImages.length / settings.maxImages));
		settings.currentPage = 1;
		settings.from = (settings.currentPage * settings.maxImages) - settings.maxImages;
		settings.numberOfPages = Math.ceil( settings.bigImages.length / settings.maxImages);		
		settings.thumbssection = $(this).get(0).id;
		settings.firstCreation = true;
		
		if (settings.numberOfPages == settings.currentPage) {
			var rest = settings.maxImages - ((settings.numberOfPages * settings.maxImages) - settings.bigImages.length);
			settings.to = (settings.currentPage-1) * settings.maxImages + rest;
		} else {
			settings.to = (settings.currentPage * settings.maxImages);
		}

		createPage(settings);		
		this.$settings = settings;
		ELMS.push(this);
		$.innerfade.setThumb(this, 0);
	},
	//change the page declaration
	gotoPage: function(page) {
		this.each(function() {

			clearTimeout(getSettings(this).timeoutId);
			$.innerfade.getPage(this, page);
		});
	}	
});

$.innerfade = function() {}
//load next fade item implementation
$.innerfade.next = function (objList, speed) {
	var settings = getSettings(objList);
	var elements = settings.elements;
	var current = settings.current;
	var last = settings.last;
	speed = (speed == undefined) ? settings.speed : speed;	
	current = (last == elements.length-1 ) ? 0 : current+1;
	
	if (current!=0) {
		$(elements[last]).fadeOut(speed);
		$(elements[current]).fadeIn(speed);
		last = current;			
	} else {
		var nextPage = parseInt(settings.currentPage);
		current = elements.length-1;
		if (settings.numberOfPages > nextPage) {
			$(".fade").gotoPage(settings.currentPage+1);
		}
	}		
	var id = setTimeout((function(){$.innerfade.next(objList);}), settings.timeout);
	setSettings(objList, 'timeoutId', id);
	setSettings(objList, 'current', current);
	setSettings(objList, 'last', last);
	$.innerfade.setThumb(objList, last);
	
};

//load previous fade item implementation
$.innerfade.previous = function (objList, speed) {
	var settings = getSettings(objList);
	var elements = settings.elements;
	var current = settings.current;
	var last = settings.last;
	speed = (speed == undefined) ? settings.speed : speed;
	
	current = (last == 0) ? 0 :current-1;
	
	if (last != 0) {
		$(elements[last]).fadeOut(speed);
		$(elements[current]).fadeIn(speed);
		last = current;		
	} else {
		if (settings.currentPage > 1) {
			$(".fade").gotoPage(settings.currentPage-1);
			$(".fade").gotoFadeItem(settings.maxImages-1);
		} 
	}		
	
	var id = setTimeout((function(){$.innerfade.next(objList);}), settings.timeout);
	setSettings(objList, 'timeoutId', id);
	setSettings(objList, 'current', current);
	setSettings(objList, 'last', last);
	$.innerfade.setThumb(objList, current);
};

//load specific fade item implementation
$.innerfade.getAt = function (objList, speed, index) {
	var settings = getSettings(objList);
	var elements = settings.elements;
	var current = settings.current;
	var last = settings.last;
		speed = (speed == undefined) ? settings.speed : speed;
	current = index;

	$(elements[last]).fadeOut(speed);
	$(elements[current]).fadeIn(speed);
	last = current;
	var id = setTimeout((function(){$.innerfade.next(objList);}), settings.timeout);
	setSettings(objList, 'timeoutId', id);
	setSettings(objList, 'current', current);
	setSettings(objList, 'last', last);
	$.innerfade.setThumb(objList, last);
};

$.innerfade.setThumb = function(objItem, index) {
	var settings = getSettings(objItem);
	if (settings) {
		var objList = $("li", $("#" + settings.thumbssection));
		objList.each(function(i){
			$('a', this).removeClass("active");
		});
		$('a', $(objList[index])).addClass("active");
	}
};

//load page implementation
$.innerfade.getPage = function (objList, page) {
	var settings = getSettings(objList);
	setSettings(objList, 'currentPage', page);
	setSettings(objList, 'numberOfPages', Math.ceil( settings.bigImages.length / settings.maxImages));
	
	if (settings.numberOfPages == settings.currentPage) {
		var rest = settings.maxImages - ((settings.numberOfPages * settings.maxImages) - settings.bigImages.length);
		setSettings(objList, 'to', (settings.currentPage-1) * settings.maxImages + rest);
	} else {
		setSettings(objList, 'to', (settings.currentPage * settings.maxImages));
	}	
	setSettings(objList, 'from', (settings.currentPage * settings.maxImages) - settings.maxImages);
	setSettings(objList, 'firstCreation', false);
	setSettings(objList, 'current', 0);
	setSettings(objList, 'last', 0);
	
	clearPage(settings);
	
	var tempELMS = [];
	$.each(ELMS, function(i, n){
		if (n != objList) {
			tempELMS.push(n);
		}
	});
	ELMS = tempELMS;
	
	var objList = createPage(settings);
	settings.elements = $(objList).children();
	objList.$settings = settings;
	ELMS.push(objList);
};
})(jQuery);