$(document).ready(function(){	
      
	// $('a').fixUrl();
	
	$('#imageFade').innerfade({
		speed: 2600,
		timeout: 4000,
		type: 'random_start',
		containerheight: '120px'
	});
	$(window).load(function() {
		$('#imageFade').show();
		//$('#pageWrapper').equalHeights(true);
		//bouwConnectBottom();
    });
	$(window).resize(function() {
		//$('#pageWrapper').equalHeights(true);
		//bouwConnectBottom();
    });
	
	
	function bouwConnectBottom(){	
		var documentHeight = $(document).height(); 
		var windowHeight = $(window).height();
		var heightMain = $(".midCol").height();
		//alert(documentHeight + " vs  " + windowHeight + " midCol: " + heightMain)
		if((documentHeight-10) > windowHeight){
			var newPosY = windowHeight-78;
			$("#bouwconnect").css("top",newPosY)
		}
	};
	/*
	$(window).scroll(function() {
		var scrollTop = $(this).scrollTop()
		var documentHeight = $(document).height(); 
		var windowHeight = $(window).height();
		var heightMain = $(".midCol").height();
		
		if(documentHeight > windowHeight){
			var newPosY = (windowHeight-78);
			newPosY = (newPosY + scrollTop) + "px";
			$("#bouwconnect").css("top",newPosY)
			//alert(documentHeight + " " +newPosY)
		}
		
    	//$('#myElement').css('top', $(this).scrollTop() + "px");
	});
	*/
	
	// navigatie aan de rechterkant
	$('#relatedNav a').click(function() {
		newHeight = $(".midCol").height();
		newHeight = (newHeight-132);
		$('.block .blockContent').height(newHeight);
		$('.block').height(newHeight);
		
		$('#relatedNav a').removeClass('active');
		$('.block').css("width","0").css("left","-48px");
		$('.block .blockContent').html('');
		$('.block').show();
		
		$(this).addClass('active');
		
		var sURL = $(this).attr("href");
		//alert(sURL);
		$('.block').animate({
			top: '128px',
			//left: '-766px',
			left: '-790px',
			width: '742px',
			//height: '632px'
			height: newHeight
		}, "slow", function() {
			// Animation complete.
			$('.block .blockContent').loadWithoutCache(sURL);
		});
		return false;

	});
	
	
			$("#projects a").fancybox({
				'padding'		: 	0,
				'autoScale'		: 	false,
				'autoDimensions':	false,
				'transitionIn'	:	'elastic',
				'transitionOut'	:	'elastic',
				'width'			: 	925,
				'height'		: 	550,
				'speedIn'		:	500, 
				'speedOut'		:	500, 
				'overlayShow'	:	true,
				'onComplete'	: function() {
									toonEersteItem();
								},
				'onCleanup'		: function() {
									$("#largeImg").hide();
									$("#imgContent").hide();
								}

			});

			
			$(".video").click(function() {
				$.fancybox({
						'padding'		: 0,
						'autoScale'		: false,
						'transitionIn'	: 'elastic',
						'transitionOut'	: 'elastic',
						'speedIn'		:	500, 
						'speedOut'		:	500, 
						//'title'			: this.title,
						'width'			: 630,
						'height'		: 495,
						'href'			: this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
						'type'			: 'swf',
						'swf'			: {
						   	'wmode'		: 'transparent',
							'allowfullscreen'	: 'true'
						}
					});
			
				return false;
			});
			
			
			
			function toonEersteItem(){	
				var largePath = $('.thumbs a').first().attr("href");
				var largeAlt = $('.thumbs a').first().attr("title");
				toonItem(largePath, largeAlt);
			}

			
			$(".thumbs a").live('click', function() {
				var largePath = $(this).attr("href");
				var largeAlt = $(this).attr("title");
				toonItem(largePath, largeAlt);
				return false;
			});
			
			function toonItem(sHref,sTitle){
					var largePath = sHref; //$(this).attr("href");
					var largeAlt = sTitle; //$(this).attr("title");
					
					/* Als de largeAlt (titel) een Youtube link bevat als 'http://www.youtube.com/embed/-f36v5mLV6o' of 'http://youtu.be/-f36v5mLV6o'
					dan het laatste deel, de Id naar de video eruit halen en deze in de embeded (iframe) code plaatsen
					*/
					if( largeAlt.indexOf("youtu") !== -1 ){
						$("#largeImg").hide();
						$("#imgContent").show();
						
						var videoId = largeAlt.substring(largeAlt.lastIndexOf('/')+1, largeAlt.length);
						$("#imgContent").html("<iframe width=\"545\" height=\"362\" src=\"http://www.youtube.com/embed/"+ videoId +"?rel=0\" frameborder=\"0\" allowfullscreen></iframe>");
					
					}else{
					
						$("#imgContent").html("");
						$("#imgContent").hide();
						$("#imgContent").html(largeAlt);
						
						
						$("#largeImg").hide();
						$('#imgWrapper').addClass('loading');
						$("#largeImg").load(function(){
							$('#imgWrapper').removeClass('loading')
							$("#largeImg").fadeIn(200);
							if (largeAlt!=""){
							//	$("#imgContent").show();
							}
						}).attr({ src: largePath, alt: largeAlt });
						
						
						// fancy popup
						var imgSrc		= largePath;
						var maxW		= '800';
						var maxH		= '800';
					
						var vars = imgSrc.split(/[;&]/);
		   				for (var i = 0; i < vars.length; i++) {
							var pair = vars[i].split('=');
							if (pair[0] == 'w'){
								pair[1] = maxW;
							}
							if (pair[0] == 'h'){
								pair[1] = maxH;
							}
							vars[i] = pair.join('=');
						}
						var newImgSrc = vars.join('&');
						
						$("#largeImgPop").attr("href", newImgSrc);
					
					}
				
					return false;
			};
			//});
	
	
});

