$(document).ready(function(){
	$('#flickrPhotosets').parent().css('background','#0099cf');	
	if($('#flickrPhotosets').length != 0){
	flickrGallery('#flickrPhotosets');	
	}
});


/*USERSPECS*/
var x = {

apiKEY : '307c5e26da851fb7940230a8c64c2e58',		//Api-Key von Flickr
usrID : '52473987@N06',								//User-ID von Flickr
thumb_size : 'm',									//Größe des Bildes für die Photoset-Links allowed values: 's' (75x75), 't' (100x?), 'm' (240x?)
pic_size : null,									//Größe des Bildes allowed values: 'm' (240x?), 'b' (1024x?), 'o' (original), default: (500x?)
photoset_id : null
}

/* FIX VARIABLES*/
var f = 0; var count = 1;


function flickrGallery(a){
//INHALT BAUEN
f = $('<div/>').attr('id','flickrImg');l = $('<a />').attr('href','#').attr('id','go_next');i = $('<a />').attr('href','#').attr('id','go_prev');c = $('<img />').attr('id','FlickrLoad').attr('src', DBName +'/ajax-loader.gif').attr('title','loading').attr('alt','loading');k = $('<div />').attr('id','photo');r = $('<div />').attr('id','flickr-sets');
imgn = $('<img />').attr('src', DBName + '/galleryview/next.gif')
imgp = $('<img />').attr('src', DBName + '/galleryview/prev.gif')
l.append(imgn);i.append(imgp);
f.append(l).append(i).append(c).append(k);$(a).append(f).append(r);


	
/*ORDNER AUSLESEN*/
$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getList&api_key=" + x.apiKEY + "&user_id=" + x.usrID + "&format=json&jsoncallback=?", function (data) {
    var list = $("<ul></ul>");
    $.each(data.photosets.photoset, function (i, set) {
		var photoSetID = 	set.id;		
		//Bilder auslesen									  
		$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=" + x.apiKEY + "&photoset_id=" + photoSetID + "&per_page=1&format=json&jsoncallback=?", function (data) {
			$.each(data.photoset.photo, function(y, photo){
					var bild = $("<img />").attr("src", 'http://farm'+photo['farm']+'.static.flickr.com/'+photo['server']+'/'+photo['id']+'_'+photo['secret']+'_'+x.thumb_size+'.jpg');
					
					bild2 = $("<span class='imgC' />").append(bild)
					var titel = set.title._content.substr(0, 42);	
					var h1 = $("<span />").append(titel);
					var a = $("<a href='#' class='tooltip' id='photoset_"+ photoSetID +"'/>").append(h1).append(bild2);
					a.attr("rel", 'http://farm'+photo['farm']+'.static.flickr.com/'+photo['server']+'/'+photo['id']+'_'+photo['secret']+'_m.jpg');
					var li = $("<li/>").append(a);
					$(list).append(li);
			});
		flickrReady();
		});	
    });
    $("#flickr-sets").append(list).append('<br class="clear" />');;
	loadFirstPhotoset();
});

}
function loadFirstPhotoset(){
		$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getList&api_key=" + x.apiKEY + "&user_id=" + x.usrID + "&format=json&jsoncallback=?", function (data) {
		x.photoset_id = data.photosets.photoset[0].id;
		$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=" + x.apiKEY + "&photoset_id=" + x.photoset_id + "&per_page=1&format=json&jsoncallback=?", function (data) {
						$.each(data.photoset.photo, function(z, photo1){
							if(x.pic_size!=null){var q = '_'+x.pic_size;} else {var q ='';}
							var bild = $("<img />").attr("title", photo1.title).attr("src", 'http://farm'+photo1['farm']+'.static.flickr.com/'+photo1['server']+'/'+photo1['id']+'_'+photo1['secret']+q+'.jpg')
							.load(function(){	
								//Tooltip für OrderrRhumbs laden
								$('.tooltip').tooltip({ 
									delay: 0, 
									showURL: false,
									top: 5, 
									left: 10,
									track: true, 
									bodyHandler: function() { return  $("<h1 />").text($(this).find('span').html());} 
								});
								$('#tooltip').css('opacity','0.8');
								$('#FlickrLoad').stop().fadeOut(200);
								$('#flickr-sets ul li:first-child a').addClass('aktiv');
						
								//Größe einbinden
								
								$("#photo").html(bild);
								if($('#photo img').innerHeight() > $('#photo img').innerWidth()){
									$('#photo img').css({
										'height': '500px',
										'width': 'auto'
									});
								}
								
								$('#photo img, #flickr-sets').fadeIn(200);
							
						});
							
						});
						
		});
	})
	
}

