<!--

_coverflow.instances = new Array()

_coverflow_events =
{
    "addEventListener" : function(element, eventName, eventHandler, scope)
    {
        var scopedEventHandler = scope ? function(e) { eventHandler.apply(scope, [e]); } : eventHandler;   
        _event_listen(element,eventName,scopedEventHandler);
    },
    
	"removeEventListener" : function(element, eventName, eventHandler, scope)
    {
        var scopedEventHandler = scope ? function(e) { eventHandler.apply(scope, [e]); } : eventHandler;          
        _event_stopListening(element,eventName,scopedEventHandler);
    }
}

function _coverflow(path,divname,imageWidth,imageHeight,separation)
{
	this.id = _coverflow.instances.length;
	_coverflow.instances[this.id] = this;
	
	//alert('instance='+this.id);
	
	this.divname = divname;
	this.div = document.getElementById(divname);
	this.divIntern = null;

	this.path = path;
	this.status = 'paused';

	this.imageAsBalise = false;
	this.zoom = false;

	this.clayer = null;

	this.ids = new Array();
	this.titles = new Array();
	this.comments = new Array();
	this.images = new Array();
	this.urls = new Array();

	this.scaleFactor = 0.5;
	this.minOpacity = '0.0';
	
	this.separation = separation;
	this.imageWidthLarge = imageWidth;
	this.imageHeightLarge = imageHeight;
	
	this.imageWidth = parseInt(this.imageWidthLarge*this.scaleFactor);
	this.imageHeight = parseInt(this.imageHeightLarge*this.scaleFactor);
	
	this.imagePositions = new Array();
	
	this.nItems = 0;
	
	this.currentIndex = 0;
	
	this.timer = null;
	
	this.buffers = new Array();
	this.buffer = 0;
	
	this.movement = 0;
	this.movementOlder = 0;
	this.movementAccel = 0;
	
	this.asBackground = true;
	
	this.frameX = 0;
	
	this.browser_prefix = _getBrowserStylesPreffix();
	
	//alert(this.browser_prefix);
	
	this.dontusetransform = false;
	
	// -----------------
	
	this.animation = false;
	
	this.animation_timer = null;
	this.animation_duration = 0.8;
	this.animation_timeUnit = 0.015;
	this.animating_nSteps = 0;
	
	this.animating = false;
	this.animating_distance = 0;
	this.animating_step = 0;
	this.animating_fromIndex = 0;
	this.animating_toIndex = 0;
	this.animating_fromPosition = 0;
	this.animating_toPosition = 0;
	
	// ---------- DRAGGING SUPPORT -------------
	
	this.draggingMode = 'mouse';
	
	this.supportsDragging = false;
	
	this.draggingFromIndex = null;
	this.draggingToIndex = null;
	
	this.draggingStartTime = null;
	this.draggingStartPosition = 0;
	this.draggingAnimDuration = 1000;

	this.draggingLastTime = null;
	this.draggingLastPosition = 0;
	this.draggingLaunchSpeed = 0.0;
	this.isDragging = false;
	
	
	
	
	// ---------- TOUCH SUPPORT -------------
	
	this.supportsTouch = false;




	// 
	
	this.debug = '';
}


_coverflow.prototype.build = function()
{
	// Création du div intérieur

	this.divIntern = _div_create(this.divname+'-in','coverflow-in',this.divname,(this.imageWidthLarge+this.separation)*this.nItems,this.imageHeightLarge,0,0,'');

	for(var i=0; i<this.nItems; i++)
	{
		this.imagePositions[i] = i*this.imageWidth+this.separation*i;
		var imageDiv = _div_create(this.divname+'image-'+i,'image',this.divname+'-in',this.imageWidthLarge,this.imageHeightLarge,this.imagePositions[i],0,'');
		
		//var anchorDiv = _div_create(imageDiv,'anchor');
		
		if(this.zoom)
		{
			
			//document.write('a');
			var that = this;
		
			this.clayer = new _clayer();
			this.clayer.imagePath = this.path+this.urls[i];
			
			//this.clayerOpenFunction = function(e){ that.clayer.setPicture.apply(); };
			this.clayerOpenFunction = function(e){ that.clayer.setPicture() };

			_event_listen(imageDiv,'click',that.clayerOpenFunction);
		}
		else
		{
			if(this.urls[i]!='')
			{
				//alert('onclick='+this.urls[i]);
				imageDiv.setAttribute('onclick',this.urls[i]);
				//imageDiv.setAttribute('onclick','alert('+i+');');
			}
		}
		
		if(this.imageAsBalise)
		{
			var htmlContent = '<img src="'+this.path+this.images[i]+'" alt="" /><div class="title">'+this.titles[i]+'</div>';
			
			imageDiv.innerHTML = htmlContent;
		}
		else
		{
			if(this.titles[i]!='')
			{
				var titleDiv = _div_create2(imageDiv,'title');
			
				titleDiv.innerHTML = this.titles[i];
			}
			
			_div_setStyleProperty(this.divname+'image-'+i,'background-image','url('+this.path+this.images[i]+')');
		}
		
		if(!this.dontusetransform)
		{
			_div_setStyleProperty(this.divname+'image-'+i,this.browser_prefix+'transform','scale('+this.scaleFactor+')');
		}	
		
		_div_setOpacity(this.divname+'image-'+i,this.minOpacity);
	}
	
	// calcul de la position du cadre central
	
	this.frameX = Math.ceil(_div_getWidth(this.divname)/2-(this.imageWidthLarge/2));
	
	this.makeReady(0);
	
}

