function wc()
{
	if(window.console)
	{
		for(var i = 0; i < arguments.length; i++)
		{
			window.console.log(arguments[i]);
		}
	}
}

var basehref; // set with jQuery $('base').attr('href');

var fancySettings = {
	'hideOnContentClick':	false,
	'cyclic'			:	true,
	'margin'			:	60,
	'centerOnScroll'	:	true,
	'overlayOpacity'	:	0.8,
	'overlayColor'		:	'#b4b0af',
	'speedIn'			:	600, 
	'speedOut'			:	200, 
	'overlayShow'		:	true,
	'showCloseButton'	:	true,
	'titlePosition' 	:	'inside',
	'titleFormat'		:	formatTitle
}

// vars tbv sidepanel
var panelHeight;
var footerHeight;
var pageHeight;

var buffer;
var offset;
var offsetLeft;

var readmoreSymbol;
switch(clientbrowser)
{
	case 'ie8':
		readmoreSymbol = '▶'; //<- ie8
		break;
	case 'mozilla5':
		readmoreSymbol = '&#10132;'; //<- mac
		break;
	default:
		readmoreSymbol = '&#x203A;&#x203A;'; //<- ie
}

// shadowbox
Shadowbox.init({
    // skip the automatic setup, we do this later manually
    skipSetup: true
});


	
// init & start
$(function() {
	
	//wc( $('div') );
	//wc( $("div") );
	
	// set base url var
	basehref = $('base').attr('href');
	
	// videos in content naar sidebar
	moviesToSide( $('#pagecontent div.folder.video') );
	
	// google maps as mainvisual
	//initMap('#mainvisual.map');
	/* in apart js file loaded on demand... */
	
	// icons in "destinations" clickable
	$('#main.destinations #pagecontent ul#destinationinfonav li a')
	.click(function(){
		
		var aHref= $(this).attr('href').split('#');
		
		$("h5 a[name='"+aHref[1]+"']").click();
		
		return false;
	});
	
	// PNG fix 
	$(document).pngFix(); 
	
	// fancy labels in form
	//initformfield( $('#newslettersubscribe form') );
	
	// fancy schedules / formulieren / info
	voyageFancy( $('a.voyageInfo') );
	
	// list naar multiple columns (footer, 3e column)
	columnizeLists( $("#sitemap ul:first > li:eq(3) > ul"),140 );
	
	// condense (truncate) texts
	truncateToFancybox($('p:first',$('.wide')),450);
	
	// mainvisual fader
	fadeRandomimagesAfter('#page #mainvisual.images img:last');
	
	/* form elements styling in js (uniform class) */
	$("select, input:checkbox, input:radio, input:file").uniform();
	
	/* panel sailing schedules submit button styling in JS */
	submitToText( $('.block#schedules form .submit') );
	/* search schedules submit button styling in JS */
	submitToText( $('#schedulesearch fieldset .submit') );
	
	// bind alle functies related to content (delegate tbv ajaxload)
	bindContent( $('#pagecontent') );
	
	/* panels mee-scroll...*/
	scrollPanels();
	
	/* ie7 menu */
	if( $('#page.ie7').length ){
	
		var i = 0;
		var fckie7 =0;
		
		$('div#navigation ul.sectionsmenu:first > li')
		.each(function(){
			
			var thisLiWidth = 0;
			var maxLiWidth = 0;
			
			$('ul',$(this).addClass('hover'))
			.each(function(){
				
				thisLiWidth = $(this).innerWidth();
				
				if(thisLiWidth > maxLiWidth){
					maxLiWidth = thisLiWidth;
					
					$('> li',$(this)).width(maxLiWidth);
				};
				
				if(i == 0){
					fckie7 = $('li ul',$(this)).outerWidth();
					i++;
				}
				
				$('li ul li a',$(this)).width(function(){
					return fckie7;
				});
				
			});
			
			
		})
		.removeClass('hover');
	}
	
	/* ie6 menu */
	if( $('#page.ie6').length ){
		$('div#navigation ul.sectionsmenu:first > li')
		.mouseover(function(){
			//wc('hover');
			$(this).addClass('hover');
			$('fieldset select',$('#schedulesform')).hide();
		})
		.mouseout(function(){
			$(this).removeClass('hover');
			$('fieldset select',$('#schedulesform')).show();
		});
	}
	
});


