
var topicArray;
var totalActive = 0;
var activeArray = new Array();
var newWindow = true;
var boxSmallHeight = 209;
var boxWidth = 208;
var boxMargin = 16;
var minSideMargin = 16;
var boxEvenTopMargin = 11;
var largeArticleWidth = 432;
var startY = 269;

var totalArticles = articleArray.length;

var totalArticlesMinStart = totalArticles;
//var totalArticlesMinStart = 16;
var totalArticlesStart = totalArticles; // change this for initial total articles to load
//var totalArticlesStart = 16; // change this for initial total articles to load

var totalArticlesDisplay = totalArticles;
//var totalArticlesDisplay = totalArticlesStart;

//if(totalArticles < totalArticlesMinStart) totalArticlesStart = totalArticles;
var totalArticlesLoaded = totalArticles;
//var totalArticlesLoaded = totalArticlesStart;

var showMoreBox = true;
var showMoreLink = true;

var viewArticleState = 2; //default view of the article

// detailview is false until url is like track/detail/id/title

var path = window.location.pathname.split('/');
var categoryActive = path[1] != 'site' && path[1] != '' ? path[1] : '';
var tagActive = path[2] == 'tag' && path[4] != '' ? path[4] : '';

var detailView = false;
var searchString = '';

for(var i = 0; i < path.length; i++)
{
	if(path[i] == 'search')
	{
		var searchString = unescape(path[(i+1)]);
	}
	if(path[i] == 'detail' && parseInt(path[(i+1)]) > 0)
	{
		var detailView = true;
	}
}

function initViewState()
{
	if($.cookie('view_cookie') != null) {
		viewArticleState = parseInt($.cookie('view_cookie'));
	}
	initCategories();
}

function initCategories()
{
	//make category active
	
	if(categoryActive != '')
	{	
		if ( $("#btn_"+categoryActive).length > 0 )
		{ 
			$("#btn_"+categoryActive).attr("src",$("#btn_"+categoryActive).attr("src").split('_off').join('_hvr'));
		}
	}
	if(tagActive != '')
	{	
		if ( $("#btn_"+tagActive).length > 0 )
		{
			$("#btn_"+tagActive).attr("src",$("#btn_"+tagActive).attr("src").split('_off').join('_hvr'));
		}
	}
	initTopics();
}

function initTopics()
{	
	if($.cookie('topic_0_cookie') != null) {
		topicArray = new Array([$.cookie('topic_0_cookie'),'dutch'],[$.cookie('topic_1_cookie'),'design'],[$.cookie('topic_2_cookie'),'fashion'],[$.cookie('topic_3_cookie'),'archi']);
	}else
	{
		topicArray = new Array([1,'dutch'],[1,'design'],[1,'fashion'],[1,'archi']);
		$.cookie('topic_0_cookie',1, { path: '/' });
		$.cookie('topic_1_cookie',1, { path: '/' });
		$.cookie('topic_2_cookie',1, { path: '/' });
		$.cookie('topic_3_cookie',1, { path: '/' });
	}

	for(var i = 0; i < topicArray.length; i++)
	{
		if(topicArray[i][0] == 1)
		{	
			//topic active
			$("#topic_"+i).attr("src",$("#topic_"+i).attr("src").split('_off').join('_act'));
			
			$("#topic_"+i).mouseover(function()
			{
				$(this).attr("src",$(this).attr("src").split('_act').join('_hvr'));
			});
			
			$("#topic_"+i).mouseout(function()
			{
				$(this).attr("src",$(this).attr("src").split('_hvr').join('_act'));
			});			
		}else
		{
			$("#topic_"+i).attr("src",$("#topic_"+i).attr("src").split('_act').join('_off'));

			$("#topic_"+i).mouseover(function()
			{
				$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
			});
		
			$("#topic_"+i).mouseout(function()
			{
				$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
			});
		}
	}
	//showLogo();
	initArticles();
}

