// JavaScript Document

$(document).ready(function(){
		
	if($("#column_small").length){
		first = true;
		$(".item").each(function(){	   
			if($(this).offset().top > ($("#column_small").offset().top + $("#column_small").height())){
				if(first) {
					$(this).prepend('<div style="clear: both;"></div>');
				}
				$(this).css("float","left");
				first = false;
			}
		});
	}
						   
	initLightboxes();
	initContinuousScrolling();
	
	if($("#lb").length){
		
		$("#lb_background").height($(document).height());
		
		$("#close").unbind("click");
		$("#close").click(function(){
			hideLightbox();
		});
		
		$("#lb_background").unbind("click");
		$("#lb_background").click(function(){
			hideLightbox();
		});
	
	}
	
		
	
	
});


function initLightboxes(){
	
	$("a.lightbox").each(function(){
		
		$(this).unbind("click");
		$(this).click(function(event){
							   
			//showLightbox($(this).attr("rel"));
			
			event.preventDefault();

		});
		
		var rel = $(this).attr("rel");
		$(this).parents(".item").unbind("click");
		$(this).parents(".item").click(function(){
												
			showLightbox(rel);
		});
		
	});
	
	
	/*$("#items .twitter, #items .flickr, #items .youtube").click(function(){
																		 
		showLightbox($(this).find("a.lightbox").attr("rel"));
	});*/
	
	
}

function showLightbox(rel){
	if(rel){
		
		$("#lb").html("");
		
		$("#lb").css("margin-top",($(window).scrollTop() + 20));
		
		$.ajax({
		  type: "POST",
		  url: "/php/AjaxController.php",
		  data: ({action:"getItem", itemId:rel}),
		  success: function(data) {
			if(data){
				$("#lb").html(data);
				
				$("#lb").slideDown("slow");
				$("#lb_background").height($(document).height());
				$("#lb_background").show();
		
				$("#close").unbind("click");
				$("#close").click(function(){
					hideLightbox();
				});
		
				$("#lb_background").unbind("click");
				$("#lb_background").click(function(){
					hideLightbox();
				});
			}
		  }
		});
	}
}

function hideLightbox(){
	
	$("#lb").fadeOut("fast");
	$("#lb_background").hide();
	
}


