var Marquee = new Class({
	Implements: [Options, Events],
	
	id : null,
	clone : null,
	element : null,
	dimensions : null,
	timer : null,
	over : false,
	conteneur : null,
	options:{
		decalage:2,
		_scroll:'up',
		infinite : true,
		nom:'maVar'
	},
	initialize: function(id,options){
		this.id = id;
		this.element = $(id);
		this.conteneur = this.element.getParent();
		//alert( this.conteneur.getSize().x+ '  '+this.conteneur.getSize().y)
		this.dimensions = {width:this.element.scrollWidth,height:this.element.scrollHeight};
		this.setOptions(options);
		this.render();
	},
	render: function(){
		var masque = new Element('div', { 'class': 'contient'});
		masque.wraps(this.element);
		if ( this.options._scroll != 'none' ){
			this.lanceScroll(this.options._scroll == 'up' ? -1 : 1 );
		}
		else{
			this.createFleche();
		}
	},
	lanceScroll: function(sens){
		if(!this.clone){
			this.clone = this.element.cloneNode(true); 
			this.clone.id = 'clone'+this.id;
			this.dimensions.height = this.element.scrollHeight;
			this.clone.setStyle("top", -1*this.dimensions.height +'px');
			this.clone.setStyle("left", '0px');
			this.element.getParent().appendChild(this.clone);
		}
		if(this.timer) clearInterval(this.timer);
		this.timer = setInterval(this.options.nom+'.scroller('+sens+')',50);
	},
	scroller: function(sens){
		
		var a = sens*this.options.decalage
		var top = (isNaN(this.element.getStyle('top').toInt()) ? 0 : this.element.getStyle('top').toInt())
		var topClone = (isNaN(this.clone.getStyle('top').toInt()) ? 0 : this.clone.getStyle('top').toInt())
		this.element.setStyle("top", (this.element.getStyle('top') == null ? sens*this.options.decalage : top +sens*this.options.decalage )+'px');
		this.clone.setStyle("top",(this.clone.getStyle('top') == null ? sens*this.options.decalage : topClone+sens*this.options.decalage )+'px');
		this.bascule(this.element,sens);
		this.bascule(this.clone,sens);
	},
	stopScroll: function(){
		if(this.timer) clearInterval(this.timer);
	},
	bascule: function(elt,sens){
		var posY = elt.getStyle('top').toInt();
		if(isNaN(posY)) posY = 0;
		var posBas = this.dimensions.height;
		var posHaut = -1*this.dimensions.height;
		if ( sens == 1 && posY >= posBas) elt.setStyle("top", posHaut+'px');
		if ( sens == -1 && posY <= posHaut) elt.setStyle("top", posBas+'px');
	},
	createFleche: function(){
		var cg = new Element('span',{'class': 'cg'});
		var cd = new Element('span',{'class': 'cd'});
		var centre = new Element('div',{'class': 'centre'});
		var fleche = new Element('span',{'class': 'fleche'});
		
		centre.setStyle('width', (this.conteneur.getSize().x -12)+ 'px');
		centre.appendChild(fleche);

		var fHaut = new Element('div',{'class': 'top'});
		fHaut.appendChild(cg);
		fHaut.appendChild(centre);
		fHaut.appendChild(cd);
		this.element.parentNode.appendChild(fHaut);
		
		var fBas = fHaut.cloneNode(true);
		fBas.setProperty('class', 'bottom');
		fBas.setStyle('margin-top', (this.conteneur.getSize().y - 58) + 'px');
		this.element.parentNode.appendChild(fBas);
		
		var _super = this;
		fHaut.onmouseover = function(){
			new Fx.Morph(this, {duration: 1500}).start({'opacity':[0.4,0.7]});
			_super.lanceScroll(-1);
		}
		fHaut.onmouseout = function(){
			new Fx.Morph(this, {duration: 1500}).start({'opacity':[0.7,0.4]});
			_super.stopScroll();
		}
		fBas.onmouseover = function(){
			new Fx.Morph(this, {duration: 1000}).start({'opacity':[0.4,0.7]});
			_super.lanceScroll(1);
		}
		fBas.onmouseout = function(){
			new Fx.Morph(this, {duration: 1000}).start({'opacity':[0.7,0.4]});
			_super.stopScroll();
		}
	}
});