/* 
	Functions
*/

// bind alle functies related to content (delegate tbv ajaxload)
function bindContent(holder){

	/* Fancybox Using custom settings */
	$('a:has(img)',$('div.thumbnail',holder)).fancybox(fancySettings);
	
	/* table styling in js */
	$('td:first',$('table tr',holder)).addClass('left');
	
	// tekst in- uitklapper
	inlineAccordion( $('.infoholder',holder).prev('h5') );
	
	// tekst in- uitklapper Ajaxcontent (inline submneu-items Ul)
	inlineListAjaxAccordion( $('#incontentsubnavigation',holder) );
	
	// mailto: formulieren
	emailForms( $('a.mailform',holder) );
	
	// slide inline anchors
	slideAnchor( $('a.inlineanchor') );
	
	// shadowboxed media
	if( $('a.media',holder).length ){
		Shadowbox.setup( $('a.media',holder) ,{
			handleOversize:	'resize',
			counterType:	'skip',//'default',//'skip',
			overlayColor:	fancySettings['overlayColor'],
			overlayOpacity:	fancySettings['overlayOpacity'],
			gallery:      	"gallery",
			autoplayMovies:	true
		});
    }
    
	// UI voor employee pagina's
	meetourteam(holder);
    
}

// videos in content naar sidebar
function moviesToSide(video){
	
	if(video.length){
		video.each(function(){
		
			var thefolder = this;
			
			$('div a span big',
				$(thefolder)
				.insertAfter( 
					$('#pagecontent #panels #schedules')
				)
			)
			.prependTo( 
				$(thefolder)
			);
		});
		
		$('#pagecontent #panels div:last')
		//.prev()
		.remove();
	}
	
}

// submit-button wordt text link
function submitToText( theButton ){
	
	$(theButton)
	.hide()
	.after( 
		$('<label/>')
		.addClass('submit')
		.html(function(){
			return $(theButton).val();
		})
		.click(function(){
			$(this)
			.prev('input')
			.click();
		})
	);
}

// field showlabel
function field_showlabel(theinput){
	
	var val = $(theinput).val();
	
	$(theinput)
	.stop();
	 
	if(val == ''){
		
		$(theinput)
		.animate({ 
			"opacity":'1.0'
		},'fast','',function(){
			$(this)
			.blur()
			.val(label);
		});
	}
}

function slideAnchor(anchor){
	
	$(anchor)
	.click(function(){
	
		var aHref= $(this).attr('href').split('#');
		
		//alert(aHref[1]);
		
		scrollPageTo("a[name='"+aHref[1]+"']");
		return false;
	});
}

function emailForms(mailtoAnchor){
	
	var newFancy = fancySettings;
	var recipient;
	
	$(mailtoAnchor)
	.click(function(){
		
		recipient = $(this).attr('href').replace('mailto:','');
		
		newFancy['autoDimensions'] = false;
		newFancy['width'] = 300;
		newFancy['height'] = 'auto';
		newFancy['onComplete'] = function(){
			bindFancySubmit();
		};
	
		ajax2Fancy();
		
		return false;
	
	});
	
	function bindFancySubmit(){
		
		voyageFancy( $('a.voyageInfo',$('#fancybox-inner')) );
		
		$('form',$('#fancybox-inner'))
		.submit(function() {
			
			$.fancybox.showActivity();
			
			var data = $(this).serializeArray();
			data.push({'name':'recipient','value':recipient});
			data.push({'name':'url','value':window.location});
			
			ajax2Fancy( data );
			
			return false;
		},'html');
	}
	
	function ajax2Fancy(data){
		
		$.ajax({
			type	: "POST",
			cache	: false,
			url		: basehref+"emailform/email",
			data	: data,
			success: function(data) {
				$.fancybox(data,newFancy);
			}
		},'html');
	}
}


