/**
 * WidgetFotoalubm.js
 * Groupsystem 2.0:
 * Copyright: Siegfried Mairböck, 2011
 * Juni 2011
 */

$(function() {
	$(".Fotoalbum").each( 
		function (idx,obj) {
			var fa = new WidgetFotoalbum();
			fa.init(idx,obj);
		}
	);
});


function WidgetFotoalbum () {
	this.album_id = 0;
	this.idx = 0;
	this.base_obj = null;
	this.browser_obj = null;
	this.imgdata = [];
	this.aktuell_idx = 0;
	this.min_fade = 0.4;
	
	var self = this;
	
	this.init = function (idx,obj) {
		this.idx = idx;
		this.base_obj = obj;
		
		this.browser_obj = $('<div class="FotoBrowser">' +
							 '<div class="FotoBrowser-navigation">' + 
							 '<a class="FotoBrowser-vorher" href="">vorheriges Bild</a>' + 
							 '<a class="FotoBrowser-naechstes" href="">nächstes Bild</a>' + 
							 '<div class="FotoBrowser-bildnummer"></div>' +
							 '</div>' +
							 '<div class="FotoBrowser-preview"><ul class="FotoBrowser-preview-ul"></ul></div>' +
							 '<div class="FotoBrowser-ansicht">' + 
							 '<div class="FotoBrowser-image"></div>' + 
							 '<div class="FotoBrowser-links" title="Ein Bild vorher ..."></div>' +
							 '<div class="FotoBrowser-rechts" title="Ein Bild weiter ..."></div>' +
							 '</div>' +
							 '<div class="FotoBrowser-bildtext"></div>' +
							 '</div>');
		$(obj).before(this.browser_obj);
		
		this.imgdata = [];

		// Setup Fotobrowser
		$(".Fotoalbum-item",obj).each(
			function (idx)	{
				self.foto_add(idx,this);
			}	
		);
		
		$(".FotoBrowser-preview-li",this.browser_obj)
			.fadeTo(0,self.min_fade)
			.click( function (ev) {
				var idx = $(this).attr("data");
				self.show(idx);
			})
			.mouseenter(function () {
				$(this).stop(true,true).fadeTo("normal",1);
			})
			.mouseleave(function () {
				if ($(this).hasClass("FotoBrowser-preview-selected")) return;
				$(this).stop(true,true).fadeTo("normal",self.min_fade);
			});
		
		
		// Erstes Bild anzeigen
		this.show(0);
/*
		$(".FotoBrowser-ansicht",self.browser_obj).click(function () {
			self.show_next();
		});
*/		
		$(".FotoBrowser-rechts",self.browser_obj)
			.fadeTo(0,0)
			.click(function (ev) { ev.preventDefault(); self.show_next(); })
			.mouseenter(function () { $(this).stop(true,true).fadeTo("slow",1); })
			.mouseleave(function () { $(this).stop(true,true).fadeTo("normal",0); });
			
		$(".FotoBrowser-links",self.browser_obj)
			.fadeTo(0,0)
			.click(function (ev) { ev.preventDefault(); self.show_before(); })
			.mouseenter(function () { $(this).stop(true,true).fadeTo("slow",1); })
			.mouseleave(function () { $(this).stop(true,true).fadeTo("normal",0); });
			
		// Navigation
		$(".FotoBrowser-vorher",self.browser_obj)
			.click( function (ev) { ev.preventDefault(); self.show_before(); });
		$(".FotoBrowser-naechstes",self.browser_obj)
			.click( function (ev) { ev.preventDefault(); self.show_next(); });
	};
	
	
	this.foto_add = function (idx,from_obj) {
		var datei = $(from_obj).attr("datadatei");
		var pfad = $(from_obj).attr("datapfad");
		var $thumb = $('<li class="FotoBrowser-preview-li" data="' + idx + '"><img class="FotoBrowser-preview-img" src="' + pfad + 'sq-' + datei + '" alt=""></li>');
		$(".FotoBrowser-preview-ul",this.browser_obj).append($thumb);
		
		this.imgdata[idx] = { idx: idx, datei: datei, pfad: pfad };
	};
	
	this.show_next = function () {
		self.show(self.aktuell_idx + 1);
	}

	this.show_before = function () {
		self.show(self.aktuell_idx - 1);
	}

	this.show = function (idx) {
		if (idx < 0) idx = this.imgdata.length - 1;
		if (idx >= this.imgdata.length) idx = 0;

		self.aktuell_idx = idx;
		
		var data = self.imgdata[idx];
		var bild = data.pfad + 'm-' + data.datei;
		
		$(".FotoBrowser-preview-li",self.browser_obj)
			.removeClass("FotoBrowser-preview-selected")
			.stop(true,true).fadeTo(0,self.min_fade)
			.eq(idx)
			.addClass("FotoBrowser-preview-selected").stop(true,true).fadeTo("normal",1);
		
		var $image = $(".FotoBrowser-image",self.browser_obj);
		var weite = $(".FotoBrowser-preview",self.browser_obj).width();
		var hoehe = $image.height();
		var i_weite = $(".FotoBrowser-preview-li",self.browser_obj).first().width() + 4;

		$image.fadeOut("fast",function () {
			$(this).css( { backgroundImage: 'url(' + data.pfad + 'm-' + data.datei + ')' })
				.html('<img src="' + bild + '" alt="">')
				.fadeIn("fast");
		});
		
		var pos_x = (weite / 2) - (i_weite * idx) - (i_weite / 2);
		$(".FotoBrowser-preview-ul",self.browser_obj)
			.stop(true,true)
			.animate({
				left: pos_x
			},
			400,
			function () {
				
			});
		
		// Navigation
		$(".FotoBrowser-bildnummer",self.browser_obj)
			.html(
				$("li",self.base_obj).eq(idx).find(".Fotoalbum-bildnummer").html()
			);

		// Bildtext
		$(".FotoBrowser-bildtext",self.browser_obj)
			.html(
				'<div class="FotoBrowser-bildtext-beschreibung">' +
				$("li",self.base_obj).eq(idx).find(".Fotoalbum-Bildtext").html() +
				'</div>'
				);
			
	};
}