_coverflow.prototype.makeAnimated = function (animated)
{
	if(animated)
	{
		_div_setStyleProperty(this.div,this.browser_prefix+'transition-property','left');
		_div_setStyleProperty(this.div,this.browser_prefix+'transition-duration','1.5s');
	}
	else
	{
		_div_setStyleProperty(this.div,this.browser_prefix+'transition-property','');
		_div_setStyleProperty(this.div,this.browser_prefix+'transition-duration','');	
	}
}

_coverflow.prototype.activateDragging = function()
{
	_coverflow_events.addEventListener(this.div, "mousedown", this.dragStart, this);	

	this.supportsDragging = true;
}

_coverflow.prototype.dragStart = function (event)
{
	var evt = event || window.event;

	this.isMoving = true;

	this.makeAnimated(false);

	var that = this;

	this.mousemoveEventListener = function(e) { that.dragging.apply(that, [e]); };
	this.mouseupEventListener = function(e) { that.dragStop.apply(that, [e]); };
	
	_event_listen(document.documentElement,'mousemove',this.mousemoveEventListener);
	_event_listen(document.documentElement,'mouseup',this.mouseupEventListener);


	// calcul du décalage entre la souris et la cellule
	
	var mouseCoord = _mouseCoordinates(evt);
	this.draggingStartPosition = mouseCoord.x;
	this.draggingLastPosition = this.draggingStartPosition;
	
	var now = new Date();
	
	this.draggingStartTime = now;
	this.draggingLastTime = this.draggingStartTime;
	
	this.draggingFromIndex = this.currentIndex;
	this.draggingToIndex = null;
	
	this.debug = 'dragStart: draggingStartTime='+this.draggingStartTime+' this.draggingStartPosition='+this.draggingStartPosition;

	_div_setContent('debug',this.debug);
} 

_coverflow.prototype.dragging = function (event)
{
	var evt = event || window.event;

	// calcul de la distance parcourue
	var mouseCoord = _mouseCoordinates(evt);
	var currentPosition = mouseCoord.x;
	var distance = currentPosition-this.draggingLastPosition;

	
	var distanceSinceBeginning = currentPosition-this.draggingStartPosition;

	if(distanceSinceBeginning>0)
	{
		this.draggingToIndex = this.draggingFromIndex-1;
	}
	else
	{
		this.draggingToIndex = this.draggingFromIndex+1;
	}

	//if()

	// calcul du temps écoulé
	var currentTime = new Date();
	var elapsedTime = (currentTime - this.draggingLastTime)/1000;
	
	var position = this.draggingFromIndex*(this.imageWidth+this.separation) + distanceSinceBeginning;
	var ratio = Math.abs(distanceSinceBeginning/this.imageWidth);
	
	this.debug = ' [distance='+distanceSinceBeginning+' elapsedTime='+elapsedTime+' position='+position+' ratio='+ratio+'] ';

	_div_setContent('debug',this.debug);
	
	this.translateTo(position,ratio);
	
	this.draggingLastPosition = currentPosition;
}

_coverflow.prototype.dragStop = function (event)
{
	this.isMoving = false;

	_coverflow_events.removeEventListener(document.documentElement, "mousemove", this.mousemoveEventListener);
	_coverflow_events.removeEventListener(document.documentElement, "mouseup", this.mouseupEventListener);	


	this.debugValue += ' [dragStop] ';

	this.focusOn(this.draggingToIndex);

} 

_coverflow.prototype.previous = function()
{
	if(!this.dontusetransform && this.scaleFactor!=1.0) 
	{
		_div_setStyleProperty(this.divname+'image-'+this.currentIndex,this.browser_prefix+'transform','scale(1.0)');
	}
	
	_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'z-index','1');
	
	var index = -1;
	
	if(this.currentIndex==0)
	{
		index = this.nItems-1;
	}
	else
	{
		index = this.currentIndex-1;
	}

	if(this.animation)
	{
		this.animateTo(index);
	}
	else
	{
		this.focusOn(index);
	}
}

