var timer = null;
var bgtimer = null;
var currentBG = 0;
var content = 0;
var menuAnimate = false;

jQuery(function() {
    jQuery('img[data-hover]').hover(function() {
        jQuery(this).attr('tmp', jQuery(this).attr('src')).attr('src', jQuery(this).attr('data-hover')).attr('data-hover', jQuery(this).attr('tmp')).removeAttr('tmp');
    }).each(function() {
        jQuery('<img />').attr('src', jQuery(this).attr('data-hover'));
    });
});

	jQuery(document).ready(function() {
		jQuery("#header-bg").ezBgResize();
		jQuery("#content-hide").animate({ opacity: 0.8 },"fast");
		jQuery("#minimaliseren").css({'cursor': 'pointer'})
		
		var newBG = jQuery("#bg_"+currentBG).attr("data-hover");
		var newBG2 = jQuery("#bg_"+currentBG).attr("src");
		jQuery("#bg_"+currentBG).attr("data-hover", newBG2);
		jQuery("#bg_"+currentBG).attr("src", newBG);	
		
		jQuery("#content-show").click(function() {
			jQuery(this).animate({ opacity: 0.0 },"slow");		
			jQuery("#content-hide").animate({ opacity: 1.0 },"slow");	
			jQuery("#minimaliseren").css({'cursor': 'pointer'})
			content = 1;
		});
		
		jQuery(".navitem img").hover(function() {
			jQuery(this).animate({opacity: 1.0}, "fast");
		}, function() {
			jQuery(this).animate({opacity: 0.5}, "slow");			
		});
		
		jQuery("#content-show").hover(function() {
			jQuery("#content-show").animate({ opacity: 1.0, filter: '' },"fast");
		}, function() {
			if (content == 0) {
				jQuery("#content-show").animate({ opacity: 0.8, filter: '' },"fast");	
			}
		});
		
			
		
		jQuery("#minimaliseren").click(function() {
			jQuery("#content-show").animate({ opacity: 0.8, filter: '' },"slow");		
			jQuery("#content-hide").animate({ opacity: 0.0, filter: '' },"slow");	
			content = 0;
		});
		
		
		jQuery("#img-nav img").click(function() {
			var bgurl = jQuery(this).attr("bgimg");
			var bgid2 = jQuery(this).attr("id");
			bgid2 = bgid2.replace("bg_", "");
			window.clearInterval(bgtimer);
			bgtimer = setInterval(function(){bgswitch()}, 5000);
			changeBG(currentBG,bgid2,bgurl);
		});
		
		bgtimer = setInterval(function(){bgswitch()}, 5000);
		
	});
	
	jQuery(window).bind("load",function() {
		 timer = setTimeout(function(){hideMenu("all")}, 1000);
		 jQuery(".navitem img").each(function() {
			 jQuery(this).animate({opacity: 0.5}, "slow");
		 });
		//hideMenu("all")
		jQuery("#menu").hover(function() {
			var item = jQuery(this).attr("id");
			showMenu("all");
		}, function() {
			var item = jQuery(this).attr("id");
			hideMenu("all");			
		});
	});
	
	function changeBG(bgid, bgid2, bgimg) {
		if (jQuery("#bg_"+bgid2).length == 0 ) {
			bgid2 = 0;
			bgimg = jQuery("#bg_"+bgid2).attr("bgimg");
		}
		jQuery("#header-bg img").attr("src", bgimg);
		
		var newBG = jQuery("#bg_"+bgid2).attr("data-hover");
		var newBG2 = jQuery("#bg_"+bgid2).attr("src");
		jQuery("#bg_"+bgid2).attr("data-hover", newBG2);
		jQuery("#bg_"+bgid2).attr("src", newBG);
		
		var oldBG = jQuery("#bg_"+bgid).attr("data-hover");
		var oldBG2 = jQuery("#bg_"+bgid).attr("src");
		jQuery("#bg_"+bgid).attr("src", oldBG);
		jQuery("#bg_"+bgid).attr("data-hover", oldBG2);
		
		currentBG = parseInt(bgid2);
	}
	
	function bgswitch() {
		var currentBG2 = currentBG + 1;
		var nextimg = jQuery("#bg_"+currentBG2).attr("bgimg");
		
		changeBG(currentBG, currentBG2, nextimg);
	}
	
	function hideMenu(item) {
		
		if(item != "all") {
	
			items = jQuery("#"+item+" img");
			var itemW = jQuery(items).width();	
			var hideW = itemW - 7;
			hideW = "-"+hideW;
				
			jQuery("#"+item).animate({ 
				marginLeft: hideW,
				opacity: 0.5,
				filter: ''
				},"slow");
			
		} else {
			window.clearTimeout(timer);
			if (menuAnimate == false) {
				jQuery(".navitem").each(function() {
					var item = jQuery(this).attr("id");
					var items = jQuery("#"+item+" img");
					var itemsW = jQuery(items).width();	
					var hideW = itemsW - 14;
					hideW = "-"+hideW;
				
					menuAnimate = true;
					
					jQuery(this).animate({ 
						marginLeft: hideW,
						
						filter: ''
						},"slow", function() { menuAnimate = false });
				
				});
			}
		}
	}
	
	function showMenu(item) {
		
		if(item != "all") {
	
			jQuery("#"+item).animate({ 
				marginLeft: 0,
				opacity: 1.0,
				filter: ''
				},"slow");
			
		} else {
			
			if (menuAnimate == false) {
				menuAnimate == true;			
				jQuery(".navitem").each(function() {

					jQuery(this).animate({ 
						marginLeft: 0,
						
						filter: ''
						},"slow", function() { menuAnimate = false });
				
				});
			}
		}
	}