function initArticles()
{
	// add more articles button
	/*
	var div = "<div class='articleMore' id='article_more'><img src='/site/gfx/btn_articles_all_off.png' class='jqRollover' alt='' id='btnArticleMore' /></div>";	
	$("#container").add(div).appendTo(document.body);
	attachRollOverEvent("#btnArticleMore.jqRollover");
	$("#btnArticleMore").addClass("btn_article_more");
	$("#btnArticleMore").click(function(){
		articleMore()
	});
	*/
	// add more articles button for a menu reset when there are no articles to display
	var div2 = "<div class='articleAll' id='article_all'><img src='/site/gfx/btn_profiles_all_off.png' class='jqRollover' alt='' id='btnArticleAll' /></div>";	
	$("#container").add(div2).appendTo(document.body);
	attachRollOverEvent("#btnArticleAll.jqRollover");
	$("#btnArticleAll").addClass("btn_article_all");
	$("#btnArticleAll").click(function(){
		articleAll()
	});
	
	switch (viewArticleState)
	{
	case 0:
		// hide image and text
		boxSmallHeight = 75;
		break;
	case 1:
		// hide image
		boxSmallHeight = 130;
		break;
	case 2:
		// hide none
		boxSmallHeight = 209;
		break;
	case 3:
		// hide headline and text
		boxSmallHeight = 130;
		break;
	default:
	}
	
	updateArticles();
}

function articleAll()
{
	for(var i = 0; i < 4; i++)
	{
		var topicId = i;
	
		$("#logo"+(topicId+1)).css({'display' : 'block'});	
		
		$("#topic_"+topicId).attr("src",'/site/gfx/btn_'+topicArray[topicId][1]+'_act.png');
			
		$("#topic_"+topicId).mouseover(function()
		{
			$(this).attr("src",$(this).attr("src").split('_act').join('_hvr'));
			
		});
		
		topicArray[topicId][0] = 1;
		$.cookie('topic_' + topicId + '_cookie', 1, { path: '/' });
		
	}

	$("#topic_0").mouseout(function(){
		$(this).attr("src",'/site/gfx/btn_'+topicArray[0][1]+'_act.png');
	});
	$("#topic_1").mouseout(function(){
		$(this).attr("src",'/site/gfx/btn_'+topicArray[1][1]+'_act.png');
	});
	$("#topic_2").mouseout(function(){
		$(this).attr("src",'/site/gfx/btn_'+topicArray[2][1]+'_act.png');
	});
	$("#topic_3").mouseout(function(){
		$(this).attr("src",'/site/gfx/btn_'+topicArray[3][1]+'_act.png');
	});
	
	updateArticles();
}

function updateArticles()
{

	// more link deactivated
	$("#btnArticleMore").unbind("mouseout");
	$("#btnArticleMore").unbind("mouseover");
	$("#btnArticleMore").attr("src","/site/gfx/btn_articles_all_off.png");
	
	$("#btnArticleMore").mouseover(function()
	{
		$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
	});

	$("#btnArticleMore").mouseout(function()
	{
		$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
	});		
	
	showMoreLink = true;
		
		
	// empty  activeArray
	
	activeArray = new Array();
	totalActive = 0;
		
	for(var i = 0; i < totalArticles; i++)
	{
		//articleArray[i][4] = 0; // set visibility of this article to 0
		
		for(var j = 0; j < 4; j++) // 4 = articleArray[i].length - 2
		{
			if(articleArray[i][j] == 1) // one or more of the categories active in this article?
			{
				if(topicArray[j][0] == 1) // is the topic active?
				{
					activeArray[totalActive] = new Array();
					activeArray[totalActive][0] = i;

					activeArray[totalActive][1] = topicArray[j][1];
					totalActive++;					
					break;
				}
			}
		}
	}

	if(totalActive < totalArticlesStart)
	{
		totalArticlesDisplay = totalActive;
	}else
	{
		totalArticlesDisplay = totalArticlesStart;
	}
	
	// remove nonactive articles

	for(var i = 0; i < totalArticles; i++)
	{	
		if(articleArray[i][4] == 1) // article is active
		{
			var curactive = false;
			//var curactivenr = 0;
			
			for(var j = 0; j < totalActive; j++)
			{
				// compare id's to new activeArray
				if(activeArray[j][0] == i && j < totalArticlesDisplay)
				{
					// article found
					var curactivenr = i;
					curactive = true;
				}
			}
			if(curactive == false)
			{
				// remove article
				$("#article_" + i).remove();
				articleArray[i][4] = 0;
			}
		}
		//activeArray[totalActive][0] = i;
	}

	// place and load articles on stage
	
	for(var i = 0; i < totalArticlesDisplay; i++)
	{
		articleArray[activeArray[i][0]][4] = 1; // set visibility of this article to 1
		
		if($("#article_" + activeArray[i][0]).length > 0) // does the article exsist?
		{
			// alert(activeArray[i][0]);
			//remove classes
			$("#article_" + activeArray[i][0]).removeClass("article_" + topicArray[0][1]);
			$("#article_" + activeArray[i][0]).removeClass("article_" + topicArray[1][1]);
			$("#article_" + activeArray[i][0]).removeClass("article_" + topicArray[2][1]);
			$("#article_" + activeArray[i][0]).removeClass("article_" + topicArray[3][1]);
			
			$("#article_" + activeArray[i][0]).addClass("article_" + activeArray[i][1]);
		}else
		{
			var div = "<div class='articleSmall' id='article_" + activeArray[i][0] + "'></div>";
			$("#container").add(div).appendTo(document.body);		
			$("#article_" + activeArray[i][0]).hide();
			$("#article_" + activeArray[i][0]).load("/site/ajax/getArticles.php", {id: activeArray[i][0], articleid: articleArray[activeArray[i][0]][5], search: searchString}, function(){
	  			articleViewSwitch(this.id); // switch class and fadeIn
			});
			
			$("#article_" + activeArray[i][0]).addClass("article_" + activeArray[i][1]);
		}
	}

	if(totalArticlesDisplay < totalArticlesStart) // hide more link if total start articles are less then standard
	{
		$("#article_more").hide();
		showMoreBox = false;
	}else
	{
		$("#article_more").show();
		showMoreBox = true;
	}
	
	// if there are no articles to display, show all button
	
	if(totalArticlesDisplay == 0)
	{
		$("#article_all").show();
	}else
	{
		$("#article_all").hide();
	}
	

	updatePositions();
}