$.fn.fixUrl = function(){   
	return this.each(function(){   
		var tag = $(this);   
		var href = tag.attr("href");
		if(href != null){
			var firstCharacter = href.substr(0,1);
			if(firstCharacter == "?"){
				this.href = 'default.asp' + href;
			};
			if(href.indexOf('/?') > 0){
				this.href = href.replace('/?','/default.asp?');
			};
		};
	});   
};



	/**
	 * Use this function as jQuery "load" to disable request caching in IE
	 * Example: $('selector').loadWithoutCache('url', function(){ //success function callback... });
	 **/
	$.fn.loadWithoutCache = function (){
	 var elem = $(this);
	 var func = arguments[1];
	 $.ajax({
	     url: arguments[0],
	     cache: false,
	     dataType: "html",
	     success: function(data, textStatus, XMLHttpRequest) {
	   elem.html(data);
	   if(func != undefined){
	    func(data, textStatus, XMLHttpRequest);
	   }
	     }
	 });
	 return elem;
	}

/*-------------------------------------------------------------------- 
 * JQuery Plugin: "EqualHeights" (http://www.filamentgroup.com)
 * Description: Compares the heights or widths of the top-level children of a provided element 
 		and sets their min-height to the tallest height (or width to widest width). Sets in em units by default if pxToEm() method is available.
 * Dependencies: jQuery library, pxToEm method	(article: 
		http://www.filamentgroup.com/lab/retaining_scalable_interfaces_with_pixel_to_em_conversion/)							  
 * Usage Example: $(element).equalHeights();
  		Optional: to set min-height in px, pass a true argument: $(element).equalHeights(true);
--------------------------------------------------------------------*/
$.fn.equalHeights = function(px) {
	$(this).each(function(){
		var currentTallest = 0;
		$(this).children().each(function(i){
			if ($(this).height() > currentTallest) { currentTallest = $(this).height(); }
		});
		if (!px || !Number.prototype.pxToEm) currentTallest = currentTallest.pxToEm(); //use ems unless px is specified
		// for ie6, set height since min-height isn't supported
		if ($.browser.msie && $.browser.version == 6.0) { $(this).children().css({'height': currentTallest}); }
		$(this).children().css({'min-height': currentTallest});
	});
	return this;
};