(function($) {
    var containerObj, center = false;

    // plugin definition
    $.fn.ezBgResize = function(center) {
        center = center || false;
    
        //console.log(center);
        // First position object
        containerObj = this;

        containerObj.css("visibility","hidden");

        $("body").css({
            "overflow-x":"hidden"
        });

        $(window).load(function() {
            resizeImage();
        });

        $(window).bind("resize",function() {
            resizeImage();
        });

    };

    function resizeImage() {
        $("body").css({
            "overflow-x":"auto"
        });

        containerObj.css({
            "position":"fixed",
            "top":"-0px",
            "left":"0px",
            "z-index":"-1",
            "overflow":"hidden",
            "width":getWindowWidth() + "px",
            "height":getWindowHeight() + "px"
        });

        // Resize the img object to the proper ratio of the window.
        var iw = containerObj.children('img').width();
        var ih = containerObj.children('img').height();
        
        containerObj.breedte = 999;
        
        if ($(window).width() > $(window).height()) {
            //console.log(iw, ih);
            if (iw > ih) {
                var fRatio = iw/ih;
                containerObj.children('img').css("width",$(window).width() + "px");
                containerObj.children('img').css("height",Math.round($(window).width() * (1/fRatio)));

                var newIh = Math.round($(window).width() * (1/fRatio));

                if(newIh < $(window).height()) {
                    var fRatio = ih/iw;
                    containerObj.children('img').css("height",$(window).height());
                    containerObj.children('img').css("width",Math.round($(window).height() * (1/fRatio)));
                }
            } else {
                var fRatio = ih/iw;
                containerObj.children('img').css("height",$(window).height());
                containerObj.children('img').css("width",Math.round($(window).height() * (1/fRatio)));
            }
        } else {
            var fRatio = ih/iw;
            containerObj.children('img').css("height",$(window).height());
            containerObj.children('img').css("width",Math.round($(window).height() * (1/fRatio)));
        }
        
        containerObj.css("visibility","visible");

        // Center BG Image
        if (center) {
            containerObj.children('img').css("position","relative");

            if (containerObj.children('img').width() > containerObj.width()) {
                var wDiff = (containerObj.children('img').width() - containerObj.width()) / 2;
                containerObj.children('img').css("left", "-" + wDiff + "px");
            }
        }
    }

    // Dependable function to get Window Height
    function getWindowHeight() {
        var windowHeight = 0;
        if (typeof(window.innerHeight) == 'number') {
            windowHeight = window.innerHeight;
        }
        else {
            if (document.documentElement && document.documentElement.clientHeight) {
                windowHeight = document.documentElement.clientHeight;
            }
            else {
                if (document.body && document.body.clientHeight) {
                    windowHeight = document.body.clientHeight;
                }
            }
        }
        return windowHeight;
    };

    // Dependable function to get Window Width
    function getWindowWidth() {
        var windowWidth = 0;
        if (typeof(window.innerWidth) == 'number') {
            windowWidth = window.innerWidth;
        }
        else {
            if (document.documentElement && document.documentElement.clientWidth) {
                windowWidth = document.documentElement.clientWidth;
            }
            else {
                if (document.body && document.body.clientWidth) {
                    windowWidth = document.body.clientWidth;
                }
            }
        }
        return windowWidth;
    };
})(jQuery);