function openPortfolio(id,num,num2,type){
		console.log(aImagesToPreload);
		if(typeof type != "undefined"){
			setCategory(type);
		}
		
		serialImages = document.getElementById("serialImages_"+id).value;
		
		aImagesToPreload = serialImages.split(",");
		
			saveSrc = document.getElementById("thumb_"+id).src;
			document.getElementById("thumb_"+id).src = "/assets/img/loading.gif";
		 
		  // set image url
		  	image_url = aImagesToPreload;
			imagesloaded = Array();
			var browser=navigator.appName;
		
		if(aImagesToPreload.length == 0){
			openPortfolio2(id,num,num2,type);
		}
	   if(aImagesToPreload.length == 1 && aImagesToPreload[0] == ""){
					openPortfolio2(id,num,num2,type);
		   }
		
		   var i = 0;
		   var counter = 0;
		   for(i=0; i<aImagesToPreload.length; i++){
		   		preload_image_object = new Image();
				
		   		preload_image_object.onload = function(){
					counter++;
					imagesloaded[i] = "1";
					//loopDelay(100);
					document.title = counter;
					if(counter == aImagesToPreload.length){
						if(browser=="Microsoft Internet Explorer"){
							loopDelay(200);
							//alert("test");
						}
						openPortfolio2(id,num,num2,type);
						document.getElementById("thumb_"+id).src = saveSrc;
					}	
				};
				if(image_url[i].indexOf("youtube") == -1){
					preload_image_object.src = image_url[i].split("//").join("/");
				}else{
					counter++;
				}
		   }
}

function loopDelay(numberMillis) {
var now = new Date();
var exitTime = now.getTime() + numberMillis;
while (true) {
now = new Date();
if (now.getTime() > exitTime)
return;
}
} 

function initGallery(id){
	serialImages = document.getElementById("serialImages_"+id).value;
	aImagesToPreload = serialImages.split(",");
	gallery = document.getElementById("gallery_"+id);
	width = (140)/ aImagesToPreload.length;
	originalImage = aImagesToPreload[0].split("_mod.").join("_thumb.");
	for(img=0;img<aImagesToPreload.length;img++){
		thumbImage = aImagesToPreload[img].split("_mod.").join("_thumb.");
		if(img % 2 == 0){
		gallery.innerHTML += "<span style='height:140px;overflow:hidden;padding:0px;margin:0px;background-image:url(/assets/img/trans.gif);display:inline-block;width:"+width+"px;' onMouseOver='gallerySwitch(\""+id+"\",\""+thumbImage+"\")' id='"+thumbImage+"'><img src='"+thumbImage+"' style='visibility:hidden;' /></span>";
		}else{
		gallery.innerHTML += "<span style='height:140px;overflow:hidden;padding:0px;margin:0px;background-image:url(/assets/img/trans.gif);display:inline-block;width:"+width+"px;' onMouseOver='gallerySwitch(\""+id+"\",\""+thumbImage+"\")' id='"+thumbImage+"'><img src='"+thumbImage+"' style='visibility:hidden;' /></span>";
		}
	}
}

function initGalleryNews(id){
	serialImages = document.getElementById("serialImages_"+id).value;
	aImagesToPreload = serialImages.split(",");
	gallery = document.getElementById("gallery_"+id);
	width = (140)/ aImagesToPreload.length;
	if(aImagesToPreload[0].indexOf("_mod_news") > -1){
		originalImage = aImagesToPreload[0].split("_mod_news").join("_thumb");
	}else{
		originalImage = aImagesToPreload[0].split("_mod").join("_thumb");
	}
	for(img=0;img<aImagesToPreload.length;img++){
		if(aImagesToPreload[img].indexOf("_mod_news") > -1){
			thumbImage = aImagesToPreload[img].split("_mod_news").join("_thumb");
		}else{
			thumbImage = aImagesToPreload[img].split("_mod").join("_thumb");
		}
		//thumbImage = aImagesToPreload[img].split("_mod_news").join("_thumb");
		if(img % 2 == 0){
		gallery.innerHTML += "<span style='height:75px;overflow:hidden;padding:0px;margin:0px;background-image:url(/assets/img/trans.gif);display:inline-block;width:"+width+"px;' onMouseOver='gallerySwitch(\""+id+"\",\""+thumbImage+"\")' id='"+thumbImage+"'><img src='"+thumbImage+"' style='visibility:hidden;' /></span>";
		}else{
		gallery.innerHTML += "<span style='height:75px;overflow:hidden;padding:0px;margin:0px;background-image:url(/assets/img/trans.gif);display:inline-block;width:"+width+"px;' onMouseOver='gallerySwitch(\""+id+"\",\""+thumbImage+"\")' id='"+thumbImage+"'><img src='"+thumbImage+"' style='visibility:hidden;' /></span>";
		}
	}
}

