var oldIE=($.browser.msie && $.browser.version<7);
var ext='.png';
if (oldIE) ext='.gif';

$(document).ready(function() {
	hideNoSubs();
	pullDownMenu();
	leesMeer();
	socialeKaart();
	faq();
	loginForm();
	
	$('#search_term').clearInput();
});

$(window).load(function(){
	reSize();
	cartoons();
});


function reSize() {
	// newsPopup height
	var popupHeight=$('#news_popup').height();
	if (popupHeight>0) {
		$('.column .startmenu').css({'margin-top':(popupHeight+55)});
		$('#cartoon_1').css({'padding-top':popupHeight});
	}
	// newsitems: min heigth if photo
	$('.nieuws .photo').each(function(){
		var h=$(this).height()+40;
		$(this).parent('.nieuws').css({'min-height':h});
	});
}

function hideNoSubs() {
	$('li.lev1.nieuws_archief:not(.sub)').hide();
}

function pullDownMenu() {
	var speed=450;
	$('.pulldown').mouseenter(function(){
		$(this).children('.startmenu').slideDown(speed);
	}).mouseleave(function(){
		$(this).children('.startmenu').delay(speed*1.5).slideUp(speed);
	});
}

function leesMeer() {
	if ($('#nieuws').length<1 && !$('body').hasClass('nieuws') && !($('body').hasClass('home'))) {
		var intros=$('.text .intro');
		if (intros.length>0) {
			// show only intro
			$('.text>*').hide();
			$('.text .intro').show();
			// add 'lees meer' link
			var last=intros[intros.length-1];
			$(last).append('<p class="more">&nbsp;</p><p class="more"><a class="more">lees meer</a></p>');
			// click event
			$('.more').click(function(){
				// remove 'lees meer'
				$('.more').remove();
				// foldOut
				$('.text>*').slideDown();
			});
		}
	}
}

function socialeKaart() {
	// random envelopes
	if (!oldIE) {
		$('.sociale_kaart').each(function(){
			var envelop=Math.round(1+Math.random()*6);
			var name="envelop-dicht-" + envelop + ext;
			var src='site/assets/img/'+name;
			$(this).attr('envelop',envelop).css({'background-image':'url('+src+')'});
		});
	}
	
	// hide all forms
	$('.sociale_kaart_form').hide();
	// show if form has errors/thanks
	$('.sociale_kaart_form .error').add('.sociale_kaart_form .thanks').parent('.sociale_kaart_form').show();
	
	// show on click, but first hide others
	$('.sociale_kaart').click(function(){
		if ( ! $(this).hasClass('show') ) {
			$('.show .sociale_kaart_form').slideUp();
			close_envelop( $('.show') );
			$('.show').removeClass('show');
			
			$(this).children('.sociale_kaart_form').slideDown();
			open_envelop(this);
			$(this).addClass('show');
		}
	}).mouseenter(function(){
		open_envelop(this);
	}).mouseleave(function(){
		close_envelop(this);
	});
	function open_envelop(items) {
		if (!oldIE) {
			var envelop=$(items).attr('envelop');
			$(items).css({'background-image':'url(site/assets/img/envelop-open-'+envelop+ext+')'});
		}
	}
	function close_envelop(items) {
		if (!oldIE) {
			var envelop=$(items).attr('envelop');
			$(items).css({'background-image':'url(site/assets/img/envelop-dicht-'+envelop+ext+')'});
		}
	}
	
}


function faq() {
	$('#faq .antwoord').hide();
	$('.faq').addClass('close');
	$('#faq .vraag').css({cursor:'pointer'}).click(function(){
		var faq=$(this).parent('.faq');
		if ($(faq).hasClass('close')) {
			$(faq).removeClass('close').addClass('open');
			$(faq).find('.antwoord').slideDown();
		}
		else {
			$(faq).removeClass('open').addClass('close');
			$(faq).find('.antwoord').slideUp();
		}
	});
}