_coverflow.prototype.setIndex = function(newIndex)
{
	//currentIndex = newIndex;
	
	if(this.animation)
	{
		this.animateTo(newIndex);
	}
	else
	{
		this.focusOn(newIndex);
	}
}

_coverflow.prototype.next = function()
{
	if(!this.dontusetransform && this.scaleFactor!=1.0) 
	{
		_div_setStyleProperty(this.divname+'image-'+this.currentIndex,this.browser_prefix+'transform','scale(1.0)');
	}
	
	_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'z-index','1');
	
	var index;
	
	if(this.currentIndex>=(this.nItems-1))
	{
		index = 0;
	}
	else
	{
		index = this.currentIndex+1;
	}

	if(this.animation)
	{
		this.animateTo(index);
	}
	else
	{
		this.focusOn(index);
	}
}


_coverflow.prototype.addItem = function(id,title,content,image,url)
{
	this.ids[this.nItems] = id;
	this.titles[this.nItems] = title;
	this.comments[this.nItems] = content;
	this.images[this.nItems] = image;
	this.urls[this.nItems] = url;
	
	this.nItems++;
}

_coverflow.prototype.start = function()
{
	this.timer = setInterval( "_coverflow.instances["+this.id+"].next()", 5000);
	this.next();
}

_coverflow.prototype.touchHandler = function(e) {
	if (e.type == "touchstart")
	{
		alert("You touched the screen!");
	}
	else if (e.type == "touchmove")
	{
		alert("You moved your finger!");
	}
	else if (e.type == "touchend" || e.type == "touchcancel")
	{
		alert("You removed your finger from the screen!");
	}
	else
	{
		// Nothing
	}
}

_coverflow.prototype.finishMovement = function()
{

}


_coverflow.prototype.makeReady = function(index)
{
	var translateTo = this.frameX-index*(this.imageWidth+this.separation);

	if(this.minOpacity!=1.0)
	{ 
		_div_setStyleProperty(this.divname+'image-'+index,'opacity','1.0');
	}
	
	_div_setStyleProperty(this.divname+'image-'+index,'z-index','10');
	
	if(this.dontusetransform)
	{
		_div_setStyleProperty(this.divname+'-in','left',translateTo+'px');
	}
	else
	{
		_div_setStyleProperty(this.divname+'-in',this.browser_prefix+'transform','translateX('+translateTo+'px)');
	}
	
	
	if(this.scaleFactor!=1.0)
	{
		_div_setStyleProperty(this.divname+'image-'+index,this.browser_prefix+'transform','scale(1.0)');
	}

	if(this.currentIndex!=index)
	{
		if(this.scaleFactor!=1.0)
		{
			_div_setStyleProperty(this.divname+'image-'+this.currentIndex,this.browser_prefix+'transform','scale('+this.scaleFactor+')');
		}
		
		if(this.minOpacity!=1.0)
		{ 
			_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'opacity',this.minOpacity);
		}
		
		_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'z-index','1');
		
		this.currentIndex = index;
	}
}


_coverflow.prototype.focusOn = function(index)
{

	var translateTo = this.frameX-index*(this.imageWidth+this.separation);

	if(this.minOpacity!=1.0)
	{ 
		_div_setStyleProperty(this.divname+'image-'+index,'opacity','1.0');
	}
	
	_div_setStyleProperty(this.divname+'image-'+index,'z-index','10');
	
	if(this.dontusetransform)
	{
		_div_setStyleProperty(this.divname+'-in','left',translateTo+'px');
	}
	else
	{
		_div_setStyleProperty(this.divname+'-in',this.browser_prefix+'transform','translateX('+translateTo+'px)');
	}
	
	
	if(this.scaleFactor!=1.0)
	{
		_div_setStyleProperty(this.divname+'image-'+index,this.browser_prefix+'transform','scale(1.0)');
	}

	if(this.currentIndex!=index)
	{
		if(this.scaleFactor!=1.0)
		{
			_div_setStyleProperty(this.divname+'image-'+this.currentIndex,this.browser_prefix+'transform','scale('+this.scaleFactor+')');
		}
		
		if(this.minOpacity!=1.0)
		{ 
			_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'opacity',this.minOpacity);
		}
		
		_div_setStyleProperty(this.divname+'image-'+this.currentIndex,'z-index','1');
		
		this.currentIndex = index;
	}

}


