/*
                              _  _   _                                        
                             | || | | |                                       
 _ __ ___    ___    ___    __| || | | |  ___   __ _  _ __  _ __   ___   _   _ 
| '_ ` _ \  / _ \  / _ \  / _` || | | | / __| / _` || '__|| '__| / _ \ | | | |
| | | | | || (_) || (_) || (_| |\ \_/ /| (__ | (_| || |   | |   | (_) || |_| |
|_| |_| |_| \___/  \___/  \__,_| \___/  \___| \__,_||_|   |_|    \___/  \__,_|
                                                                              
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|v|i|r|t|u|a|l|g|a|d|j|o| |f|o|r| |M|o|o|d|f|o|r|w|e|b|
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
*/

var moodVcarrou = new Class ({

	Implements: [Options],

	Binds : ['toPrev', 'toNext'],

	options: {
		transition  : Fx.Transitions.Quad.easeOut,
		duration    : 600,
		pause       : 2000,
		buttDiv     : '',
		nextB       : '',
		prevB       : '',
		listPicto   : '',
		listText    : '',
		textItem    : 'div',
		selText     : 'selText',
		selectClass : 'selectPicto',
		withmask    : true,
		maskClass   : 'realmask',
		auto        : false
	},

	initialize: function(ziParent, ziBigConteneur, options) {
		this.setOptions(options);
		this.bigCont   = ziBigConteneur;
		this.maman     = ziParent;
		this.imgs      = this.bigCont.getChildren('img') || [];
		this.itemsNum  = this.imgs.length;
		this.w         = this.bigCont.getCoordinates().width;
		this.idx       = 0;
		this.diff      = 0;

		if (this.options.withmask == true){
			this.rmask = new Element ('div', {
				'class' : this.options.maskClass,
				styles  : {
					'width'           : '543px',
					'height'          : '345px',
					'position'        : 'absolute',
					'z-index'         : 30,
					'background-color': '#000000',
					'opacity'         : .3,
					'left'            : 0,
					'top'             : 0
				}
			}).inject(this.bigCont, 'top');

			this.rmask.set('tween', {duration: 400});

			this.maman.addEvents({
				'mouseenter': function(){
					this.rmask.tween('opacity', 0);
					if ( this.imgs.length > 1 ) {
						this.options.nextB.setStyle('visibility', 'visible');
						this.options.prevB.setStyle('visibility', 'visible');
					}
				}.bind(this),
				'mouseleave': function(){
					this.rmask.tween('opacity', 0.3);
					if ( this.imgs.length > 1 ) {
						this.options.nextB.setStyle('visibility', 'hidden');
						this.options.prevB.setStyle('visibility', 'hidden');
					}
				}.bind(this)
			});
		}


		if (this.options.listPicto != '' && this.options.selectClass != ''){
			this.pictos = this.options.listPicto.getChildren('li').getChildren('a');
			this.pictos[0].addClass(this.options.selectClass);
		}

		if (this.options.listText != ''){
			this.txt = this.options.listText.getChildren(this.options.textItem);
		}

		for (var i = 1; i < this.itemsNum; i ++){
			this.imgs[i].setStyle('display', 'none');
		}

		//defilement auto
		if (this.options.auto == true) this.defilAuto();

		//les boutons prev next
		if(this.options.nextB != '' && this.options.prevB != '' && this.options.buttDiv != ''){
			this.options.nextB.setStyle('visibility', 'hidden');
			this.options.prevB.setStyle('visibility', 'hidden');

			this.options.buttDiv.addEvents({
				'mouseenter' : function(){
					if ( this.imgs.length > 1 ) {
						this.options.nextB.setStyle('visibility', 'visible');
						this.options.prevB.setStyle('visibility', 'visible');
					}
				}.bind(this),
				'mouseleave' : function(){
					this.options.nextB.setStyle('visibility', 'hidden');
					this.options.prevB.setStyle('visibility', 'hidden');
				}.bind(this)
			});
			this.options.nextB.addEvents({
				'click'     : function(e){
					e.stop();
					this.toNext();
				}.bind(this)
			});

			this.options.prevB.addEvents({
				'click'     : function(e){
					e.stop();
					this.toPrev();
				}.bind(this)
			});
		}

		//le clic sur les pictos
		if( this.pictos && this.imgs.length > 1 ){
			this.pictos.each(function(el, j){
				el.addEvent('click', function(e){
					e.stop();
					if (j != this.idx){
						//console.log(j);
						j < this.idx ? this.toPrev(j+1) : this.toNext(j+1);
					}
				}.bind(this));
			}.bind(this));
		}
	},

	setSelVign: function(){
		this.pictos[this.newid].addClass(this.options.selectClass);
		for (var i = 0; i < this.itemsNum; i ++){
			if (i != this.newid) this.pictos[i].removeClass(this.options.selectClass);
		}
	},

	setSelTxt: function(){
		this.txt[this.newid].addClass(this.options.selText);
		for (var i = 0; i < this.itemsNum; i ++){
			if (i != this.newid) this.txt[i].removeClass(this.options.selText);
		}
	},

	toNext: function(idx){
		//this.compEvent = function(){ this.fireEvent('onNext'); }
		if (!idx) this.newid = this.idx == this.itemsNum - 1 ? 0 : this.idx + 1;
		else this.newid = idx - 1;
		//console.log(this.newid);
		this.imgs[this.newid].setStyles({
			'display': 'block',
			'left'   : this.w
		});
		this.setSelVign();
		new Fx.Tween(this.imgs[this.idx], {
			duration  : this.options.duration,
			transition: this.options.transition,
			link      : 'chain'
		}).start('left', -this.w);
		new Fx.Tween(this.imgs[this.newid], {
			duration  : this.options.duration,
			transition: this.options.transition,
			link      : 'chain',
			onComplete : function(){
				if(this.txt) this.setSelTxt();
			}.bind(this)
		}).start('left', 0);
		this.idx = this.newid;
	},

	toPrev: function(idx){
		if (!idx) this.newid = this.idx == 0 ? this.itemsNum - 1 : this.idx - 1;
		else this.newid = idx - 1;
		this.imgs[this.newid].setStyles({
			'display': 'block',
			'left'   : - this.w
		});
		this.setSelVign();
		new Fx.Tween(this.imgs[this.idx], {
			duration  : this.options.duration,
			transition: this.options.transition,
			link      : 'chain'
		}).start('left', this.w);
		new Fx.Tween(this.imgs[this.newid], {
			duration  : this.options.duration,
			transition: this.options.transition,
			link      : 'chain',
			onComplete: function(){
				if(this.txt) this.setSelTxt();
			}.bind(this)
		}).start('left', 0);
		this.idx = this.newid;
	},

	defilAuto: function(){
		this.enroute = this.toNext.setTimeout(this.options.pause, this);
	}

});