function loginForm() {
	// Put login form inside #page
	var login=$('#login');
	if (login.length>0) {
		$('#page').append(login);
	}
}


function cartoons() {
	
	function randomCartoon(max) {
    if ( typeof randomCartoon.existing == 'undefined' ) {
    	randomCartoon.existing = new Array();
    }
		// get rnd, and check is it doesn't exists yet
		var rnd=Math.round(1+Math.random()*max);
		while ( (randomCartoon.existing.length<max) && ($.inArray(rnd,randomCartoon.existing)>=0) ){
			rnd=Math.round(1+Math.random()*max); 
		}
		randomCartoon.existing.push(rnd);
		return rnd;
	}
	
	// options
	var s = {width:75, big_width:115, next:459, ext:ext, nr_images:12 };
	var o = {
		'cartoon_1': { top:(134+200), name:'klein_', first_name:'klein_' }, 
		'cartoon_2': { top:(134), name:'klein_', first_name:'groot_'}, 
		'cartoon_3': { top:(0), name:'klein_', first_name:'klein_'}
	};
	var io = new Array('I','O');

	// init
	var cartoons=$('.cartoon');
	// set height to container height - margin + title
	var h=$('#content').height()+179;
	$(cartoons).css({height:h});

	// fill each cartoon column with images
	$(cartoons).each(function(){
		var nr=1;
		var id=$(this).attr('id');
		var co=o[id];
		var pos=co.top;
		var first=true;
		// Zolang er ruimte is, plaats een cartoon
		while ( (pos+129)<h ) {
			var name='karakter_';
			var inOut=io[Math.round(Math.random())];
			var size='';
			if (first) size=co.first_name;	else size+=co.name;
			name+=size;																					 		// klein_ / groot_
			name+=randomCartoon(s.nr_images) + '-';									// number
			name+=inOut;																						// I/O
			name+=ext;																							// .png/.gif
			var topMargin=300;
			if (first) topMargin=co.top;
			$(this).append('<img src="site/assets/img/'+name+'" class="karakter" inout="'+inOut+'" size="'+size+'" ext="'+ext+'" style="margin-top:'+topMargin+'px;"/>');
			// next
			first=false;
			pos+=s.next;
			nr++;
		} 
	});
	
	
	// Events:

	function changeIO(imgObj) {
		var io=$(imgObj).attr('inout');
		var newIO='';
		if (io=='I') newIO='O'; else newIO='I';
		var src=$(imgObj).attr('src');
		if (typeof(src)!='undefined') {
			src=src.replace('-'+io,'-'+newIO);
			$(imgObj).attr('src',src).attr('inout',newIO);
		}
	}

	function linkAction(linkObj) {
		// in which column?
		var c=$(linkObj).parents('.column').attr('column');
		// find closest cartoon and change image
		var distance=100000;
		var closest=null;
		$('#cartoon_'+c+' img.karakter').each(function(){
			var dist=calculateDistance($(linkObj),$(this));
			if (dist<distance) {
				distance=dist;
				closest=this;
			}
		});
		changeIO(closest);
	}

	// hover/click: change I to O
	$('img.karakter').mouseenter(function(){changeIO(this);}).mouseleave(function(){changeIO(this);}).click(function(){changeIO(this);});
	// hover/click a link in textcolumn left to cartooncolumn: change I O
	$('#container a').add('.karakter_switch').mouseenter(function(){ linkAction(this); }).click(function(){ linkAction(this); });
	
}

function calculateDistance(elem, elem2) {
	var x=(elem.offset().left+(elem.width()/2)) - (elem2.offset().left+(elem2.width()/2));
	var y=(elem.offset().top+(elem.height()/2)) - (elem2.offset().top+(elem2.height()/2));
	return Math.floor(Math.sqrt( Math.pow(x,2) + Math.pow(y,2) ) );
}

