//#################################################################
// Light box  #####################################################

function wt_lightbox(element_click)
{
	var w_height = $(window).height();
	var w_width = $(window).width();
	
	var d_height = $(document).height();
	var d_width = $(document).width();
	
	var box_width;
	var box_height
	var pos_x;
	var pos_y;
	
	var b_content;
	var b_content_title;
	var b_content_desc;
	
	var title_height;
	var desc_height;
	
	var total_slides;
	var current_slide;
	
	var next_height;
	var prev_height;
	
	var img_h;
	
	var b_loading;
	var loading_width;
	var loading_height;
	var loading_pos_x;
	var loading_pos_y;
	
// ###################################################################
// ### Le message de loading #########################################
	
	b_loading = $("#loading_indicator");
	
	loading_width = b_loading.outerWidth();
	loading_height = b_loading.outerHeight();
	
	b_loading.bind('ajaxStart', function(){
		loading_pos_x = w_width / 2;
		loading_pos_y = (w_height / 2) + $(window).scrollTop();
		b_loading.css("top", loading_pos_y - (loading_height/2));
		b_loading.css("left", loading_pos_x - (loading_width/2));
	});
	
	b_loading.bind('ajaxComplete', function(){
		loading_pos_x = w_width / 2;
		loading_pos_y = (w_height / 2) + $(window).scrollTop();
		b_loading.css("top", 0);
		b_loading.css("left", '-9000px');
	});
	
// ###################################################################
// ### Ouverture du Lightbox #########################################
	
	$(element_click).live('click', function(){
		
		var b_ctr = $("#b_ctr");
		var b_black = $("#b_black");
		
		b_black.css("width", d_width);
		b_black.css("height", d_height);
		
	// ###################################################################
	// ### Call du contenu AJAX ##########################################
		
		var album_id = $(this).attr('title');
		
		$.ajax({
			type: 'POST',
			url: 'wt_lightbox_ajax.php',
			data: {'album_id' : album_id},
			dataType: 'html',
			success: function(html, textStatus){
				
				$("#ajax_content").html(html);
				
				current_slide = 1;
				total_slides = $("#b_content img").length;
				
				// ###################################################################
				
				b_black.fadeTo(400, 0.65, function(){
					
					b_content = $("#b_content");
					b_content_title = $("#b_content_title");
					b_content_desc = $("#b_content_desc");
					
					img_h = $("img.active_image").outerHeight();
					b_content.css('height', img_h+'px');
					
					box_width = b_ctr.outerWidth();
					box_height = b_ctr.outerHeight();
					
					//console.log('Box_width = '+box_width+' - Box Height = '+box_height);
					
					pos_x = w_width / 2;
					pos_y = (w_height / 2) + $(window).scrollTop();
					
					b_ctr.css("top", pos_y - (box_height/2));
					b_ctr.css("left", pos_x - (box_width/2));
					
					b_ctr.fadeIn(300, function(){
						
						title_height = b_content_title.outerHeight();
						
						// ### Réinitialisation et animation du Title ########################
						
						b_content_title.css("top', '0");
						b_content_title.animate({'top': '-='+title_height}, 300, function(){
						});
						
						// ### Réinitialisation et animation de la description ###############
						
						if($(".active_text").outerHeight() != 0){
							desc_height = $(".active_text").outerHeight() + 24;
						}
						else{
							desc_height = $(".active_text").outerHeight();
						}
							
						b_content_desc.css("bottom', '0");
						b_content_desc.css('height', desc_height+'px');
						b_content_desc.animate({'bottom': '-='+desc_height}, 300, function(){
						});
					});
				});
					
				
			// #######################################################################
			// ###  Bouton previous et next  #########################################
				
				if(total_slides > current_slide)
				{
					/*if(current_slide < total_slides){
						$("#b_next_button").show();
					}*/
					
					if(current_slide != 1){
						$("#b_next_button").css('visibility', 'visible');
					}
				}
				else
				{
					$("#b_next_button").css('visibility', 'hidden');
				}
				
				$("#b_next_button").click(function(){
					
					if(current_slide < total_slides){
						
						current_slide += 1;
						
						$(".active_image").fadeOut(200, function(){
							$(this).removeClass('active_image');
							$(this).next().addClass('active_image').fadeIn(200);
							
							img_h = $(this).next().outerHeight();
							b_content.css('height', img_h+'px');
							
							if(current_slide >= total_slides){
								$("#b_next_button").css('visibility', 'hidden');
							}
							if(current_slide > 1 && $("#b_prev_button:hidden"))
							{
								$("#b_prev_button").css('visibility', 'visible');
							}
						});
						
						$(".active_text").fadeOut(200, function(){
							$(this).removeClass('active_text');
							$(this).next().addClass('active_text').fadeIn(200);
							
							if($(this).next().outerHeight() != 0){
								next_height = $(this).next().outerHeight() + 24;
							}
							else{
								next_height = $(this).next().outerHeight();
							}
							
							b_content_desc.css('height', next_height+'px');
							b_content_desc.css('bottom', '-'+next_height+'px');
						});
					}
					
					return false;
				});
				
				$("#b_prev_button").click(function(){
					img_h = $("img.active_image").outerHeight();
					b_content.css('height', img_h+'px');
					if(current_slide != 1){
						$(".active_image").fadeOut(200, function(){
							$(this).removeClass('active_image');
							$(this).prev().addClass('active_image').fadeIn(200);
							
							img_h = $(this).prev().outerHeight();
							b_content.css('height', img_h+'px');
							
							current_slide -= 1;
							
							if(current_slide <= 1){
								$("#b_prev_button").css('visibility', 'hidden');
							}
							if(current_slide < total_slides && $("#b_next_button:hidden")){
								$("#b_next_button").css('visibility', 'visible');
							}
						});
						
						$(".active_text").fadeOut(200, function(){
							$(this).removeClass('active_text');
							$(this).prev().addClass('active_text').fadeIn(200);
							
							if($(this).prev().outerHeight() != 0){
								prev_height = $(this).prev().outerHeight() + 24;
							}
							else{
								prev_height = $(this).prev().outerHeight();
							}
							
							b_content_desc.css('height', prev_height+'px');
							b_content_desc.css('bottom', '-'+prev_height+'px');
						});
					}
					return false;
				});
				
				// #######################################################################
				// ### Fermeture du lightbox #############################################
				
				$("#b_black, #b_close").live('click',function(){
					b_content_desc.animate({'bottom': '+='+desc_height});
					b_content_title.animate({'top': '+='+title_height}, 200, function(){
						b_ctr.css('left', '-20000px');
						b_black.fadeOut(200);
					});
					return false;
				});
			},
			error: function(xhr, textStatus, errorThrown){
				alert('An error occurred! ' + (errorThrown ? errorThrown : xhr.status));
			}
		});
		
		return false;
	});
	
}