function initContinuousScrolling(){
	
	var loading = false;
	if($("#facebook").length){
		var offsetY = $("#facebook").offset().top;
	}
	
	$(window).scroll(function(){
		$("#lb_background").height($(document).height());
		
		if(($(document).height() - ($(document).scrollTop() + $(window).height()) <= 125) && loading == false){
			
			
			if($("#items_holder_home").length){
				
				
				
					$(window).scroll(function(){
						if($(window).scrollTop() > (offsetY - 50)){
							$("#facebook").animate({ marginTop: ($(window).scrollTop() - (offsetY - 50)) + 'px' }, { queue: false, duration: 250, easing: 'easeInOutSine' });
						} else {
							$("#facebook").animate({ marginTop: 0 }, { queue: false, duration: 250, easing: 'easeInOutSine' });
						}
					});


					
					loading = true;
					
					if($("#loading").length) $("#loading").remove();
					$("#items").after('<div id="loading"><img src="/img/ajax-loader.gif" alt="Bezig met laden..." /></div>');
					
					var maxItemsText = 6;
					
					var averageHeightItemsText = 100;
					var heightItemsVisual = 240;
					
					var columnHeightText = $("#items_text").height();
					var columnHeightVisual = $("#items_visual").height();
					
					var heightMargin = 500;
					
					var diffHeight = (columnHeightText - columnHeightVisual);
					diffHeight = (diffHeight + (maxItemsText * averageHeightItemsText));
					
					// visual items column is biggest
					
					// make difference positive
					diffHeight = Math.abs(diffHeight);
					
					itemCount = Math.round(diffHeight / heightItemsVisual) + 1;
					var maxItemsVisual = itemCount;
					
					$.ajax({
					  type: "POST",
					  dataType: "json",
					  url: "/php/AjaxController.php",
					  data: ({action:"getItemsHome", visualItems: maxItemsVisual, textItems: maxItemsText, textDate: text_date, visualDate: visual_date}),
					  success: function(data) {
						 
						if(data.results){
								
							var html_visual = html_text = "";
							
							if(data.results.length){
								for(var i = 0; i < data.results.length; i++){
									
									if(data.results[i].service == "youtube") {
										html_visual += '<div class="item youtube appended"><div class="item_bgimage" style="background-image: url('+data.results[i].image+')"><h2>'+data.results[i].title+'</h2><a href="'+data.results[i].more+'" title="Video afspelen" rel="'+data.results[i].id+'" class="lightbox btn_play"><img src="/img/btn_play.png" alt="Video afspelen" /></a></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+' YouTube</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
										
										visual_date = data.visual_date;
									
									} else if(data.results[i].service == "flickr") {
										html_visual += '<div class="item flickr appended"><div class="item_bgimage" style="background-image: url('+data.results[i].image+')"><h2>'+data.results[i].title+'</h2></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+' Flickr</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
										
										visual_date = data.visual_date;
									
									} else if(data.results[i].service == "twitter") {
										html_text += '<div class="item twitter appended"><div class="t"><div class="tl"></div><div class="tc"></div><div class="tr"></div></div><div class="box_content"><a href="'+data.results[i].url+'" title="'+data.results[i].title+'"><img src="'+data.results[i].image+'" alt="'+data.results[i].title+'" /></a><h2>'+data.results[i].title+'</h2></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+'</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
										
										text_date = data.text_date;
									}
									
								}
							}
							
							loading = false;
							$("#loading").remove();
							
							$("#items_text").append(html_text);
							$("#items_visual").append(html_visual);
							
							if($(window).scrollTop() > (offsetY - 50)){
								$("#facebook").animate({ marginTop: ($(window).scrollTop() - (offsetY - 50)) + 'px' }, { queue: false, duration: 250, easing: 'easeInOutSine' });
							} else {
								$("#facebook").animate({ marginTop: 0 }, { queue: false, duration: 250, easing: 'easeInOutSine' });
							}
							
							$("#items .appended").each(function(){
								$(this).hide();
								$(this).fadeIn("slow");
								$(this).removeClass("appended");
							});
							
							initLightboxes();
							initDISQUS();
						} else {
							$("#loading").remove();
							$(document).unbind("scroll");
						}
					  }
					});
					
					
			} else {
				
				// vervolgpagina
			
				if($("#items .item").length){
					
					pageNr++;
					
					loading = true;
					
					if($("#loading").length) $("#loading").remove();
					$("#items").after('<div id="loading"><img src="/img/ajax-loader.gif" alt="Bezig met laden..." /></div>');
					
					$.ajax({
					  type: "POST",
					  dataType: "json",
					  url: "/php/AjaxController.php",
					  data: ({action:"getItems", pageNr:pageNr, pageId:pageId}),
					  success: function(data) {
						 
						if(data.results){
								
							var html = "";
							
							if(data.results.length){
								for(var i = 0; i < data.results.length; i++){
									
									if(data.results[i].now == 1) {
										if(pageId == 1) {
											html += '<img src="/img/now_h.png" alt="Nu" id="now_h" />';
										} else {
											html += '<img src="/img/now_v.png" alt="Nu" id="now_v" />';
										}
									}
									
									if(data.results[i].yesterday == 1) {
										if(pageId == 1) {
											html += '<div class="item appended"><img src="/img/yesterday_h.png" alt="Gisteren" id="yesterday_h" /></div>';
										} else {
											html += '<div class="item appended"><img src="/img/yesterday_v.png" alt="Gisteren" id="yesterday_v" /></div>';
										}
									}
									
									if(data.results[i].day_before_yesterday == 1) {
										if(pageId == 1) {
											html += '<div class="item appended"><img src="/img/day_before_yesterday_h.png" alt="Eergisteren" id="day_before_yesterday_h" /></div>';
										} else {
											html += '<div class="item appended"><img src="/img/day_before_yesterday_v.png" alt="Eergisteren" id="day_before_yesterday_v" /></div>';
										}
									}
									
									if(data.results[i].earlier_today == 1) {
										if(pageId == 1) {
											html += '<div class="item appended"><img src="/img/earlier_today_h.png" alt="Eerder vandaag" id="earlier_today_h" /></div>';
										} else {
											html += '<div class="item appended"><img src="/img/earlier_today_v.png" alt="Eerder vandaag" id="earlier_today_v" /></div>';
										}
									}
									
									if(data.results[i].earlier_this_week == 1) {
										if(pageId == 1) {
											html += '<div class="item appended"><img src="/img/previous_week_h.png" alt="Afgelopen week" id="previous_week_h" /></div>';
										} else {
											html += '<div class="item appended"><img src="/img/previous_week_v.png" alt="Afgelopen week" id="previous_week_v" /></div>';
										}
									}
									
									if(data.results[i].earlier == 1) {
										if(pageId == 1) {
											html += '<div class="item appended"><img src="/img/earlier_h.png" alt="Eerder" id="earlier_h" /></div>';
										} else {
											html += '<div class="item appended"><img src="/img/earlier_v.png" alt="Eerder" id="earlier_v" /></div>';
										}
									}
									
									if(data.results[i].service == "youtube") {
										html += '<div class="item youtube appended"><div class="item_bgimage" style="background-image: url('+data.results[i].image+')"><h2>'+data.results[i].title+'</h2><a href="'+data.results[i].more+'" title="Video afspelen" rel="'+data.results[i].id+'" class="lightbox btn_play"><img src="/img/btn_play.png" alt="Video afspelen" /></a></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+' YouTube</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
									
									} else if(data.results[i].service == "flickr") {
										html += '<div class="item flickr appended"><div class="item_bgimage" style="background-image: url('+data.results[i].image+')"><h2>'+data.results[i].title+'</h2></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+' Flickr</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
									
									} else if(data.results[i].service == "twitter") {
										html += '<div class="item twitter appended"><div class="t"><div class="tl"></div><div class="tc"></div><div class="tr"></div></div><div class="box_content"><a href="'+data.results[i].url+'" title="'+data.results[i].title+'"><img src="'+data.results[i].image+'" alt="'+data.results[i].title+'" /></a><h2>'+data.results[i].title+'</h2></div><div class="meta_data"><a href="'+data.results[i].more+'#disqus_thread " rel="'+data.results[i].id+'" title="Reageren op: '+data.results[i].title+'" class="lightbox">reageren</a><small>'+data.results[i].published+' Twitter</small></div><div class="b"><div class="bl"></div><div class="br"></div></div></div>';
									}
									
								}
							}
							
							loading = false;
							$("#loading").remove();
							$("#items").append(html);
							
							$("#items .appended").each(function(){
								$(this).hide();
								$(this).fadeIn("slow");
								$(this).removeClass("appended");
							});
							
							if($("#column_small").length){
								first = true;
								$(".item").each(function(){	   
									if($(this).offset().top > ($("#column_small").offset().top + $("#column_small").height())){
										if(first) {
											$(this).prepend('<div style="clear: both;"></div>');
										}
										$(this).css("float","left");
										first = false;
									}
								});
							}
							
							initLightboxes();
							initDISQUS();
						} else {
							$("#loading").remove();
							$(document).unbind("scroll");
						}
					  }
					});
				
				}
				
			}
			
		}
		
	});
	
}