﻿/**
* jQuery.smoothDivScroll - Smooth div scrolling using jQuery.
*/

$(function() {   
	$("#scroll-vlak").smoothDivScroll();
	
	var totaleBreedteObjecten = 0;
	var aantalObjecten = 0;
	
	$(".scroll-wrapper .block").each(function () {
		//block met meeste a-tjes wegschrijven in variable					   
		if ($(this).find("a").size() > aantalObjecten){
			aantalObjecten = $(this).find("a").size();
		}
	});
	
	//aantal x breedte object
	totaleBreedteObjecten = aantalObjecten * 162;
	
	if($.browser.msie && $.browser.version.substr(0,1)<"7") {
		totaleBreedteObjecten = totaleBreedteObjecten + 5;
	}
	
	$(".scroll-veld").css("width",totaleBreedteObjecten / 2+"px");
	
	$(".scroll-links, .scroll-rechts").hover(
      function () {
        $(this).addClass("actief");
      }, 
      function () {
        $(this).removeClass("actief");
      }
    );
	
	$(".scroll-veld .block a").click(function () { 
		$(".scroll-veld .block a").removeClass("actief");
		$(this).addClass("actief");
	});

});

(function($) { 
	jQuery.fn.smoothDivScroll = function(options){

		var defaults = {
			scrollingHotSpotLeft: "div.scroll-links",
			scrollingHotSpotRight: "div.scroll-rechts", 
			scrollWrapper: "div.scroll-wrapper", 
			scrollableArea: "div.scroll-veld",
			ajaxContentURL: "", 
			autoScrollOnStart: false,
			autoScrollSpeed: 1
		};

		options = $.extend(defaults, options);
		
		return this.each(function() {
		
			var $mom = $(this);
			
			if(options.ajaxContentURL.length !== 0){
				$mom.scrollableAreaWidth = 0;
				$mom.find(options.scrollableArea).load((options.ajaxContentURL), function(){	
					$mom.find(options.scrollableArea).children((options.countOnlyClass)).each(function() {
						$mom.scrollableAreaWidth = $mom.scrollableAreaWidth + $(this).outerWidth(true);
					});

					// Set the width of the scrollable area
					$mom.find(options.scrollableArea).css("width", ($mom.scrollableAreaWidth + "px"));
					
					// Hide the mother element if it shouldn't be visible on start
					if(options.hiddenOnStart) {
						$mom.hide();
					}
					
					windowIsResized();
					
					setHotSpotHeightForIE();
				});		
			}
			
			var scrollXpos;
			var booster;
			
			var motherElementOffset = $mom.offset().left;
			
			var hotSpotWidth = 0;
			
			booster = 0.4;
			$(window).one("load",function(){
				if(options.ajaxContentURL.length === 0) {
					$mom.scrollableAreaWidth = 0;
					$mom.find(options.scrollableArea).children((options.countOnlyClass)).each(function() {
						$mom.scrollableAreaWidth = $mom.scrollableAreaWidth + $(this).outerWidth(true);
					});
					
					$mom.find(options.scrollableArea).css("width", $mom.scrollableAreaWidth + "px");
					
					if(options.hiddenOnStart) { 
						$mom.hide();
					}
				}

				if(options.autoScrollOnStart)
				{
					autoScrollInterval = setInterval(autoScrollRight, 15);
				}
	
				switch(options.visibleHotSpots)
				{
					case "always":
						makeHotSpotBackgroundsVisible();
						break;
					case "onstart":
						makeHotSpotBackgroundsVisible();
						hideHotSpotBackgroundsInterval = setInterval(hideHotSpotBackgrounds, (options.hotSpotsVisibleTime * 1000));
						break;
					default:
						break;	
				}
				
			});

			$mom.find(options.scrollingHotSpotRight).one('mouseover',function(){
				if(options.autoScrollOnStart)
				{
					clearInterval(autoScrollInterval);
				}
			});	
			
			$mom.find(options.scrollingHotSpotLeft).one('mouseover',function(){
				if(options.autoScrollOnStart)
				{
					clearInterval(autoScrollInterval);
				}
			});	
			
			function makeHotSpotBackgroundsVisible()
			{
				$mom.find(options.scrollingHotSpotLeft).addClass("scrollingHotSpotLeftVisible");

				// The right hot spot
				$mom.find(options.scrollingHotSpotRight).addClass("scrollingHotSpotRightVisible");
			}
			
			function hideHotSpotBackgrounds()
			{
				clearInterval(hideHotSpotBackgroundsInterval);
				
				// The left hot spot
				$mom.find(options.scrollingHotSpotLeft).fadeTo("slow", 0.0, function(){
					$mom.find(options.scrollingHotSpotLeft).removeClass("scrollingHotSpotLeftVisible");
				});

				// The right hot spot
				$mom.find(options.scrollingHotSpotRight).fadeTo("slow", 0.0, function(){
					$mom.find(options.scrollingHotSpotRight).removeClass("scrollingHotSpotRightVisible");
				});
			}
			
			// EVENT - window resize
			$(window).bind("resize",function(){
				windowIsResized();
			});

			// A function for doing the stuff that needs to be
			// done when the browser window is resized
			function windowIsResized()
			{
				// If the scrollable area is not hidden on start, reset and recalculate the
				// width of the scrollable area
				if(!(options.hiddenOnStart))
				{
					$mom.scrollableAreaWidth = 0;
					$mom.find(options.scrollableArea).children((options.countOnlyClass)).each(function() {
						$mom.scrollableAreaWidth = $mom.scrollableAreaWidth + $(this).outerWidth(true);
					});
					
					$mom.find(options.scrollableArea).css("width", $mom.scrollableAreaWidth + 'px');
				}

				// Reset the left offset of the scroll wrapper
				$mom.find(options.scrollWrapper).scrollLeft("0");
				
				// Get the width of the page (body)
				var bodyWidth = $("body").innerWidth();
				
				// If the scrollable area is shorter than the current
				// window width, both scroll hot spots should be hidden.
				// Otherwise, check which hot spots should be shown.
				if($mom.scrollableAreaWidth < bodyWidth)
				{	
					hideLeftHotSpot();
					hideRightHotSpot();
				}
				else
				{
					showHideHotSpots();
				}
			}
			
			// HELPER FUNCTIONS FOR SHOWING AND HIDING HOT SPOTS
			function hideLeftHotSpot(){
				
			}
			
			function hideRightHotSpot(){
				
			}
			
			function showLeftHotSpot(){
				$mom.find(options.scrollingHotSpotLeft).show();
				// Recalculate the hot spot width. Do it here because you can
				// be sure that the hot spot is visible and has a width
				if(hotSpotWidth <= 0)
				{
					hotSpotWidth = $mom.find(options.scrollingHotSpotLeft).width();
				}
			}
			
			function showRightHotSpot(){
				$mom.find(options.scrollingHotSpotRight).show();
				// Recalculate the hot spot width. Do it here because you can
				// be sure that the hot spot is visible and has a width
				if(hotSpotWidth <= 0)
				{
					hotSpotWidth = $mom.find(options.scrollingHotSpotRight).width();
				}
			}
			
			function setHotSpotHeightForIE()
			{
				// Some bugfixing for IE 6
				jQuery.each(jQuery.browser, function(i, val) {
					if(i=="msie" && jQuery.browser.version.substr(0,1)=="6")
					{
						$mom.find(options.scrollingHotSpotLeft).css("height", ($mom.find(options.scrollableArea).innerHeight()));
						$mom.find(options.scrollingHotSpotRight).css("height", ($mom.find(options.scrollableArea).innerHeight()));				
					}
				});
			}
			
			// EVENTS - scroll right
			var rightScrollInterval;
			
			$mom.find(options.scrollingHotSpotRight).bind('mousemove',function(e){
				var x = e.pageX - (this.offsetLeft + motherElementOffset);
				x = Math.round(x/(hotSpotWidth/15));
				scrollXpos = x;
			});

			// mouseover right hot spot
			$mom.find(options.scrollingHotSpotRight).bind('mouseover',function(e){
				rightScrollInterval = setInterval(doScrollRight, 15);
			});	
			
			// mouseout right hot spot
			$mom.find(options.scrollingHotSpotRight).bind('mouseout',function(e){
				clearInterval(rightScrollInterval);
				scrollXpos = 0;
			});
					
			// stop boosting the scrolling speed
			$("*").bind('mouseup',function(e){
				booster = 1;
			});
			
			// The function that does the actual scrolling right
			var doScrollRight = function()
			{	
				$mom.find(options.scrollWrapper).scrollLeft($mom.find(options.scrollWrapper).scrollLeft() + (scrollXpos*booster));
				showHideHotSpots();
				if ($(".scroll-wrapper").scrollLeft() == $(".scroll-veld").width() * 0.59917695473251028806584362139918){
					$(".scroll-rechts").hide();
				}
			};
					
			// EVENTS - scroll left
			var leftScrollInterval;
			
			// mousemove left hot spot
			$mom.find(options.scrollingHotSpotLeft).bind('mousemove',function(e){
				var x = $mom.find(options.scrollingHotSpotLeft).innerWidth() - (e.pageX - motherElementOffset);
				x = Math.round(x/(hotSpotWidth/30));
				scrollXpos = x;
			});
			
			// mouseover left hot spot
			$mom.find(options.scrollingHotSpotLeft).bind('mouseover',function(e){
				if(options.autoScrollOnStart)
				{
					clearInterval(autoScrollInterval);
				}
				leftScrollInterval = setInterval(doScrollLeft, 15);
			});	
			
			// mouseout left hot spot
			$mom.find(options.scrollingHotSpotLeft).bind('mouseout',function(e){
				clearInterval(leftScrollInterval);
				scrollXpos = 0;
			});
			
			// The function that does the actual scrolling left
			var doScrollLeft = function()
			{	
				$mom.find(options.scrollWrapper).scrollLeft($mom.find(options.scrollWrapper).scrollLeft() - (scrollXpos*booster));
				showHideHotSpots();
				if ($(".scroll-wrapper").scrollLeft() == 0){
					$(".scroll-links").hide();
				}
			};
			
			// Function for showing and hiding hot spots depending on the
			// offset of the scrolling
			function showHideHotSpots()
			{
				// When you can't scroll further left
				// the left scroll hot spot should be hidden
				// and the right hot spot visible
				if($mom.find(options.scrollWrapper).scrollLeft() === 0)
				{
					hideLeftHotSpot();
					showRightHotSpot();
				}
				// When you can't scroll further right
				// the right scroll hot spot should be hidden
				// and the left hot spot visible
				else if(($mom.scrollableAreaWidth) <= ($mom.find(options.scrollWrapper).innerWidth() + $mom.find(options.scrollWrapper).scrollLeft()))
				{
					hideRightHotSpot();
					showLeftHotSpot();
				}
				// If you are somewhere in the middle of your
				// scrolling, both hot spots should be visible
				else
				{
					showRightHotSpot();
					showLeftHotSpot();
				}

			}
	});
};

})(jQuery);