function updatePositions()
{
	var e = clientCoords();
	var winWidth = e.w; 
	var winHeight  = e.h;	
	var animateDuration = 200;
	var curRow = 1;
	var curBox = 0;
	var totalInRow = Math.floor((winWidth - boxMargin) / (boxWidth + boxMargin));
	var startY = 270;
	var largeArticleHeight;
	
	if(detailView) //detail article
	{

		// show article detail and get height
		
		$("#articledetail").css({'display' : 'block'});
		largeArticleHeight = $("#articledetail").height();
		
		var totalSideRows = Math.round(largeArticleHeight / (boxSmallHeight + boxMargin));
		var totalInSideRow = Math.floor((winWidth - boxMargin - largeArticleWidth - boxMargin) / (boxWidth + boxMargin));

		if(totalArticlesDisplay == 0) // only articledetail in the middle of the page
		{
			var startX = Math.floor((winWidth - largeArticleWidth) / 2);
			
		}else if(totalArticlesDisplay < totalInSideRow && totalArticlesDisplay != 0) // only articles in first siderow
		{
			var startSideX = Math.floor((winWidth - ((totalArticlesDisplay * (boxWidth + boxMargin)) + largeArticleWidth)) / 2 + (largeArticleWidth + boxMargin));
			var startX = Math.floor((winWidth - largeArticleWidth - ((totalArticlesDisplay * (boxWidth + boxMargin)) - boxMargin)) / 2);
			
		}else // more articles in siderow
		{
			var startSideX = Math.floor((winWidth - ((totalInSideRow * (boxWidth + boxMargin)) + largeArticleWidth)) / 2 + (largeArticleWidth + boxMargin));
			var startX = Math.floor((winWidth - ((totalInRow * (boxWidth + boxMargin)) - boxMargin)) / 2);
		}
		
		$("#articledetail").animate({ left: startX, top: startY }, { duration: animateDuration, queue: false });
		
		
		if(totalInSideRow != 0 && totalInSideRow != -1) // if there are articles in siderow, position them first. Else get the first position beneath the article detail
		{
			for(var i = 0; i <= totalSideRows; i++)
			{	
				for(var j = 0; j < totalInSideRow; j++)
				{	
					if(curBox < totalArticlesDisplay)
					{
						var newX = startSideX + (j * (boxWidth + boxMargin));
						var newY = startY + (i * (boxSmallHeight + boxMargin));
						
						if(j%2) // odd and even
						{
							newY += boxEvenTopMargin;
						}
						if(newWindow)
						{
							$("#article_" + activeArray[curBox][0]).animate({ left: newX, top: newY }, 0);

						}else
						{
							$("#article_" + activeArray[curBox][0]).animate({ left: newX, top: newY }, { duration: animateDuration, queue: false });
						}
			    		curBox++;
					}
				}
			}
			
			startY = newY + (boxMargin + boxSmallHeight); //starting position y for remaining articles

		}else
		{
			startY = startY + ((totalSideRows + 1) * (boxMargin + boxSmallHeight)); //starting position y for remaining articles
		}
		
		// how many articlerows beneath the article detail?
		var totalRowsRemaining = Math.ceil((totalArticlesDisplay - curBox) / totalInRow);
		
		for(var i = 0; i <= totalRowsRemaining; i++) // position remaining articles
		{	
			for(var j = 0; j < totalInRow; j++)
			{	
				if(curBox < totalArticlesDisplay)
				{
					var newX = startX + (j * (boxWidth + boxMargin));
					var newY = startY + (i * (boxSmallHeight + boxMargin));
				
					if(j%2)
					{
						newY += boxEvenTopMargin;
					}
					if(newWindow) // direct positioning without animation on window load
					{
						$("#article_" + activeArray[curBox][0]).animate({left: newX,top: newY}, 0);
					}else
					{
						$("#article_" + activeArray[curBox][0]).animate({left: newX,top: newY}, { duration: animateDuration, queue: false });
					}
		    		curBox ++;
	    		}
	    	}
		}

		if(showMoreBox)
		{	
			if(totalRowsRemaining > 0)
			{
				newX = startX;
				var containerHeight = ((totalSideRows + totalRowsRemaining) * (boxSmallHeight + boxMargin));
				
			}else
			{
				newX = startSideX;
				var containerHeight = $("#articledetail").height() + (boxSmallHeight + boxMargin);
				
			}
			
			newY = newY+ boxSmallHeight + boxMargin;
			
			if(newWindow)
			{
				$("#article_more").animate({left: newX,top: newY}, 0);
			}else
			{
				$("#article_more").animate({left: newX,top: newY}, { duration: animateDuration, queue: false });
			}
		}


		var containerHeight = ((totalSideRows + totalRowsRemaining) * (boxSmallHeight + boxMargin));
		$("#container").css({'height' : containerHeight + 250+ 'px'});
		
		newWindow = false;

	}else //overview page
	{

		var totalRows = Math.ceil(totalArticlesDisplay / totalInRow);

		if(totalArticlesDisplay < totalInRow)
		{
			var startX = Math.floor((winWidth - ((totalArticlesDisplay * (boxWidth + boxMargin)) - boxMargin)) / 2);
		}else
		{
			var startX = Math.floor((winWidth - ((totalInRow * (boxWidth + boxMargin)) - boxMargin)) / 2);
		}
		
		for(var i = 0; i < totalRows; i++)
		{	
			for(var j = 0; j < totalInRow; j++)
			{
				if(curBox < totalArticlesDisplay)
				{	
					var newX = startX + (j * (boxWidth + boxMargin));
					var newY = startY + (i * (boxSmallHeight + boxMargin));
					
					if(j%2)
					{
						newY += boxEvenTopMargin;
					}
					
					if(newWindow)
					{
						$("#article_" + activeArray[curBox][0]).animate({left: newX, top: newY}, 0);
					}else
					{
						$("#article_" + activeArray[curBox][0]).animate({left: newX, top: newY}, { duration: animateDuration, queue: false });
					}
		    		curBox++;
	    		}
	    	}
		}

		if(showMoreBox)
		{
			newY += boxSmallHeight + boxMargin;
			newX = startX;
			
			if(newWindow)
			{
				$("#article_more").animate({left: newX,top: newY}, 0);
			}else
			{
				$("#article_more").animate({left: newX,top: newY}, { duration: animateDuration, queue: false });
			}
		}		
		newWindow = false;
		
		var containerHeight = (totalRows * (boxSmallHeight + boxMargin));
		$("#container").css({'height' : containerHeight+'px'});
		
		if(totalArticlesDisplay == 0)
		{	
			newX = Math.floor((winWidth - 176) / 2);
			
			$("#article_all").animate({left: newX,top: startY}, 0);
			
		}
	}
}


