/**
 * Coin Slider - Unique jQuery Image Slider
 * @version: 1.0 - (2010/04/04)
 * @requires jQuery v1.2.2 or later
 * @author Ivan Lazarevic
 * Examples and documentation at: http://workshop.rs/projects/coin-slider/

 * Licensed under MIT licence:
 *   http://www.opensource.org/licenses/mit-license.php
**/

(function ($) {

	var params = new Array;
	var order = new Array;
	var images = new Array;
	var links = new Array;
	var linksTarget = new Array;
	var titles = new Array;
	var interval = new Array;
	var imagePos = new Array;
	var appInterval = new Array;
	var squarePos = new Array;
	var reverse = new Array;

	$.fn.coinslider = $.fn.CoinSlider = function (options) {

		init = function (el) {

			order[el.id] = new Array(); // order of square appereance
			images[el.id] = new Array();
			links[el.id] = new Array();
			linksTarget[el.id] = new Array();
			titles[el.id] = new Array();
			imagePos[el.id] = 0;
			squarePos[el.id] = 0;
			reverse[el.id] = 1;

			params[el.id] = $.extend({}, $.fn.coinslider.defaults, options);

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


			// set panel
			$(el).css({
				'background-image': 'url(' + images[el.id][0] + ')',
				'width': params[el.id].width,
				'height': params[el.id].height,
				'position': 'relative',
				'background-position': 'top left'
			}).wrap("<div class='coin-slider' id='coin-slider-" + el.id + "' />");


			// create title bar
			$('#' + el.id).append("<div class='cs-title' id='cs-title-" + el.id + "' style='position: absolute; bottom:0; left: 0; z-index: 1000;'></div>");

			$.setFields(el);

			if (params[el.id].navigation)
				$.setNavigation(el);

			$.transition(el, 0);
			$.transitionCall(el);

		}

		// squares positions
		$.setFields = function (el) {

			tWidth = sWidth = parseInt(params[el.id].width / params[el.id].spw);
			tHeight = sHeight = parseInt(params[el.id].height / params[el.id].sph);

			counter = sLeft = sTop = 0;
			tgapx = gapx = params[el.id].width - params[el.id].spw * sWidth;
			tgapy = gapy = params[el.id].height - params[el.id].sph * sHeight;

			for (i = 1; i <= params[el.id].sph; i++) {
				gapx = tgapx;

				if (gapy > 0) {
					gapy--;
					sHeight = tHeight + 1;
				} else {
					sHeight = tHeight;
				}

				for (j = 1; j <= params[el.id].spw; j++) {

					if (gapx > 0) {
						gapx--;
						sWidth = tWidth + 1;
					} else {
						sWidth = tWidth;
					}

					order[el.id][counter] = i + '' + j;
					counter++;

					if (params[el.id].links)
						$('#' + el.id).append("<a href='" + links[el.id][0] + "' class='cs-" + el.id + "' id='cs-" + el.id + i + j + "' style='width:" + sWidth + "px; height:" + sHeight + "px; float: left; position: absolute;'></a>");
					else
						$('#' + el.id).append("<div class='cs-" + el.id + "' id='cs-" + el.id + i + j + "' style='width:" + sWidth + "px; height:" + sHeight + "px; float: left; position: absolute;'></div>");

					// positioning squares
					$("#cs-" + el.id + i + j).css({
						'background-position': -sLeft + 'px ' + (-sTop + 'px'),
						'left': sLeft,
						'top': sTop
					});

					sLeft += sWidth;
				}

				sTop += sHeight;
				sLeft = 0;

			}


			$('.cs-' + el.id).mouseover(function () {
				$('#cs-navigation-' + el.id).show();
			});

			$('.cs-' + el.id).mouseout(function () {
				$('#cs-navigation-' + el.id).hide();
			});

			$('#cs-title-' + el.id).mouseover(function () {
				$('#cs-navigation-' + el.id).show();
			});

			$('#cs-title-' + el.id).mouseout(function () {
				$('#cs-navigation-' + el.id).hide();
			});

			if (params[el.id].hoverPause) {
				$('.cs-' + el.id).mouseover(function () {
					params[el.id].pause = true;
				});

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

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

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


		};


		$.transitionCall = function (el) {

			clearInterval(interval[el.id]);
			delay = params[el.id].delay + params[el.id].spw * params[el.id].sph * params[el.id].sDelay;
			interval[el.id] = setInterval(function () { $.transition(el) }, delay);

		}

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

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

			$.effect(el);

			squarePos[el.id] = 0;
			appInterval[el.id] = setInterval(function () { $.appereance(el, order[el.id][squarePos[el.id]]) }, params[el.id].sDelay);

			$(el).css({ 'background-image': 'url(' + images[el.id][imagePos[el.id]] + ')' });

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

			if (imagePos[el.id] == images[el.id].length) {
				imagePos[el.id] = 0;
			}

			if (imagePos[el.id] == -1) {
				imagePos[el.id] = images[el.id].length - 1;
			}

			$('.cs-button-' + el.id).removeClass('cs-active');
			$('#cs-button-' + el.id + "-" + (imagePos[el.id] + 1)).addClass('cs-active');

			if (titles[el.id][imagePos[el.id]]) {
				$('#cs-title-' + el.id).css({ 'opacity': 0 }).animate({ 'opacity': params[el.id].opacity }, params[el.id].titleSpeed);
				$('#cs-title-' + el.id).html(titles[el.id][imagePos[el.id]]);
			} else {
				$('#cs-title-' + el.id).css('opacity', 0);
			}

		};

		$.appereance = function (el, sid) {

			$('.cs-' + el.id).attr('href', links[el.id][imagePos[el.id]]).attr('target', linksTarget[el.id][imagePos[el.id]]);

			if (squarePos[el.id] == params[el.id].spw * params[el.id].sph) {
				clearInterval(appInterval[el.id]);
				return;
			}

			$('#cs-' + el.id + sid).css({ opacity: 0, 'background-image': 'url(' + images[el.id][imagePos[el.id]] + ')' });
			$('#cs-' + el.id + sid).animate({ opacity: 1 }, 300);
			squarePos[el.id]++;

		};

		// navigation
		$.setNavigation = function (el) {
			// create prev and next
			$(el).append("<div id='cs-navigation-" + el.id + "'></div>");
			$('#cs-navigation-' + el.id).hide();

			//			$('#cs-navigation-'+el.id).append("<a href='#' id='cs-prev-"+el.id+"' class='cs-prev'>prev</a>");
			//			$('#cs-navigation-'+el.id).append("<a href='#' id='cs-next-"+el.id+"' class='cs-next'>next</a>");
			$('#cs-prev-' + el.id).css({
				'position': 'absolute',
				'top': params[el.id].height / 2 - 20,
				'left': 0,
				'z-index': 1001,
				'line-height': '30px',
				'opacity': params[el.id].opacity
			}).click(function (e) {
				e.preventDefault();
				$.transition(el, 'prev');
				$.transitionCall(el);
			}).mouseover(function () { $('#cs-navigation-' + el.id).show() });

			$('#cs-next-' + el.id).css({
				'position': 'absolute',
				'top': params[el.id].height / 2 - 15,
				'right': 0,
				'z-index': 1001,
				'line-height': '30px',
				'opacity': params[el.id].opacity
			}).click(function (e) {
				e.preventDefault();
				$.transition(el);
				$.transitionCall(el);
			}).mouseover(function () { $('#cs-navigation-' + el.id).show() });

			// image buttons
			$("<div id='cs-buttons-" + el.id + "' class='cs-buttons'></div>").appendTo($('#coin-slider-' + el.id));


			for (k = 1; k < images[el.id].length + 1; k++) {
				$('#cs-buttons-' + el.id).append("<a href='#' class='cs-button-" + el.id + "' id='cs-button-" + el.id + "-" + k + "'>" + k + "</a>");
			}

			$.each($('.cs-button-' + el.id), function (i, item) {
				$(item).click(function (e) {
					$('.cs-button-' + el.id).removeClass('cs-active');
					$(this).addClass('cs-active');
					e.preventDefault();
					$.transition(el, i);
					$.transitionCall(el);
				})
			});

			$('#cs-navigation-' + el.id + ' a').mouseout(function () {
				$('#cs-navigation-' + el.id).hide();
				params[el.id].pause = false;
			});

			$("#cs-buttons-" + el.id).css({
				'left': '0px',
			//	'margin-left': -images[el.id].length * 20 / 2 - 1,
				'position': 'relative',
				'top' : '-19px',
				'z-index' : 1000

			});


		}



		// effects
		$.effect = function (el) {

			effA = ['random', 'swirl', 'rain', 'straight'];
			if (params[el.id].effect == '')
				eff = effA[Math.floor(Math.random() * (effA.length))];
			else
				eff = params[el.id].effect;

			order[el.id] = new Array();
			
			if (eff == 'random') {
				counter = 0;
				for (i = 1; i <= params[el.id].sph; i++) {
					for (j = 1; j <= params[el.id].spw; j++) {
						order[el.id][counter] = i + '' + j;
						counter++;
					}
				}
				$.random(order[el.id]);
			}

			if (eff == 'rain') {
				$.rain(el);
			}

			if (eff == 'swirl')
				$.swirl(el);

			if (eff == 'straight')
				$.straight(el);

			reverse[el.id] *= -1;
			if (reverse[el.id] > 0) {
				order[el.id].reverse();
			}

		}


		// shuffle array function
		$.random = 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;
			}
		}

		//swirl effect by milos popovic
		$.swirl = function (el) {

			var n = params[el.id].sph;
			var m = params[el.id].spw;

			var x = 1;
			var y = 1;
			var going = 0;
			var num = 0;
			var c = 0;

			var dowhile = true;

			while (dowhile) {

				num = (going == 0 || going == 2) ? m : n;

				for (i = 1; i <= num; i++) {

					order[el.id][c] = x + '' + y;
					c++;

					if (i != num) {
						switch (going) {
							case 0: y++; break;
							case 1: x++; break;
							case 2: y--; break;
							case 3: x--; break;

						}
					}
				}

				going = (going + 1) % 4;

				switch (going) {
					case 0: m--; y++; break;
					case 1: n--; x++; break;
					case 2: m--; y--; break;
					case 3: n--; x--; break;
				}

				check = $.max(n, m) - $.min(n, m);
				if (m <= check && n <= check)
					dowhile = false;

			}
		}

		// rain effect
		$.rain = function (el) {
			var n = params[el.id].sph;
			var m = params[el.id].spw;

			var c = 0;
			var to = to2 = from = 1;
			var dowhile = true;


			while (dowhile) {

				for (i = from; i <= to; i++) {
					order[el.id][c] = i + '' + parseInt(to2 - i + 1);
					c++;
				}

				to2++;

				if (to < n && to2 < m && n < m) {
					to++;
				}

				if (to < n && n >= m) {
					to++;
				}

				if (to2 > m) {
					from++;
				}

				if (from > to) dowhile = false;

			}

		}

		// straight effect
		$.straight = function (el) {
			counter = 0;
			for (i = 1; i <= params[el.id].sph; i++) {
				for (j = 1; j <= params[el.id].spw; j++) {
					order[el.id][counter] = i + '' + j;
					counter++;
				}

			}
		}

		$.min = function (n, m) {
			if (n > m) return m;
			else return n;
		}

		$.max = function (n, m) {
			if (n < m) return m;
			else return n;
		}

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


	};


	// default values
	$.fn.coinslider.defaults = {
		width: 565, // width of slider panel
		height: 290, // height of slider panel
		spw: 7, // squares per width
		sph: 5, // squares per height
		delay: 3000, // delay between images in ms
		sDelay: 30, // delay beetwen squares in ms
		opacity: 0.7, // opacity of title and navigation
		titleSpeed: 500, // speed of title appereance in ms
		effect: '', // random, swirl, rain, straight
		navigation: true, // prev next and buttons
		links: true, // show images as links
		hoverPause: true // pause on hover
	};

})(jQuery);