(function($) {

var types = ['DOMMouseScroll', 'mousewheel'];

$.event.special.mousewheel = {
    setup: function() {
        if ( this.addEventListener ) {
            for ( var i=types.length; i; ) {
                this.addEventListener( types[--i], handler, false );
            }
        } else {
            this.onmousewheel = handler;
        }
    },
    
    teardown: function() {
        if ( this.removeEventListener ) {
            for ( var i=types.length; i; ) {
                this.removeEventListener( types[--i], handler, false );
            }
        } else {
            this.onmousewheel = null;
        }
    }
};

$.fn.extend({
    mousewheel: function(fn) {
        return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
    },
    
    unmousewheel: function(fn) {
        return this.unbind("mousewheel", fn);
    }
});


function handler(event) {
    var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0;
    event = $.event.fix(orgEvent);
    event.type = "mousewheel";
    
    // Old school scrollwheel delta
    if ( event.wheelDelta ) { delta = event.wheelDelta/120; }
    if ( event.detail     ) { delta = -event.detail/3; }
    
    // New school multidimensional scroll (touchpads) deltas
    deltaY = delta;
    
    // Gecko
    if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
        deltaY = 0;
        deltaX = -1*delta;
    }
    
    // Webkit
    if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY/120; }
    if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = -1*orgEvent.wheelDeltaX/120; }
    
    // Add event and delta to the front of the arguments
    args.unshift(event, delta, deltaX, deltaY);
    
    return $.event.handle.apply(this, args);
}

})(jQuery);

function hashtag(hash) {
	window.location.hash = hash
}

$(document).ready(function () {

	if(window.location.hash) {
	 
	 $('#menu a').removeClass('active');
	 var hash_value = window.location.hash;
	 $('#menu a[href="'+hash_value+'"]').addClass('active');
	 
	 $('article').removeClass('active');
	 $('article#'+hash_value.substring(1)).addClass('active');
	 	 
	}
	
	$('article').wrap('<div class="page-wrap" />');
	
	
	$('#menu a').click(function(){
	
		var page = $(this).attr('href');
		page = page.substring(1, page.length);
		
		$('#content').scrollTo($('#'+page), {duration: 1000, easing: 'easeOutQuint'} );
		$('article').removeClass('active');
		$('article#'+page).addClass('active');
		
		var scrollHeight = $('#scrollbar').outerHeight();
		
		var viewHeight = $('.page-wrap').outerHeight();
		var elemHeight = $('article.active').outerHeight();
		
		if(elemHeight > viewHeight) {
		    
		    var handleHeight = scrollHeight - (((elemHeight - viewHeight)/elemHeight)*(scrollHeight));
		    $('#scrollhandle').height(handleHeight);
		    $('#scrollhandle').css('top', 0);
		    $('.page-wrap').scrollTop(0);
		    $('#scrollbar').fadeIn();
		    
		    $('#scrollhandle').draggable({ axis: 'y', containment: 'parent', cursor: 'default'});
		    
		    $('#scrollhandle').bind('drag', function( event ){
		                
		                var scrollPosition = $('#scrollhandle').position();
		                var elemScroll = (scrollPosition.top/scrollHeight)*elemHeight;
		                $('article.active').parent().scrollTop(elemScroll);
		                
		    });
		    
		    $('.page-wrap').bind('mousewheel', function(event, delta, deltaX, deltaY) {
		    	
		    	this.scrollTop -= (delta * 30);
		    	var elemPosition = this.scrollTop;
		    	var handlePosition = (elemPosition/elemHeight)*(scrollHeight);
		    	$('#scrollhandle').css('top', handlePosition);
		    		
		    });
		    
		}
		
		else {
			$('#scrollbar').fadeOut();
			$('.page-wrap').scrollTop(0);
		}
		
		setTimeout('hashtag("'+page+'")', 1000); 
		
		$('#menu a').removeClass('active');
		$(this).addClass('active');
		
		return false;
	
	});
	
	$('a.subpagelink').click(function(){
	
		var subpage = $(this).attr('href');
		subpage = subpage.substring(1, subpage.length);
		
		$('.subpage#'+subpage).show();
		$('#referenties-main').animate({'marginLeft': -660, 'opacity': 0}, 1000, 'easeOutQuint');
		return false;
	
	});
	
	$('a.back').click(function(){
	
		$('#referenties-main').animate({'marginLeft': 0, 'opacity': 1}, 1000, 'easeOutQuint');
		$('.subpage').fadeOut();
		return false;
	
	});
	
	var viewportHeight = $(window).height();
	$('#scrollbar').height(viewportHeight-40);
	
	var scrollHeight = $('#scrollbar').outerHeight();
	    
    
    var viewHeight = $('.page-wrap').outerHeight();
    var elemHeight = $('article.active').outerHeight();
    
    if(elemHeight > viewHeight) {
        
        var handleHeight = scrollHeight - (((elemHeight - viewHeight)/elemHeight)*(scrollHeight));
        $('#scrollhandle').height(handleHeight);
        $('#scrollbar').fadeIn();
        
        $('#scrollhandle').draggable({ axis: 'y', containment: 'parent', cursor: 'default'});
        
        $('#scrollhandle').bind('drag', function( event ){
                    
                    var scrollPosition = $('#scrollhandle').position();
                    var elemScroll = (scrollPosition.top/scrollHeight)*elemHeight;
                    $('article.active').parent().scrollTop(elemScroll);
                    
        });
        
        $('.page-wrap').bind('mousewheel', function(event, delta, deltaX, deltaY) {
        	
        	this.scrollTop -= (delta * 30);
        	var elemPosition = this.scrollTop;
        	var handlePosition = (elemPosition/elemHeight)*(scrollHeight);
        	$('#scrollhandle').css('top', handlePosition);
        		
        });
        
    }

});