
var gallery = {
	
	isOpen:false,
	
	$layer:null,
	
	toOpen:null,
	
	
	startX:0,
	startY:0,
	
	dx:0,
	dy:0,
	
	isMove: false,
	isForce: false,
	
	currentIndex:0,
	maxItems:0,
	
	init:function () {
		$('#foto-serien-list')
			.parent()
			.parent()
			.append( $('<div>').attr('id','fotogallery-wrapper') );
			
		gallery
			.$layer = $('#fotogallery-wrapper');
		
		gallery
			.$layer
			.append(
				$('<div>')
					.attr('id','gallery-info-wrapper')
					.append(
						$('<h2>'),
						$('<h1>'),
						$('<a>')
						.attr('id','gallery-close-bn')
						.click(gallery.closeGallery)
						.append(
							$('<img>')
								.attr('src','images/gallery-close-bn.png')
						)
					)
			

					
			)
			.append( 
				$('<div>')
					.attr('id','fotogallery-inner')
					.append(
						$('<div>')
							.attr({
								'id':'fotogallery-loader',
								onselect:'return fasle;',
								onclick:'return false;'
								})
						)
			);
		
		
		gallery.$layer.hover(function () {slider.isActiv = false;}, function () {slider.isActiv = true;})
	
	
		
	},
	
	
	
	
	
	
	updateThumbs: function () {
	
		$('.fotoserien_container')
			.hover (
				function () {
					$(this)
						.find('.fotoserien_container-inner')
						.stop()
						.animate({'background-color':'#333333'}, 400);
				},
				function () {
					$(this)
						.find('.fotoserien_container-inner')
						.stop()
						.animate({'background-color':'#0F0F0F'}, 400);					
				}
			);
			
			
		$('#serien_thumbs > div').click (gallery.openGallery);
	},
	
	
	
	
	openGallery: function () {
		
		if (gallery.isOpen == false) {
			
			gallery.isOpen = true;
			gallery.toOpen = $(this).attr('datum');
			
			gallery
				.$layer
				.css('display','block')
				.addClass('loader')
				.animate({height:500, marginTop:-280},300, gallery.onLayerOpen);
				
			pm.beforChange = gallery.closeGallery;
		}
	},
	
	
	
	triggerGallery: function (datum) {

		if (gallery.isOpen == false) {
			
			gallery.isOpen = true;
			gallery.toOpen = datum;
			
			gallery
				.$layer
				.css('display','block')
				.addClass('loader')
				.animate({height:500, marginTop:-280},300, gallery.onLayerOpen);
				
			pm.beforChange = gallery.closeGallery;
		}		
		
		
	},
	
	
	
	onLayerOpen: function () {
		pm.hideContentLayers();
		$.getJSON('templates/fotos_get_thumbs.php',{ser:gallery.toOpen}, gallery.onDataLoaded);	
	},
	
	
	onDataLoaded: function (json) {
		

		
		gallery.$layer.removeClass('loader');
		
		var line_max = 24;
		var current_index = 0;
		var current_row = 0;
		
		if (json) {
			
			$iw = $('#gallery-info-wrapper');
			$iw.children('h2').html(json.data.serie.tag+'//'+json.data.serie.monat+'//'+json.data.serie.jahr);
			$iw.children('h1').html(json.data.serie.titel);
			
			fft.serTitel = json.data.serie.titel;
			fft.serDate = json.data.serie.tag+'.'+json.data.serie.monat+'.'+json.data.serie.jahr;
			fft.ser= gallery.toOpen;
			
			gallery.maxItems = json.data.images.length;
			
			$.each(json.data.images, function (i, elem) {
				
				
			$item = $('<div>')
							.addClass('item')
							.append(
								$('<a>')
									.attr({'href':'getpic.php?path='+elem.verz+'&pic='+elem.nr, rel:'fancybox', onselect:'return false;', onmousedown:'return false;', ondragstart:'return false;',  ondrag:'return false'})
									.append(
										$('<img>')
											.attr({'src':'fotos/'+elem.verz+"/thumb"+elem.name, onmousedown:'return false;', onselect:'return false;', ondragstart:'return false;', ondrag:'return false'})
									)
							)
							.css({
								left:154 * current_index,
								top:104 * current_row
								
							})
				
				
				if (elem.comments > 0) {
					$item
						.children ('a')
						.append(
							$('<div>')
								.addClass('fb-gallerytagcount')
								.append('<h1>'+elem.comments+'</h1>')
								.css({position:'absolute',bottom:'0', right:'0', marginRight:'5px'})
						)					
				}
				
				$('#fotogallery-loader')
					.append($item);
					
				current_index ++;
				
				if (current_index > line_max) {
					current_index = 0;
					current_row ++;
				}
				
			})
		}
		
		
		$('#fotogallery-loader')
			.mousedown(gallery.onLayerDown)
			.scrollLeft( (line_max * 150) /2 )
			.scrollTop( (current_row * 100) /2 )
			.find('a')
			.click(function (e) {
				return false;
			});
		
	},
	

	onLayerDown: function (e) {
		
		gallery.startX = e.pageX;
		gallery.startY = e.pageY;
		
		$('#fotogallery-loader')
			.stop()
			.bind('mousemove',gallery.onLayerMove);
				
		$('#page-size')
			.bind('mouseup', gallery.onLayerUp);
			
		gallery.isForce = false;
		
	},


	onLayerMove: function (e) {
		
		$t = $('#fotogallery-loader');
		
		gallery.dx = gallery.startX - e.pageX;
		gallery.dy = gallery.startY - e.pageY;
		
		
		var offsetLeft = $t.scrollLeft();
		var offsetTop = $t.scrollTop();
		
		
		$t
		.scrollLeft( offsetLeft + gallery.dx )
		.scrollTop( offsetTop + gallery.dy );
		
		if ( Math.abs(gallery.dx + gallery.dy) > 0 )
			gallery.isMove = true;
		else
			gallery.isMove = false;
		
		
		if ( Math.abs(gallery.dx + gallery.dy) > 5 )
			gallery.isForce = true;
		else
			gallery.isForce = false;
		
		
		gallery.startX = e.pageX;
		gallery.startY = e.pageY;	
		
	},
	
	
	onLayerUp: function (e) {
		
		$t = $('#fotogallery-loader');
		
		$('#fotogallery-loader')
			.unbind('mousemove')
			
			
		$('#page-size')
			.unbind('mouseup');
			
			
		if (gallery.isMove == false) {
			
			$a = $(e.target).closest('.item').children('a');
			href = $a.attr('href');
			
			gallery.currentIndex = $t.find('a').index($a)
			
			
			var data = $a.data('data');
			
			if (typeof href != 'undefined'	) {				
				$.fancybox ({
					href: href,
					'transitionIn'	: 'elastic',
					'transitionOut'	: 'elastic',
					orig:$a,
					onClosed:fft.stop,
					padding:5,
					margin:5
				});	
			}
			
			
			
		}
		
		if (gallery.isForce ) {
			
			var offsetLeft = $t.scrollLeft();
			var offSetTop = $t.scrollTop();
			
			$t
			.stop()
			.animate({
				scrollLeft: offsetLeft + (gallery.dx * 15),
				scrollTop: offSetTop + (gallery.dy * 15)
				},1000);
			
		}
		
			
		gallery.isMove = false;
	},
	
	
	onThumbUp: function (e) {
		
		
		return false;
		
	},
	
	
	closeGallery: function (cb) {

		$('#fotogallery-loader')
			.unbind('mousedown')
			.unbind('mousemove')
			
			
		$('#page-size')
			.unbind('mouseup');		
		
		pm.showContentLayers();
		gallery
			.$layer
			.animate({height:0, marginTop:0},200, 
				function () {
					$('#fotogallery-loader').html('');
					gallery.isOpen = false;
					gallery.isOpen = false;
					gallery.currentIndex = 0;
					gallery.maxItems = 0;
					gallery.$layer.css('display','none');
					
					
					if (typeof (cb) == "function") cb();
					
					}
			
			);		
		
	},
	
	showNext: function () {
		fft.stop();
		if (gallery.currentIndex + 1 < gallery.maxItems) {
			gallery.currentIndex ++ ;
			$target = $($('#fotogallery-loader').find('a')[gallery.currentIndex]);
			var href = $target.attr('href');
			$.fancybox ({
				href: href,
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'elastic',
				orig:$target,
				onClosed:fft.stop,
				padding:5,
				margin:5
			});
		}
		
	},
	
	
	showPrev: function () {
		fft.stop();
		if (gallery.currentIndex - 1 >= 0) {
			gallery.currentIndex -- ;
			$target = $($('#fotogallery-loader').find('a')[gallery.currentIndex]);
			var href = $target.attr('href');
			
			$.fancybox ({
				href: href,
				'transitionIn'	: 'elastic',
				'transitionOut'	: 'elastic',
				orig:$target,
				onClosed:fft.stop,
				padding:5,
				margin:5
			});
		}

		
	}
	
}