/*
	

	for(var i = 0; i < totalArticles; i++)
	{
		var div = "<div class='articleSmall' id='article_" + i + "'></div>";
		$("#container").add(div).appendTo(document.body);		

		$("#article_"+i).load("/site/ajax/getArticles.php", {id: i, articleid: articleArray[i][5], search: searchString}, function(){
  			articleViewSwitch(this.id);
		});
	}

	
	totalActive = 0;

	for(var i = 0; i < totalArticles; i++)
	{

		
		
		
		//$("#article_" + i).animate({ left: 0, top: (i*250) }, 0);
	
		var visible = 0;
		
		for(var j = 0; j < 4; j++) // 4 = articleArray[i].length - 2
		{
			// remove all possible topic classes
			$("#article_" + i).removeClass("article_" + topicArray[0][1]);
			$("#article_" + i).removeClass("article_" + topicArray[1][1]);
			$("#article_" + i).removeClass("article_" + topicArray[2][1]);
			$("#article_" + i).removeClass("article_" + topicArray[3][1]);
			
			if(articleArray[i][j] == 1) // one or more of the categories active in this article?
			{			
				if(topicArray[j][0] == 1) // is the topic active?
				{
					$("#article_" + i).addClass("article_" + topicArray[j][1]);
					visible = 1;
					break;
				}
			}
		}
		if(visible == 0) // article visible or not visible
		{
			articleArray[i][4] = 0;
			$("#article_" + i).fadeOut();
			
		}else
		{
			activeArray[totalActive] = i;
			totalActive++;
			$("#article_" + i).fadeIn("fast");
		alert(totalActive);
			//$("#article_" + i).animate({ left: 0, top: (totalActive*250) }, 0);
		}
	}


function updateArticleBox()
{
	totalActive = 0;

	for(var i = 0; i < totalArticles; i++)
	{
	
	$("#article_" + i).animate({ left: 0, top: (i*250) }, 0);
	
		var visible = 0;
		
		for(var j = 0; j < 4; j++) // 4 = articleArray[i].length - 2
		{
			// remove all possible topic classes
			$("#article_" + i).removeClass("article_" + topicArray[0][1]);
			$("#article_" + i).removeClass("article_" + topicArray[1][1]);
			$("#article_" + i).removeClass("article_" + topicArray[2][1]);
			$("#article_" + i).removeClass("article_" + topicArray[3][1]);
			
			if(articleArray[i][j] == 1) // one or more of the categories active in this article?
			{			
				if(topicArray[j][0] == 1) // is the topic active?
				{
					$("#article_" + i).addClass("article_" + topicArray[j][1]);
					visible = 1;
					break;
				}
			}
		}
		if(visible == 0) // article visible or not visible
		{
			articleArray[i][4] = 0;
			$("#article_" + i).fadeOut();
			
		}else
		{
			activeArray[totalActive] = i;
			totalActive++;
			$("#article_" + i).fadeIn("fast");
		alert(totalActive);
			//$("#article_" + i).animate({ left: 0, top: (totalActive*250) }, 0);
		}
	}
	
	//updatePositions();
}

*/

