var Logic = function($){
    var priv = {
    
        // variabele for fading banner
        fadeTime : 1500, // time to fade from one item to another
	    fadePauseTime : 5000, // time to show an item
        $fadingImages : null,
        $fadingText : null,
        fadeTimeout : null,
        fadeStop : false
        
    };
    return {

        /**
         * Fade from one item to another
         */
        fadeItems : function(){
            // get current state of images and text
		    priv.$fadingImages = $('div.fading-images img');
            priv.$fadingText = $('div.fading-text div.fade-block');
            // fade in the second item
            $(priv.$fadingText[1]).fadeIn(priv.fadeTime);
		    $(priv.$fadingImages[1]).fadeIn(priv.fadeTime, 
		        function () {
		            // when fading finished hide the first item
	                $(priv.$fadingImages[0]).hide();
                    $(priv.$fadingText[0]).hide();
                    // and move the first item as the last item
	                $('div.fading-images').append($(priv.$fadingImages[0]));
	                $('div.fading-text').append($(priv.$fadingText[0]));
	                // continue the fade thread
	                priv.fadeTimeout = setTimeout('Logic.fadeItems()', priv.fadePauseTime);
                    // set the correct bullet as active
                    $('div.pager ul li a').removeClass('active');
                    var index = parseInt($(priv.$fadingImages[1]).attr('class').replace('index',''));
                    $('div.pager ul li:eq('+index+') a').addClass('active');
	        });    
	    },

        /**
         * Set item with given index to active
         */
        setItem : function(index){
            // clear the fading thread
            if(priv.fadeTimeout != null){
                window.clearTimeout(priv.fadeTimeout);
                priv.fadeTimeout = null;
            }
            // get current state of images and text
            priv.$fadingImages = $('div.fading-images img');
            priv.$fadingText = $('div.fading-text div.fade-block');
            // hide all images and texts
            priv.$fadingImages.hide();
            priv.$fadingText.hide();
            // get the index in the array of the item that needs to be changed
            var indexOfChange = priv.$fadingImages.index($('div.fading-images img.index'+index));
            // only change when the index of item is greater than zero, else it is already active
            if(indexOfChange > 0){
                // move all items before the item that needs to be active after the last item
                $('div.fading-images img:lt('+indexOfChange+')').insertAfter('div.fading-images img:eq('+(priv.$fadingImages.length-1)+')');
                $('div.fading-text div.fade-block:lt('+indexOfChange+')').insertAfter('div.fading-text div.fade-block:eq('+(priv.$fadingText.length-1)+')');
            }
            // show the first item
            $('div.fading-images img:eq(0)').show();
            $('div.fading-text div.fade-block:eq(0)').show();
        },

        /**
         * Stop fading/looping of banner
         */
        stopOnCurrentItem : function() {
           priv.fadeStop = true;
        },
           
        /**
		 * initializes the page logic
		 * to be called on $(document).ready
		 */ 
        OnReady : function(){
            // get current state of images and text
            priv.$fadingImages = $('div.fading-images img');
            priv.$fadingText = $('div.fading-text div.fade-block');
            // only do fading when there is more than one item
	        if(priv.$fadingImages.length > 1 && priv.$fadingText.length > 1){
                // give all fade items an index
                priv.$fadingImages.each(function (i) {
                    $(this).addClass('index'+i);    
                });
                priv.$fadingText.each(function (i) {
                    $(this).addClass('index'+i);    
                });
                // start fading thread
    	        priv.fadeTimeout = setTimeout('Logic.fadeItems()', priv.fadePauseTime);
                // add hover event, to change the active item
                $('div.pager ul li a').hover(
                    function(){
                        $('div.pager ul li a').removeClass('active');
                        $(this).addClass('active');
                        var index = $('div.pager ul li').index($(this).parent());
                        Logic.setItem(index);
                    },
                    function(){
                        if(!priv.fadeStop){
                           priv.fadeTimeout = setTimeout('Logic.fadeItems()', priv.fadePauseTime);
                        }
                    }
                );
            }
            
            // initialize scrollable with mousewheel support
            $("div.scrollable").scrollable({ vertical: true, mousewheel: true });	
        }
    }
}(jQuery);

/**
 * Initiate onload methods and functions
 */
$(document).ready(
	function(){
		Logic.OnReady();
	}
);

function setActiveVacature(divId){
    var className = document.getElementById(divId).className;
    if (className.match(' active')) {
        //$(divId).className += ' active';
        document.getElementById(divId).className = className.replace(' active', '');
    }
    else{
        //$(divId).className = cssClass;
        document.getElementById(divId).className += ' active';
    }
}