fft = {
	user_id:null,
	
	imageTarget :null,
	
	imageWidth:480,
	imageHeight:321,
	
	minWidth:50,
	minHeight:50,
	maxWidth:250,
	maxHeight:250,
	
	serTitel:null,
	serDate:null,
	ser:null,
	
	sizerID:'#resizeMe',
	
	targetID:null,

	start:function (targetID) {
		if ($('#'+targetID).length > 0) {
		
			fft.stop();
			$(document.body).append('<div id="fft-saver"><h1>Person ausw&auml;hlen</h1><form id="fft-saver-taged-user"><div id="fft-saver-pchoser"><center><img src="facebook_connect/images/loader.gif" /></center></div></form><span style="color:#666">Kommentar hinzuf&uuml;gen:</span><textarea id="fft-textarea" style="height:60px; width:215px;" onfocus="this.value="""></textarea><button class="fft-button" onclick="fft.save()">Speichern </button></div>');
			$(document.body).append('<div id="resizeMe"><div id="resizeSE"></div><div id="resizeE"></div><div id="resizeNE"></div><div id="resizeN"></div><div id="resizeNW"></div><div id="resizeW"></div><div id="resizeSW"></div><div id="resizeS"></div></div>');
			
			$('#fft-saver-pchoser').load('facebook_connect/load_frinds.php');
			
			var imageTop = $('#'+targetID).offset().top;
			var imageLeft = $('#'+targetID).offset().left;
			
			$('#fft-saver').css({'top':imageTop - 5,'left':imageLeft + fft.imageWidth + 10});
			
			fft.targetID = targetID;
			
			$(fft.sizerID).Resizable(
				{
					minWidth: fft.minWidth,
					minHeight: fft.minHeight,
					maxWidth: fft.maxWidth,
					maxHeight: fft.maxHeight,
					minTop: imageTop,
					minLeft: imageLeft,
					maxRight: imageLeft+fft.imageWidth,
					maxBottom: imageTop+fft.imageHeight,
					dragHandle: true,
					handlers: {
						se: '#resizeSE',
						e: '#resizeE',
						ne: '#resizeNE',
						n: '#resizeN',
						nw: '#resizeNW',
						w: '#resizeW',
						sw: '#resizeSW',
						s: '#resizeS'
					}
				}
			).css ({'left':imageLeft,'top':imageTop});
		}else{
			alert("The target = '"+targetID+"' dossen't exist! Please check targetID!");	
		}
	},
	
	save:function () {
		
		var imageTop  = $('#'+fft.targetID).offset().top;
		var imageLeft = $('#'+fft.targetID).offset().left;

		var sizerTop  = $(fft.sizerID).offset().top;
		var sizerLeft = $(fft.sizerID).offset().left;

		var relativTop  = sizerTop - imageTop;
		var relativLeft = sizerLeft - imageLeft;
		var sizerWidth  = $(fft.sizerID).css('width');
		var sizerHeight = $(fft.sizerID).css('height');
		
		var imageRec = fft.imageTarget;//"facebook_image_drwa.php?fotopath="+fft.imageTarget+"&left="+relativLeft+"&top="+relativTop+"&width="+sizerWidth+"&height="+sizerHeight;
		var comment = document.getElementById('fft-textarea').value;
		
		var tagedUser = ($('#fft-saver-taged-user').serialize()).toString();
			tagedUser = tagedUser.split('fft-tag-user=')[1];
		
		
		fft.stop();
		fft_box.showbox();
		fft_box.loadbox('Wo m&ouml;chtest du deinen Eintrag ver&ouml;ffentlichen? <ul><li rel="pinwand"><h1>Pinwand</h1><p>Das Foto mit Kommentar auf deiner Pinwand bei Facebook und auf der Seite Ver&ouml;ffentlichen.</p></li><li rel="album"><h1>Fotoalbum</h1><p>Das Foto mit Kommentar in einer deiner Fotalbem auf Facebook und auf der Seite Ver&ouml;ffentlichen.</p></li></ul><div style="clear:both"></div>');		
		$('#fft-status-box-area>ul>li').hover(function(){
				$(this).addClass('fft-hover');
			},function(){
				$(this).removeClass('fft-hover');
				}).click(function () {
					var rel = $(this).attr('rel');
					
					if (rel == "pinwand"){
						fft_box.clearbutton();
						fft.savetofeed(relativLeft,relativTop,sizerWidth,sizerHeight,comment,imageRec,tagedUser);
					}
					
					if (rel == "album") {
						fft_box.clearbutton();
						fft.savetoalbum(relativLeft,relativTop,sizerWidth,sizerHeight,comment,fft.imageTarget,tagedUser);
					}
					
					});
				
				
		fft_box.centerbox();
		$(fft_box.createButton('CLOSE')).click(function(){fft_box.hidebox();});

	},
	
	
	savetoalbum:function (left,top,width,height,comment,image,tagedUser) {
		fft_box.clearbox();
		fft_box.showloaderbar();
		
		$.get("facebook_connect/get_albums.php",{'titel':fft.serTitel+" "+fft.serDate},function (data) {
			fft_box.loadbox(data);
			fft_box.hideloaderbar();
			
			$(fft_box.createButton('OK')).click (function () {
				fft_box.clearbutton();
				
				var postfild = $('#fft-umage-uploadform').serialize();
					postfild += '&titel='+fft.serTitel;
					postfild +=	'&comment='+comment;
					postfild +=	'&date='+fft.serDate;
					postfild += '&image='+image;
					postfild += '&ser='+fft.ser;
					postfild +=	'&top='+top;
					postfild += '&left='+left;
					postfild += '&width='+width;
					postfild += '&height='+height;
					postfild += '&pic='+fft.imageTarget;
					postfild += '&tagedUser='+tagedUser;
					
					
					
					fft_box.loadbox('Eintrag wird ver&ouml;ffentlicht...');
					fft_box.showloaderbar();
					fft_box.centerbox();
					fft_box.loadprewiev("<img src='http://"+window.location.hostname+"/"+image+"' width='150' style='float:right;' hspace='5'/>"+comment+"<div style='clear:both'></div>");
					fft_box.centerbox();
					fft.stop();
					
					
				
					$.post("facebook_connect/post_entry.php",postfild,function (code) {
						
						if (code.indexOf('001') != -1 || code.indexOf('003') != -1) {
							fft_box.loadbox('<strong style="color:#F00">Ein interner Fehler ist aufgetreten, bitte versuchen Sie es sp&auml;ter noch einmal.</strong>');
							fft_box.hideloaderbar();
							$(fft_box.createButton('OK')).click(function() {
								fft.stop();
								fft_box.hidebox();
								});
						}
						
						if (code.indexOf('002') != -1) {
							fft_box.loadbox('<strong style="color:#0C3">Der Eintrag wurde auf Facebook ver&ouml;ffentlicht!</strong>');
							fft_box.hideloaderbar();
							$(fft_box.createButton('OK')).click(function() {
								fft.stop();
								fft_box.hidebox();
								$.fancybox.reload();
								});
						}
						
					});
				
				});
			
			});
	},
	
	
	savetofeed:function (left,top,width,height,comment,image,tagedUser) {
		fft_box.loadbox('Eintrag wird ver&ouml;ffentlicht...');
		fft_box.showloaderbar();
		fft_box.centerbox();
		
		
		fft_box.loadprewiev("<img src='http://"+window.location.hostname+"/facebook_connect/"+image+"' width='150' style='float:right;' hspace='5'/>"+comment+"<div style='clear:both'></div>");
		fft_box.centerbox();
		fft.stop();
		
		
		
		$.post("facebook_connect/post_entry.php",{'titel':fft.serTitel,
													'comment':comment,
													'date':fft.serDate,
													'image':image,
													'ser':fft.ser,
													'top':top,
													'left':left,
													'width':width,
													'height':height,
													'pic':fft.imageTarget,
													'tagedUser':tagedUser
													},function (code) {							
			if (code.indexOf('001') != -1 || code.indexOf('003') != -1) {
				fft_box.loadbox('<strong style="color:#F00">Ein interner Fehler ist aufgetreten, bitte versuchen Sie es sp&auml;ter noch einmal.</strong>');
				fft_box.hideloaderbar();
				$(fft_box.createButton('OK')).click(function() {
					fft.stop();
					fft_box.hidebox();
					});
			}
			
			if (code.indexOf('002') != -1) {
				fft_box.loadbox('<strong style="color:#0C3">Der Eintrag wurde auf Facebook ver&ouml;ffentlicht!</strong>');
				fft_box.hideloaderbar();
				$(fft_box.createButton('OK')).click(function() {
					fft.stop();
					fft_box.hidebox();
					$.fancybox.reload();
					});
			}
			
		});
	},
	
	delete_entry:function (ID,elem) {
		$(elem).html('<img src="facebook_connect/images/loader-smal.gif" border="0"/>');
		$.get('facebook_connect/imagetag_delete.php',{ID:ID},function (data) {
			if (data.indexOf('001') != -1) {
				$.fancybox.reload();
			}
			});
	},
	
	
	removeFeedback:function () {
		$('#fft-feedback-container').remove();
	},
	
	stop:function () {
		$(fft.sizerID).remove();
		$('#fft-saver').remove();
	},
	
	
	findFrend:function (elem) {
		$elem = $(elem);
		var input = $elem.val();
			input = input.toLowerCase();
			
		$('#fft-saver-frendlist')
			.children('div')
			.each(function (i, elem) {
				var name = $(elem).find('.fft-saver-user-infos-inner').html();
					name = name.toLowerCase();
				if (name.indexOf(input) != -1)
					$(elem).css('display','block');
				else
					$(elem).css('display','none');
					
				
			});


	}
	
}