function voyageFancy(mailtoAnchor){
	
	var newFancy = fancySettings;
	
	$(mailtoAnchor)
	.click(function(){
		
		var url = $(this).attr('href');
		
		newFancy['autoDimensions'] = false;
		newFancy['width'] = 520;
		newFancy['height'] = 'auto';
		newFancy['onComplete'] = function(){
			bindFancySubmit(url);
		};
		
		//wc( $(this).attr('href') );
		
		ajax2Fancy( url,{'request':'xhr','validate':'false'} );
		
		return false;
	
	});
	
	function bindFancySubmit(url){
		
		voyageFancy( $('a.voyageInfo',$('#fancybox-inner')) );
		
		$('form',$('#fancybox-inner'))
		.submit(function() {
			
			$.fancybox.showActivity();
			
			var data = $(this).serializeArray();
			data.push({'name':'request','value':'xhr'});
			//data.push({'name':'url','value':window.location});
			//data.push({'request':'xhr'});
			
			ajax2Fancy(url,data);
		
			return false;
		},'html');
	}
	
	function ajax2Fancy(url,data){
				
		$.ajax({
			type	: "POST",
			cache	: false,
			url		: url,
			data	: data,
			success: function(data) {
				$.fancybox(data,newFancy);
			}
		},'html');
	}
}

function inlineListAjaxAccordion(ulholder){
	
	if( $(ulholder).length ){
		
		$('li',$('ul:first',$(ulholder)))
		.unwrap()
		.wrap('<ul class="sectionsmenu" />')
		.addClass('a')
		.append( 
			$('<span/>')
			.addClass('loading')
		)
		.append( $('<span/>')
		.addClass('readmore')
		.html(' '+readmoreSymbol) )
		.click(function(){
			
			var linkPage = $('a',$(this)).attr('href');
			var thisLi = $(this);
			var page = linkPage.replace('/page/','/xhr/');
			var holder = $('<span/>').addClass('ajaxcontent');
			
			if(linkPage != window.location){
			
				if( $(thisLi).hasClass('not-selected') ){
				
					$('li.selected',$(ulholder))
					.removeClass('selected')
					.addClass('not-selected')
					.parent('ul')
					.next('.ajaxcontent')
					.slideUp();
					
					$(thisLi)
					.addClass('selected')
					.addClass('loading')
					.removeClass('not-selected');
					
					if(
						$(thisLi)
						.parent('ul')
						.next('.ajaxcontent')
						.length
					)
					{ 
						$(thisLi)
						.addClass('loading')
						.parent('ul')
						.next('.ajaxcontent')
						.slideDown(400, function() {
						
							$(thisLi)
							.removeClass('loading')
						
							scrollPageTo( $('li.selected',$(ulholder)) );
						});
					}
					else 
					{
						$.post(page,{url:$('a',$(thisLi)).attr('src')},
						function(data){
							
							var newholder = $(holder).html(data).hide();
							
							bindContent( newholder );
							
							$(thisLi)
							.removeClass('loading')
							.parent('ul')
							.after( newholder );
							
							$(newholder)
							.slideDown(400, function() {
								scrollPageTo( $('li.selected',$(ulholder)) );
							});
						
						},"HTML");
					}
					
					
				} else {
					
					$('li.selected',$(ulholder))
					.removeClass('selected')
					.addClass('not-selected');
					
					$('.ajaxcontent',$(ulholder))
					.slideUp();
					
				}
				
				
			
			} 
			
			return false;
			
		});
	
	}
}