function articleMore()
{	


/*
	var div = "<div class='articleMore' id='article_more'><img src='/site/gfx/btn_articles_all_off.png' class='jqRollover' alt='' id='btnArticleMore' /></div>";	
	$("#container").add(div).appendTo(document.body);
	attachRollOverEvent("#article_more img.jqRollover");
	$("#btnArticleMore").addClass("btn_article_more");
	$("#btnArticleMore").click(function(){
		articleMore()
	});
*/
	if(showMoreLink)
	{
		$("#btnArticleMore").unbind("mouseout");
		$("#btnArticleMore").unbind("mouseover");
		$("#btnArticleMore").attr("src","/site/gfx/btn_articles_less_off.png");
		
		$("#btnArticleMore").mouseover(function()
		{
			$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
		});
	
		$("#btnArticleMore").mouseout(function()
		{
			$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
		});
		
		showMoreLink = false;
			
		
		for(var i = totalArticlesDisplay; i < totalActive; i++)
		{
			articleArray[activeArray[i][0]][4] = 1; // set visibility of this article to 1

			var div = "<div class='articleSmall' id='article_" + activeArray[i][0] + "'></div>";
			$("#container").add(div).appendTo(document.body);		
			$("#article_" + activeArray[i][0]).hide();
			$("#article_" + activeArray[i][0]).load("/site/ajax/getArticles.php", {id: activeArray[i][0],articleid: articleArray[activeArray[i][0]][5],search: searchString}, function(){
	  			articleViewSwitch(this.id); // switch class and fadeIn
			});
			$("#article_" + activeArray[i][0]).addClass("article_" + activeArray[i][1]);
		}

		totalArticlesDisplay = totalActive;

	}else
	{
		$("#btnArticleMore").unbind("mouseout");
		$("#btnArticleMore").unbind("mouseover");
		$("#btnArticleMore").attr("src","/site/gfx/btn_articles_all_off.png");
		
		$("#btnArticleMore").mouseover(function()
		{
			$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
		});
	
		$("#btnArticleMore").mouseout(function()
		{
			$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
		});		
		
		showMoreLink = true;
		
		if(totalActive < totalArticlesStart)
		{
			totalArticlesDisplay = totalActive;
		}else
		{
			totalArticlesDisplay = totalArticlesStart;
		}
		//remove articles
		for(var i = totalArticlesDisplay; i < totalActive; i++)
		{
			$("#article_" + activeArray[i][0]).remove();
		}
	}
	updatePositions();
}

