/* JavaScript for Avril Home Slider
   Largely based on http://jqueryfordesigners.com/coda-slider-effect/ */

// when the DOM is ready...
jQuery(document).ready(function ($) {

var $panels = $('#home-slider .scrollContainer > div');
var $container = $('#home-slider .scrollContainer');

$panels.css({
  'float' : 'left'
});

// calculate a new width for the container (so it holds all panels)
$container.css('width', $panels[0].offsetWidth * $panels.length);

// collect the scroll object, at the same time apply the hidden overflow
// to remove the default scrollbars that will appear
var $scroll = $('#home-slider .scroll').css({'overflow':'hidden','width':'550px'});

$('body.page-template-accueil-php #content').css({
	'width' : '550px',
	'margin' : '0 230px 0 16px'
})

// handle nav selection
function selectNav() {
  $(this).parents('ul:first').find('li').removeClass('current-panel');
  $(this).parents('li:first').addClass('current-panel');
}

$('ul#slider-nav').find('a').click(selectNav);

// go find the navigation link that has this target and select the nav
function trigger(data) {
  var el = $('ul#slider-nav').find('a[href$="' + data.id + '"]').get(0);
  selectNav.call(el);
}


var scrollOptions = {
  target: $scroll, // the element that has the overflow
  
  // can be a selector which will be relative to the target
  items: $panels,
  
  navigation: 'ul#slider-nav a',
  
  // allow the scroll effect to run both directions
  axis: 'x',
  
  onAfter: trigger, // our final callback
  
  // duration of the sliding effect
  duration: 500,
  
  // easing - can be used with the easing plugin: 
  // http://gsgd.co.uk/sandbox/jquery/easing/
  easing: 'easeInQuad',

  interval: 12000
};

// apply serialScroll to the slider - we chose this plugin because it 
// supports// the indexed next and previous scroll along with hooking 
// in to our navigation.
$('#home-slider').serialScroll(scrollOptions);

$('ul#slider-nav a:first').click();

});