/* ---------------------------------- */
/*Bepaal de hoogte van de sections*/
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
//
  $(window).resize(function() {
    winheight = $(window).height();
    /*$("section").css("height",winheight); */
  });
//}

winheight = $(window).height();
//if(is_chrome){
  if(winheight > 650){
    $("section").css("height",winheight); 
  //}
}  
  if(is_chrome){
    if(winheight > 650){
      $("section").css("height",winheight); 
    }
  
   
  }


/* submenus textballon (oa brochure) */
function showhide(id){
  showhidesub(id);
  $(".article").hide();
  $('article#'+id).show();
}

function showhidesub(id){
  $(".subart").hide();
  $(".sub-waar").hide();
  $('article#'+id).show();
}

function showhidecal(id){
  $(".cal").hide();
  $('#cal'+id).show();
}

$(function() {
  $("#wrapper").click(function(e) {
    if (e.target.id == "sect-brochure" || e.target.id=="doyou1" || e.target.id=="doyou3" || e.target.id=="subcontainer" || e.target.id=="wereld")
      hideArticles();
    if (e.target.id == "sect-waar")      
      hideArticles();
  });
/*  $("#main-container").click(function(e) {
    if (e.target.id == "active")
      hideArticles();
  });*/
  $("article#doyou").click(function(e) {
    if (e.target.id == "doyou" || e.target.id == "doyou1" || e.target.id == "doyou2")
      $(".subart").hide();       
      $(".sub-waar").hide();    
  });
});

function hideArticles() {
  $('.btn').click(function(){
    return false;
  });
  $(".article").hide();
  $(".subart").hide(); 
  $(".sub-waar").hide();      
}

$(document).ready(function() {
  $("a.ytb").fancybox({
    'width' : '50%',
    'height' : '75%',
    'padding'			: 0,
  	'autoScale'			: true,
    'transitionIn'	: 'elastic',
    'transitionOut'	: 'elastic',
    'type'				: 'iframe'
  });
  
  $("a.contact").fancybox({
    'width' : 660, 
    'height' : 610, 
    'padding'			: 0,
  	'autoScale'			: false,
    'transitionIn'	: 'elastic',
    'transitionOut'	: 'elastic',
    'type'				: 'iframe',
    'scrolling'  : 'no'
  });
});

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

/* Initialize */


/* Author: (C) Nike Better World 2011
 * Edited by: Teqz.nl
 */
 
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');

    $('[data-controller]').Instantiate();
  }
);

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

/* Auto Instantiate, om data-controller aan te kunnen roepen */
(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);

/* ---------------------------------- */
/* Events */
(function($) {
  $.Events = {
     OMNITURE_TRACK: 'omnitureTrack',
     OMNITURE_TRACK_LINK: 'omnitureTrackLink',
     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',
   
     PROOF_POINT: 'proofPointMore'
   } // Events  
  
  $.Views = {
  } // Views 
})(jQuery);

/* ---------------------------------- */
/* TopNav */
(function($) {

   $.fn.TopNav = function() {
     this.each(function() { 
      
        var $self = $(this),
            $ul = $('<ul/>').appendTo($self),
            $sections = $('[data-nav]'),
            _sections = new Array(),
            $navs = new Array(),
            _active = 0;
            
            
       if (!$.Mobile && !$.Unsupported) { 
        $sections.each(
          function(i){
            _sections.push($(this))
            $('<li/>').appendTo($ul).BlockNav({id:$(this).attr('id'),name:$(this).attr('data-nav')});
        
          })
          
        $self.css({marginTop:-$self.height()/2})
        
        }
        
        $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
              
              $sections.each(
                function(i){
                  if ($(this).attr('id')==id)
                    _active = i;
              
                })
            
            })
          .bind($.Events.KEY_RIGHT,
            function(e){
              _active++;
              if (_active>$sections.length-1)
                _active=$sections.length-1;
              _seek();
          })
          .bind($.Events.KEY_LEFT,
            function(e){
              _active--;
              if (_active<0)
                _active=0;
              _seek()
              
          })
          
          
          function _seek() {
            $.Body.triggerHandler($.Events.SCROLL_TO,_sections[_active].attr('id'))
          }
        
            
     });
     
    return this;
     
  } 
  
  $.fn.BlockNav = function(settings) {
    var config = {};
    if (settings) $.extend(config, settings);
     this.each(function() { 
        var $self = $(this),
            $a = $('<a/>'),
            $id = config.id,
            $name= config.name;

            $a
              .attr('href',"#/"+config.name.split(' ').join('_'))
              .html($name)
              .appendTo($self)
              .bind('click',
                function(e){
                  
                  $.Body.triggerHandler($.Events.SCROLL_TO,$id)
                  
                  e.preventDefault();
                  
                })
            
            $self
              .attr('data-id',$id);

         $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
              if (id==$id)
                $self.addClass('active')
              else
                $self.removeClass('active')
            });
     });
     
    return this;
     
  } // BlockNav
  })(jQuery);// Top Nav
  
  

