// JavaScript Document
var $j = jQuery.noConflict();

$j(document).ready(function(){
  	//define browser compat mode
  	Essentials.setCompatOldBrowser();
  	Essentials.setURLdetails();
  
  	var urlObj = Essentials.getURLdetails();
  	//if home page hide menu sub
  	if(urlObj.segments[0] == '') {
  		//$j('ul.one').hide();
  		$j('div#container').addClass('home');
  	}

  	if ((urlObj.segments[0] != '') && (urlObj.path != '/contact.html')) {
    		//hide sitedetails
    		$j('#siteDetails').hide();
  	}
    
	/*
  	if(! Essentials.getCompatOldBrowser()){
  		//font restyle
  		Cufon.replace('#pageTitle');
  		Cufon.replace('#siteDetails p, #content h1.csc-firstHeader, .b11 #content h1');
  		Cufon.replace('#menu ul.one li a', {
			hover: true
  		});
  	}*/
  
  	//set homepage selected
  	$j('#home').setHomeSelected();
  	
	//menu workSpace contains the sub menu / check if menu contains 3 or 2 levels
	var workSpace = '';
  	if($j('li.third').length > 8){
  		workSpace = 'li.third';
  	} else if($j('li.second').length > 8){
  		workSpace = 'li.second';
  	}
  	
  	//check if workspace is set
	if(workSpace != ''){
		var maxItems = 8;
	
		$j(workSpace).menuItemsHideShow(0, maxItems);
		
		$j('#menu').append('<div class="menuStep"><div class="prevStep" data="0"> </div><div class="nextStep" data="1"> </div></div>');
		$j('.prevStep, .nextStep').hoverClass('hover');
		$j('.prevStep').click(function(){
				$j(this).menuItemsHideShow( parseInt($j(this).attr('data')) , maxItems);
				$j(this).updateNavIter(maxItems);
		});
		$j('.nextStep').click(function(){
				$j(this).menuItemsHideShow( parseInt($j(this).attr('data')) , maxItems);
				$j(this).updateNavIter(maxItems);
		});
	}
   
	/**
	* reset top for second and third menu items
	*/
	$j('.one li').resetSubMenusTop();
  
	if( $j('.three li.selected').length > 0 ) {
		$j('body').showSelectedMenuItem();
	} else if( $j('.two li.selected').length > 0 ) {
		$j('body').showSelectedMenuItem();
	}
	
	//project pages
	if( $j('#images img:first').width() > 700 ){
		$j('#images').initNavBlox();
	}
	
	//contact and bureau image slideshow
	if( $j('.b11 #images img, .b10 #images img').length > 1 ){
		$j('#images div.csc-textpic-imagewrap').cycle({      
		   delay:  2000, 
		   speed:  500
		});
	}
	
	// content scrollable special for bureau
	if( $j('body').hasClass('b11') ) {
		$j('#content').createNavBlox();
		
		// initialize scrollable 
    		$j("div#contentContainer").scrollable({
		items: '#content', 
    		size: 1
    		}).navigator(); 	
	} else {
	 	// initialize scrollable 
    		$j("div#contentContainer").scrollable({
		items: '#images', 
    		size: 1
    		}).navigator(); 
    	}
});

/** 
 * create scrollable nav blox
 */
(function($) {
 $.fn.createNavBlox = function() { 
	var container = $(this);
	
	var totalBlox = $('.default', container ).length; 
	var tags = '';
	
	if( totalBlox > 1){
		for (i=0;i<totalBlox;i++){
			var id= 'bloxText' + i;
			tags = tags + '<a class="bloxItem" id="'+id+'" href="'+i+'"> </a>';
		}
	
		$('#pageTitle').after('<div class="blox navi">'+tags+'</div>');
		var w = $('#pageTitle').outerWidth();
		
		$('.blox').css({
			'left': w
		});
	}
 };
})(jQuery);

/**
 * Function to reset the top value for the sub cats
 */
