/*
/*
	LBi gallery v1.2
	
	A gallery of elements being shown i various ways
	
	Coded by Flemming Hansen 2011
	
	Built on jQuery library
	http://jquery.com
*/


var LBi_gallery = {};

(function($){	
	$.fn.LBi_gallery = function(options) {
	
		// support mutltiple elements
		if (this.length > 1) {
			this.each(function() {
				$(this).LBi_gallery(options)
			});
			return this;
		}
	
		// configurable by user
		var defaults = {
			type: "slideshow",				// type of transition
			dir: "ltr",						// slide direction (ltr, rtl, ttb, btt)
			offset: 1,						// start-position
			txtbg: "",
			speed:500,						// animation speed
			delay:2000,						// delay between animation
			width:300,						// width of images
			height:200,						// height of images
			cb_startAnim:function(){},		// callback when starting to animate next element. 
			cb_endAnim:function(){},		// callback when current animation has ended
			autostart: true,				// automatically start transitions
			fancyboxtitle:function(){}		// additional content for fancybox overlay
		}
				
		var options = $.extend(defaults, options); 

		// system
		if (options.data) {
			var oData = options.data;
		} else {
			var oData = $.parseJSON($(".oData", this).html()); // slideshow data
		}
		var obj = this;								// obj ref
		var output = "";							// html to be outputted
		var counter = 1;							// counter for current shown image (first = 1)
		var gal_width = options.width;				// image width
		var gal_height = options.height;			// image height
		var oTimer = {};							// loop timer
		var nDir = 1;								// slideshow direction as number (1 / -1)
		var delay = options.delay + options.speed;	// set delay-time between pictures to be after transition has finished
		var overlay = "";							// element overlay such as a video play icon
		var zidx = oData.length;					// index for layer to be shown in transitions
		var nextImg	= 2;							// next image to be shown in transition
		var prevImg = 1;							// previous shown image transition
		var animType = {};							// type of animation playing
		var ssImage = {};							// reference to the slideshow container
		var animating = false;						// check if animation is running before firering a new one
		var current = options.offset;				// current displayed item
		var currentElm = {}							// reference to current shown element
		
		if (options.dir == "rtl" || options.dir == "btt") {
			nDir = -1;
		}

		var init = function() {
		
			// elements wrapper
			if($(".ssImage", $(obj)).length == 0) {
					$(obj).append("<div class=\"ssImage\" style=\"position:absolute;z-index:1;top:0px;lef:0px;\"></div>");
			}
			ssImage = $(".ssImage", $(obj));
		
			if (oData.length > 1) {
				switch (options.type) {
				
				case "slideshow":
					slideshow();
					break
				case "fadeimage":
					fadeimage();
					break;
				case "fadebg":
					fadebg();
					break;
				default:
					alert("\""+options.type+"\" is not a valid gallery type. It should be one of these:\n- slideshow\n- fadeimage\n- fadebg");
					break;
				}
			}
			if (oData.length == 1) {
				// only one element, so just show it
				$(ssImage).html("<div class=\"pic pic-0 item\" style=\"position:absolute;width:"+gal_width+"px;height:"+gal_height+"px;top:0px;left:0px\"><img src=\""+oData[0]["image"]+"\">"+overlay(0)+addText(0)+"</div>");
				initFancybox();
				initLinks();
			}
		
			if (oData.length == 0) {
				// alert("no data");
			}

		}
		
		// SHOW VIDEO
		/*
		var showVideo = function(url) {
			stopAnim();
			
			var output = "<iframe width=\"640\" height=\"390\" src=\""+url+"?rel=0&autoplay=1&autohide=1\" frameborder=\"0\"></iframe>";
			$("body").append("<div id=\"videoplayer\">"+output+"<a href=\"javascript:;\" onclick=\"hideVideo()\" class=\"close\">CLOSE</a>");
		}
		*/
		/*
		var hideVideo = function() {
			$("#videoplayer").remove();
			init();
		}
		*/
		var overlay = function(nr) {
			var data = "";
			if (oData[nr].datatype == "youtube") {
//				data = "<a href=\""+oData[nr].youtube+"\" class=\"ic_videoplay\" style=\"cursor:pointer;\"></a>";
				data = "<a href=\""+oData[nr].youtube+"\" class=\"ic_videoplay\" style=\"position:absolute;width:"+gal_width+"px;height:"+gal_height+"px;left:0px;top:0px;cursor:pointer;display:block;z-index:9999;\"></a>";
			}

			if (oData[nr].datatype == "link") {
				data = "<a href=\""+oData[nr].link+"\" class=\"ic_link\" style=\"position:absolute;width:"+gal_width+"px;height:"+gal_height+"px;left:0px;top:0px;cursor:pointer;display:block;\"></a>";
			}
			
			return data;
		}

		
		// FANCYBOX
		var initFancybox = function() {
//			var o={};o.t=this.showFancy;
			//  init videos
			$("a.ic_videoplay", obj).each(function() {

				$(this).fancybox({
					'href' 			: this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
					'type'      	: 'swf',
					'overlayColor'	: '#000',
					'overlayOpacity': '0.8',
					'transitionIn'	: 'none',
					'transitionOut'	: 'none',
					'swf'       	: {'wmode':'transparent','allowfullscreen':'true'},
					'showCloseButton': false,
					'titlePosition'	: 'outside',
					'titleFormat'	: function() { return options.fancyboxtitle(cb_data()); }
				});

				$(this).click(function() {
					obj.stopIt();
				});
				
			});
		}
		
		// init link-items
		var initLinks = function() {
			$(".ic_videoplay, .ic_link", obj).each(function() {
				$(this).hover(function() {
					$(this).closest(".pic").addClass("over");
				}, function() {
					$(this).closest(".pic").removeClass("over");
				});
			});
		}
		
		var startAnim = function() {
			oTimer = setInterval(animType, delay);
		}
		
		var stopAnim = function() {
			clearInterval(oTimer);
			oTimer = false;
		}
		
		var addTextBg = function(oData) {
			if (oData.txtbg) {
				return " "+oData.txtbg;
			} else {
				return "";
			}
		}
		
		// ADD TEXT OVERLAY
		var addText = function(nr) {
			var out = "<div class=\"image-overlay\"></div><div class=\"textwrap"+addTextBg(oData[nr])+"\">";
			
			if (oData[nr].datatype == "youtube") {
				out += "<a href=\""+oData[nr].youtube+"\" class=\"ic_videobn\" style=\"cursor:pointer;\"></a>";

				if (oData[nr].headline) {
					out += "<div class=\"headline\">"+oData[nr]["headline"]+"</div>";
				}
				if (oData[nr].bodytxt) {
					out += "<div class=\"bodytxt\">"+oData[nr]["bodytxt"]+"</div>";
				}
			}

			if (oData[nr].datatype == "link") {

			
				if (oData[nr].headline) {
					out += "<div class=\"headline\">"+oData[nr]["headline"]+"<span class=\"icon\"></span></div>";
				}
				if (oData[nr].bodytxt) {
					out += "<div class=\"bodytxt\">"+oData[nr]["bodytxt"]+"</div>";
				}
			
			
/*			
				if (oData[nr].headline) {
					out += "<div class=\"headline\">"+oData[nr]["headline"]+"<span class=\"icon\"></span></div>";
				}
*/
		}
			/*
			if (document.createElement("detect").style.textShadow === undefined) {
				out += "<div class=\"headlineshadow\">"+oData[nr]["headline"]+"</div>";
			}
			*/
			out += "</div>"
			return out;
		}

		// FIND NEXT ELEMENT #
		var findNext = function() {
			if (current > oData.length) {
				return 0;
			} else {
				return current;
			}
		}
		
		// FIND PREVIOUS ELEMENT #
		var findPrevious = function() {
			if (current == 0) {
				return oData.length;
			} else {
				return current-1;
			}
		}
		
		// CALLBACK DATA
		var cb_data = function() {
			return {
				"cur-nr":current,
				"cur-ref":oData[current-1].ref,
				"next-nr":findNext(),
				"next-ref":oData[findNext()-1].ref,
				"prev-nr":findPrevious(),
				"prev-ref":oData[findPrevious()].ref,
				"ndir":nDir,
				"id":options.id
			};
		}
		
		// SLIDESHOW
		var slideshow = function() {

			// create all elements
			for (var t=0; t<oData.length; t++) {
				output +="<div class=\"pic pic-"+(t+1)+" item\" style=\"position:relative;width:"+gal_width+"px;height:"+gal_height+"px;overflow:hidden;float:left;\"><img src=\""+oData[t]["image"]+"\">"+overlay(t);
				output += addText(t);
				output += "</div>";
			}
			
			$(ssImage).html(output);
		
			$(ssImage, $(obj)).width(gal_width*oData.length+gal_width).height(gal_height);
			
			// clone first element to end fir circular slideshow
			$(ssImage).children("div:first").clone().appendTo(ssImage);


			initFancybox();
			initLinks();

			animType = slideshowAnim;
			if (options.autostart) {
				startAnim();
			}
			
		}
		
		var slideshowAnim = function() {
			if (!animating) {
				current+=nDir;
				
				if (current == 0) {
					$(ssImage).css("left",-(oData.length*gal_width));
					current = oData.length;
				}

				var tmpCur = current;

				if (current > oData.length) {
					current = 1;
				}

				options.cb_startAnim(cb_data());

				animating = true;
				$(ssImage).animate({
					left:"-="+(gal_width*nDir)
					
				}, options.speed, function() {
					animating = false;
					if (tmpCur > oData.length) {
						$(ssImage).css("left",0);
					}

					options.cb_endAnim(cb_data());
				});
			}
		}

		// FADE IMAGE
		var fadeimage = function() {
			for (var t=0; t<oData.length; t++) {
				output += "<div class=\"pic pic-"+(t+1)+"\" style=\"position:absolute;top:0px;left:0px;\"><img src=\""+oData[t]["image"]+"\">"+overlay(t);
				output += addText(t);
				output += "</div>";
			}

			$(ssImage).html(output);

			$(ssImage).children(".pic").css({"opacity":0});
			//$(ssImage).children().not(".pic-"+current).css({"opacity":"0"});
			$(ssImage).children(".pic-"+current).css({"opacity":1});
			
			initFancybox();
			initLinks();

			animType = fadeimageAnim;
			if (options.autostart) {
				startAnim();
			}
			
		}

		var fadeimageAnim = function() {
			if (!animating) {
				if (current == oData.length) {
					current = 0;
				}
				current++;
				animating = true;
				options.cb_startAnim(cb_data());
				$(ssImage).children(".pic-"+current).css({"opacity":"0","z-index":1}).animate({
					opacity: 1
				}, options.speed, 'linear', function() {
					$(ssImage).children().not(".pic-"+current).css({"opacity":"0"});
					$(ssImage).children().css({"z-index":0});
					animating = false;
					options.cb_endAnim(cb_data());
				});
			}
		}
		

		// FADE BG
		var fadebg = function() {

			for (var t=0; t<oData.length; t++) {
				output += "<div class=\"pic pic-"+(t+1)+"\" style=\"position:absolute;top:0px;left:0px;z-index:1\"><img src=\""+oData[t]["image"]+"\">"+overlay(t);
				output += addText(t);
				output += "</div>";
			}

			$(ssImage).html(output);

			$(ssImage).children().not(".pic-"+current).css({"opacity":"0"});
			$(ssImage).children(".pic-"+current).css({"opacity":"1", "z-index":"2"});
			currentElm = $(ssImage).children(".pic-"+current);
			
			initFancybox();
			initLinks();

			animType = fadebgAnim;
			if (options.autostart) {
				startAnim();
			}
			
		}
		
			
		var fadebgAnim = function() {
			if (!animating) {
				if (current == oData.length) {
					current = 0;
				}
				current++;
				animating = true;
				options.cb_startAnim(cb_data());
				$(currentElm).animate({
					opacity: 0
				}, options.speed/2, 'linear', function() {
					$(ssImage).children(".pic-"+current).animate({
						opacity:1
					}, options.speed/2, 'linear', function() {
						$(ssImage).children(".pic").css("z-index","1");
						$(ssImage).children(".pic-"+current).css("z-index","2");
						currentElm = $(ssImage).children(".pic-"+current);
						animating = false;
						options.cb_endAnim(cb_data());
					});
				});
			}
		}

		// PUBLIC FUNCTIONS

		// stop animation
		var stopIt = function() {
			stopAnim();
		}

		// start animation
		var startIt = function() {
			stopAnim();
			animType();
			startAnim();
		}

		// go to a specific element and start animation
		var gotoAndPlay = function(ref) {
			stopAnim();
			var go = -1;
			for (var t=0; t<oData.length; t++) {
				if (ref == oData[t].ref) {
					go = t;
				}
			}
			// slideshow
			counter = go;
			//fade
			nextImg = go;
			//init();
			animType("goto");
			startAnim();
			options.cb_startAnim(cb_data());
		}
		
		// go to a specific element and stop animation
		var gotoAndStop = function(ref) {
			if (current != ref.split("-")[1] && !animating) {
				current = ref.split("-")[1]-1;
	
				stopAnim();
				animType();
			}
		}
		
		var slideNext = function() {
			stopAnim();
			nDir = 1;
			animType();
		}

		var slidePrev = function() {
			stopAnim();
			nDir = -1;
			animType();
		}

		this.getLink = function(idx) {
			return oData[idx-1].link;
		}

		this.getHeadline = function(idx) {
			return oData[idx-1].headline;
		}

		
		init();
		
		return {
			startIt:startIt,
			stopIt:stopIt,
			gotoAndPlay:gotoAndPlay,
			gotoAndStop:gotoAndStop,
			slidePrev:slidePrev,
			slideNext:slideNext
		};
	}
})(jQuery);