/**
* jqFancyTransitions - jQuery plugin
* @version: 1.8 (2010/06/13)
* @requires jQuery v1.2.2 or later 
* @author Ivan Lazarevic
* Examples and documentation at: http://www.workshop.rs/projects/jqfancytransitions

* Dual licensed under the MIT and GPL licenses:
*   http://www.opensource.org/licenses/mit-license.php
*   http://www.gnu.org/licenses/gpl.html
**/

(function ($) {
	var opts = new Array;
	var level = new Array;
	var img = new Array;
	var links = new Array;
	var titles = new Array;
	var order = new Array;
	var imgInc = new Array;
	var inc = new Array;
	var stripInt = new Array;
	var imgInt = new Array;
	var target = new Array;

	$.fn.jqFancyTransitions = $.fn.jqfancytransitions = function (options) {

		init = function (el) {

			opts[el.id] = $.extend({}, $.fn.jqFancyTransitions.defaults, options);
			img[el.id] = new Array(); // images array
			links[el.id] = new Array(); // links array
			titles[el.id] = new Array(); // titles array
			order[el.id] = new Array(); // strips order array
			target[el.id] = new Array(); // target array      
			imgInc[el.id] = 0;
			inc[el.id] = 0;

			params = opts[el.id];

			if (params.effect == 'zipper') { params.direction = 'alternate'; params.position = 'alternate'; }
			if (params.effect == 'wave') { params.direction = 'alternate'; params.position = 'top'; }
			if (params.effect == 'curtain') { params.direction = 'alternate'; params.position = 'curtain'; }

			// width of strips
			stripWidth = parseInt(params.width / params.strips);
			gap = params.width - stripWidth * params.strips; // number of pixels
			stripLeft = 0;

			// create images and titles arrays
			$.each($('#' + el.id + ' img'), function (i, item) {
				img[el.id][i] = $(item).attr('src');
				links[el.id][i] = $(item).next().attr('href');
				titles[el.id][i] = $(item).attr('alt') ? $(item).attr('alt') : '';
				target[el.id][i] = $(item).attr('target') ? $(item).attr('target') : ''
				$(item).hide();
			});

			// set panel
			$('#' + el.id).css({
				'background-image': 'url(' + img[el.id][0] + ')',
				'width': params.width,
				'height': params.height,
				'position': 'relative',
				'background-position': 'top left'
			});

			// create title bar
			$('#' + el.id).append("<div class='ft-title' id='ft-title-" + el.id + "' style='visibility: hidden; position: absolute; bottom:0; left: 0; z-index: 1000; color: #fff; background-color: #000; '>" + titles[el.id][0] + "</div>");
			if (titles[el.id][imgInc[el.id]])
				$('#ft-title-' + el.id).css('opacity', opts[el.id].titleOpacity);
			else
				$('#ft-title-' + el.id).css('opacity', 0);

			if (params.navigation) {
				$.navigation(el);
				$('#ft-buttons-' + el.id).children().first().addClass('ft-button-' + el.id + '-active');
			}

			odd = 1;
			// creating bars
			// and set their position
			for (j = 1; j < params.strips + 1; j++) {

				if (gap > 0) {
					tstripWidth = stripWidth + 1;
					gap--;
				} else {
					tstripWidth = stripWidth;
				}

				if (params.links)
					if (target[el.id][0] )
						$('#' + el.id).append("<a href='" + links[el.id][0] + "' class='ft-" + el.id + "' id='ft-" + el.id + j + "' style='width:" + tstripWidth + "px; height:" + params.height + "px; float: left; position: absolute;outline:none;' ></a>");
					else
						$('#' + el.id).append("<a href='" + links[el.id][0] + "' class='ft-" + el.id + "' id='ft-" + el.id + j + "' style='width:" + tstripWidth + "px; height:" + params.height + "px; float: left; position: absolute;outline:none;' target='_blank'></a>");


				else
					$('#' + el.id).append("<div class='ft-" + el.id + "' id='ft-" + el.id + j + "' style='width:" + tstripWidth + "px; height:" + params.height + "px; float: left; position: absolute;'></div>");

				// positioning bars
				$("#ft-" + el.id + j).css({
					'background-position': -stripLeft + 'px top',
					'left': stripLeft
				});

				stripLeft += tstripWidth;

				if (params.position == 'bottom')
					$("#ft-" + el.id + j).css('bottom', 0);

				if (j % 2 == 0 && params.position == 'alternate')
					$("#ft-" + el.id + j).css('bottom', 0);

				// bars order
				// fountain
				if (params.direction == 'fountain' || params.direction == 'fountainAlternate') {
					order[el.id][j - 1] = parseInt(params.strips / 2) - (parseInt(j / 2) * odd);
					order[el.id][params.strips - 1] = params.strips; // fix for odd number of bars
					odd *= -1;
				} else {
					// linear
					order[el.id][j - 1] = j;
				}

			}

			$('.ft-' + el.id).mouseover(function () {
				opts[el.id].pause = true;
			});

			$('.ft-' + el.id).mouseout(function () {
				opts[el.id].pause = false;
			});

			$('#ft-title-' + el.id).mouseover(function () {
				opts[el.id].pause = true;
			});

			$('#ft-title-' + el.id).mouseout(function () {
				opts[el.id].pause = false;
			});

			clearInterval(imgInt[el.id]);
			imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay + params.stripDelay * params.strips);

		};

		// transition
		$.transition = function (el, direction) {

			if (opts[el.id].pause == true) return;

			stripInt[el.id] = setInterval(function () { $.strips(order[el.id][inc[el.id]], el) }, opts[el.id].stripDelay);

			$('#' + el.id).css({ 'background-image': 'url(' + img[el.id][imgInc[el.id]] + ')' });

			if (typeof (direction) == "undefined")
				imgInc[el.id]++;
			else
				if (direction == 'prev')
					imgInc[el.id]--;
				else
					imgInc[el.id] = direction;

			if (imgInc[el.id] == img[el.id].length) {
				imgInc[el.id] = 0;
			}

			if (imgInc[el.id] == -1) {
				imgInc[el.id] = img[el.id].length - 1;
			}

			if (titles[el.id][imgInc[el.id]] != '') {
				$('#ft-title-' + el.id).animate({ opacity: 0 }, opts[el.id].titleSpeed, function () {
					$(this).html(titles[el.id][imgInc[el.id]]).animate({ opacity: opts[el.id].titleOpacity }, opts[el.id].titleSpeed);
				});
			} else {
				$('#ft-title-' + el.id).animate({ opacity: 0 }, opts[el.id].titleSpeed);
			}

			inc[el.id] = 0;

			buttons = $('#ft-buttons-' + el.id).children();

			buttons.each(function (index) {
				if (index == imgInc[el.id]) {
					$(this).addClass('ft-button-' + el.id + '-active');
				} else {
					$(this).removeClass('ft-button-' + el.id + '-active');
				}
			});

			if (opts[el.id].direction == 'random')
				$.fisherYates(order[el.id]);

			if ((opts[el.id].direction == 'right' && order[el.id][0] == 1)
										 || opts[el.id].direction == 'alternate'
										 || opts[el.id].direction == 'fountainAlternate')
				order[el.id].reverse();
		};


		// strips animations
		$.strips = function (itemId, el) {

			temp = opts[el.id].strips;
			if (inc[el.id] == temp) {
				clearInterval(stripInt[el.id]);
				return;
			}
			$('.ft-' + el.id).attr('href', links[el.id][imgInc[el.id]]);
			if (opts[el.id].position == 'curtain') {
				currWidth = $('#ft-' + el.id + itemId).width();
				$('#ft-' + el.id + itemId).css({ width: 0, opacity: 0, 'background-image': 'url(' + img[el.id][imgInc[el.id]] + ')' });
				$('#ft-' + el.id + itemId).animate({ width: currWidth, opacity: 1 }, 1000);
			} else {
				$('#ft-' + el.id + itemId).css({ height: 0, opacity: 0, 'background-image': 'url(' + img[el.id][imgInc[el.id]] + ')' });
				$('#ft-' + el.id + itemId).animate({ height: opts[el.id].height, opacity: 1 }, 1000);
			}

			inc[el.id]++;

		};

		// navigation
		$.navigation = function (el) {
			// create prev and next 
			$('#' + el.id).append("<a href='#' id='ft-prev-" + el.id + "' class='ft-prev'><<</a>");
			$('#' + el.id).append("<a href='#' id='ft-next-" + el.id + "' class='ft-next'>>></a>");

			$('#ft-prev-' + el.id).css({
				'position': 'absolute',
				'bottom': 0,
				'z-index': +1,
				'line-height': '10px',
				'width': '14px',
				'height': '14px',
				'right': 105,
				'color': '#000000',
				'padding-left': 10,
				'padding-right': 5,
				'padding-top': 7,
				//'-moz-border-radius': 10;
				'background-color': '#fff'
			}).click(function (e) {
				e.preventDefault();
				$.transition(el, 'prev');
				clearInterval(imgInt[el.id]);
				imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay + params.stripDelay * params.strips);
			});

			$('#ft-next-' + el.id).css({
				'position': 'absolute',
				'bottom': 0,
				'z-index': +1,
				'line-height': '10px',
				'width': '14px',
				'height': '14px',
				'right': '0px',
				'color': '#000000',
				'padding-left': 10,
				'padding-right': 5,
				'padding-top': 7,
				'background-color': '#fff'
			}).click(function (e) {
				e.preventDefault();
				$.transition(el);
				clearInterval(imgInt[el.id]);
				imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay + params.stripDelay * params.strips);
			});

			// image buttons
			$("<div id='ft-buttons-" + el.id + "'></div>").insertAfter($('#' + el.id));
			$('#ft-buttons-' + el.id).css({
				'position': 'absolute',
				'text-align': 'left',
				'padding-top': 5,
				'width': '80px',
				'height': '23px',
				'z-index': 0,
				'background-color': '#fff',
				'margin-top': -26,
				'right': '30px',
				'bottom': '0px',
				'padding-left': 0

			});
			for (k = 1; k < img[el.id].length + 1; k++) {
				$('#ft-buttons-' + el.id).append("<a href='#' class='ft-button-" + el.id + "'>" + k + "</a>");
			}
			$('.ft-button-' + el.id).css({
				'padding': 7,
				'background-image': 'url(../images/banner_nav_ball.jpg)',
				'font-weight': 'bold',
				'color': '#ffffff',
				'background-position': '50% 50%',
				'background-repeat': 'no-repeat'
			});

			$.each($('.ft-button-' + el.id), function (i, item) {
				$(item).click(function (e) {
					e.preventDefault();
					$.transition(el, i);
					clearInterval(imgInt[el.id]);
					imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay + params.stripDelay * params.strips);
				})
			});
		}



		// shuffle array function
		$.fisherYates = function (arr) {
			var i = arr.length;
			if (i == 0) return false;
			while (--i) {
				var j = Math.floor(Math.random() * (i + 1));
				var tempi = arr[i];
				var tempj = arr[j];
				arr[i] = tempj;
				arr[j] = tempi;
			}
		}

		this.each(
							function () { init(this); }
			 );

	};

	// default values
	$.fn.jqFancyTransitions.defaults = {
		width: 500, // width of panel
		height: 332, // height of panel
		strips: 10, // number of strips
		delay: 5000, // delay between images in ms
		stripDelay: 50, // delay beetwen strips in ms
		titleOpacity: 0.7, // opacity of title
		titleSpeed: 1000, // speed of title appereance in ms
		position: 'alternate', // top, bottom, alternate, curtain
		direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
		effect: '', // curtain, zipper, wave
		navigation: false, // prev next and buttons
		links: false // show images as links               
	};

})(jQuery);