fft_box = {
	
	showbox:function () {
		if ($('#fft-statsu-box-container').length > 0) fft_bod.hidebox();
		if (fft.targetID) {
			$('#'+fft.targetID).append ('<div id="fft-statsu-box-container"><div id="fft-status-box-inner-padding"><div id="fft-status-box-inner-content"> <h1> Funfactory > Facebook </h1><div id="fft-status-box-area"></div><div id="fft-status-box-loader-container"></div><div id="fft-status-box-preview"></div><div id="fft-status-box-bottom"></div></div></div></div>');
			$('#fft-statsu-box-container').stop().fadeIn('fast');
		}
	},
	
	hidebox:function () {
		$('#fft-statsu-box-container').stop().fadeOut('fast',function () {
			$('#fft-statsu-box-container').remove();
			});
		
	},
	
	centerbox:function () {
		var t = $('#fft-statsu-box-container');
		var width = $(t).innerWidth();
		var height = $(t).innerHeight();
		$(t).css({'left':'50%','top':'50%','marginLeft':-width/2,'marginTop':-height/2});
	},
	
	
	loadbox:function (htmlData) {
		$('#fft-status-box-area').html(htmlData);
	},
	
	clearbox:function () {
		$('#fft-status-box-area').html(' ');
		$('#fft-status-box-preview').html(' ');
	},
	
	loadprewiev:function (htmldata) {
		$('#fft-status-box-preview').html(htmldata);
	},
	
	
	createButton:function (label) {
		var string = '<button class="fft-button" id="fft-button-'+label+'">'+label+'</button>';
		$('#fft-status-box-bottom').append(string);
		return $('#fft-button-'+label);
	},
	
	
	showloaderbar:function () {
		$('#fft-status-box-loader-container').html("<center><img src='facebook_connect/images/loader.gif'/></center>");
	},
	
	
	hideloaderbar:function () {
		$('#fft-status-box-loader-container').html('<span></span>');
	},
	
	clearbutton:function () {
		$('.fft-button').each(function () {
			$(this).remove();
			});
	}
}