function clearSearch() {
	window.location = '/video';
}

function initSearch()
{

	$("#search").val(unescape(searchString));
	//$('#frmSearchDelete').show();
}

function articleViewSwitch(id)
{

	$("#"+id).fadeIn(500);
	
	switch (viewArticleState)
	{
	case 0:
		// hide image and text
				
			$('#slider').slider('option', 'value', 1);
			$("#"+id+" .artsmall_image").css({'display' : 'none'});
			$("#"+id+" .artsmall_headline").css({'display' : 'block'});
			$("#"+id+" .artsmall_text").css({'display' : 'none'});
			$("#"+id+" .artsmall_image_play").css({'display' : 'none'});
			$("#"+id).css({'height' : '30px'});
			boxSmallHeight = 75;
		break;
	case 1:
		// hide image
			$('#slider').slider('option', 'value', 2);
			$("#"+id+" .artsmall_image").css({'display' : 'none'});
			$("#"+id+" .artsmall_headline").css({'display' : 'block'});
			$("#"+id+" .artsmall_text").css({'display' : 'block'});
			$("#"+id+" .artsmall_image_play").css({'display' : 'none'});
			$("#"+id).css({'height' : '85px'});
			boxSmallHeight = 130;
		break;
	case 2:
			// hide none
			$('#slider').slider('option', 'value', 3);
			$("#"+id+" .artsmall_image").css({'display' : 'block'});
			$("#"+id+" .artsmall_headline").css({'display' : 'block'});
			$("#"+id+" .artsmall_text").css({'display' : 'block'});
			$("#"+id+" .artsmall_image_play").css({'display' : 'block'});
			$("#"+id).css({'height' : '163px'});
			boxSmallHeight = 209;
		break;
	case 3:
			// hide headline and text
			$('#slider').slider('option', 'value', 4);
			$("#"+id+" .artsmall_image").css({'display' : 'block'});
			$("#"+id+" .artsmall_headline").css({'display' : 'none'});
			$("#"+id+" .artsmall_text").css({'display' : 'none'});
			$("#"+id+" .artsmall_image_play").css({'display' : 'block'});
			$("#"+id).css({'height' : '85px'});
			boxSmallHeight = 130;

		break;
	default:
	}
}


function articleView(id)
{
	viewArticleState = id;
	
	$.cookie('view_cookie', id, { path: '/' });
	
	for(var i = 0; i < totalActive; i++)
	{
		articleViewSwitch("article_" + activeArray[i][0]);		
	}
	updatePositions();
}


