/*
	Οδηγίες χρήσης:
	Προυπόθεση για να παίξει είναι να έχουμε κάνει include στο head το jquery library.
	Βάζουμε στο head της σελίδας το css jquery.pankak-slideshow.css και το jquery.pankak-slideshow.js.
	Στο σημείο που θέλουμε να εμφανίσουμε το slideshow βάζουμε τον παρακάτω κώδικα:
	<div id="slideShow"></div>

	Στο head βάζουμε:
		$(document).ready(function(){
			$("#slideShow").pankakgallery();
		});		
*/
(function($) {
	
	$.fn.pankakgallery = function(options) {
		var settings = $.extend({
				bgAlpha: 80,
				bgColor: "#333333",
				titleColor: "#FFFFFF",
				descrColor: "#FFFFFF",
				titleFontSize: 22,
				descrFontSize: 16,
				dotImage: "images/dot_trans.gif",
				xmlPath: "xml/slideshows/flashbanner.xml",
				slideDuration: 9000,
				textPanelShowDelay: 800,
				textPanelSlideDuration: 300
		}, options);		
		
		var maximumItems = 8
		var rootObj = this;
		var totalItems = 0;
		
		//Δημιουργεί το html που χρειάζεται για τη λειτουργία του control
		createHtml();
		
		$("#panelForTextBackground").slideDown("slow", function(){$("#panelForText").fadeIn("slow")});
		$.ajax({
			type: "GET",
			url: settings.xmlPath,
			dataType: "xml",
			success: ParseXmlForGallery
		});	
		
		var isDuringTransition = false;

		function ParseXmlForGallery(xml) {
			$("#slideShow").data("data", {
				xmlData: xml,
				currentIndex: 0,
				previousIndex: 0,
				timeout:0
			});
			var globals = $(xml).find("globals");
			var width = parseInt(globals.find("width").text());
			var height = parseInt(globals.find("height").text());
			var bgColor = $.trim(globals.find("bgColor").text());
			var bgAlpha = $.trim(globals.find("bgAlpha").text());
			var titleColor = $.trim(globals.find("titleColor").text());
			var titleFontSize = $.trim(globals.find("titleFontSize").text());
			var descriptionColor = $.trim(globals.find("descriptionColor").text());
			var descriptionFontSize = $.trim(globals.find("descriptionFontSize").text());
			if (bgAlpha.length <= 0) { bgAlpha = settings.bgAlpha; }
			if (bgColor.length <= 0) { bgColor = settings.bgColor; }
			if (titleColor.length <= 0) { titleColor = settings.titleColor; }
			if (descriptionColor.length <= 0) { descriptionColor = settings.descrColor; }
			if (titleFontSize.length <= 0) { titleFontSize = settings.titleFontSize; }
			if (descriptionFontSize.length <= 0) { descriptionFontSize = settings.descrFontSize; }
		
			$("#panelForTextBackground").css("background-color", bgColor).css("filter", "alpha(opacity=" + bgAlpha + ")").css("opacity", parseFloat(bgAlpha / 100.0));
			$("#panelForTextBackground").css("-moz-opacity", parseFloat(bgAlpha) / 100.0);
			$("#panelForText h1").css("color", titleColor).css("font-size", titleFontSize + "px");;
			$("#panelForText .summary").css("color", descriptionColor).css("font-size", descriptionFontSize + "px");
		
			var items = $(xml).find("item");
			totalItems = items.length;
			if (totalItems >= maximumItems) totalItems = maximumItems;
			var liItem = $("<li>");
			liItem.append("<a href='#' onclick='DisplayPreviousItem();' class='prev'><img src='" + settings.dotImage + " /></a>");
			liItem.appendTo("#slideShow .navigator ul");
			liItem.click(function() { DisplayPreviousItem(); });
//			for (var i = 0; i < items.length; i++) {
			for (var i = 0; i < totalItems; i++) {
				var newImg = $("<img>");
				newImg.attr("id", "backgroundImage" + i);
				newImg.addClass("bgr");
				newImg.insertBefore("#panelForTextBackground");
				if ($.trim($(items[i]).find("url").text()).length > 0) {
					var newLink = $("<a>");
					newLink.attr("href", $.trim($(items[i]).find("url").text()));
					if ($.trim($(items[i]).find("target").text()).length > 0 && $.trim($(items[i]).find("target").text()) != "_self") { 
						newLink.attr("target", $(items[i]).find("target").text()); 
					}
					newImg.wrap(newLink.get(0));
				}
				//backgroundImages[i][0].src = $(items[i]).find("image").text();
				newImg.hide();
				var liItem = $("<li>");
				liItem.append("<a href='#' onclick='DisplayItem(" + i + ");' class='dot'><img src='" + settings.dotImage + "' /></a>");
				liItem.appendTo("#slideShow .navigator ul");
			}
			$("#slideShow .navigator ul .dot").each(function(itemIndex, elm) {
				$(elm).click(function() { DisplayItem(itemIndex); });
			});			
			var liItem = $("<li>");
			liItem.append("<a href='#' onclick='DisplayNextItem();' class='next'><img src='" + settings.dotImage + "' /></a>");
			liItem.appendTo("#slideShow .navigator ul");
			liItem.click(function() { DisplayNextItem(); });
			
//			$("#slideShow").data("data").previousIndex = items.length - 1;
			$("#slideShow").data("data").previousIndex = totalItems - 1;
			$("#slideShow .navigator .prevButton").click(function(e){
				e.preventDefault();
				if ($("#slideShow").data("data").currentIndex == 0) {
					DisplayItem(items.length-1);
				}else{
					DisplayItem($("#slideShow").data("data").currentIndex - 1);
				}
			});
			$("#slideShow .navigator .nextButton").click(function(e){
				e.preventDefault();
				DisplayItem($("#slideShow").data("data").currentIndex + 1);
			});
			DisplayItem(-1);
		}

		function DisplayItem(itemIndex) {
			if (isDuringTransition) return;
			isDuringTransition = true;
			if (itemIndex == $("#slideShow").data("data").currentIndex) { 
				isDuringTransition = false;
				return; 
			}	
			clearTimeout($("#slideShow").data("data").timeout);
			var xml = $("#slideShow").data("data").xmlData;
			var isFirstRun = itemIndex < 0;
			if (isFirstRun) {itemIndex = 0;}
			var items = $(xml).find("item");
			if (itemIndex >= items.length || itemIndex >= maximumItems) { itemIndex = 0; }
			$("#slideShow").data("data").previousIndex = $("#slideShow").data("data").currentIndex;
			$("#slideShow").data("data").currentIndex = itemIndex;
			var xitem = $(items[itemIndex]);
			var image = xitem.find("image").text();
			var title = xitem.find("title").text();
			var url = $.trim(xitem.find("url").text());
			var target = xitem.find("target").text();
			var description = xitem.find("description").text();
			var timer = xitem.find("timer").text();
			var bgColor = $.trim(xitem.find("bgColor").text());
			var bgAlpha = $.trim(xitem.find("bgAlpha").text());
			var titleColor = $.trim(xitem.find("titleColor").text());
			var titleFontSize = $.trim(xitem.find("titleFontSize").text());
			var descriptionColor = $.trim(xitem.find("descriptionColor").text());
			var descriptionFontSize = $.trim(xitem.find("descriptionFontSize").text());
			var x1 = $.trim(xitem.find("resize").attr("x1"));
			var x2 = $.trim(xitem.find("resize").attr("x2"));	
			var y1 = $.trim(xitem.find("resize").attr("y1"));	
			var y2 = $.trim(xitem.find("resize").attr("y2"));	
			var channelImageUrl = $.trim(xitem.find("channel").attr("url"));
			var date = $.trim(xitem.find("channel").attr("date"));
			var time = $.trim(xitem.find("channel").attr("time"));
			
			var globals = $(xml).find("globals");
			var gWidth = parseInt(globals.find("width").text());
			var gHeight = parseInt(globals.find("height").text());
			var gBgColor = $.trim(globals.find("bgColor").text());
			var gBgAlpha = $.trim(globals.find("bgAlpha").text());
			var gTitleColor = $.trim(globals.find("titleColor").text());
			var gTitleFontSize = $.trim(globals.find("titleFontSize").text());
			var gDescriptionColor = $.trim(globals.find("descriptionColor").text());
			var gDescriptionFontSize = $.trim(globals.find("descriptionFontSize").text());
		
			if ($.trim(gBgAlpha).length <= 0) { gBgAlpha = settings.bgAlpha; }
			if ($.trim(bgAlpha).length <= 0) { bgAlpha = gBgAlpha; }
			if ($.trim(gBgColor).length <= 0) { gBgColor = settings.bgColor; }
			if ($.trim(bgColor).length <= 0) { bgColor = gBgColor; }
			if ($.trim(gTitleColor).length <= 0) { gTitleColor = settings.titleColor; }
			if ($.trim(titleColor).length <= 0) { titleColor = gTitleColor; }
			if ($.trim(gDescriptionColor).length <= 0) { gDescriptionColor = settings.descrColor; }
			if ($.trim(descriptionColor).length <= 0) { descriptionColor = gDescriptionColor; }
			if ($.trim(gTitleFontSize).length <= 0) { gTitleFontSize = settings.titleFontSize; }
			if ($.trim(titleFontSize).length <= 0) { titleFontSize = gTitleFontSize; }
			if (gDescriptionFontSize.length <= 0) { descriptionFontSize = settings.descrFontSize; }
			if (descriptionFontSize.length <= 0) { descriptionFontSize = gDescriptionFontSize; }
			
			var titleHtml = title;
			var summaryHtml = description;
			if (url.length > 0) {
				if (url.length > 0) {
					titleHtml = "<a href='" + url + "'";
					if (target.length > 0) { titleHtml += " target='" + target + "' style='color:" + titleColor + "; font-size:" + titleFontSize + "px'>"; }
					titleHtml += title + "</a>";
					summaryHtml = "<a href='" + url + "'";
					if (target.length > 0) { summaryHtml += " target='" + target + "' style='color:"  + descriptionColor + "; font-size:" + descriptionFontSize + "px'>"; }
					summaryHtml += description + "</a>";
				}
			}
		
			if (isFirstRun) {
					var channelInfo = "";
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Απενεργοποιώ date - time
					//if (time.length > 0) { channelInfo += time; }
					//if (date.length > 0) { channelInfo = date + "&nbsp;" + channelInfo};
					$("#channelInfo").html(channelInfo);
					var imageUrl = "Thumbnail.ashx?url=" + image + "&width=" + gWidth + "&height=" + gHeight + "&x1=" + x1 + "&y1=" + y1 + "&x2=" + x2 + "&y2=" + y2
					$("#panelForText h1").css("color", titleColor).css("font-size", titleFontSize + "px").html(titleHtml);
					$("#panelForText .summary").css("color", descriptionColor).css("font-size", descriptionFontSize + "px").html(summaryHtml);
					$("#backgroundImage" + itemIndex).get(0).src = imageUrl;
					$("#backgroundImage" + itemIndex).show();
					$("#slideShow .navigator .dot:eq(" + itemIndex + ")").toggleClass("dotCurrent");
					$("#panelForTextBackground").css("background-color", bgColor).css("filter", "alpha(opacity=" + bgAlpha + ")").css("opacity", parseFloat(bgAlpha / 100.0));
					$("#panelForTextBackground").css("-moz-opacity", parseFloat(bgAlpha) / 100.0);
					isDuringTransition = false;
			}else{
				$("#panelForText").fadeOut("fast", function(){
					var channelInfo = "";
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Απενεργοποιώ date - time
					//if (time.length > 0) { channelInfo += time; }
					//if (date.length > 0) { channelInfo = date + "&nbsp;" + channelInfo};
					$("#channelInfo").html(channelInfo);
		
					$("#slideShow .navigator .dot:eq(" + itemIndex + ")").toggleClass("dotCurrent");
					$("#slideShow .navigator .dot:gt(" + itemIndex + ")").removeClass("dotCurrent");
					$("#slideShow .navigator .dot:lt(" + itemIndex + ")").removeClass("dotCurrent");
					//$(".navigator").hide();
					$("#panelForTextBackground").fadeOut("slow", function() {
					});
					if($("#backgroundImage" + itemIndex).get(0).src.length <= 0) {
						var imageUrl = "Thumbnail.ashx?url=" + image + "&width=" + gWidth + "&height=" + gHeight + "&x1=" + x1 + "&y1=" + y1 + "&x2=" + x2 + "&y2=" + y2
						$("#backgroundImage" + itemIndex).get(0).src = imageUrl;
					}
					$("#backgroundImage" + itemIndex).fadeIn("slow", function() {$("#backgroundImage" + $("#slideShow").data("data").previousIndex).hide(); });
					$("#backgroundImage" + itemIndex).css("z-index", 1);
					$("#backgroundImage" + $("#slideShow").data("data").previousIndex).css("z-index", 0);
					$("#panelForText h1").css("color", titleColor).css("font-size", titleFontSize + "px").html(titleHtml);
					$("#panelForText .summary").css("color", descriptionColor).css("font-size", descriptionFontSize + "px").html(summaryHtml);
					if (descriptionColor.length > 0) { $("#panelForText .summary").css("color", descriptionColor); }
					if (descriptionFontSize.length > 0) { $("#panelForText .summary").css("font-size", descriptionFontSize + "px"); }
					setTimeout(function(){
						$("#panelForTextBackground").css("background-color", bgColor).css("filter", "alpha(opacity=" + bgAlpha + ")").css("opacity", parseFloat(bgAlpha / 100.0));
						$("#panelForTextBackground").css("-moz-opacity", parseFloat(bgAlpha) / 100.0);
						$("#panelForTextBackground").slideDown(settings.textPanelSlideDuration, function(){/*$(".navigator").show();*/ $("#panelForText").fadeIn("slow", function() {isDuringTransition = false; })});
					}, settings.textPanelShowDelay);
			
				});
			}
			if (totalItems > 1) {
				$("#slideShow").data("data").timeout = setTimeout(function(){
					DisplayItem(itemIndex + 1);
				}, settings.slideDuration);			
			}
		}

		function DisplayPreviousItem() {
			if (isDuringTransition) return;
			if ($("#slideShow").data("data").currentIndex - 1 < 0)
			{
				var itemsLength = $($("#slideShow").data("data").xmlData).find("item").length;
				if (itemsLength >= maximumItems) itemsLength = maximumItems;
				DisplayItem(itemsLength - 1);
			}else{
				DisplayItem($("#slideShow").data("data").currentIndex - 1);
			}
		}
		function DisplayNextItem() {
			if (isDuringTransition) return;
			DisplayItem($("#slideShow").data("data").currentIndex + 1);
		}

		function createHtml() {
			var componentHtml = "\
					<div id='panelForTextBackground'></div>	\
					<div class='navigator'>									\
						<ul></ul>															\
					</div>																	\
					<div id='panelForText'>									\
						<h1></h1>															\
						<div class='summary'></div>						\
						<div id='channelInfo'></div>					\
					</div>";
			$(rootObj).html(componentHtml);
		}		
		
	}
		
})(jQuery);