/************************************************* 
 *	 		Yet Another Pano Viewer   			 *
 *                                               *
 * Documentation et aide disponible sur mon site *
 *	- Site Web : http://astre.henri.free.fr      *
 *                                               *
 *************************************************/

function $(id)
{
	return document.getElementById(id);
}

/***************************
 *	Définition de Yapv  *
 ***************************/ 

function Yapv(identifiant) 
{	
	// variables de Yapv
	this.pic           = "url(pano/pano0.jpg)"; // nom du fichier image sous la forme url(pano/pano0.jpg)
	this.width         = 640;                   // largeur du panorama (pas du fichier jpeg)
	this.height        = 480;                   // hauteur du panorama (pas du fichier jpeg)
	this.identifiant   = identifiant;           // identifiant du div contenant le panorma
	this.dec           = 0;                     // decalage initial du panorama
	this.stepSize      = 20;                    // pas de decalage en pixel
	this.quickness     = 40;                    // intervalle de temps entre chaque decalage en ms
	this.panoWidth     = 5200;                  // largeur du panorama en pixel (recalculé automatiquement)
	this.panoHeight    = 480;                   // hauteur du panorama en pixel (recalculé automatiquement)
	this.actif         = 0;
	this.angle         = 0;                     // angle correspondant à la rotation du panorama
	this.autoRotate    = false;
	this.div           = $(identifiant);        // div qui contient le panorama
	this.mouseX        = 0;
	this.maxSpeed      = 2;
	this.loaded        = false;
	this.tabLoad       = new Array();
	
	//méthodes de Yapv
	this.getCssProperty   = Yapv_getCssProperty; // permet d'initialiser Yapv avec les propriétés CSS
	this.refresh          = Yapv_refresh;        // permet de déplacer le panorama et de 
	this.startMoveLeft    = Yapv_startMoveLeft;  // permet de lancer moveLeft  à intervalle régulier
	this.startMoveRight   = Yapv_startMoveRight; // permet de lancer moveRight à intervalle régulier
	this.moveLeft         = Yapv_moveLeft;       // permet de déplacer le panorama vers la gauche
	this.moveRight        = Yapv_moveRight;      // permet de déplacer le panorama vers la droite
	this.stopMove         = Yapv_stopMove;       // permet de stopper le mouvement du panorama
	this.getAngle         = Yapv_getAngle;       // permet de récupérer l'angle correspondant à la rotation du panorama
	this.setAngle         = Yapv_setAngle;       // permet de faire tourner le panorama d'un certain angle
	this.setQuickness     = Yapv_setQuickness;   // permet de spécifier l'intervalle de temps en ms entre chaque déplacement du panorama (réglage de la fluidité)
	this.setStepSize      = Yapv_setStepSize;    // permet de spécifier de combien de pixel se déplace le panorama à chaque déplacement
	this.getPanoWidth     = Yapv_getPanoWidth;   // donne la largeur du fichier image du panorama 
	this.getPanoHeight    = Yapv_getPanoHeight;  // donne la hauteur du fichier image du panorama
	this.getWidth         = Yapv_getWidth;       // donne la largeur du div de la zone panoramique
	this.getHeight        = Yapv_getHeight;      // donne la hauteur du div de la zone panoramique
	this.getShift         = Yapv_getShift;
	this.setShift         = Yapv_setShift;
	this.getStepSize      = Yapv_getStepSize;	
	this.getQuickness     = Yapv_getQuickness;
	this.setAutoRotate    = Yapv_setAutoRotate;
	this.setMaxSpeed      = Yapv_setMaxSpeed;
	this.getMousePos      = Yapv_getMousePos;
	this.addElementToLoad = Yapv_addElementToLoad;
	this.buildHtml        = Yapv_buildHtml;
	this.launch           = Yapv_launch;
	this.tryLaunch        = Yapv_tryLaunch;	
	this.destroy          = Yapv_destroy;
	this.getCssProperty();
}

/*************************
 *	méthodes de Yapv    *
 *************************/ 