function topicActivate(topicId)
{	

	if(topicArray[topicId][0] == 1)
	{
		//set topic off
		$("#logo"+(topicId+1)).css({'display' : 'none'});

		$("#topic_"+topicId).attr("src",'/site/gfx/btn_'+topicArray[topicId][1]+'_off.png');
		
		$("#topic_"+topicId).mouseover(function(){
			$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
		});
		
		$("#topic_"+topicId).mouseout(function(){
			$(this).attr("src",'/site/gfx/btn_'+topicArray[topicId][1]+'_off.png');
		});
		
		topicArray[topicId][0] = 0;
		$.cookie('topic_' + topicId + '_cookie', 0, { path: '/' });
		
		updateArticles();
	}else
	{
		$("#logo"+(topicId+1)).css({'display' : 'block'});
		
		$("#topic_"+topicId).attr("src",'/site/gfx/btn_'+topicArray[topicId][1]+'_act.png');	
		
		$("#topic_"+topicId).mouseover(function(){
			$(this).attr("src",$(this).attr("src").split('_act').join('_hvr'));
		});
		
		$("#topic_"+topicId).mouseout(function(){
			$(this).attr("src",'/site/gfx/btn_'+topicArray[topicId][1]+'_act.png');
		});

		topicArray[topicId][0] = 1;
		$.cookie('topic_' + topicId + '_cookie', 1, { path: '/' });
		
		updateArticles();
	}
	//showLogo();
}


function clientCoords()
{	

    if(jQuery.browser.msie)
    {
        return {w:document.documentElement.offsetWidth,h:document.documentElement.offsetHeight}
    }else
    {
       return {w:window.innerWidth,h:window.innerHeight}
    }
}


function slideView(dir)
{
	if(dir == 'down')
	{
		if(viewArticleState > 0)
		{
			viewArticleState--;
			articleView(viewArticleState);
		}
	}else
	{
		if(viewArticleState < 3)
		{
			viewArticleState++;
			articleView(viewArticleState);
		}
	}
	
}

$(window).resize(function()
{
  updatePositions();
});

$(document).ready(function()
{	
		
	if(order!="")
	{	
		$("#order_"+order+" img").attr("src",$("#order_"+order+" img").attr("src").split('_off').join('_hvr'));

	}
	
	
	$(window).focus();
	
	if(searchString != '')
	{
		initSearch();	
	}else{
		$('#frmSearchDelete').hide();
	}

	attachRollOverEvent("img.jqRollover");
	initViewState();
	
	var slider = $('#slider').slider({ 
    steps: 2,
    animate: true,
    min:1,
    max:4,
    value: (viewArticleState + 1),
    change: function(e,ui){
    	
    	switch (ui.value){
	
		case 1:
    		articleView(0);
    		break;
    			
		case 2:
    		articleView(1);
    		break;
    		
    	case 3:
    		articleView(2);
    		break;
    		
    	case 4:
    		articleView(3);
    		break;
    			
		default:	
		}
	}
	});

	$('#topic_0').click(function(){
		topicActivate(0);
	});
	$('#topic_1').click(function(){
		topicActivate(1);
	});
	$('#topic_2').click(function(){
		topicActivate(2);
	});
	$('#topic_3').click(function(){
		topicActivate(3);
	});
	$('#slideDown').click(function(){
		slideView('down');
	});
	$('#slideUp').click(function(){
		slideView('up');
	});
	$('#frmSubscribeSubmit').click(function(){
		$('#frmSS11').submit();
	});
	$('#frmSearchSubmit').click(function(){
		$('#frmSearch').submit();
	});
	$('#frmSearchDelete').click(function(){
		clearSearch();
	});
});

	
function e(id) { return document.getElementById(id) }

/* Contactform functions */

function toggleErrorLabel(label,state) {
	if(state == 'on') {
		document.getElementById(label).className = "errorlabel";
	}else{
		document.getElementById(label).className = "normallabel";
	}
}

function isValidEmail(str) {
   return (str.indexOf(".") > 2) && (str.indexOf("@") > 0);
}