/* ---------------------------------- */
/* MainNav */
(function($) {

   $.fn.MainNav = function() {
     this.each(function() { 
      
        var $self = $(this),
            $ul = $('<ul/>').appendTo($self),
            $sections = $('[data-nav]'),
            _sections = new Array(),
            $navs = new Array(),
            _active = 0;
            
            
       if (!$.Mobile && !$.Unsupported) { 
        $sections.each(
          function(i){
            _sections.push($(this))
            $('<li/>').appendTo($ul).DotNav({id:$(this).attr('id'),name:$(this).attr('data-nav')});
        
          })
          
        $self.css({marginTop:-$self.height()/2})
        
        }
        
        $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
              
              $sections.each(
                function(i){
                  if ($(this).attr('id')==id)
                    _active = i;
              
                })
            
            })
          .bind($.Events.KEY_RIGHT,
            function(e){
              _active++;
              if (_active>$sections.length-1)
                _active=$sections.length-1;
              _seek();
          })
          .bind($.Events.KEY_LEFT,
            function(e){
              _active--;
              if (_active<0)
                _active=0;
              _seek()
              
          })
          
          
          function _seek() {
            $.Body.triggerHandler($.Events.SCROLL_TO,_sections[_active].attr('id'))
          }
        
            
     });
     
    return this;
     
  } // Main Nav
  
  
  
  $.fn.DotNav = function(settings) {
    var config = {};
    if (settings) $.extend(config, settings);
     this.each(function() { 
        var $self = $(this),
            $a = $('<a/>'),
            $h1 = $('<span class="link"/>').appendTo($self),
            $h2 = $('<span class="links">&nbsp;</span>').appendTo($h1),
            $span = $('<span class="mid"/>').html(config.name).appendTo($h1),
            $h3 = $('<span class="rechts">&nbsp;</span>').appendTo($h1),
            $id = config.id;

            $a
              .attr('href',"#/"+config.name.split(' ').join('_'))
              .html($id)
              .appendTo($self)
              .bind('click',
                function(e){
                  
                  $.Body.triggerHandler($.Events.SCROLL_TO,$id)
                  
                  e.preventDefault();
                  
                })
            
            $self
              .attr('data-id',$id);
              
        $a
          .bind('mouseenter',
            function(e) {
              if ($('._playing').length==0)
              if ($.browser.msie)
                $h1.stop().css({display:'block',right: 30})
              else
                $h1.stop().css({display:'block'}).animate({right:30,opacity:1},450,'easeOutQuart')
            })
          .bind('mouseleave',
            function(e) {
              if ($.browser.msie)
                $h1.stop().css({display:'none',right: 30})
              else
                $h1.stop().animate({right:15,opacity:0},450,'easeOutQuart',function(){$h1.stop().css({display:'none'})})
            });
            
        $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
            
              if (id==$id)
                $self.addClass('active')
              else
                $self.removeClass('active')
              
            });
        
            
     });
     
    return this;
     
  } // DotNav

})(jQuery);