function gallerySwitch(id,url){
	oldImage = document.getElementById("thumb_"+id);
	//oldImage.src ="cropimages.php?image="+ url;
		if(url.indexOf("/old/")>-1){
			url = "/cropimages.php?image="+url.split("_thumb").join("").toString().substring(1);
		}
	oldImage.src = url;
}

function galleryReset(id,url){
	oldImage = document.getElementById("thumb_"+id);
	//oldImage.src = "cropimages.php?image="+ url;
	if(url.indexOf("/old/")>-1){
			//url = "cropimages.php?image="+url.split("_mod").join("");
		}
	oldImage.src = url;
}
				
function openPortfolio2(id,num,num2,type){
	document.title = "O.K. PARKING / Interactief & Grafisch Ontwerpers / "+document.getElementById('maintitle' + id).innerHTML;
	//alert("NUM:"+num);
	idnum = id.substring(4);
	var winlok = window.location.toString();
	/*if(winlok.indexOf("?id") == -1){
		window.location.hash = "id="+idnum + "&type=portfolio";
	}*/
	
	if(winlok.indexOf("#") > -1 || (winlok.indexOf("/news/") == -1 && winlok.indexOf("/item/") == -1 && winlok.indexOf("/portfolio/") == -1 && winlok.indexOf("/over/") == -1 && winlok.indexOf("/eigen/") == -1 && winlok.indexOf("?id") == -1)){
		//window.location.hash = "id="+idnum + "&type=news";
		var str = document.getElementById('urlstr'+idnum).value;		
		if(type.toLowerCase() == "initiatief"){
			type = "eigen";
		}
		window.location.hash = "/"+type.toLowerCase()+"/"+str+"/";
	}
	var divElement = document.getElementById(id);
	
	
	var images = document.getElementById("loadImages_"+id).value;
	
	document.getElementById('imageArea_'+id).innerHTML = images;
	
	var p = underscore.position(divElement);
	if(p.x > window.innerWidth-450){
	
	}
	
	
	
	elem = document.getElementById(id);
	if(elem.offsetWidth == '180'){
		elem.style.width='588px';
		elem.style.height='auto';
		elem.style.zIndex='200';
		elem.className = elem.className + " threecols";
		if(p.x > window.innerWidth-450){
			
		}
		document.getElementById(id+'_intro').style.display = 'none';
		document.getElementById(id+'_content').style.display = 'block';
	}
	
	
	
	for(var i=1;i<num+1;i++){
		elem = document.getElementById("item"+i);
		if(elem != null){
			
			if(elem.offsetWidth != '180' && id != "item"+i){
				elem.className = "portfolio_item eachpost";
				elem.style.width='180px';
				elem.style.height='210px';
				elem.style.zIndex='2';
				document.getElementById("item"+i+'_intro').style.display = 'block';
				document.getElementById("item"+i+'_content').style.display = 'none';
				
			}
		}else{
			
			if(elem == null){
				//alert(i+" was empty!"+elem);
				//break;	
			}
		}
	}
	
	/*for(var j=1;j<num2+1;j++){
		elem2 = document.getElementById("news"+j);
		if(elem2 != null){
			elem2.className = "nieuws_item eachpost";
			if(elem2.offsetWidth != '180'){
				elem2.style.width='180px';
				elem2.style.height='210px';
				elem2.style.zIndex='2';
				document.getElementById("news"+j+'_intro').style.display = 'block';
				document.getElementById("news"+j+'_content').style.display = 'none';
				
			}
		}
		
	}*/
	
	arrangeFunc(id);
	
	

	

}



