/*
	JQuery Plugin für eine große Slideshow

	Parameter:
						
		* images 					(Array)		: Bilder die in der Slidershow angezeigt werden sollen
				- src					(String)	: pfad zu den Bild
				- html 				(String) 	: kann als Bildbeschreibung genutzt werden, der Html code kommt unter die Galerie
		
		* pictureWidth 		(Int) 		: Breite von einem Bild, daher ist es empfohlen, das alle Bilder gleich breit sind	(px)
		* pictureHeight   (Int)			: Höhe von einem Bild, daher ist es empfohlen, das alle Bilder gleich hoch sind			(px)
		* pictureMarginRight (Int)  : MarginRight von den Bildern
		* containerWidth  (Int) 		: Breite von der Bildergalerie																											(px)
		* containerHeight (Int)			: Höhe von der Bildergalerie																												(px)
		* sliderHeight 		(Int)			: Höhe von dem Rahmen																																(px)
		* sliderWidth			(Int)			: Breite von dem Rahmen																															(px)
		* sliderColor			(String)	: Rahmenfarbe
		* fadeSpeed				(Int)			: in welcher Geschwindigkeit sich das Bild einrastet, beim verschieben							(ms)
		* textSpeed				(Int)			: in welcher Geschwindigkeit sich der Text ausblendet und einblendet 								(ms)
		* blinkSpeed			(Int)			: in welcher Geschwindigkeit der Button blinkt 																			(ms)
		* scrollSpeed			(Int)			: in welcher Geschwindigkeit sich die Liste änder wenn auf den Button gedrückt wird (ms) 
		* bsSlider				(String)	: großer Slider kann eingebettet werden. Mini Slider steuert big Slider
		* textOpacity			(Int)			: Transparenz von Textfeld der über dem Bild liegt
		


*/


