/* 
	 * Définition de Marquee, fonction de défilement 
	 * @param box (string/node) le noeud marquee 
	 * @param options (map) les options
	 *		- speed : la vitesse du déplacement (default 0.5)
	 *		- dirc : la direction du déplacement (default top)
	 *		- btSpeedUp : la bouton d'accélération 
	 *		- btSpeedDown : la bouton d'esaccélération 
	 *		- speedActiveBt : vitesse d'accélaration pour le bouton (default 10)
	 *		- cssActiveBtSpeedUp : class du bouton accélération actif
	 *		- cssActiveBtSpeedUp : class du bouton desaccélération actif
	 *		- eventBt : l'évenement de l'activation de bouton (default over, sinon down)
	 *		- stopOnOver : pour stopper le difelement au survole (default false)
	 *		- scrollOnMove : pour actievr le scrolling au survole
	 *		- maxSpeedOnMove : vitesse d'accélaration pour le scrool (default 10)
	 *		- expoSpeedOnMove : comportement exponentiel de l'accélaration  (default 2)
	 *		- draggable : permet de scroller le contenue lors d'un drag  (default false)
	 *		- cursorOverDrag : définit l'url du curseur à utilisé pour spécifié que le contenue peux etre "dragger" 
	 *		- cursorOnDrag : définit l'url du curseur à utilisé pour spécifié que le contenue est en train d'etre "dragger" 
	 */