function closePortfolio(id){
	document.title = "O.K. PERIODICALS / a biannual magazine produced by creative professionals for creative professionals";
	elem = document.getElementById(id);
	if(elem.offsetWidth != '180'){
		elem.style.width='180px';
		elem.style.height='210px';
		elem.style.zIndex='2';
		elem.className = "portfolio_item eachpost";
		document.getElementById(id+'_intro').style.display = 'block';
		document.getElementById(id+'_content').style.display = 'none';
	}
	arrange();
	
}

underscore = {
    position: function (element) {
        var p = {x: element.offsetLeft || 0, y:element.offsetTop || 0};
        while (element = element.offsetParent) {
            p.x += element.offsetLeft;
            p.y += element.offsetTop;
        }
        return p;
    }
}

	var MIN_COLS_NEWS = 1;
	var MIN_COLS = 4;
	var COL_WIDTH = 140;
	var GAP = 10; 
	
	var offx, offy, topY = 12;
	offx = 20;
	offy = 120;
	maxy = new Array();
	
	// on site load (DOM READY)
	$(function() { 
		offy = $('#left').offset().top;
		offx = $('#left').offset().left;
		
			//document.title += "#";
		
		arrange(); 
		//$.localScroll();

	});
	var count = 0;
	// on window resize, call again
	window.onresize = function(){
			
			//count++;
			//document.title = count;
			if($(".top_nav").width() < 809){
				$(".top_nav").width(809);
			}
			//document.title = $("#blockfield").width();
			
			//$("#over-ons").width($("#blockfield").width());
			
			//document.title += "#";
			arrange();
		
 	};

	function arrange(test) {
	$("#left").width($("body").width()-420);
	if($("#left").width() < 600){
		$("#left").width(600);
	}
		//alert($(".eachpost").length);
		
		$items = $(".eachpost");
		
		if($items.length > 0){
			$("#left").height($(".eachpost").last().position().top + 60);
		}
		$('#left').each(function(i) {
			offy = 121;
			offx = $('#left').offset().left;
		});
		if(typeof test != "undefined"){
			offx = 20;
		}
		//if($('#blockfield').innerWidth() == 0){
			
			//$("#over-ons").width((diff));
		//}
		// how many columns fits here?
		var diff = (($('#left').innerWidth()+GAP) / (COL_WIDTH+GAP));
		var columns = Math.max(MIN_COLS, parseInt(diff));
		
		//alert("X "+offx+" Y "+offy+" T "+test);
		$items.css('width',COL_WIDTH  + 'px');
		$('.twocols').css('width', COL_WIDTH*2 + GAP  );
		$('.threecols').css('width', COL_WIDTH*3 + GAP*2);
		for (x=0; x < columns; x++) {
			maxy[x] = 0;
		}
		var maxHeight = 0;
		// lets iterate over all posts
		$items.each(function(i) {
			if($(this).css('display') != "none"){
			var pos, cursor, w , altura= 0;
			
			
			if($(this).hasClass("twocols")){
				
				GAPBOT = GAP - 75;				
			}else if($(this).hasClass("threecols")){
				GAPBOT = GAP;
				
			}else{
				GAPBOT = GAP;	
			}
			
			w = (Math.floor($(this).outerWidth() / COL_WIDTH));
			
			cursor = 0;
			if (w>1) {
				for (x=0; x < columns-(w-1); x++) {
					cursor = maxy[x] < maxy[cursor] ? x : cursor;
				}
				pos = cursor;
				
				for (var x=0; x<w; x++) {
					altura = Math.max(altura, maxy[pos+x]);
				}
				for (var x=0; x<w; x++) 
					maxy[pos+x] = parseInt($(this).outerHeight()) + GAPBOT + altura;
					
				$(this).css('left', pos*(COL_WIDTH+GAP) + offx).css('top',altura + offy);
				
				if (altura+topY > maxHeight) {
				  maxHeight=maxy[pos+w-1];
				}

			}
			else {
			
				for (x=0; x < columns; x++) {
					cursor = maxy[x] < maxy[cursor] ? x : cursor;
				}

				$(this).css('left', cursor*(COL_WIDTH+GAP) + offx).css('top',maxy[cursor] + offy);
				//document.title += "["+(cursor)+"]";
				maxy[cursor] += 140 + GAPBOT;
				if (maxy[cursor] > maxHeight) {maxHeight=maxy[cursor];}
				
			}
			}
		});
		
		
		if($items.length > 0){
			$("#left").height($items.last().position().top + 60);
		}
		
		
		
		if($(".threecols").length > 0){
			var yPos = $(".threecols").offset().top;
			var thisHeight = $(".threecols").outerHeight(true);
			
			var thisVar = yPos + thisHeight;
			//document.title = thisVar + " - " + $("#left").outerHeight(true);
			
			if(thisVar > $("#left").outerHeight(true)){
				//document.title = "ABSOLUTE:"+offsetTop+" - "+footerHeight;
				$(".footer").css("position","absolute");
				var top = thisVar+20;// - (offsetTop+footerHeight+1);
				$(".footer").css("top",top+"px");
				$(".actualWrapper").height($(document).height());
				
			}else{
				//document.title = "RELATIVE:"+offsetTop+" - "+footerHeight;
				$(".footer").css("position","relative");
				$(".footer").css("top","");
			}
			
		}else{
				//document.title = "RELATIVE:"+offsetTop+" - "+footerHeight;
				$(".footer").css("position","relative");
				$(".footer").css("top","");
				$(".actualWrapper").height('auto');
			}	
		
		
	
	
	}
	

