var heights = new Array();
var titleheights = new Array();
var itemHeight = 84;
var titleHeight = 20;

$(document).ready( function () {
	//save original height of each item
	$(".Item").each(function(index) {
		heights[index] = $("#Item"+index).height();
		});
	//save original height of each item title
	$(".Item").each(function(index) {
		titleheights[index] = $("#Item"+index+" .ItemTitle").height();
		});

	//make all Items small, but only if there's more than one
	if(heights.length > 1) {
		$(".Item").css('height', itemHeight);
		$(".ItemTitle").css('height', titleHeight);
		$(".MinusButton span").hide();
	} else {
		$(".PlusButton").text('[-]');
	}

	$(".Unfold").click(
		function () {
			oldheight = $(this).parent().height();
			//it might be that the title is clicked, in which case the .parent step
			//is redundant, but it might have been the image that has been clicked
			titleoldheight = $(this).parent().find('.ItemTitle').height();
			//collapse all items
			$(".Item").css("height",itemHeight);
			$(".ItemTitle").css('height',titleHeight);
			$(".PlusButton").text('[+]');
			$(".MinusButton span").hide();
			
			//expand the item that was clicked and collapsed
			if(parseInt(oldheight) == itemHeight) {
				parentid = $(this).parent().attr('id');
				id = parseInt(parentid.replace(/Item/, ""));
				
				//get the original height for both Item and ItemTitle
				newheight = parseInt(heights[id]);
				newtitleheight = parseInt(titleheights[id]);
				//when the original heights are smaller than the
				//collapsed heights, make them the collapse heights
				if(newheight < itemHeight)
					newheight = itemHeight;
				if(newtitleheight < titleHeight)
					newtitleheight = titleHeight;
				
				//set the heights, make plusbutton minus and show the bottom minus button
				$(this).parent().css('height', newheight);
				$(this).parent().find('.ItemTitle').css('height', newtitleheight);
				$(this).parent().find(".PlusButton").text('[-]');
				$(this).parent().find(".MinusButton span").show();
			}
		}
	);

	//on click of the bottom minus button
	$(".MinusButton span").click(
		function() {
			//collapse all items
			$(".Item").css("height",itemHeight);
			$(".ItemTitle").css('height',titleHeight);
			//make plusbutton plus again
			$(".PlusButton").text('[+]');
			//hide all botom minusbuttons
			$(".MinusButton span").hide();
		}
	);
	
	//mouse in/out for minus and plus buttons
	$(".PlusMinus").hover(
		function() {
			$(this).css("color","#999999")
		},
		function() {
			$(this).css("color", "#ffffff");
		}
	);

	/* Open calendar popup when user clicks icon*/
	$('#filter_date').calendar({
		triggerElement: '.CalendarIcon'
	});
	$('#filter_date').change(
		function () {
			value = $(this).val();
			myDateParts = value.split("-");
			uservalue = myDateParts[2]+'-'+myDateParts[1]+'-'+myDateParts[0];
			$(".DateInput").text(uservalue);
		}
	);
	//empty the date input field when period pulldown is clicked
	$(".PeriodPulldown select").focus(
		function() {
			$(".DateInput").text('');
		}
	);
	
	$("input:text").click(
		function(){
			$(this).css("color","#666666");
		}
	);
});

/**
 * Empty the field of it's original value when clicked
 */
function focusInputFieldText(element, origvalue){
	if (element.value == origvalue ) {
		element.value = '';
	}
}

/**
 * Put the original value of the field back when focus
 * is gone and no new value was entered
 */
function blurInputFieldText(element, origvalue){
	if (element.value == '' ) {
		element.value = origvalue;
		element.style.color = '#666666';
	}
}

/**
 * Check if the subscription form was completely and
 * correctly filled in. If not, return false and thus
 * stop it from submitting.
 */
function checkLetterForm(element) {
	email = element.form.email.value;

var msg ='';
	var patEmail = /^[A-Za-z0-9_\.\-]+@[A-Za-z0-9_\.\-]+\.[A-Za-z]+$/;
	if (!patEmail.test(email))
		msg = 'Ongeldig e-mailadres ingevoerd' +"\n";
	if($('input[name=interval]:radio:checked').val() == undefined)
		msg += 'Geen keuze voor interval gemaakt';
	if(msg != '') {
		alert(msg);
		return false;
	}
	return true;
}

/**
 * Remove the default value from the searchterm field
 * when nothing was entered, to prevent searching on the default text.
 */
function checkSearchForm(element, origvalue) {
	if(element.form.searchterm.value == origvalue)
		element.form.searchterm.value = '';
	return true;
}

/**
 * From http://radio.javaranch.com/pascarello/2005/01/09/1105293729000.html
 * @param    element     The element to scroll to. Not the id, the actual element.
 */
function scrollToElement(element){
	var selectedPosX = 0;
	var selectedPosY = 0;

	while(element != null){
		selectedPosX += element.offsetLeft;
		selectedPosY += element.offsetTop;
		element = element.offsetParent;
	  }

	 window.scrollTo(selectedPosX,selectedPosY);
}

function playItemInPlayer(type, id, siteurl, playerid){
	/* Get the flashplayer object.*/
	lst = new Array();
	var flobj = document.getElementById(playerid);        

	if (flobj && typeof flobj.sendEvent !== undefined) {
		flobj.sendEvent('LOAD', lst[0] = {file:siteurl+'&playerxml=1&type='+type+'&id='+id});
		//set the player to play after 2 seconds. 2 seconds to load the new playlist.
		setTimeout(function(){flobj.sendEvent("PLAY", 'true');}, 2000);
	}
	else
		alert('flobj.sendEvent not defined');
	//scroll to the player
	scrollToElement(flobj);
}

function vidPlay (url) {
	window.open(url, 'view','width=433,height=562,scrollbars=yes,resizable=yes');
}

//array for keeping all images in
var kaartimages = new Array();

kaartimages['image_0']="siteimg/kaart/basis.png"; 
kaartimages['image_19']="siteimg/kaart/haven.png"; 
kaartimages['image_23']="siteimg/kaart/buiten.png"; 
kaartimages['image_24']="siteimg/kaart/hout.png"; 
kaartimages['image_25']="siteimg/kaart/poort.png"; 
kaartimages['image_26']="siteimg/kaart/stad_centrum.png"; 
kaartimages['image_27']="siteimg/kaart/stad_west.png"; 
kaartimages['image_28']="siteimg/kaart/stad_oost.png"; 

// Refresh image map with id kaartImage with a new img src.
function newKaart(img) {
	document.getElementById('kaartImage').src = kaartimages[img];
}