Cufon.replace('h1');
Cufon.replace('h2');
Cufon.replace('h3');
Cufon.replace('h4');
Cufon.replace('h5');
Cufon.replace('h6');
Cufon.replace('#columnhome #welkom p');


$(document).ready(function() {

	/* ========================================================== */
	/* MENU                                                       */
	/* ========================================================== */

	$('#menu ul').addClass('topnav');
	$('#menu ul ul').removeClass('topnav').addClass('subnav');
	$('#menu ul ul ul').removeClass('topnav subnav').addClass('subsubnav');

	$('#menu ul.topnav li a.selected').wrapInner($('<span>').addClass('topselected'));
	$('#menu ul.topnav li a.selected').prepend($('<span>').addClass('topselectedbegin'));
	$('#menu ul.topnav li a.selected').append($('<span>').addClass('topselectedend'));

	$('#menu ul.subnav li a.selected span').removeClass('topselected');
	$('#menu ul.subnav li a.selected span.topselectedbegin').remove();
	$('#menu ul.subnav li a.selected span.topselectedend').remove();

	$('#menu ul').superfish({
		delay: 1000,                            // one second delay on mouseout 
		animation: { opacity: 'show', height: 'show' },  // fade-in and slide-down animation 
		speed: 'fast',                          // faster animation speed 
		autoArrows: false,                           // disable generation of arrow mark-up 
		dropShadows: false                            // disable drop shadows 
	});
	$('#menu').css('visibility', 'visible');

	//alert($('#menu ul.topnav li a.selected').width());
	$('#menu ul.topnav li a.selected:first').css('width', ($('#menu ul.topnav li a.selected .topselected').width() + 20) + 'px');


	/* ========================================================== */
	/* REFERENTIES                                                */
	/* ========================================================== */

	//scrollpane parts
	var scrollPane = $('#referenties_container #scroll');
	var scrollContent = $('#referenties_container #scroll #logos');

	//build slider
	var scrollbar = $(".scroll-bar").slider({
		slide: function(e, ui) {
			if (scrollContent.width() > scrollPane.width()) { scrollContent.css('margin-left', Math.round(ui.value / 100 * (scrollPane.width() - scrollContent.width())) + 'px'); }
			else { scrollContent.css('margin-left', 0); }
		}
	});

	//append icon to handle
	var handleHelper = scrollbar.find('.ui-slider-handle')
	.mousedown(function() {
		scrollbar.width(handleHelper.width());
	})
	.mouseup(function() {
		scrollbar.width('100%');
	})
	.parent();

	//change overflow to hidden now that slider handles the scrolling
	scrollPane.css('overflow', 'hidden');

	//size scrollbar and handle proportionally to scroll distance
	function sizeScrollbar() {
		var remainder = scrollContent.width() - scrollPane.width();
		var proportion = remainder / scrollContent.width();
		var handleSize = scrollPane.width() - (proportion * scrollPane.width());
		scrollbar.find('.ui-slider-handle').css({
			width: handleSize,
			'margin-left': -handleSize / 2
		});
		handleHelper.width('').width(scrollbar.width() - handleSize);
	}

	//reset slider value based on scroll content position
	function resetValue() {
		var remainder = scrollPane.width() - scrollContent.width();
		var leftVal = scrollContent.css('margin-left') == 'auto' ? 0 : parseInt(scrollContent.css('margin-left'));
		var percentage = Math.round(leftVal / remainder * 100);
		scrollbar.slider("value", percentage);
	}

	//init scrollbar size
	setTimeout(sizeScrollbar, 10); //safari wants a timeout

	$('#referenties_container').show();

});