// Copyright (c) 2011, Open Experience GmbH. All rights reserved.

/**
 * Plug-in: ox-slideshow
 * 
 * shows after seconds another pic
 * 
 * Usage:
 * 			<div class="slideContainer">
 *				<div class="imageContainer"><img src="../img/bild.jpg"/></div>
 *				<div class="imageContainer"><img src="../img/bild2.jpg"/></div>
 *				<div class="imageContainer"><img src="../img/bild3.jpg"/></div>
 *				<div class="imageContainer"><img src="../img/bild4.jpg"/></div>
 *			</div>
 * 		 
 * @author Daniel Wachter, Open Experience GmbH <wachter@openexperience.de>
 */
(function ($) {
	var name = 'ox_slideshow';
	var defaults = {
			mode: 'show',
			enableBigImage: true,
			bigImageClass: "",
			delay: 2000,
			random: false, 
			startPic: 0
	};

	function PlugIn ($element, o) {
		$element.data(name, this);
		
		var $slides = $element.children()
			.hide();
			$slides.eq(o.startPic).show();

		$(window).load(function () {				
			$slides.each(function (i, e) {
				var $e = $(e);
				$e.css({
					position: 'absolute', 
					left: ($element.width() - $e.width()) / 2,
					top: ($element.height() - $e.height()) / 2});
			})
		});
		
		if (o.mode == 'show') {
			var 
				getRandomIndex = function () {
					return Math.floor( Math.random() * ($slides.length -1));
				},
				
				lastId = 0,
				activ = window.setInterval(function startSlide() {
					lastId = (lastId + 1 > $slides.length - 1) ? 0 : lastId + 1;
					$slidess
						.hide()
						.eq(o.random ? getRandomIndex() : lastId).show();
				}, o.delay);	
		} else if (o.mode == 'manual') {
			$element.css({cursor: 'pointer'});
			var arrowClick = function(event) {
					var $vis = $slides.filter(':visible'),
						i = $vis.index();
					if ($(this).css("left") == "0px") {
						$slides.eq( i > $slides.length - 2 ? 0 : i + 1).show();
					} else {
						$slides.eq( i < 1 ? $slides.length - 1 : i - 1).show();
					}
					$vis.hide();
					event.stopPropagation();
					return false;
				}
				$arrowleft = $('<div class="ox-slideshow-arrow ox-slideshow-arrowleft" />')
					.appendTo($element)
					.css({'height':  $element.height() +'px'})
					.click(arrowClick),
				$arrowright = $('<div class="ox-slideshow-arrow ox-slideshow-arrowright" />')
					.appendTo($element)
					.css({'height': $element.height() +'px'})
					.click(arrowClick);
		}		
		if (o.enableBigImage) {
			var $bigImage = $('<img src="" class="ox-slideshow-bigImage ' + o.bigImageClass + '" />')
					.hide()
					.appendTo($element.parent());
			$slides.click(function(event){
				$bigImage
					.attr({
						'src':  $(this).attr('src')})
					.css({
						'left': $element.position().left - (($bigImage.width() - $element.width()) / 2) > 0
									? $element.position().left - ($bigImage.width() - $element.width()) / 2
									: 0,
						'top': $element.position().top - (($bigImage.height() - $element.height()) / 2) > 0
									? $element.position().top - ($bigImage.height() - $element.height()) / 2
									: 0})
					.show();
					event.stopPropagation();
			});
			$(document).click(function(){
				$bigImage.hide();
			});
		}
	}

	function debug (obj) {
		console.log(obj);
	}

	$.fn[name] = function (method, options) {
		this.each(function () {
			$this = $(this);
			var obj = $this.data(name);
			if (!obj) {
					if (typeof method === 'object') {
						obj = new PlugIn($this, $.extend(true, {}, defaults, method));
					} else {
						obj = new PlugIn($this, $.extend(true, {}, defaults));
					}
			}
			if (typeof method === 'string') {
				obj[method](options);
			}
		});
		return this;
	};

})(jQuery);