/* ---------------------------------- */
/* SiteScroll */
(function($) {
   $.fn.SiteScroll = function() {
     this.each(function() { 
        var $self = $(this);
        $.Body
          .bind($.Events.SCROLL_TO,
            function(e,id){
              var $element = $('#'+id),
                  $header = $element.find('header'),
                  _align = $element.attr('data-align'),
                  _offset = $element.attr('data-scrolloffset') ? parseInt($element.attr('data-scrolloffset')) : 50,
                  _top = $element.offset().top;
              
              if ($header.length>0 && _align!="top") { 
                  
                  _top = $header.offset().top  + $header.height()/2 - $.Window.height()/2;

                  if (_top > $header.offset().top)
                    _top = $header.offset().top - 50
              }
              
              if (_align=="center" && $element.height()>$.Window.height()) {
                _top = $element.offset().top + ($element.height()-$.Window.height())/2
              }
              
              $.Scroll
                .stop()
                .animate(
                  { 'scrollTop': _top },
                  800,
                  'easeInOutQuart'
                )
            })   
     });
    return this;
  }
})(jQuery);

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

/* ProofPoints */
(function($) {

  $.fn.ProofPoints = function(settings) {
    var config = {};
    if (settings) $.extend(config, settings);
      this.each(function() { 
        var $self = $(this),
            $id = $self.attr('id'),
            $points = $self.find('[data-proofpoint]'),
            //$points_container = $self.find('.proof-points-container'),
            $more = $self.find('nav.more a'),
            _active = 0;
        
        $self.Scrollable({is_nav:true})
        
        $.Window
          .bind('scroll',
            function(){
              if ( $.inview($self,{threshold:0}) ) {
                if (!$self.hasClass('active')) {
                  $self.addClass('active');
                  $.Body.triggerHandler($.Events.SECTION_ENTER,$id);
                }
              }else{
                $self.removeClass('active');
                
              }
              
            })
        
        $points.ProofPoint({owner:$self})
        
        $more
          .bind('mousedown',
            function(e){
              $more.addClass('_down');
            })
          .bind('mouseup',
            function(e){
              $more.removeClass('_down');
            })
          .bind('click',
            function(e){
              
              _active++;
              
              if(_active>$points.length-1)
                _active=0;
              
              var dir = (_active==0) ? -1 : 1;
              
              $self.triggerHandler($.Events.PROOF_POINT,[_active,dir])
              
              //$points_container.stop().animate({marginTop:-_active*600},850,'easeOutExpo')
              
              e.preventDefault();
              
            })
        
       
              
      });
      
      
      return this;
      
  } //ProofPoint

  $.fn.ProofPoint = function(settings) {
    var config = {};
    if (settings) $.extend(config, settings);
      this.each(function(index) { 

        var $self = $(this),
            $h1 = $self.find('h6'),
            $headline = $self.attr('data-share'),
            $summary = $self.find('p').html(),
            $copy = $self.find('section.proof-description'),
            $icons = $('<aside/>').appendTo($copy),
            _heading = $h1.html();
            
        $self.css({left:index*500})
          
        config.owner
          .bind($.Events.PROOF_POINT,
            function(e,i,dir){
              
              if (i==index)
                _show(dir);
              else
                _hide(dir);
                
              
            });
      
       function _show(dir) {
        $self.stop().animate({opacity: 1},800,'easeOutExpo')
        $.Body.triggerHandler($.Events.OMNITURE_TRACK,'proofpoint_'+escape($headline))
       }
       
       function _hide(dir) {
        $self.stop().animate({opacity: 0},800,'easeOutExpo')
       }  
      });
      return this;
  } // ProofPoint

})(jQuery); 

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

/* Scrollable */
(function($) {
  $.fn.Scrollable = function(settings) {
     var config = { threshold: -100, 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 (config.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}) - config.threshold) * config.offset_intertia) + 'px';
          $self.css({'backgroundPosition':bpos})
        }*/
        /*if (config.auto_scroll)
          _scroll_background();*/
     });
     
    return this;
     
  }
  })(jQuery);
  
  /* ---------------------------------- */

/* Worker */
(function($) {
    $.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);