function Yapv_addElementToLoad(type, variable) {
	this.tabLoad.push({t: type, v: variable});
}

function Yapv_buildHtml() {
	this.scrollWidth = this.width/3;
	this.div.innerHTML  = '<div id="'+this.identifiant+'scrollLeft" onmousemove=\"'+this.identifiant+'.getMousePos(event);\" onmouseover=\"'+this.identifiant+'.startMoveLeft();\"  onmouseout="'+this.identifiant+'.stopMove();" style=\"float: left;  height: '+this.height+'px; width: '+this.scrollWidth+'px; margin-bottom: 0px;\"></div>';
	this.div.innerHTML += '<div id="'+this.identifiant+'scrollRight" onmousemove=\"'+this.identifiant+'.getMousePos(event);\" onmouseover=\"'+this.identifiant+'.startMoveRight();\" onmouseout="'+this.identifiant+'.stopMove();" style=\"float: right; height: '+this.height+'px; width: '+this.scrollWidth+'px; margin-bottom: 0px;\"></div>';
	
	var scrollLeft = $(this.identifiant+'scrollLeft');
	//this.scrollLeftOffset  = scrollLeft.offsetLeft; 
	this.scrollLeftOffset = 0;

	while (scrollLeft.offsetParent){
		this.scrollLeftOffset += scrollLeft.offsetLeft;
		scrollLeft     = scrollLeft.offsetParent;
	}

	var scrollRight = $(this.identifiant+'scrollRight');
	//this.scrollRightOffset  = scrollRight.offsetLeft; 
	this.scrollRightOffset = 0;

	while (scrollRight.offsetParent){
		this.scrollRightOffset += scrollRight.offsetLeft;
		scrollRight     = scrollRight.offsetParent;
	}
}

function Yapv_launch()
{
	var local_this = this;
	if (arguments.length > 0)
		local_this.actif = setInterval(function(){local_this.tryLaunch(1);}, local_this.quickness); 	
	else
		local_this.actif = setInterval(function(){local_this.tryLaunch();}, local_this.quickness); 
}

function Yapv_tryLaunch()
{
	for (var i=0; i<this.tabLoad.length; ++i) 
	{	
		switch (this.tabLoad[i].t)
		{
			default :
			case 'pic': if (this.tabLoad[i].v.complete == false) return false; 
						 break;
			case 'var': if (this.tabLoad[i].v == false) return false;
						 break;
		}
	}
	this.panoWidth  = this.pano.width;
	this.panoHeight = this.pano.height;
	if (arguments.length == 0)
		this.buildHtml();
	this.loaded = true;
	clearInterval(this.actif);
	this.refresh();	
}

function Yapv_getCssProperty() {
	this.width  = parseInt(this.div.style.width);
	this.height = parseInt(this.div.style.height);
	
	if (this.div.style.backgroundPosition) 
		this.dec = parseInt(this.div.style.backgroundPosition); 
	else 
		this.dec = 0;
		
	var panoUrl   = extractUrl(this.div.style.backgroundImage);
	this.pano     = new Image;
	this.pano.src = panoUrl; 
	this.addElementToLoad('pic',this.pano);
}

function Yapv_refresh() {
	if (this.loaded)
		this.angle = (360 - (this.dec * 360 / this.panoWidth)) % 360;
	this.div.style.backgroundPosition = this.dec+'px 0px';
	if (this.onstatechange)
		this.onstatechange();
}

function Yapv_startMoveLeft() {
	if (this.autorotate)
		return;
		
	if (arguments.length > 0) {
		var speed = arguments[0];
		var local_this = this;
		local_this.actif = setInterval(function(){local_this.moveLeft(speed);}, local_this.quickness); 
	}
	else {
		var local_this = this;
		local_this.actif = setInterval(function(){local_this.moveLeft();}, local_this.quickness); 
	}
} 