var Marquee = new Class({
    Implements: Options,
	initialize: function(box, options){
	    this.box = $(box);
		this.content = this.box.getFirst();
		this.coefDirc = 1;
		
		//ini les options
		this.setOptions(options);

		
		if(this.options.btSpeedUp)
		    this.options.btSpeedUp = $(this.options.btSpeedUp);
		if(this.options.btSpeedDown)
		    this.options.btSpeedDown = $(this.options.btSpeedDown);
		
		this._speed = this.options.speed;
		this.inverseDirc = this.options.dirc=='bottom' || this.options.dirc=='right';
		this.horizontalDirc = this.options.dirc=='bottom' || this.options.dirc=='top';	
		
        
		this.box.style.overflow = 'hidden';
		this.box.style.position = 'relative'; 
		this.content.style.position = 'absolute';
		
        
		//calcule la dimension du conteneur  + la dimention du contenue 
		var boxDim = this.box['client' + (this.horizontalDirc ? 'Height' : 'Width')];
		var contentDim = this.content['offset' + (this.horizontalDirc ? 'Height' : 'Width')];
		
		//on definit las position max et min
		this.maxDim =-contentDim;
		this.startStep = 0;//boxDim;
		
		//on définit la position de départ
		if(this.options.activeCookie && this.box.id){
		     window.addEvent('unload', this.saveCookie.bindWithEvent(this));
			 this.currentStep = this.getCookie() || this.startStep;
		}else{		
		    this.currentStep = this.startStep;
		}
		
		if(this.options.btSpeedUp || this.options.btSpeedDown){
		    this.eventsBt = this.options.eventBt == 'over' ? ['mouseover', 'mouseout'] : ['mousedown', 'mouseup'];
		}
		//ajoutes les evenemnts du bouton speedUp
		if(this.options.btSpeedUp){
			this.options.btSpeedUp.addEvent(this.eventsBt[0] ,this.onActiveBt.bindWithEvent(this, this.inverseDirc));
			//this.options.btSpeedUp.addEvent(this.eventsBt[1], this.onInactiveBt.bindWithEvent(this));
		}
		
		//ajoutes les evenemnts du bouton speedDown
		if(this.options.btSpeedDown){
			this.options.btSpeedDown.addEvent(this.eventsBt[0], this.onActiveBt.bindWithEvent(this, [!this.inverseDirc, true]));
			//this.options.btSpeedDown.addEvent(this.eventsBt[1], this.onInactiveBt.bindWithEvent(this, true));
		}
		
		//ajoutes l' evenemnt stopOnOver
		if(this.options.stopOnOver){
			this.box.addEvent('mouseover', this.onMouseOverContent.bindWithEvent(this));
			this.box.addEvent('mouseout', this.onMouseOutContent.bindWithEvent(this));
		}
		
		if(this.options.scrollOnMove){
		    this.middleDim = boxDim / 2;
			this.timeOut = false;
			 
			this.box.addEvent('mouseover', this.onActiveScroll.bindWithEvent(this));
			this.box.addEvent('mouseout', this.onInactiveScroll.bindWithEvent(this));
			this.box.addEvent('mousemove', this.scrollOnMove.bindWithEvent(this));
		}
		
		
		if(this.options.draggable){
		    if(this.options.cursorOverDrag){
				this.box.addEvent('mouseover', this.setCursorOverDrag.bindWithEvent(this));
				this.box.addEvent('mouseout', this.setCursorOverDrag.bindWithEvent(this, true));
			}
			this.box.addEvent('mousedown', this.onActiveDrag.bindWithEvent(this));
		}
		
		
		
		this.setInterval();
		
	},
	
	options : {
		speed : 0.5,
		speedActiveBt : 10,
		dirc : 'top',
		eventBt : 'over',
		stopOnOver : false,
		draggable : false,
		maxSpeedOnMove : 10,
		expoSpeedOnMove : 2
	},
	
	onInactiveBt : function(e, down){
		this.options.speed = this._speed;
		var css = this.options['cssActiveBtSpeed' + (down ? 'Down' : 'Up')];
		if(css){
			var bt = this.options['btSpeed' + (down ? 'Down' : 'Up')],
			cls = bt.className;
			bt.className = cls.replace(' ' + css, '');
		}
		this.toogleSelect(e, true);
		document.removeEvent('mouseup', this['handlerInctiveBt' + (down ? 'Down' : 'Up')]);
	},
	
	onActiveBt : function(e, inverse, down){
		this.options.speed  = inverse ? -this.options.speedActiveBt : this.options.speedActiveBt;
		var css = this.options['cssActiveBtSpeed' + (down ? 'Down' : 'Up')];
		
		if(css)
			this.options['btSpeed' + (down ? 'Down' : 'Up')].className += ' ' + css;
		
		var eventHandler = 'handlerInctiveBt' + (down ? 'Down' : 'Up');
 			
		this[eventHandler] = this.onInactiveBt.bindWithEvent(this, down);
		document.addEvent(this.eventsBt[1], this[eventHandler]);
		this.toogleSelect(e);
	},

	onMouseOverContent : function(){
		this.clearInterval();
	},
	
	onMouseOutContent  : function(){
		if(!this.isOndrag)
			this.setInterval();
	},

	onActiveScroll : function(e){
		//on passe par un setTimeout , pour eviter une émulation de mouseenter, mouseleave
		if(this.timeOut){
			clearTimeout(this.timeOut);
		}else{
			
			var dim = this.box.getOffsets();
			
			this.coor = this.options.dirc == 'top' || this.options.dirc == 'bottom' ? dim.y: dim.x;
		}
	},
	
	onInactiveScroll : function(e){
		//on passe par un setTimeout , pour eviter une émulation de mouseenter, mouseleave
		this.timeOut = setTimeout(function(){
			this.timeOut = null;
			this.options.speed = this._speed;
		}.bind(this), 0);

	},
	
	scrollOnMove : function(e){
		e = new Event(e);
		if(this.options.dirc == 'top' || this.options.dirc == 'bottom'){
			var mouseCoor = e.page.y;
		}else var mouseCoor = e.page.x;
		
		var ratio = (this.middleDim - (mouseCoor - this.coor))/ this.middleDim,
		coefDirc = Math.pow(ratio, this.options.expoSpeedOnMove) * this.options.maxSpeedOnMove;
		
		this.options.speed = (ratio > 0 ? coefDirc : coefDirc > 0 ? -coefDirc : coefDirc) * (this.inverseDirc ? -1 : 1);
	},


	onActiveDrag : function(e){
	    var ev = new Event(e);
		this.isOndrag = true;
		this.clearInterval();
		
		this.coor = this.horizontalDirc ? ev.page.y : ev.page.x;
		 
		this.handlerInactiveDrag = this.onInactiveDrag.bindWithEvent(this);
		document.addEvent('mouseup', this.handlerInactiveDrag);
		
		this.handlerDragOnMove = this.dragOnMove.bindWithEvent(this);
		document.addEvent('mousemove', this.handlerDragOnMove);
		
		if(this.options.cursorOnDrag)
			document.documentElement.style.cursor = 'url(' + this.options.cursorOnDrag + '), auto';
		
		this.toogleSelect(e);
		
	},
	
	onInactiveDrag : function(e){
	    var ev = new Event(e);
		this.isOndrag = false;
		var coor = this.horizontalDirc ? ev.page.y : ev.page.x;
		this.currentStep = this.inverseDirc ? this.currentStep - (coor - this.coor) : this.currentStep + (coor - this.coor) ;
		
		
		if(this.isOutDrag && this.options.cursorOnDrag){
			document.documentElement.style.cursor = 'auto';
		}else if(this.options.cursorOverDrag){
			document.documentElement.style.cursor = 'url(' + this.options.cursorOverDrag + '), auto';
		}
		
		document.removeEvent('mouseup', this.handlerInactiveDrag);
		document.removeEvent('mousemove', this.handlerDragOnMove);
		
		this.toogleSelect(e, true);
		this.setInterval();
	},
	
	dragOnMove : function(e){
	    var ev = new Event(e);
		var coor = this.horizontalDirc ? ev.page.y : ev.page.x,
		steep =  this.inverseDirc ? this.currentStep - (coor - this.coor) : this.currentStep + (coor - this.coor) ;
		
		this.content.style[this.options.dirc] =  steep + 'px';
		
		if(steep > this.startStep){
			this.currentStep = this.maxDim;
			this.coor = coor;
		}else if(steep < this.maxDim){
		   this.currentStep = this.startStep;
			this.coor = coor;
		}
	},
	
	setCursorOverDrag : function(e, del){
		if(!this.isOndrag){
			document.documentElement.style.cursor = del ? 'auto' : 'url(' + this.options.cursorOverDrag + '), auto';
		}else this.isOutDrag = del;
	},
	
		
	setSteep : function(){
		var acc = this.options.speed;
		this.content.style[this.options.dirc] = this.currentStep - acc + 'px';
		
		this.currentStep -= acc;
		if(this.currentStep > this.startStep)
			this.currentStep = this.maxDim;
		if(this.inverseDirc){
			if(this.currentStep < this.maxDim)
				this.currentStep = this.startStep;
		}else if(this.currentStep < this.maxDim){
			this.currentStep = this.startStep;
		}
	},
	
	setInterval : function(){
		if(!this.interval)
			this.interval = setInterval(this.setSteep.bind(this), 35);
	},
	
	clearInterval : function(){
		if(this.interval){
			clearInterval(this.interval);
			this.interval = null;
		}
	},
	
	toogleSelect : function(e, enable){
		if(enable){
			document.onselectstart = null;
			document.ondragstart = null;
		}else{
			document.onselectstart = function(){return false;};
			document.ondragstart = function(){return false;};
			Event.stop(e);
		}
	},
	getCookie : function(){
	    return Cookie.read('marquee_'+this.box.id);
	},
	saveCookie : function(){
		Cookie.write('marquee_'+this.box.id, this.currentStep);
	}
});