function inlineAccordion(elem){
		
	//if( $(elem).length > 1){
		
		$(elem)
		.addClass('a')
		.append( 
			$('<span/>')
			.addClass('loading')
		)
		.append( 
			$('<span/>')
			.addClass('readmore')
			.html(' '+readmoreSymbol) 
		)
		.css({'cursor':'pointer'})
		.addClass('not-selected')
		.click(function(){
			
			if( $(this).hasClass('not-selected') ){
				
				var thiselem = $(this);
				
				$('h5.selected')
				.removeClass('selected')
				.addClass('not-selected')
				.next('.infoholder')
				.slideUp();
				
				$(this)
				.addClass('selected')
				.addClass('loading')
				.removeClass('not-selected')
				.next()
				.slideDown('fast', function() {
				
					$(this)
					.css({'display':'inline-block'})
					
					$(thiselem)
					.removeClass('loading')
					
					scrollPageTo(elem);
					
				});
				
			} else {
				
				$('h5.selected')
				.removeClass('selected')
				.addClass('not-selected')
				.next('.infoholder')
				.slideUp();
				
			}
			
		})
		.next('.infoholder')
		.hide();
	
	/*
	} else {
		
		$(elem)
		.addClass('a')
		.addClass('selected')
		.next()
		.css({'display':'inline-block'})
	}
	*/
};

function scrollPageTo(element)
{
   var destination = $(element).offset().top;
   $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination-20}, 400 );
   return false;
   
};

function fadeRandomimagesAfter(theimg){
	
	if( $(theimg).length ){
		
		var src = $(theimg).attr('src');
		
		//wc( src );
		
		// haal resterende random plaatjes op
		$.post(basehref+'image/list',{img:src},
		function(data){
		
			for (var i = 0; i < data.length; i++) {
			
				// prak de random plaatjes in de holder
				$('<img/>')
				.attr('alt',data[i])
				.insertAfter($(theimg));
			}
			
			// start fader
			$(theimg)
			.parent()
			.cycle({
				timeout:       6000,  // milliseconds between slide transitions (0 to disable auto advance) 
				speed:         3000,  // speed of the transition (any valid fx speed value) 
				next:          null,  // id of element to use as click trigger for next slide 
				prev:          null,  // id of element to use as click trigger for previous slide 
				before:        function(current,next){
					if( $(next).attr('alt').length ){
						$(next).attr('src',$(next).attr('alt')).removeAttr('alt');
					}
				},  // transition callback (scope set to element to be shown) 
				after:         null,  // transition callback (scope set to element that was shown) 
				height:       'auto', // container height 
				sync:          1,     // true if in/out transitions should occur simultaneously 
				fit:           0,     // force slides to fit container 
				pause:         0,     // true to enable "pause on hover" 
				delay:         -4000,     // additional delay (in ms) for first transition (hint: can be negative) 
				slideExpr:     null   // expression for selecting slides (if something other than all children is required) 
			});
	
		},"json");
		
	}
}

function formatTitle(title, currentArray, currentIndex, currentOpts) {
    return '<div id="fancydescription">' + (title && title.length ? '<b>' + title + '</b><br/>' : '' ) + (currentArray.length > 1 ? '<span id="fancypagecount"><a href="javascript:;" onclick="$.fancybox.prev();">&#8249;&#8249; prev </a> &#160; Image ' + (currentIndex + 1) + ' of ' + currentArray.length + ' &#160; <a href="javascript:;" onclick="$.fancybox.next();"> next &#8250;&#8250;</a></span>' : '') +'</div>';
}

