var totalItems = 0;

$(function() {
  /*
  ** @init main site bg
  */
  $.fn.supersized.options = { startwidth: 960, startheight: 800, vertical_center: 1, slideshow: 0, navigation: 0, transition: 0, pause_hover: 0, slide_counter: 0, slide_captions: 0, slide_interval: 3000 };
  $('#supersize').supersized();
  /*
  ** @homepage
  */
  $('#carousel-home').cycle({
    timeout : 2800,
    pager : '#control'
  });
  
  /*
  ** @vacature
  */
  var vaccordion = $('.vacature-listing');
  if (vaccordion.size() > 0) {
    initVacatureAccordion(vaccordion);    
  }
  
  /*
  ** @ portfolio detail 
  */
  $('.thumbsinner').cycle({
    fx: 'scrollHorz',
    timeout : 0,
    pager : '#control',
    speed : 300
  });
  
  /*
  ** als er 3 items in portfolio zitten
  */
  if($('.portfolio_detail #control a').size() == 1)
  {
    $('#control').remove();
  }
  
  /*
  ** @ portfolio detail 
  */
  
  $('.slider').each(function() {

    var $slider = $(this);
    var $inner = $slider.find('.slider-inner:first');
    var $thumbs = $inner.find('.slider-item a');
    var $full = $('.slider-full:first');
    
    var $next = $('#portfolio_next');
    var $prev = $('#portfolio_prev')

    var PER_PAGE = 3;
    var TOTAL_ITEMS = $thumbs.size();
    var THUMB_WIDTH = $thumbs.width()+2;

    function setup() {
      
      if ($thumbs.size() <= 3) {
        $next.remove();
        $prev.remove();
      } else {
        $next.click(nextItem)
        $prev.click(prevItem);
      }
            
      $slider.data('current-item', 0);
      
      $thumbs.click(showItem);
      var totalWidth = $thumbs.size() * THUMB_WIDTH;
      
      $inner.width(totalWidth);
      
      $('.slider-item-big .back').click(hideItem);
      $(window).keydown(function(e) {
        if (e.which === 27) {
          hideItem(false)
        }
      });
      
    }
    
    function showItem(e) {
      e.preventDefault();
      
      var $item = $(this);
      var item_id = $item.attr('data-item');
      
      var $full_item = $full.find('#'+item_id);
      
      if ($full_item.size() > 0) {
        $full_item.addClass('show');
        $full.fadeIn(0);
      }
    }

    function hideItem(e)
    {
      if (e) {
        e.preventDefault();        
      }
      
      var $full_item = $full.find('.show');
      
      var $youtube = $full_item.find('iframe[src*=youtube]');
      
      if ($youtube.size() > 0) {
        var $video = $youtube.clone();
        $youtube.after($video);
        $youtube.remove();
      }
      
      $full.fadeOut(0, function() {
        $full_item.removeClass('show')
      });
      
    }

    function nextItem(e) {
      e.preventDefault();
      
      if ($(this).hasClass('disabled')) return false;
      
      var currentItem = $slider.data('current-item');
      var nextItem = currentItem + PER_PAGE;
      gotoItem(nextItem);
    }
    
    function prevItem(e) {
      e.preventDefault();

      if ($(this).hasClass('disabled')) return false;

      var currentItem = $slider.data('current-item');
      var nextItem = currentItem - PER_PAGE;
      gotoItem(nextItem);
    }
    
    function gotoItem(num)
    {
      $next.removeClass('disabled');
      $prev.removeClass('disabled');
      
      if (num > TOTAL_ITEMS-PER_PAGE) {
        num = TOTAL_ITEMS-PER_PAGE;
        $next.addClass('disabled');
      } else {
        num = num;
      }

      if (num < 0) {
        num = 0;
        $prev.addClass('disabled');
      } else {
        num = num;
      }

      $slider.data('current-item', num);

      var offset = num * THUMB_WIDTH;
      
      $inner.animate({
        left : -offset
      }, {
        duration : 250
      });
    }
    
    setup();
    
  });
  
  // var $pfNext = $('#portfolio_next');
  // var $pfPrev = $('#portfolio_prev');
  // 
  // $('.thumbsinner').cycle({
  //   fx: 'scrollHorz',
  //   speed : 500,
  //   timeout : 0,
  //   continuous : false,
  //   next : $pfNext,
  //   prev : $pfPrev
  // });
  
  



  
  /*
  ** als er 3 items in portfolio zitten
  */
  if($('.portfolio_detail #control a').size() == 1)
  {
    $('#control').remove();
  }
  
  
  
  $('.portfolio_detail .media').click(function(e){
    e.preventDefault();
    $('.caseswitch, #portfolio_info, .thumbs').hide();
    var vid_id = $(this).attr('rel');
    $('#media_'+vid_id).show();
    $('#full').fadeIn(350);
  });
  $('.portfolio_detail .thumb, .block').hover(function(){
    $(this).stop().fadeTo(350,.9)
  }, function(){
    $(this).stop().fadeTo(350,1)
  })
  $('.portfolio_detail .thumb').click(function(e){
    e.preventDefault();
    $('.caseswitch, .mediaall, .thumbs').hide();
    var url = $(this).attr('href');
    $('<img title="Klik op de afbeelding om terug te gaan" src="'+url+'"/>').appendTo('#full');
    $('#full').fadeIn(350, function(){
      $('#portfolio_info').hide();
    });
  });
  $('.back, #full img').live('click',function(e){
    e.preventDefault();
    $('.mediaall').hide();
    $('.caseswitch, #portfolio_info, .thumbs').show();
    $('#full').fadeOut(350, function(){
      $('#full img').remove();
    });
  });

//eof jQuery
});

function initVacatureAccordion(vaccordion) {
  $('dd', vaccordion).hide();
  $('dt', vaccordion).click(function(evt) {
    var that = this;
    $('dt', vaccordion).each(function(i) {
      if(this == that) {
        if($(that).next('dd').not(':visible')) {
          $(that).addClass('open').next('dd:not(:visible)').show('blind', { direction: 'vertical', easing:'easeInOutCubic'}, 350);
          $('#job').val($(that).text())
        } else {
          $(that).removeClass('open').next('dd:visible').hide('blind', { direction: 'vertical', easing:'easeInOutCubic'}, 350);
        }
      } else {
        $(this).removeClass('open').next('dd:visible').hide('blind', { direction: 'vertical', easing:'easeInOutCubic'}, 350);
      }
    })
  });
  $('dt:first', vaccordion).click();
}