_coverflow.prototype.animateTo = function(toIndex)
{
	// Calculs préliminaires

	if(this.animating)
	{
		clearInterval(this.animation_timer);
		this.animation_timer = null;
		this.animating=false;
	}
	
	this.animating_nSteps = this.animation_duration / this.animation_timeUnit;
	
	this.animating_fromIndex = this.currentIndex;
	this.animating_toIndex = toIndex;
	
	_div_setStyleProperty(this.divname+'image-'+this.animating_fromIndex,'z-index','1');
	_div_setStyleProperty(this.divname+'image-'+this.animating_toIndex,'z-index','3');
	
	this.animating_fromPosition = -this.animating_fromIndex*(this.imageWidth+this.separation);
	this.animating_toPosition = -toIndex*(this.imageWidth+this.separation);
		
	this.animating_distance = this.animating_toPosition-this.animating_fromPosition;
	
	this.animating = true;
	
	this.animation_timer = setInterval( "_coverflow.instances["+this.id+"].animate()", 1000*this.animation_timeUnit);

	this.currentIndex = toIndex;
}


_coverflow.prototype.animate = function()
{	
	var newPosition = 0;

	var scalingValue = 1.0;
	var invScalingValue = 1.0;
	
	var opacity = 1.0;
	var invOpacity = 0.0;
	
	if(this.animating_step < this.animating_nSteps)
	{
		newPosition = Math.round(_animation_interpolatedValue(this.animating_fromPosition,this.animating_toPosition,this.animating_step,this.animating_nSteps,'smooth'));

		scalingValue = this.scaleFactor - (this.scaleFactor-1.0) * this.animating_step / this.animating_nSteps;
		scalingValue = scalingValue.toFixed(2);
		
		invScalingValue = 1.0 + (this.scaleFactor-1.0) * this.animating_step / this.animating_nSteps;
		invScalingValue = invScalingValue.toFixed(2);
					
		opacity = _animation_interpolatedValue(this.minOpacity,1.0,this.animating_step,this.animating_nSteps,'smooth');		
		opacity = opacity.toFixed(2);
		
		invOpacity = _animation_interpolatedValue(1.0,this.minOpacity,this.animating_step,this.animating_nSteps,'smooth');
		invOpacity = invOpacity.toFixed(2);
		
		//alert(opacity+'/'+invOpacity);		
	
	}
	else
	{
		clearInterval(this.animation_timer);
		this.animation_timer = null;
	
		newPosition = this.animating_toPosition;
		invScalingValue = this.scaleFactor;
		scalingValue = 1.0;
		
		opacity = 1.0;
		invOpacity = this.minOpacity;
		
		this.animating_step = 0;
		this.animating = false;
		
		this.currentIndex = this.animating_toIndex;
	}
	
	//alert('newPosition='+newPosition);
	
	//_div_setStyleProperty(this.divname+'-in',this.browser_prefix+'transform','translateX('+newPosition+'px)');
	_div_setStyleProperty(this.divname+'-in','left',newPosition+'px');
	
	if(!this.dontusetransform)
	{
		_div_setStyleProperty(this.divname+'image-'+this.animating_toIndex,this.browser_prefix+'transform','scale('+scalingValue+')');
		_div_setStyleProperty(this.divname+'image-'+this.animating_fromIndex,this.browser_prefix+'transform','scale('+invScalingValue+')');
	}

	_div_setOpacity(this.divname+'image-'+this.animating_toIndex,opacity);
	_div_setOpacity(this.divname+'image-'+this.animating_fromIndex,invOpacity);


	this.animating_step++;
}


_coverflow.prototype.translateTo = function(position,ratio)
{	
	alert('translateTo');

	var scalingValue = 1.0;
	var invScalingValue = 1.0;
	
	var opacity = 1.0;
	var invOpacity = 0.0;
	
	newPosition = position;

	scalingValue = this.scaleFactor - (this.scaleFactor-1.0) * ratio;
	scalingValue = scalingValue.toFixed(2);
		
	invScalingValue = 1.0 + (this.scaleFactor-1.0) * ratio;
	invScalingValue = invScalingValue.toFixed(2);
					
	opacity = _animation_interpolatedValueFromRatio(this.minOpacity,1.0,ratio,'smooth');		
	opacity = opacity.toFixed(2);
		
	invOpacity = _animation_interpolatedValueFromRatio(1.0,this.minOpacity,ratio,'smooth');
		invOpacity = invOpacity.toFixed(2);



	//_div_setStyleProperty(this.divname+'-in','left',newPosition+'px');
	_div_setStyleProperty(this.divname+'-in',this.browser_prefix+'transform','translateX('+newPosition+'px)');
	
	if(!this.dontusetransform)
	{
		_div_setStyleProperty(this.divname+'image-'+this.draggingToIndex,this.browser_prefix+'transform','scale('+scalingValue+')');
		_div_setStyleProperty(this.divname+'image-'+this.draggingFromIndex,this.browser_prefix+'transform','scale('+invScalingValue+')');
	}

	_div_setOpacity(this.divname+'image-'+this.draggingToIndex,opacity);
	_div_setOpacity(this.divname+'image-'+this.draggingFromIndex,invOpacity);

}




//-->
