$(function() {
  if(!($.browser.msie == true && $.browser.version < 7)) {
    Cufon.replace('.singlescreen .rechts h3', { 'fontWeight' : 'bold', 'separate' : 'none'});
    Cufon.replace('.singlescreen .rechts .price', { fontFamily: 'EtelkaLight' });
  }
  Cufon.replace('.category-title');
  init();
});

var ss, fader;

function init() {
  $('#onderwerp_select').change(function(evt) {
    if($(this).val() == 'anders') {
      $('#onderwerp').show();
      $('#onderwerp').val('')
    } else {
      $('#onderwerp').hide();
      $('#onderwerp').val($(this).val());
    }
  });
  
  $('#social_link input').click(function() { $(this).focus().select(); })
  $('#social_bar_open').click(toggleSocial);
  $('#social_bar_close').click(closeSocial);
  
  $('.product_image_thumbs img').click(changeModelImage);
  $('.product_image_large').mouseenter(zoomModelImage).mouseleave(unzoomModelImage);
  
  $('.faq_overview dd').hide();
  $('.faq_overview dt').click(toggleFaq);
  $('.faq_overview dt:first').trigger('click');
  $('a[rel=external]').attr('target', '_blank');
  $('form a[rel=submit]').click(function(evt) { evt.preventDefault(); $(this).parents('form').submit(); })
  
  
  ss = $('.singlescreen');
  fader = $('#fader').css('opacity', 0);
  $('dt', ss).bind('mouseenter', activate);
  $('dt', ss).click(gotoCategory);
  ss.find('dt:first').addClass('active');
  ss.find('dd').not(':first').hide();
  $('dt li:first-child', ss).addClass('active');
  $('dd .rechts li:first-child', ss).addClass('active');
  $('dt .prev, dt .next', ss).mouseup(switchModel);
//  $('dt li', ss).click(switchModel);
  $('dt li', ss).click(showModel);
  $('.dots li', ss).click(showModel);
  
  ss.everyTime(10000, activateNext)
  ss.mousemove(function(evt) {
    ss.stopTime();
  }).mouseleave(function(evt) {
    ss.everyTime(10000, activateNext);
  });
  
  
}


function toggleSocial(evt) {
  if($('.social_bar').is(':visible'))
    closeSocial();
  else
    openSocial();
}

function openSocial(evt) {
  $('#social_bar_open').addClass('active');
  $('.social_bar').slideDown('fast');
}

function closeSocial(evt) {
  $('#social_bar_open').removeClass('active');
  $('.social_bar').slideUp('fast');
}

function gotoCategory(evt) {
  if($(evt.target).is(':not(ul, li,.prev,.next)')) {
    location.href = $('.category-title', this).attr('href');
  }
}

function toggleFaq(evt) {
  evt.preventDefault();
  $(this).toggleClass('active').next('dd:first').slideToggle('fast');
}

function activate(evt) {  
  $('dd', ss).stop();
  var o = $('dd:visible', ss);
  var n = $('#' + $(evt.currentTarget).attr('id') + '-content');
  
  if(o.get(0) == n.get(0) && o.length == 1) { return false };

  $(fader).stop().css('background-image', n.css('background-image')).animate({opacity:1}, 'fast', function(e) {
    $('#singlescreen').css('background-image', n.css('background-image'));
    $(fader).css('opacity', 0);
  });  
  
  if(jQuery.browser.msie == true) {
    o.css('z-index', 15).hide();
    n.css('z-index', 20).show();    
  } else {
    o.stop().css('z-index', 15).animate({opacity:0}, 'normal', function(e) {$(this).hide();});
    n.stop().css('z-index', 20).css({display: 'block', opacity:0}).animate({opacity:1}, 'fast');    
  }
  
  $('dt.active', ss).removeClass('active');
  $(this).addClass('active');
  Cufon.refresh('.category-title');
  
}

function activateNext() {
  var next = $('dt.active', ss).nextAll('dt:first');
  if(next.length === 0) { next = $('dt:first', ss); }
  next.triggerHandler('mouseenter');
}

function showModel(evt) {
  $(this).addClass('active').siblings('li.active').removeClass('active');
  var model = $(this);
  var panel = $('dd:visible li#'+$(this).attr('rel')+'-panel', ss);
  if(jQuery.browser.msie == true) {
    panel.css('z-index', 20).show().siblings('li').css('z-index', 19).hide();    
  } else {
    panel.css('z-index', 20).fadeIn('fast').siblings('li').css('z-index', 19).fadeOut('normal');    
  }
  if(model.parent().hasClass('dots')) {
    var li = $('dt li[rel='+model.attr('rel')+']', ss);
    li.addClass('active').siblings('li.active').removeClass('active');
    if(li.is(':first-child')) { $('dt.active .prev', ss).addClass('disabled'); } else { $('dt.active .prev', ss).removeClass('disabled') }
    if(li.is(':last-child')) { $('dt.active .next', ss).addClass('disabled'); } else {$('dt.active .next', ss).removeClass('disabled')}
  } else {
    $('.dots li[rel='+model.attr('rel')+']', ss).addClass('active').siblings('li.active').removeClass('active');     
  }
}

function switchModel(evt) {
  $(this).attr('unselectable', 'on').css('MozUserSelect', 'none');
  if($(this).hasClass('disabled')) return;
  
  var p = $(this).parent();
  if($(this).hasClass('prev')) {
    $('.next', p).removeClass('disabled')
    var li = $('li.active', p).prev('li');     
    if(li.is(':first-child')) $(this).addClass('disabled');
  } else if ($(this).hasClass('next')) {
    $('.prev', p).removeClass('disabled')
    var li = $('li.active', p).next('li');
    if(li.is(':last-child')) $(this).addClass('disabled');
  } else {
    return;
  }
  
  $(li).triggerHandler('click')
}

$.fn.getIndex = function() {
  var a = $(this).parent().children();
  for(var i=0;i<a.length;i++) {
    if(a[i] == this.get(0)) 
      return i;
  }
  return false;
}

function changeModelImage(evt) {
  $('.product_image_large img').attr('src', $(this).attr('src')).attr('name', $(this).attr('name'));
  $(this).parent('li').addClass('active').siblings('li.active').removeClass('active');
}

function zoomModelImage(evt) {
  var img = $('img', this).hide().attr('name');
  $(this).css({'background-image': 'url('+img+')', 'border-color':'#f4f4f4'});
  $(this).bind('mousemove', moveModelImage);
}

function unzoomModelImage(evt) {
  $(this).css({'background-image': 'none', 'border-color' : '#fff'}).find('img').fadeIn('fast');
  $(this).unbind('mousemove', moveModelImage);
}

function moveModelImage(evt) {
  var x = (evt.pageX - $(this).offset().left) * 1.375;
  var y = (evt.pageY - $(this).offset().top) * 1.85;
  $(this).css('background-position', '-'+x+'px -'+y+'px');
}