/*
                     __                      ___                           __                    
         __         /\ \__                  /\_ \                         /\ \     __            
 __  __ /\_\   _ __ \ \ ,_\  __  __     __  \//\ \       __       __      \_\ \   /\_\     ___   
/\ \/\ \\/\ \ /\`'__\\ \ \/ /\ \/\ \  /'__`\  \ \ \    /'_ `\   /'__`\    /'_` \  \/\ \   / __`\ 
\ \ \_/ |\ \ \\ \ \/  \ \ \_\ \ \_\ \/\ \L\.\_ \_\ \_ /\ \L\ \ /\ \L\.\_ /\ \L\ \  \ \ \ /\ \L\ \
 \ \___/  \ \_\\ \_\   \ \__\\ \____/\ \__/.\_\/\____\\ \____ \\ \__/.\_\\ \___,_\ _\ \ \\ \____/
  \/__/    \/_/ \/_/    \/__/ \/___/  \/__/\/_/\/____/ \/___L\ \\/__/\/_/ \/__,_ //\ \_\ \\/___/ 
                                                         /\____/                  \ \____/       
                                                         \_/__/                    \/___/        

Script : mooVcarrousel.js
massacred by christopher wait aka virtualgadjo aka grizzly aka l'ôt fou
un petit carrousel horizontal ou vertical
tourne avec mootools 1.2
http://www.virtual-gadjo.com/mooVcarrousel.php
--o0o--
TODO
ne fonctionne pour le moment qu'avec les boutons prev/next, nécessité fait loi...
à ajouter donc : les modes de fonctionnement défilement automatique ou au passage de la souris
--o0o--

*/

var mooVcarrousel = new Class ({

  Implements: [Events, Options],

  options: {
    onNext      : Class.empty,
    onPrev      : Class.empty,
    onStart     : Class.empty,
    direction   : 'horizontal',
    transition  : Fx.Transitions.linear,
    duration    : 500,
    mode        : 'butts', //"auto"
    mousePlay   : false,
    progressBy  : 1,
    butts       : {
      nextB   : 'vCarrouNext',
      prevB   : 'vCarrouPrev'
    },
    items       : {
      space   : 10,
      width   : 100,
      height  : 117
    }
  },

  initialize: function(ziCarrousel, ziItemConteneur, ziItems, options) {
    this.setOptions(options);
    this.carrou   = $(ziCarrousel);
    this.defil    = $(ziItemConteneur);
    this.items    = $$('.' + ziItems) || [];
    this.itemsNum = this.items.length;
    this.itemsRW  = this.options.items.width + this.options.items.space;
    this.itemsRH  = this.options.items.height + this.options.items.space;
    this.sectionW = this.itemsNum * this.itemsRW;
    this.sectionH = this.itemsNum * this.itemsRH;
    this.dn       = this.options.progressBy;

    (2).times(function(){
      this.items.each(function(el){
        el.clone().inject(this.defil, 'bottom');
      }.bind(this));
    }.bind(this));

    switch (this.options.direction) {
      case "horizontal" :
        this.defil.setStyles({
          'width'    : this.sectionW * 3,
          'position' : 'absolute',
          'left'     : - this.sectionW
        });
        break;
      case "vertical" :
        this.defil.setStyles({
          'height'   : this.sectionH * 3,
          'position' : 'absolute',
          'top'      : - this.sectionH
        });
        break;
    }

    if (this.options.mode == "butts") {
      $(this.options.butts.nextB).addEvent('click', function(e){
        e.stop();
        this.toNext();
      }.bind(this));
      $(this.options.butts.prevB).addEvent('click', function(e){
        e.stop();
        this.toPrev();
      }.bind(this));
    }

    this.fireEvent('onStart');
    this.defilFx = new Fx.Tween(this.defil, {
      transition : this.options.transition,
      duration   : this.options.duration,
      link       : 'ignore',
      onComplete : function(){
        this.repos();
        this.compEvent();
      }.bind(this)
    });
  },

  recal: function(){
    var i = 0;
    if(navigator.userAgent.indexOf("MSIE 8") != -1)         i = 1;
    else if(navigator.userAgent.indexOf("MSIE 7") != -1)    i = 1;
    //else if(navigator.userAgent.indexOf("MSIE 6") != -1)
    //else if(navigator.userAgent.indexOf("Firefox/3") != -1) i = 1;
    //else if(navigator.userAgent.indexOf("Firefox/2") != -1) i = 1;
    //else if(navigator.userAgent.indexOf("Firefox") != -1)   i = 1;
    //else if(navigator.userAgent.indexOf("Netscape/7") != -1)
    //else if(navigator.userAgent.indexOf("Netscape") != -1)
    //else if(navigator.userAgent.indexOf("Opera/9") != -1)
    //else if(navigator.userAgent.indexOf("Opera") != -1)
    return i;
  },
  
  repos: function(){
    this.defilPos = this.defil.getPosition(this.carrou);
    if(this.defilPos.x<0) 
      this.defilPos.x = this.defilPos.x - this.recal();
    else 
      this.defilPos.x = this.defilPos.x - this.recal();
    
    if (this.options.direction == "horizontal"){
      // this.defil.offsetLeft
      if (this.defilPos.x <= - this.sectionW * 2) this.defil.setStyle('left', (this.defilPos.x + this.sectionW));
      if (this.defilPos.x >= - this.itemsRW * this.dn) this.defil.setStyle('left', this.defilPos.x - this.sectionW);
    }
    if (this.options.direction == "vertical"){
      if (this.defilPos.y <= - this.sectionH * 2) this.defil.setStyle('top', this.defilPos.y + this.sectionH);
      if (this.defilPos.y >= - this.itemsRH * this.dn) this.defil.setStyle('top', this.defilPos.y - this.sectionH);
    }
  },

  toNext: function(){
    this.compEvent = function(){ this.fireEvent('onNext'); }

    this.defilPos = this.defil.getPosition(this.carrou);
    if(this.defilPos.x<0) 
      this.defilPos.x = this.defilPos.x - this.recal();
    else 
      this.defilPos.x = this.defilPos.x - this.recal();

    if (this.options.direction == "horizontal"){
      this.defilFx.start('left', (this.defilPos.x) - (this.itemsRW * this.dn));
      //alert('('+this.defilPos.x+')'+this.defil.offsetLeft+' - '+(this.itemsRW * this.dn));
    }
    if (this.options.direction == "vertical"){
      this.defilFx.start('top', this.defilPos.y - (this.itemsRH * this.dn));
    }
  },

  toPrev: function(){
    this.compEvent = function(){ this.fireEvent('onPrev'); }
    this.defilPos = this.defil.getPosition(this.carrou);
    if(this.defilPos.x<0) 
      this.defilPos.x = this.defilPos.x - this.recal();
    else 
      this.defilPos.x = this.defilPos.x - this.recal();
      
    if (this.options.direction == "horizontal"){
      this.defilFx.start('left', (this.defilPos.x) + (this.itemsRW * this.dn));
    }
    if (this.options.direction == "vertical"){
      this.defilFx.start('top', this.defilPos.y + (this.itemsRH * this.dn));
    }
  }
});

//