function ValidateContactForm() {

	var form = document.getElementById('contactform');
	var error = 0;
	var errorMessage = 'De volgende velden zijn niet juist ingevuld:\n\n';
		
	if(form.naam.value == "") { 
		errorMessage += '- Naam is niet ingevuld\n';
		error = 1;
		toggleErrorLabel('label_naam','on');
	}else{
		toggleErrorLabel('label_naam');
	}
	if(form.email.value == "") {
		errorMessage += '- Emailadres is niet ingevuld\n';
		error = 1;
		toggleErrorLabel('label_email','on');
	}else{
		if(isValidEmail(form.email.value)) {
			toggleErrorLabel('label_email');
		}else{
			errorMessage += '- Emailadres is niet geldig \n';
			error = 1;
			toggleErrorLabel('label_email','on');	
		}	
	}
	if(form.bericht.value == "") { 
		errorMessage += '- Bericht is niet ingevuld\n';
		error = 1; 	
		toggleErrorLabel('label_bericht','on');
	}else{
		toggleErrorLabel('label_bericht');
	}
	
	if(error){
		alert(errorMessage);
		return false; 
	}else{
		return true;
	}
}

function resetSite() {
	// reset filter and view cookies here!
	$.cookie('topic_0_cookie','', { expires: -1, path: '/' });
	$.cookie('topic_1_cookie','', { expires: -1, path: '/' });
	$.cookie('topic_2_cookie','', { expires: -1, path: '/' });
	$.cookie('topic_3_cookie','', { expires: -1, path: '/' });
	$.cookie('view_cookie','', { expires: -1, path: '/' });
	window.location = '/video';
}

function clearDefault(el)
{
  if (el.defaultValue == el.value) el.value = '';
}

function setDefault(el)
{
  if (el.value == '') el.value = el.defaultValue;
}

jQuery.preloadImages = function(){for(var i = 0; i<arguments.length; i++){jQuery("<img>").attr("src", arguments[i]);}}

$.preloadImages("/site/gfx/btn_article_all_hvr.png","/site/gfx/btn_article_less_hvr.png","/site/gfx/btn_dutch_hvr.png","/site/gfx/btn_design_hvr.png","/site/gfx/btn_fashion_v.png","/site/gfx/btn_archi_hvr.png","/site/gfx/btn_programme_hvr.png","/site/gfx/btn_news_hvr.png","/site/gfx/btn_faq_hvr.png","/site/gfx/btn_facts_hvr.png","/site/gfx/slider_text_hvr.png","/site/gfx/slider_images_hvr.png","/site/gfx/btn_contact_hvr.png","/site/gfx/btn_press_hvr.png","/site/gfx/btn_rss_hvr.png","/site/gfx/btn_wiki_hvr.png","/site/gfx/btn_about_hvr.png");

/*
$.cookie('the_cookie'); // get cookie
$.cookie('the_cookie', 'the_value'); // set cookie
$.cookie('the_cookie', 'the_value', { expires: 7 }); // set cookie with an expiration date seven days in the future
$.cookie('the_cookie', '', { expires: -1 }); // delete cookie
*/

attachRollOverEvent = function(image){
	
	$(image).mouseover(function(){
		if($(this).attr("src").indexOf('_off') > 0){
		
			$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
		}else{
			$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
		}
	});
	$(image).mouseout(function(){
		
		if($(this).attr("src").indexOf('_hvr') > 0){
			$(this).attr("src",$(this).attr("src").split('_hvr').join('_off'));
		}else{
			$(this).attr("src",$(this).attr("src").split('_off').join('_hvr'));
		}
	
	});
}


function showLogo() {

	//reset the logo's
	
	$("#logo1").css({'display' : 'none'});
	$("#logo2").css({'display' : 'none'});
	$("#logo3").css({'display' : 'none'});
	$("#logo4").css({'display' : 'none'});
	$("#logo5").css({'display' : 'none'});
	
	var img = Array('','dutch','design','fashion','archi','black');
	
	var nonactiveTopicArray = new Array();
	var count = 0;
	
	for(var i = 0; i < topicArray.length; i++)
	{
		if(topicArray[i][0] == 0)
		{
			nonactiveTopicArray[count] = (i+1);
			count++;
		}
	}
	
	var count1 = 0;
	var count2 = 0;
	
	i = window.setInterval(function () {
		count1++;
		$("#logo"+count1).css({'display' : 'block'});
		
		if(count1 >= 5) { 
		
			clearInterval(i);
			j = window.setInterval(function () {
			
				//hide logo
				$("#logo"+nonactiveTopicArray[count2]).css({'display' : 'none'});

				if(count2 > nonactiveTopicArray.length) { 
					clearInterval(j);
				}
				count2++;
				
			},200);
		}
		
	},200);
}