function flickrReady(){			   
	//Bild des ersten Ablums anzeigen
	$('#flickr-sets a').unbind('click').click(function(){
		$('#flickr-sets a').removeClass('aktiv');
		$(this).addClass('aktiv')
		var photoSetID = $(this).attr('id').split("_");
		flickr(photoSetID[1]);								 
	});
	$('#go_next').css({'opacity':'0.5','display':'block'}).unbind('click').unbind('mouseenter').unbind('mouseleave').click(function(){nextPic()}).mouseenter(function(){$(this).fadeTo(100, 0.8)}).mouseleave(function(){$(this).fadeTo(200, 0.5)});
	$('#go_prev').css({'opacity':'0.5','display':'none'}).unbind('click').unbind('mouseenter').unbind('mouseleave').click(function(){prevPic()}).mouseenter(function(){$(this).fadeTo(100, 0.8)}).mouseleave(function(){$(this).fadeTo(200, 0.5)});

};

function flickr(psid){
	count = 1;
	$('#go_prev').fadeOut().unbind('mouseenter').unbind('mouseleave');
	$('#photo img').fadeOut(200);
	$('#FlickrLoad').fadeIn(200);
	$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=" + x.apiKEY + "&photoset_id=" + psid + "&per_page=1&format=json&jsoncallback=?", function (data) {
		$.each(data.photoset.photo, function(z, photo1){
				if(x.pic_size!=null){var q = '_'+x.pic_size;} else {var q ='';}
            	var bild = $("<img />").attr("title", photo1.title)
				.attr({"src": 'http://farm'+photo1['farm']+'.static.flickr.com/'+photo1['server']+'/'+photo1['id']+'_'+photo1['secret'] +q+ '.jpg'}).load(function(){
					$("#photo").html(bild);
	            	if($('#photo img').innerHeight() > $('#photo img').innerWidth()){
						$('#photo img').css({
							'height': '500px',
							'width': 'auto'
						});	
					}	
					$('#photo img').fadeIn(200);
					$('#FlickrLoad').fadeOut(200);																																							  
						})
				
		});
		x.photoset_id = psid;
		
	});
}

function nextPic(){
	$('#photo img').fadeOut(200);
	$('#FlickrLoad').fadeIn(200);
	
	$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getInfo&api_key=" + x.apiKEY + "&photoset_id=" + x.photoset_id + "&format=json&jsoncallback=?", function (data) {
		var maxcount = (data.photoset.photos);
		if(count < maxcount) {count ++;}
		else {$('#go_next').unbind('mouseleave').fadeOut();}
	
		$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=" + x.apiKEY + "&photoset_id=" + x.photoset_id + "&per_page=1&page=" +count+"&format=json&jsoncallback=?", 		
		function (data) {
			$.each(data.photoset.photo, function(z, photo1){
					if(x.pic_size!=null){var q = '_'+x.pic_size;} else {var q ='';}
						$('#photo img').attr("src", 'http://farm'+photo1['farm']+'.static.flickr.com/'+photo1['server']+'/'+photo1['id']+'_'+photo1['secret']+q+'.jpg').load(function(){
							if($('#photo img').innerHeight() > $('#photo img').innerWidth()){
								$('#photo img').css({
									'height': '500px',
									'width': 'auto'
								});	
							}
						$('#photo img').fadeIn(200);
						$('#FlickrLoad').fadeOut(200);																																							  
						})
					});
			$('#go_prev').fadeTo(100, 0.5).unbind('mouseenter').unbind('mouseleave').mouseenter(function(){$(this).fadeTo(100, 0.8)}).mouseleave(function(){$(this).fadeTo(200, 0.5)});
		});
	
	
	});
}

function prevPic(){
	$('#photo img').fadeOut(200);
	$('#FlickrLoad').fadeIn(200);
	count --;
	if(count == 1)	{$('#go_prev').unbind('mouseleave').fadeOut();}
	$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=" + x.apiKEY + "&photoset_id=" + x.photoset_id + "&per_page=1&page=" +count+"&format=json&jsoncallback=?", function (data) {
		
		$.each(data.photoset.photo, function(z, photo1){
				if(x.pic_size!=null){var q = '_'+x.pic_size;} else {var q ='';}
        	    	$('#photo img').attr("src", 'http://farm'+photo1['farm']+'.static.flickr.com/'+photo1['server']+'/'+photo1['id']+'_'+photo1['secret']+q+'.jpg').load(function(){
        	    		if($('#photo img').innerHeight() > $('#photo img').innerWidth()){
							$('#photo img').css({
								'height': '500px',
								'width': 'auto'
							});	
						}	
						$('#photo img').fadeIn(200);
						$('#FlickrLoad').fadeOut(200);																																							  
						})
				});
		
		$('#go_next').fadeTo(100, 0.5).unbind('mouseenter').unbind('mouseleave').mouseenter(function(){$(this).fadeTo(100, 0.8)}).mouseleave(function(){$(this).fadeTo(200, 0.5)});
	});
}