var Global = {

	init: function(){

		this.setMainBackground();
		$(window).resize(function() {
			Global.setMainBackground();
		});
		this.initModal();

	},

	setMainBackground: function(){
		// set global variables
		var oBg = $('#main-background');
		var oContainer = $('#content-wrapper');
		var iBgWidth = parseInt(oBg.attr('width'));
		var iBgHeight = parseInt(oBg.attr('height'));
		// set the wrapper to overflow hidden. with javascript after dom has loaded and width's/height's are already defined.
		//$('#content-wrapper').css({'overflow':'hidden'});

		//setTimeout(setContainer, 10000);


		if ($.browser.msie && $.browser.version.substr(0,1)<7) {
		  	$('.page-container').css({'overflow-x':'hidden'}); 
		} else {
			$('.page-container').css({'overflow':'hidden'}); 
		}

		// check if image width is bigger then height
		if (oContainer.width() > oContainer.height())
		{
			// calculate ratio
			var iRatio =  oContainer.width() / iBgWidth;
			resizeBg(iRatio, iBgWidth, iBgHeight);
		}
		// check if image width is smaller then height
		else if (oContainer.width() < oContainer.height())
		{
			// calculate ratio
			var iRatio = oContainer.height() / iBgHeight;
			resizeBg(iRatio, iBgWidth, iBgHeight);
		}
		function resizeBg(iRatio, iBgWidth, iBgHeight){ 
			// define new width and height based on aspect ratio
			var iNewWidth = (iBgWidth*iRatio);
			var iNewHeight = (iBgHeight*iRatio);
			// check if dimensions are big enough to fit
			if (oContainer.width() > iNewWidth) {
				iNewWidth *= (oContainer.width()/iNewWidth);
			}
			else if (oContainer.height() > iNewHeight) { 
				iNewHeight *= (oContainer.height()/iNewHeight);
			}
			// set new dimensions
			oBg.attr({ 
				width:Math.ceil(iNewWidth + 20), 
				height:Math.ceil(iNewHeight + 20)
			}); 

		}
	},

	setNavHover: function(sId){
		var onMouseEnter = function() {
			$(this).addClass('hover');
		}
		var onMouseLeave = function() {
			$(this).removeClass('hover');
		}
		
		$('.'+sId+' ul:first li').bind('mouseenter', onMouseEnter).bind('mouseleave', onMouseLeave);
	},

	setHeading: function(){
		var oHeading = $('h1');

		if (oHeading != null)
		{
			oHeading.replaceWith("<h1><a href='#' title='Klik hier om terug te keren naar de hoofdpagina'><img src='assets/img/logo.gif' alt='Movilicous.nl' /></a></h1>");
		}
	},

	initCufon: function(){
		if ( $('.navigation ul li a') != null ){
			Cufon.replace('.navigation ul li a', { hover: true });
		}
		if ( $('h1') != null ){
			Cufon.replace('h1');
		}
		if ( $('.content-block h3') != null ){
			Cufon.replace('.content-block h3');
		}
	},
	
	initModal: function() {
		var aModalEnabled = $('a.modal');
		var oModalOptions = {
				overlayClose:true
		};
		if (aModalEnabled) {
			var iLength = aModalEnabled.length;
			for (i = 0; i < iLength; i++) {
				$(aModalEnabled[i]).click(function(event){
					var link = $(this);
					var imgSrc = $(link).attr('href');
					
			        var modalHtml  = '<div class="large-img-modal">';
		            modalHtml += '<div class="large-img-modal-content" >';
		            modalHtml += '<div class="close-link"><a href="#" title="Sluiten"><span class="icon">&nbsp;</span></a></div>';
		            modalHtml += '<img src="'+ imgSrc +'" />';
		            modalHtml += '</div></div>';
		        
		            $.modal(modalHtml,{
		            	closeClass:'close-link',
		            	overlayClose: true,
		            	containerId: 'simplemodal-container-img'
		            });
		        
		            
		            if ($.browser.msie && $.browser.version == '6.0') {
		            	$('.large-img-modal').css('filter', 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' + websiteGlobal.baseUri + '/website/img/img-large-bg.png, sizingMethod=\'noscale\')');
		            	$('.large-img-modal').css('background', 'none');
		            }

					return false;
				});
			}
		}
	}

}


$(window).load(function() {
  Global.init();
});