function setCategory(cat,nav){
	if(nav){
	
	var winlok = window.location.toString();
		if(winlok.indexOf("#") > -1 || (winlok.indexOf("/news/") == -1 && winlok.indexOf("/item/") == -1 && winlok.indexOf("/portfolio/") == -1 && winlok.indexOf("/over/") == -1 && winlok.indexOf("/eigen/") == -1 && winlok.indexOf("?id") == -1)){	//window.location.hash = "id="+idnum + "&type=news";	
		
		if(cat == "Initiatief"){
			window.location.hash = "/eigen/";
		}else if(cat == "Over"){
			window.location.hash = "/over/";
			
		}else if(cat == "Portfolio"){
			window.location.hash = "/portfolio/";
		
		}
	}
	
	}

	$(".eachpost").each(function(){
		if($("#typer",this).val() != cat && $("#typer2",this).val() != cat && $("#typer3",this).val() != cat && $("#typer4",this).val() != cat){
			$(this).hide();
		} 
		if($("#typer",this).val() == cat || $("#typer2",this).val() == cat || $("#typer3",this).val() == cat || $("#typer4",this).val() == cat){
			$(this).show();
		} 
	});
	$(".menu-title a").removeClass("active");
	$(".menu-title a."+cat.toLowerCase()).addClass("active");
	if(cat == "Over"){
		
		//$("#over-ons").width($("#blockfield").width());
		$("#blockfield").css("margin-top",$("#over-ons").height()+24);
		$("#over-ons").show();
	}else{
		$("#blockfield").css("margin-top",0);
		$("#over-ons").hide();
	}
	arrange();
}


function testResize(){
	$("#blockfield-news").width(221+180+GAP);
	$("#blockfield").width($("body").innerWidth() - ($("#blockfield-news").innerWidth()+GAP));
	arrange();
}

function testResizeBack(){
	$("#blockfield-news").width(221);
	$("#blockfield").width($("body").innerWidth() - ($("#blockfield-news").innerWidth()));
	arrange();
}
	
function testResizeOver(){
	//$("#over-ons").width($("#blockfield").width());
	$("#blockfield").css("margin-top",$("#over-ons").height()+24);
	$("#over-ons").show();
	arrange();
}

function blurAnchors(){
	if(document.getElementsByTagName) {
		var a = document.getElementsByTagName("a");
		//collect all anchors A
		for(var i = 0; i < a.length; i++){
			// mouse onfocus, blur anchors
			a[i].onfocus = function(){this.blur();};
		}
		var a = document.getElementsByTagName("input");
		//collect all anchors A
		for(var i = 0; i < a.length; i++){
			// mouse onfocus, blur anchors
			if(a[i].type == 'submit')
			a[i].onfocus = function(){this.blur();};
		}
	}
}

$(document).ready(function() { 
    
	blurAnchors();

});