function truncateToFancybox(truncateElem,length)
{

	$(truncateElem)
	.condense({
		
		condensedLength: length,//Target length of condensed element. Default: 200  
		minTrail: 20,//Minimun length of the trailing text. Default: 20
		delim: ' ',//Delimiter used for finding the break point. Default: " " - {space}
		moreText: 'Read more >',//Text used for the more control. Default: [more]  
		lessText: '< show less',//Text used for the less control. Default: [less]  
		ellipsis: '...',//Text added to condensed element. Default:  "( ... )" 
		moreSpeed: 'normal',//Animation Speed for expanding. Default: "normal"  
		lessSpeed: 'normal',//Animation Speed for condensing. Default: "normal"
		easing: 'linear'//Easing algorith. Default: "linear"
	});
	// gespawnd door condense functie:
	$('span.condense_control_more',$(truncateElem).next())
	// unbind event aangemaakt door condense functie:
	.unbind()
	// bind naar fancybox
	.click(function(){
		
		var html = '<h3>'
		+
		$(this)
		.parent('p')
		.prev('p')
		.prev('h3')
		.html()
		+
		'</h3>'
		+
		'<p>'+
		$(this)
		.parent('p')
		.prev('p')
		.html()
		+'</p>';
		
		var newFancy = fancySettings;

		newFancy['autoDimensions'] = false;
		newFancy['width'] = 600;
		newFancy['height'] = 'auto';
		
		wc(newFancy);
			
		$.fancybox(html,newFancy);
	
	});
	
}

function scrollVars(){
	
	panelHeight = $('#panels').outerHeight();
	footerHeight = $('#footer').outerHeight();
	pageHeight = $('#page').outerHeight();
	
	buffer = 28;
	offset = $('#panels').offset();
	offsetLeft = offset.left;
}

function scrollPanels(){
	
	/* panels mee-scroll hackje..
	beter nog wat toevoegen zodat footer 'm op afstand houdt*/
	if($('#panels').length){
		
		scrollVars();
		
		$(window).resize(function () { 
			
			var Newoffset = $('#panels').offset();
			offsetLeft = Newoffset.left;
			//windowHeight = $(window).height();
		});
		
		$(window).scroll(function () { 
			setPanels();
			
		});
	}
}

function setPanels(){
	
	pageHeight = $('#page').outerHeight();
	
	var scroll = $(window).scrollTop();
	var newtop = offset.top;
	
	if( scroll >= offset.top-buffer ){
		newtop = offset.top+(scroll-offset.top)+buffer;
	}
	
	var a = (pageHeight - (panelHeight + buffer));
	var b = (footerHeight+scroll);
	
	
	if(a >= b){
		
		/*  "live" scrollen (werkend): */
		$('#panels')
		.offset({
			top:newtop,
			left:offsetLeft
		});
		
		/* k*t IE */
		if(clientbrowser == 'ie7'){
			//alert(offsetLeft);
			$('#panels')
			.offset({
				top:newtop,
				left:offsetLeft
			});
		}
		
		// met scrollTo:
		/*
		$('#panels')
		.offset({
			//top:newtop,
			left:offsetLeft
		})
		.scrollTo({top:newtop,left:offsetLeft},800);
		*/
	}
}

function columnizeLists(thecol,width){
	
	$(thecol)
	.parent()
	.css({'width':(width*2)+'px'});
	
	$(thecol).makeacolumnlists({cols:2,colWidth:(width),equalHeight:'ul'});

}

// media
function initmedia(){

	$.fn.media.defaults.flvPlayer = basehref+'gui/media/flvplayer.swf';
	$('p a',$('div.video'))
	.media({ 
		width:  	540,//430, //4
		height: 	230,//343, //3 + 21 controlbar
		autoplay:	false, 
		src:		$(this).attr('href'),
		bgColor:	false, // background color
		caption:	false, // supress caption text
		attrs:		{ 
						autoplay:  false,  
						autostart:  false//, 
						//controlbar: 'none' 
					},  // object/embed attrs 
		params: 	{ 
						autoplay: false, 
						autostart: false//, 
						//controlbar: 'none' 
					}//, // object params/embed attrs 
	}); 
	
	//$('div.media p div embed')
	//.css('backgroundColor','#ff9600')
	//.attr('bgcolor','#ff9600');
}