(function($) {
 $.fn.resetSubMenusTop = function() { 
	var oneIndex = $j('.one li').index( $j('.one li.selected') );
	
	if(oneIndex > 0){	
		//reset top of second sub menu
		twoTop = (oneIndex)*17;
		
		//set new top in css
		$j('.two').css('top',-1*twoTop);
	
		//reset top of third sub menu
		var twoIndex = $j('li.second').index( $j('li.second.selected') );

		if(twoIndex > 0){
			//reset top of third sub menu
			threeTop = (twoIndex)*17;
			
			//set new top in css
			$j('.three').css('top',-1*threeTop);
		}
	}
 };
})(jQuery);

/**
 * Menu item navigation
 */
(function($) {
 $.fn.updateNavIter = function(maxVisible) { 
 	if($('.three li').length > 0){
		var li = $('.three li');
		var lenLi = $('.three li').length; 
	} else {
		var li = $('.two li');
		var lenLi = $('.two li').length; 
	}
	var spread;
	var cur = 0;
	
	if( $(this).hasClass('prevStep') ){
		cur = parseInt($('.prevStep').attr('data'));
		if( $('.prevStep').attr('data') == 0){
			return false;	
		}
		//else 
	}
	if( $(this).hasClass('nextStep') ){
		cur = parseInt($('.nextStep').attr('data'));
		spread = cur+maxVisible;
		if (spread >= lenLi)	{
			return false;
		}
		//else 
	}
	$('.nextStep').attr('data', cur+1);
	$('.prevStep').attr('data', cur-1);
 };
})(jQuery);

/**
 * Function will display selected item in list if not listed within the first 8 items
 */
(function($) {
 $.fn.showSelectedMenuItem = function(){
 	if($('.three li').length > 0){
 		var workspace = '.three li';
		var total = $j('.three li').length;
	} else {
		var workspace = '.two li';
		var total = $j('.two li').length;
	}
	
	if(total > 8) {
		var listItem = $j( workspace + '.selected');
		var indexItem = $j(workspace).index( listItem );
		
		//see where item is located in total list
		if(indexItem + 1 > 8){
			//window.console.log('workspace:' + workspace + ' total:' + total + ' indexItem:' + indexItem + ' listItem:' + listItem );
			if( (total - indexItem) <= 8){
				//last segment (last 8 items)
				//var seg = total - indexItem;
				var seg = (indexItem+1) -8;
				//window.console.log(seg);
				
				$j('body').menuItemsHideShow(seg, total);
			} else {
				//between first and last segment (8 items)
				var seg = indexItem;
				$j('body').menuItemsHideShow(seg, total);
			}
			
			//update data containers of nav icons
			$j('.prevStep').attr('data',seg -1);
			$j('.nextStep').attr('data',seg +1);
		} 
	}	
 }
})(jQuery);

/**
 * show menu items not listed within the first 8 items
 */
(function($) {
 $.fn.menuItemsHideShow = function(startvalue, endvalue) { 
	if($('.three li').length > 0){
		var el = $('.three li');
	} else {
		var el = $('.two li');
	}
	var iter=0;
	
	if($('.three li').length > 0){
		$('.three li').hide();
	} else {
		$('.two li').hide();
	}
	endvalue = startvalue+endvalue;
	for (iter=startvalue;iter<endvalue;iter++){
		el.eq(iter).show();
	}
 };
})(jQuery);

/**
 * Hover class for elements
 */
(function($) {
 $.fn.hoverClass = function(c) {
    return this.each(function(){
        $(this).hover( function() { 
            	$(this).addClass(c);
            },
            function() { $(this).removeClass(c); }
        );
    });
 };
})(jQuery);

(function($) {
 $.fn.setHomeSelected = function(){
 	var myURL = Essentials.parseURL(document.location.href);
 	if(myURL.segments[0] == ''){
		$('#menu li').removeClass('selected');
		$(this).addClass('selected');
	}
 };
})(jQuery);