function Yapv_startMoveRight() {
	if (this.autorotate)
		return;

	if (arguments.length == 1) {
		var speed = arguments[0];
		var local_this = this;
		local_this.actif = setInterval(function(){local_this.moveRight(speed);}, local_this.quickness); 
	}
	else if (arguments.length == 2) {
		/*alert('mode auto...'+arguments[0]);*/
		this.autorotate = true;
		var speed = arguments[0];
		var local_this = this;
		local_this.actif = setInterval(function(){local_this.moveRight(speed);}, local_this.quickness); 
	}
	else {
		var local_this = this;
		local_this.actif = setInterval(function(){local_this.moveRight();}, local_this.quickness); 
	}
}

function Yapv_moveLeft() {
	if (arguments.length > 0) 
		var speed = arguments[0];
	else {
		var relativeX = this.mouseX - this.scrollLeftOffset;
		var speed = (1-relativeX/this.scrollWidth)*this.maxSpeed;
	}
	this.dec = parseInt((this.dec + this.stepSize*speed + this.panoWidth) % this.panoWidth);
	this.refresh();
}

function Yapv_moveRight() {
	if (arguments.length > 0) 
		var speed = arguments[0];
	else {
		var relativeX = this.mouseX - this.scrollRightOffset;
		var speed = (relativeX/this.scrollWidth)*this.maxSpeed;
	}
	this.dec = parseInt((this.dec - this.stepSize*speed + this.panoWidth) % this.panoWidth);
	this.refresh();
}

function Yapv_stopMove() {
this.autorotate = false;
	clearInterval(this.actif);
}

function Yapv_getAngle() {
	return this.angle;
}   

function Yapv_setAngle(angle) {
	this.angle = angle;
	this.dec = Math.round(this.panoWidth * angle / 360);
	this.refresh();
}

function Yapv_setQuickness(quickness) {
	this.quickness = quickness;
}

function Yapv_setStepSize(stepSize) {
	this.stepSize = stepSize;
}

function Yapv_getPanoWidth() {
	return this.panoWidth;
}

function Yapv_getPanoHeight() {
	return this.panoHeight;
}

function Yapv_getWidth() {
	return this.width;
}

function Yapv_getHeight() {
	return this.height;
}

function Yapv_getShift() {
	return this.dec;
}
function Yapv_setShift(shift) {
	this.dec = shift;
	this.refresh();
}

function Yapv_getQuickness(quickness) {
	return this.quickness;
}

function Yapv_getStepSize(stepSize) {
	return this.stepSize;
}

function Yapv_setAutoRotate(speed) {
	this.startMoveRight(speed,1);
}

function Yapv_setMaxSpeed(speed) {
	this.maxSpeed = speed;
}

function Yapv_getMousePos(e) {
	if (!e) { //IE  
		var e = window.event
	}
	if (e.pageX) { //Moz
		this.mouseX = e.pageX; 
	}
	else if (e.clientX) { //IE
		this.mouseX = e.clientX-2; 
	}
}

function Yapv_destroy() {
	this.div.innerHTML = "";
}

/****************************************
 *	Ajout de fonctionnalités à Yapv    *
 ****************************************/ 

Yapv.prototype.loadPano     = Yapv_loadPano;     // permet de changer l'image du panorama

function Yapv_loadPano(panoUrl)
{
	this.loaded = false;
	this.div.style.backgroundImage = 'url('+panoUrl+')';
	this.pano = new Image;
	this.pano.src = panoUrl; 
	this.addElementToLoad('pic',this.pano);
	this.launch(1);
}

/***************
 *    DEBUG    *
 ***************/ 
 
function addDebug(trace)
{
	var debug = $('debug');
	debug.innerHTML += trace+'<br />\n';
}

function clearDebug()
{
	var debug = $('debug');
	debug.innerHTML = "";
}

//permet de transformer "url(pano/pano0.jpg)" en "pano/pano0.jpg"
function extractUrl(strIn) {
	var strOut = strIn.substring(4,strIn.length-1);

	if (strOut.charAt(0) == '"') //Merci Opera... d'utiliser : url("pano/pano0.jpg") ;-(
		strOut = strOut.substring(1,strOut.length-1);
	
	return strOut;
}