/* ---------------------------------- */

/*
 *  TABLE OF CONTENTS
 *  
 *  @Initialize
 *  @Events
 *  @AutoInstantiate
 *  @Scrollable
 *  @Stories
 *  @Worker Methods
 *
 */

/* ---------------------------------- */

/* Initialize */

jQuery(

  function ($) {

	$.Body = $('body');

	$.Window = $(window);

	$.Scroll = ($.browser.mozilla || $.browser.msie) ? $('html') : $.Body;

	$.Mobile = ($.Body.hasClass('webkit-mobile') || (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))),

	$.Unsupported = $.Body.hasClass('unsupported-browser');

	$('.section').Instantiate();

  } 

);

/* ---------------------------------- */

/* Events */

(function($) {

  $.Events = {

	 SECTION_ENTER: 'sectionEnter',

	 SCROLL_TO: 'scrollTo',

	 SCROLL: 'windowScroll',
	 SCROLL_ENTER: 'windowScrollEnter',
	 SCROLL_LEAVE: 'windwScrollLeave',

	 KEY_UP: 'keyUp',
	 KEY_DOWN: 'keyDown',
	 KEY_LEFT: 'keyLeft',
	 KEY_RIGHT: 'keyRight',
	 KEY_ESC: 'keyEsc',
	 KEY_SPACE: 'keySpace'

  } // Events  

  $.Views = {


  } // Views 



})(jQuery);


/* ---------------------------------- */

/* Auto Instantiate */
/*
(function($) {

  $.fn.Instantiate = function(settings) {

	var config = {};

	if (settings) $.extend(config, settings);

	  this.each(function() { 

		  var $self = $(this),
			  $controller = $self.attr('data-controller');

		  if ($self[$controller])
			$self[$controller]();

	  });

  }



})(jQuery);*/

(function($) {

  $.fn.Instantiate = function(settings) {

	var config = {};

	if (settings) $.extend(config, settings);

	  this.each(function() { 

		  var $self = $(this),
			  $controller = $self.attr('id');

		  if ($self[$controller])
			$self[$controller]();

	  });

  }

})(jQuery);


/* ---------------------------------- */

/* Scrollable */

(function($) {


  $.fn.Scrollable = function(settings) {

	 var config = { threshold: -80, offset_scroll: 6, offset_intertia: .15 };

	 //if (settings) $.extend(config, settings);

	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id');

		config.threshold = 0

		if ($.Mobile || $.Unsupported) {  
		  $self.css({backgroundAttachment:'scroll'})
		}else{
		$.Window
		  .bind('scroll',
			function(e){

			  if ( $.inview($self,{threshold:config.threshold}) ) {

				if (!$self.hasClass('_active')){

				  $self.addClass('_active');

				  if (settings.is_nav)
					$.Body.triggerHandler($.Events.SECTION_ENTER,$id);

				  $self.triggerHandler($.Events.SCROLL_ENTER);

				}

				  _scroll_background();

				$self.triggerHandler($.Events.SCROLL,$.distancefromfold($self,{threshold:config.threshold}) - config.threshold)

			  }else{

				if ($self.hasClass('_active')){

				  $self.removeClass('_active');

				  $self.triggerHandler($.Events.SCROLL_LEAVE);

				}

			  }


			})


		}

		function _scroll_background() {

		  var _x = '50% '
		  var bpos = _x + (-($.distancefromfold($self,{threshold:config.threshold}) - $(window).height()) * config.offset_intertia) + 'px';		  
		  $self.css({'backgroundPosition':bpos})
		  

		}

	 });

	return this;

  } //Scrollable	

$.fn.Start = function() {
	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id'),
			_threshold = -200;

		$self
		  .Scrollable({threshold: _threshold,is_nav:true})


	 });

	return this;

  } //Section Start

$.fn.Tjanster = function() {
	 this.each(function() { 

        var $self = $(this),
            $id = $self.attr('id'),
            _threshold = -200;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})

	 });

	return this;

  } //Sektion Tjanster

$.fn.Portfolio = function() {
	 this.each(function() { 

        var $self = $(this),
            $id = $self.attr('id'),
            $bg = $self.find('.bg'), 
            _threshold = -100;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL,on_scroll)

          
        function on_scroll(e,distance) {
         
          var bpos = '15% ' + (300+$.Window.height()/2-distance/3) + 'px';
                  
          $bg.css({'backgroundPosition':bpos});
        
        }

	 });

	return this;

  } //Sektion Portfolio

$.fn.Kontakt = function() {
	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id'),
			_threshold = -100;

		$self
		  .Scrollable({threshold: _threshold,is_nav:true})


	 });

	return this;

  } //Sektion Kontakt
  
$.fn.Lediga_jobb = function() {
	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id'),
			_threshold = -100;

		$self
		  .Scrollable({threshold: _threshold,is_nav:true})


	 });

	return this;

  } //Sektion Lediga_jobb
  
$.fn.Blogg = function() {
	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id'),
			_threshold = -100;

		$self
		  .Scrollable({threshold: _threshold,is_nav:true})


	 });

	return this;

  } //Sektion Blogg
  
$.fn.Lokaler = function() {
	 this.each(function() { 

		var $self = $(this),
			$id = $self.attr('id'),
			_threshold = -100;

		$self
		  .Scrollable({threshold: _threshold,is_nav:true})


	 });

	return this;

  } //Sektion Lokaler

})(jQuery);

/* Worker */

(function($) {

	$.distancefromtop = function($element, settings) {
		return $(window).height() - $element.offset().top ;
	};

	$.distancefromfold = function($element, settings) {
		if (settings.container === undefined || settings.container === window) {
			var fold = $(window).height() + $(window).scrollTop();
		} else {
			var fold = $(settings.container).offset().top + $(settings.container).height();
		}
		return (fold + settings.threshold) - $element.offset().top ;
	};

	$.belowthefold = function($element, settings) {
		if (settings.container === undefined || settings.container === window) {
			var fold = $(window).height() + $(window).scrollTop();
		} else {
			var fold = $(settings.container).offset().top + $(settings.container).height();
		}
		return fold <= $element.offset().top - settings.threshold;
	};

	$.rightoffold = function($element, settings) {
		if (settings.container === undefined || settings.container === window) {
			var fold = $(window).width() + $(window).scrollLeft();
		} else {
			var fold = $(settings.container).offset().left + $(settings.container).width();
		}
		return fold <= $element.offset().left - settings.threshold;
	};

	$.abovethetop = function($element, settings) {
		if (settings.container === undefined || settings.container === window) {
			var fold = $(window).scrollTop();
		} else {
			var fold = $(settings.container).offset().top;
		}
		return fold >= $element.offset().top + settings.threshold  + $element.height();
	};

	$.leftofbegin = function($element, settings) {
		if (settings.container === undefined || settings.container === window) {
			var fold = $(window).scrollLeft();
		} else {
			var fold = $(settings.container).offset().left;
		}
		return fold >= $element.offset().left + settings.threshold + $element.width();
	};

	$.inview = function($element, settings) {
		return ($.abovethetop($element,settings)!=true && $.belowthefold($element,settings)!=true)
	};


	$.extend($.expr[':'], {
		"below-the-fold" : "$.belowthefold(a, {threshold : 0, container: window})",
		"above-the-fold" : "!$.belowthefold(a, {threshold : 0, container: window})",
		"right-of-fold"  : "$.rightoffold(a, {threshold : 0, container: window})",
		"left-of-fold"   : "!$.rightoffold(a, {threshold : 0, container: window})"
	});

})(jQuery);