(function($) {
 $.fn.triggerProjectImgCycle = function(){
	$(this).click(function(){
		if( $(this).attr('id') == 'content' ){
			$(".bloxItem:first").trigger('hover');
		}
		if( $(this).attr('id') == 'images' ){
			//$("button:first").trigger('click');
		}
	});	
 };
})(jQuery);


(function($) {
$.fn.initNavBlox = function(){	
	var container = $(this);
	
	//reposition images
	$('img', container ).each(function(){
		container.append( $(this) );
	});
	
	$("img", container).wrap('<div class="contentSlide"></div>');
	
	//clean up
	$('.default', container).remove();
	
	//now append content text to same div as images
	//$('#content .default').append( $('#contentRight .csc-default').addClass('opdrachtgever') );
	container.append($('#content .default').addClass('contentSlide'));
	
	//clean up
	$('#content').remove();
	
	//wrap images and cycle
	var divBlox = $('.contentSlide', container ).length; 
	var tags = '';
	
	if( $('.contentSlide', container ).length > 1){
		
		for (i=0;i<divBlox;i++){
			var id= 'blox'+i;
			
			if($('.contentSlide').eq(i).hasClass('default')){
				id= 'bloxText';
			}
			tags = tags + '<a class="bloxItem" id="'+id+'" href="'+i+'"> </a>';
		}
	
		$('#pageTitle').after('<div class="blox navi">'+tags+'</div>');
		var w = $('#pageTitle').outerWidth();
		
		$('.blox').css({
			'left': w
		});
	}
	
	//initialise
	$('.bloxItem').eq(0).addClass('selected');
	$('img', container ).eq(0).css('z-index','11');
	
	$('.bloxItem').click(function(){
		var iter = $(this).attr('id').substring(4);
		
		//reset images
		$('img', container).css('z-index','10');
		$('img', container).eq(iter).css('z-index','11');
		
		$('#images').css('display','block');
		$('#content').css('display','none');
		
		//set selected bloxItem
		$('.bloxItem, #bloxText').removeClass('selected');
		$(this).addClass('selected');
	});
	
	$('.blox div').hoverClass('hover');
};
})(jQuery);

(function($) {
$.fn.displayProjectText = function(){
   
   var container = $(this);
   
   //add Button
   $('#bloxText').hover(function(){
	//set selected bloxItem
	$('.bloxItem').removeClass('selected');
	$(this).addClass('selected');
	
	$('#images').css('display','none');
	$('#content').css('display','block');
    });
};
})(jQuery);

Essentials = {
	compatOldBrowser : false ,
	siteURL: null,
	setCompatOldBrowser : function (){
		if ($j.browser.msie && $j.browser.version.substr(0,1)<7) {
  			this.compatOldBrowser = true;
  		}
		return null;
	},
	getCompatOldBrowser : function (){
		return this.compatOldBrowser;
	},	
	debugCompatOldBrowser : function(){
		alert( this.getCompatOldBrowser() );
	},
	setURLdetails: function(){
		this.siteURL = this.parseURL(document.location.href);
	},
	getURLdetails: function(){
		return this.siteURL;
	},
	// This function creates a new anchor element and uses location
	// properties (inherent) to get the desired URL data. Some String
	// operations are used (to normalize results across browsers).
	parseURL: function (url) {
		var a =  document.createElement('a');
		a.href = url;
		return {
			source: url,
			protocol: a.protocol.replace(':',''),
			host: a.hostname,
			port: a.port,
			query: a.search,
			params: (function(){
			var ret = {},
			seg = a.search.replace(/^\?/,'').split('&'),
			len = seg.length, i = 0, s;
			for (;i<len;i++) {
				if (!seg[i]) { continue; }
					s = seg[i].split('=');
					ret[ unescape(s[0]) ] = s[1];
				}
				return ret;
			})(),
			file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
			hash: a.hash.replace('#',''),
			path: a.pathname.replace(/^([^\/])/,'/$1'),
			relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1],
			segments: a.pathname.replace(/^\//,'').split('/')
		};
	}
};