(function($){
		
	var settings = {
		images : [{
			src : "",
			html : ""			
		}],
		pictureWidth:80,
		pictureHeight:55,
		pictureMarginRight:5,
		containerWidth:650,
		containerHeight:55,
		sliderHeight:57,
		sliderWidth:522,
		fadeSpeed:200,
		textSpeed:400,
		blinkSpeed:400,
		scrollSpeed:10,
		bsSlider:"",
		textOpacity:0.9
	};
	
	var methods = {
		init : function(options) {
			if((navigator.userAgent.match(/iPhone/i)) || 
				 (navigator.userAgent.match(/iPod/i)) || 
				 (navigator.userAgent.match(/iPad/i)) || 
				 (navigator.userAgent.match(/Android/i)) ||
				 (navigator.userAgent.match(/webOS/i))) {
 				var isTouchScreen = 1;
 			}else{
 				var isTouchScreen = 0;
 			}
			//clone setting object for multible use
			_settings = $.extend(true, {}, settings);
			//no initialization has been done
			if (options != undefined) { 
				$.extend( _settings, options );
			}
			this.each(function(){
				var data = $(this).data("bsMiniSlider");
				if(!data){
					$(this).data("settings",_settings);
				}
			});
			
			var self = "";
			//Grundgerüst
			this.html(buildHTML.apply(this));
			
			//Bildereinfügen in Wrapper
			for(i=0 ; i<this.data("settings").images.length ; i++){
				methods.addImageToSlider.apply(this,[this.data("settings").images[i]]);
			}
			
			//thumb_text verstecken
			this.find(".mini_slider_text").animate({
				opacity : 0
			},0);
			
			//aktuelle Bild auslesen
			this.data("currentImage",methods.getFirstImage.apply(this));

			//Events Binden
			var self = this;
			this.bind("next",nextImage);
			this.bind("previous",previousImage);
			
			//Event auslösen bei click
			this.find(".mini_arrow_left").click(function(){
					methods.previousImage.apply($(this));
			});
			this.find(".mini_arrow_right").click(function(){
					methods.nextImage.apply($(this));
			});
			
			this.find(".mini_slider_text").bind('click',function(){
					fadeToImageBsSlider.apply($(self),[$(this).attr("id")]);
			}); 
			
			this.find(".mini_restriction")
				.mousedown(function(e){
					self.data("oldPageX",e.pageX);
					self.data("wrapperX",getWrapperPosition.apply($(self)));
					$(this).bind('mousemove',function(e){
						self.find(".mini_slider_text").unbind('click');	
						var pos = e.pageX-self.data("oldPageX")+(self.data("wrapperX")*(1));
						fadeImage.apply($(self),[pos,0]);
					});
				})
				.mouseup(function(){
					changeStatus.apply($(self));								
					$(this).unbind('mousemove');
					self.find(".mini_slider_text").bind('click',function(){
						fadeToImageBsSlider.apply($(self),[$(this).attr("id")]);
					});
	
				})
				.mouseleave(function(){
					changeStatus.apply($(self));								
					$(this).unbind('mousemove');
					self.find(".mini_slider_text").bind('click',function(){
						fadeToImageBsSlider.apply($(self),[$(this).attr("id")]);
					}); 
				});
				
				/** Touch funktion hinzufügen */
				this.find(".mini_restriction_wrapper").addTouch();
			
			/*
			/ Touch beachten
			*/
		  if(!isTouchScreen){
				this.find(".mini_arrow_left")
					.mouseenter(function(){
						$.doTimeout('hover',self.data("settings").scrollSpeed,function(){
								methods.previousImage.apply($(self));
								return true;
						});
					})
					.mouseleave(function(){
						$.doTimeout('hover');								 								 
					});
					
					
				this.find(".mini_arrow_right")
					.mouseenter(function(){
						$.doTimeout('hover',self.data("settings").scrollSpeed,function(){
								methods.nextImage.apply($(self));
								return true;
						});
					})
					.mouseleave(function(){
						$.doTimeout('hover');								 								 
					});
					
				
				this.find(".mini_slider_text")
					.mouseenter(function(){
						showText.apply($(self),[$(this).attr("id")]);
					})
					.mouseleave(function(){
							hideText.apply($(self),[$(this).attr("id")]);
					});
					
			}
			
			//Css setzen
			buildCSS.apply(this);
			
			//Buttons setzen
			changeButtonStatus.apply(this);
			return this;
		},
		
		addImage : function(image){
			this.data("settings").images.push(image);
		},
		
		getImage : function(index){
			return this.find("img[id=\""+index+"\"]");
		},
		
		setTextToImage : function(index,text){
			this.find("img[id=\""+index+"\"]").data("html",text);
		},
		
		getTextFromImage : function(index){
			return this.find("img[id=\""+index+"\"]").data("html");
		},
		
		getImageCount : function(){
			return this.find(".mini_restriction_wrapper img").length;
		},
		
		getFirstImage : function(){
			var left = this.find(".mini_restriction_wrapper").css("left").split("p")[0]*(-1);
			var imgWidth = this.find(".mini_restriction_image").outerWidth(true);
			var id =  Math.round( left / imgWidth);	
			return this.find("img[id=\""+id+"\"]");
		},
		
		addImageToSlider : function(image){
			var id 		= methods.getImageCount.apply(this);
			var html  = "<img class='mini_restriction_image' src='"+ image.src +"' alt='"+ image.src +"' id='"+ id +"'/>";
			html 		 += "<div class='mini_slider_text' id='"+ id + "'>";
			html		 += 		image.html;
			html		 +=	"</div>";
			image.id 	= id;
			this.find(".mini_restriction_wrapper").append(html);
		},
		
		nextImage : function(){
			this.trigger("next");
		},
		
		previousImage : function(){
			this.trigger("previous");
		},
		
		getTextFromCurrentImage : function(){
			return this.data("settings").images[methods.getFirstImage.apply(this).attr("id")].html;
		},
		
		fadeToImage : function(index){
			var image = methods.getImage.apply($(this),[index]);
			var id = image.attr("id");
			var xPosition = (-1)*id*image.outerWidth(true);
			fadeImage.apply(this,[xPosition,this.data("settings").fadeSpeed]);
		}
		
	};
	
	function fadeToImageBsSlider(index){
		this.data("settings").bsSlider.bsSlider("fadeToImage",index);
	}
	
	function showText(id){
		var self	= this;
		this.find(".mini_slider_text[id=\""+id+"\"]").stop(true,true).animate({
			opacity	: self.data("settings").textOpacity					 
		},self.data("settings").textSpeed);
	}
	
	function hideText(id){
		var self=this;
		this.find(".mini_slider_text[id=\""+id+"\"]").stop(true,true).animate({
			opacity	: 0					 
		},self.data("settings").textSpeed);
	}
	
	function 	nextImage(){
			var left = $(this).find(".mini_restriction_wrapper").css("left").split("p")[0];
			left -= methods.getFirstImage.apply($(this)).outerWidth(true);
			fadeImage.apply($(this),[left,$(this).data("settings").fadeSpeed]);
	}
	
	function 	previousImage(){
			var left = $(this).find(".mini_restriction_wrapper").css("left").split("p")[0];
			left = (left*1) + methods.getFirstImage.apply($(this)).outerWidth(true);
			fadeImage.apply($(this),[left,$(this).data("settings").fadeSpeed]);
	}
	
	function changeStatus(){
		var image = methods.getFirstImage.apply(this);
		var id = image.attr("id");
		var xPosition = (-1)*id*image.outerWidth(true);
		fadeImage.apply($(this),[xPosition,$(this).data("settings").fadeSpeed]);
	}
	
	function changeText(text){
		if(text==undefined){
			text="";
		}
		var self = this;
		this.find(".mini_slider_text").animate({
			opacity:0
		},{
			duration : self.data("settings").textSpeed,
			complete : function(){
				$(this).html(text);
				$(this).animate({
						opacity:1
				},self.data("settings").textSpeed);
			}
		});
	}
	
	function changeButtonStatus(){
		var firstImg = methods.getFirstImage.apply(this);
		var imageID = firstImg.attr("id");
		var imageCount = methods.getImageCount.apply(this);
		var contentCount = ($(this).data("settings").sliderWidth+firstImg.outerWidth(true)-firstImg.outerWidth())/firstImg.outerWidth(true);
		$(this).find(".mini_arrow_container_left").show();
		$(this).find(".mini_arrow_container_right").show();
		if((imageID==0)&&((imageCount-contentCount)<=0)){
			$(this).find(".mini_arrow_container_left").hide();
			$(this).find(".mini_arrow_container_right").hide();
			return true;
		}
		if(imageID==0){
			$(this).find(".mini_arrow_container_left").hide();
			return true;
		}
		if(imageID>=(imageCount-Math.floor(contentCount))){
			$(this).find(".mini_arrow_container_right").hide();
			return true;
		}
		return true;
	}
	
	function fadeImage(xPosition,time){
		var self = this;
		var wrapperWidth = self.find(".mini_restriction_wrapper").width();
		var sliderWidth = self.data("settings").sliderWidth;
		var maxLeft = (wrapperWidth-sliderWidth+xPosition)*(-1);
		if(maxLeft>=0){
			xPosition = (wrapperWidth-sliderWidth)*(-1);
		}
		if(xPosition>=0){
			xPosition=0;
		}
		if(self.data("animate")==undefined||self.data("animate")==false){
			self.data("animate",true);
			$(this).find(".mini_restriction_wrapper").animate({
				left : xPosition
			},{
				duration : time,	
				complete : function(){
					if(changeButtonStatus.apply(self)){
						if(self.data("currentImage").attr("id")!=methods.getFirstImage.apply(self).attr("id")){
							self.data("currentImage",methods.getFirstImage.apply(self));
						}
						self.data("animate",false);
					}
				}
			});
		}
	}
	
	function setWrapperPosition(xPosition){
		$(this).find(".mini_restriction_wrapper").css({
				"left":xPosition
		})
	}
	
	function getWrapperPosition(){
		return $(this).find(".mini_restriction_wrapper").css("left").split("p")[0];
	}
	
	function buildHTML(){
		var html  =	"<div class='mini_slider'>";
		html +=		"<div class='mini_slider_content'>";
    html += 		"<div class='mini_button_container_left'>";
    html +=  			"<div class='mini_arrow_container_left'><a class='mini_arrow_left'></a></div>";
    html +=			"</div>";
    html +=			"<div class='mini_picture_border'>";
		html +=				"<div class='mini_banner'></div>";
    html +=		  	"<div class='mini_restriction'>";
		html +=					"<div class='mini_restriction_wrapper'>";
		html +=					"</div>";
		html +=				"</div>";
    html += 			"</div>";
    html +=				"<div class='mini_button_container_right'>";
    html +=  				"<div class='mini_arrow_container_right'><a class='mini_arrow_right'></a></div>"
    html += 			"</div>";
 		html += 		"</div>";
  	html +=		"</div>";
		html +=	"</div>";
		return html;
	}
	
	function buildCSS(){
		var settings = $(this).data("settings");
		$(this).find(".mini_slider").css({
			"height" 	: settings.containerHeight,
			"width"		: settings.containerWidth
		});
		
		$(this).find(".mini_slider_content").css({
			"height"	: settings.sliderHeight
		});

		$(this).find(".mini_button_container_left").css({
			"width"		: ((settings.containerWidth-settings.sliderWidth) /2),
			"height"	: settings.sliderHeight
		});

		$(this).find(".mini_button_container_right").css({
			"width"		: ((settings.containerWidth-settings.sliderWidth) /2),
			"height"	: settings.sliderHeight
		});
		
		$(this).find(".mini_arrow_container_left").css({
			"marginTop"		: ((settings.sliderHeight/2) - ($(this).find(".mini_arrow_container_left").height()/2)),
			"marginLeft"	: ((settings.containerWidth-settings.sliderWidth) /2) - $(this).find(".mini_arrow_container_left").width()
		});
		
		$(this).find(".mini_arrow_container_right").css({
			"marginTop"		: settings.sliderHeight/2 - $(this).find(".mini_arrow_container_right").height()/2														
		});
		
		$(this).find(".mini_picture_border").css({
			"width"		: settings.sliderWidth,
			"height"	: settings.sliderHeight												 
		});
		
		$(this).find(".mini_restriction").css({
			"width"		: settings.sliderWidth,
			"height"	: settings.sliderHeight							
		});
		
		$(this).find(".mini_restriction_image").css({
			"height"	: settings.pictureHeight,
			"width"		: settings.pictureWidth
		});	
		
				
		$(this).find(".mini_restriction_wrapper").css({
			"height"	: settings.sliderHeight	,
			"width"		: methods.getImageCount.apply($(this))*$(this).find(".mini_restriction_image").outerWidth(true)																		
		});
		
		$(this).find(".mini_slider_information").css({
			"height"			: settings.containerHeight - settings.sliderHeight,
			"width"				: settings.sliderWidth,
			"marginLeft"	: ((settings.containerWidth-settings.sliderWidth) /2)														 
		});
		
		$(this).find(".mini_slider_text").css({
			"height"			: settings.pictureHeight,
			"width"				:	settings.pictureWidth,
			"margin-left"	: (-1*settings.pictureWidth)-8
		});
		
	}
	
	$.fn.bsMiniSlider = function(method) {		
		if ( methods[method] ) {
			return methods[method].apply(this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			return methods.init.apply(this, arguments );
		} else {
			$.error( 'Method ' +  method + ' does not exist on jQuery.bsSlide' );
		}
	};
   
})(jQuery);