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

// jquery.imagearea.js

// Date: 2008-03-06
// based on the work of Torsten Baldes http://medienfreunde.com

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


(function($) {

	$.fn.imagearea = function(options) {
		return this.each(function() {   
			$.imagearea(this, options);
		});
	};
	
	// Constructor
	$.imagearea = function(container, options) {
		// Settings
		var settings = { 'speed': 500 };
		if (options) $.extend(settings, options);
		
		// Create Image List
		var id = $(container).parent().attr('id').substr(5);
		var numofimages = $.imagearea.numOfImages(container);
		var html = '<ul>';
		var i=1; while(i <= numofimages) {
			if (i > 1) html += '<li><img src="img/work/blank.png" width="672" height="588" alt="" /></li>';
			else html += '<li><img src="img/work/' +id+ '-' +i+ '.jpg" width="672" height="588" alt="" /></li>';
			i++;
		}
		$(container).html(html + '</ul>');
		
		// Hide all images except for first one
		var listitems = $(container).find('ul').children();
		var j=0; while (j < listitems.length) {
			$(listitems[j]).css('z-index', String(numofimages-(j++))).css('display','none').hide();
		}
		$(listitems[0]).css('display','block').show();
		
		// Create Controls
		var controls = $(container).parent().find('.controls');
		var elements = { 'id':id, 'controls':controls, 'listitems':listitems };
		$.imagearea.refreshImageControls(1, numofimages, elements, settings);
	};
	
	// Gets number of image from class name 'numofimagesX' where X = number
	$.imagearea.numOfImages = function(container) {
		var classes = $(container).attr('class').split(' ');
		var i=0; while(i < classes.length) {
			if (classes[i].substr(0, 11) == 'numofimages') {
				var num = parseInt(classes[i].substr(11));
				return num;
			}
			i++;
		}
		return 1;
	};
	
	$.imagearea.refreshImageControls = function(pos, tot, elements, settings) {
		// Create Controls
		var html = '<p class="position">' +pos+ ' of ' +tot+ '</p><p class="links">';
		if (tot > 1) {
			if (pos == 1) html += '<span class="prev">Previous</span> / ';
			else html += '<a href="javascript:;" class="prev">Previous</a> / ';
			if (pos == tot) html += '<span class="next">Next</span>';
			else html += '<a href="javascript:;" class="next">Next</a></p>';
		} else {
			html += '<span class="prev">Single Image</span>';
		}
		elements.controls.html(html);
		
		// Setup Events
		elements.controls.find('a.next').hover(function() {
			$.imagearea.loadNextImage(pos, elements);
		}, function() {});
		
		elements.controls.find('a.next').click(function(){
			$.imagearea.next(pos, tot, elements, settings);
		});
		elements.controls.find('a.prev').click(function(){
			$.imagearea.prev(pos, tot, elements, settings);
		});
	};
	
	// Loads the next image
	$.imagearea.loadNextImage = function(pos, elements) {
		var newsrc = 'img/work/' +elements.id+ '-' +(pos+1)+ '.jpg';
		$(elements.listitems[pos]).find('img').attr('src', newsrc);
	};
	
	// Show Next Image
	$.imagearea.next = function(pos, tot, elements, settings) {
		$(elements.listitems[pos-1]).fadeOut(settings.speed);
		$(elements.listitems[pos]).css('display','block');
		$(elements.listitems[pos]).fadeIn(settings.speed);
		$.imagearea.refreshImageControls(++pos, tot, elements, settings);
	};
	// Show Previous Image
	$.imagearea.prev = function(pos, tot, elements, settings) {
		$(elements.listitems[pos]).fadeOut(settings.speed);
		$(elements.listitems[pos-2]).fadeIn(settings.speed);
		$.imagearea.refreshImageControls(--pos, tot, elements, settings);
	};

})(jQuery);