
var mooHotspot = new Class({	
	originalLeft : 0,
	originalTop : 0,
	actualLeft :0,
	actualTop :0,
	id :"",
	
	initialize: function(_id,_originalLeft,_originalTop, options) {
		this.setOptions(options);
		this.originalLeft = _originalLeft;
		this.originalTop = _originalTop;
		this.id = _id;
	},
	moveHSTo : function(_left,_top){
		this.actualLeft = _left;
		this.actualTop = _top;
		$(this.id).setStyle('left',this.actualLeft+"px");
		$(this.id).setStyle('top',this.actualTop+"px");
		
	}
});
var mooPanorama = new Class({	
	offsetPanorama:0,
	oldOffsetPanorama:0,
	elMaster:null,
	elMasterid:null,
	timerMaster:-1,
	nbElement:0,
	nbElementThumb:0,
	activeIndex:-1,
	tabEffectsFadeIn:[],
	scrollPosition:0,
	idExt:null,
	box:null,
	isThumbing:false,
	fxScroll:null,
	boxHotSpotCat :null,
	mooLoopVisitauto:null,
	boxHotSpot :null,
	loadingHS : false,
	TipsHS : null,
	options: {
		info_secondaire:null,
		showPanoramaIndex:0,
		widthMax:"100%",
		heightMax:"400px",
		tabImg:[],
		showoverflowX : false,
		useHotSpot:false,
		urlHotSpot:null,
		durationAttenteAutoSlide:8000,
		durationEffectOpacity:2000,
		showControls:true,
		autoSlide:false,
		autoSlideMethod:"fade",
		autoPlay:false,
		autoPlayStep:2,
		autoPlaySens:"left",
		durationAutoPlay:100,
		enableDrag : true,
		xStart:0,
		yStart:0,
		xDelta:0,
		yDelta:0,
		thumbSpace : 'loading_thumb_histo',
		useSecondLoadingPosition:null,
		useThumb:false
	},

		initialize: function(_el,_idExt, options) {
		
		if(!_el) {return false;}
		this.idExt = _idExt;
		try {
			this.elMaster = $(_el);
			this.elMasterId = _el;
		} catch (e) {
			this.elMaster = _el;
			this.elMasterId = _el.id;
		}
		
		
		this.setOptions(options);
		
		this.tabEffectsFadeIn = new Array();
		
		this.elMaster.setStyle('overflow','hidden');
		this.elMaster.setStyle('overflow-x','hidden');
		this.elMaster.setStyle('overflow-y','hidden');
		
		new Element('DIV', {"id":'divMain'+this.elMasterId, 
				'styles': { "display":"block","height":this.options.heightMax }
			}).injectInside(this.elMaster);
		
		
		if(this.options.useThumb){
			new Element('DIV', {"id":'divThumb'+this.elMasterId, 
				'styles': { "display":"none","height":"400px","width":"650px","overflow":"hidden visible","overflow-x":"hidden","overflow-y":"auto" }
			}).injectInside(this.elMaster);
		
			new Element('A', {"id":'mb11'+this.elMasterId, "title":lngTab[9],
				"class":"mb"+this.elMasterId ,"rel":"type:element" ,"href":"#divThumb"+this.elMasterId,"index":this.elMasterId,'styles': { "display":"none","position":"absolute","top":"50%","left":"20%" }
			}).injectInside(this.elMaster);
			
			new Element('DIV', {"title":lngTab[9],
				"class":"multiBoxDesc mb11"+this.elMasterId ,"index":this.elMasterId,'styles': { "display":"none" }
			}).setHTML(lngTab[9]).injectInside(this.elMaster);
			
			
			
			
	
		}
		new Element('DIV', {"id":'progress-main'+this.elMasterId, 
				'styles': { "display":"none",'position':'absolute','z-index':'1300','left':(this.elMaster.getPosition().x+(window.getWidth().toInt()/2)),'top':(this.elMaster.getPosition().y+(this.elMaster.getSize().size.y.toInt()/2)) }
			}).addClass('loading-progress').injectInside(this.elMaster);
		
		new Element('DIV', {"id":'progress'+this.elMasterId
			}).addClass('progress-bar').injectInside($('progress-main'+this.elMasterId));
		
		new Element('DIV', {"id":'progress-bar'+this.elMasterId 
			}).addClass('progress-bar-unit').addClass("bar").injectInside($('progress'+this.elMasterId));
			
		
		new Element('DIV', {"id":'text-loading'+this.elMasterId, 
				'styles': { "display":"block" }
			}).addClass('text-loading').injectInside($('progress-main'+this.elMasterId));
			
		new Element('DIV', {"id":'progress-anim'+this.elMasterId, 
				'styles': { "display":"block" }
			}).addClass('loading').injectInside($('progress-main'+this.elMasterId));
			
		
		var width = this.elMaster.getSize().size.x-10;		
		var height = this.elMaster.getSize().size.y;
		
		if(this.options.tabImg.length>0){
			for(var index=0; index<this.options.tabImg.length; index++) {
				this.addPanorama(this.options.tabImg[index],index,width,height);
				if(this.options.showPanoramaIndex==index){
					this.showPanorama(this.options.showPanoramaIndex,"fade");
					
				}
			}
			
		}
		if(this.options.showPanoramaIndex>-1)
			this.activeIndex = this.options.showPanoramaIndex;
		else
			this.activeIndex = 0;
			
		
		if(this.options.autoSlide)
			this.clipMyPanorama();
		else if(this.options.autoPlay)
			this.playPanorama(this.activeIndex);
		this.options.enableDrag = false;
		this.box = new MultiBox('mb'+this.elMasterId, {"descClassName": 'multiBoxDesc', "height":'400px', "width":'700px',"useOverlay":true});
		window.addEvent('resize',this.resizeWindow.bind(this));
	},
	resizeWindow : function(){
		var width = this.elMaster.getSize().size.x-10;		
		var height = this.elMaster.getSize().size.y;	
		
		for(var index=0; index<this.nbElement; index++) {
			if($(this.elMasterId+"_element"+index)){
				$(this.elMasterId+"_element"+index).setStyle('width',width);
				$(this.elMasterId+"_element"+index).setStyle('height',height);
			}
			if(this.options.showControls){
				if($('controls-main'+this.elMasterId+index)){
					$('controls-main'+this.elMasterId+index).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x.toInt())-$('controls-main'+this.elMasterId+index).getSize().size.x.toInt()-20);
					$('controls-main'+this.elMasterId+index).setStyle('top',this.elMaster.getPosition().y+10);
				}
			}
			if(this.options.useHotSpot=="true"){
				if($('controls-mainhs'+this.elMasterId+index)){
					$('controls-mainhs'+this.elMasterId+index).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x.toInt())-$('controls-mainhs'+this.elMasterId+index).getSize().size.x.toInt()-20);
					$('controls-mainhs'+this.elMasterId+index).setStyle('top',this.elMaster.getPosition().y+10);
				}
			}
		}
		
		
	},
	showControls:function(_index){
		$('controls-main'+this.elMasterId+_index).setStyle('display','block');
	},
	showControlsHS:function(_index){
		$('controls-mainhs'+this.elMasterId+_index).setStyle('display','block');
	},
	hideControls:function(_index){
		$('controls-main'+this.elMasterId+_index).setStyle('display','none');
	},
	hideControlsHS:function(_index){
		$('controls-mainhs'+this.elMasterId+_index).setStyle('display','none');
	},
	addControls:function(_index){
		//control-start-selected
		new Element('DIV', {"id":'controls-main'+this.elMasterId+_index, 
				"index":_index,'styles': { "display":"block","position":"absolute" }
			}).addClass('controls-main').injectInside(this.elMaster);
		
		
		new Element('DIV', {"id":'divControlStart'+this.elMasterId+_index, 
				"index":_index,'styles': { "display":"block","float":"left" }
			}).addClass("control-start").setText(lngTab[5]).injectInside($('controls-main'+this.elMasterId+_index));
		
		
		new Element('DIV', {"id":'divControlStop'+this.elMasterId+_index, 
				"index":_index,'styles': { "display":"block","float":"left" }
			}).addClass("control-stop").setText(lngTab[6]).injectInside($('controls-main'+this.elMasterId+_index));
		
		new Element('DIV', {"id":'divControlMove'+this.elMasterId+_index, 
				"index":_index,'styles': { "z-index":1000,"display":"block","float":"left" }
			}).addClass("control-move").setText(lngTab[7]).injectInside($('controls-main'+this.elMasterId+_index));
		
		
		
		var fn = this;
		$('divControlStart'+this.elMasterId+_index).addEvent('click',function(){fn.playPanorama(_index);});
		
		$('divControlStop'+this.elMasterId+_index).addEvent('click',function(){fn.stopPanorama(_index);});
		$('divControlStop'+this.elMasterId+_index).addClass('control-stop-selected');
		
		$('divControlMove'+this.elMasterId+_index).addEvent('click',function(){fn.movePanorama(_index);});
		this.activeIndex = _index;
		$(this.elMasterId+"_elementint"+_index).onmousedown = this.initDrag.bind(this);
		
		
 			
		
		$('controls-main'+this.elMasterId+_index).setStyle('position',"absolute");
		$('controls-main'+this.elMasterId+_index).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x.toInt())-$('controls-main'+this.elMasterId+_index).getSize().size.x.toInt()-20);
		$('controls-main'+this.elMasterId+_index).setStyle('top',this.elMaster.getPosition().y+10);
		
		$('controls-main'+this.elMasterId+_index).setStyle('display',"none");
		$('controls-main'+this.elMasterId+_index).setStyle('z-index',1200);

		
	},
	addControlsHS:function(_index){
		//control-start-selected
		new Element('DIV', {"id":'controls-mainhs'+this.elMasterId+_index, 
				"index":_index,'styles': { "display":"block","position":"absolute" }
			}).addClass('controls-main').injectInside(this.elMaster);
		
	
		//alert(this.options.useHotSpot);
		if(this.options.useHotSpot=="true"){
			new Element('A', {"id":'divControlHS'+this.elMasterId+_index, 
				"index":_index,"href":"#mbHelpCategorie"+this.elMasterId,"rel":"width:500px,height:400px,type:element",'styles': { "z-index":1000,"display":"block","float":"left" }
			}).addClass("control-move").addClass("mb_categorie").setText("HS").injectInside($('controls-mainhs'+this.elMasterId+_index));
			var fn = this;
			
			new Element('DIV', {"id":'divControlHSDesc'+this.elMasterId+_index, 
				"index":_index,'styles': { "z-index":1000,"display":"none","float":"left" }
			}).addClass("multiBoxDesc").addClass('divControlHS'+this.elMasterId+_index).injectInside($('controls-mainhs'+this.elMasterId+_index));
		
			new Element('DIV', {"id":'divControlHSStart'+this.elMasterId+_index, 
				"index":_index,'styles': { "display":"block","float":"left" }
			}).addClass("control-start").setText(lngTab[5]).injectInside($('controls-mainhs'+this.elMasterId+_index));
		
		
			new Element('DIV', {"id":'divControlHSStop'+this.elMasterId+_index, 
					"index":_index,'styles': { "display":"block","float":"left" }
				}).addClass("control-stop").setText(lngTab[6]).injectInside($('controls-mainhs'+this.elMasterId+_index));
			
			
			
			var fn = this;
			$('divControlHSStart'+this.elMasterId+_index).addEvent('click',function(){fn.visitAuto(true);});
			
			$('divControlHSStop'+this.elMasterId+_index).addEvent('click',function(){fn.visitAuto(false);});
			$('divControlHSStop'+this.elMasterId+_index).addClass('control-stop-selected');
			
			$('divControlHS'+this.elMasterId+_index).addEvent('click',function(){fn.stopPanorama(fn.activeIndex)});
			
			window.addEvent('domready', function(){
				 
				fn.boxHotspotCat = new MultiBox('mb_categorie', {idElement:'mbHelpCategorie',descClassName: 'multiBoxDesc', useOverlay:true});
					
			});
		}
		
		var fn = this;
			$('controls-mainhs'+this.elMasterId+_index).setStyle('position',"absolute");
		$('controls-mainhs'+this.elMasterId+_index).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x.toInt())-$('controls-mainhs'+this.elMasterId+_index).getSize().size.x.toInt()-20);
		$('controls-mainhs'+this.elMasterId+_index).setStyle('top',this.elMaster.getPosition().y+10);
		if(this.options.showControls){
			$('controls-mainhs'+this.elMasterId+_index).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x.toInt())-$('controls-mainhs'+this.elMasterId+_index).getSize().size.x.toInt()-20);
			$('controls-mainhs'+this.elMasterId+_index).setStyle('top',this.elMaster.getPosition().y+30);
			
		}
		$('controls-mainhs'+this.elMasterId+_index).setStyle('display',"none");
		$('controls-mainhs'+this.elMasterId+_index).setStyle('z-index',1200);

		
	},
	
	getSizeImg : function (_path){
		// Declaration d'un objet Image
		var oImg = new Image();
		// Affectation du chemin de l'image a l'objet
		oImg.src = _path;
		var tab = new Array();
		// On recupere les tailles reelles
		tab.push( oImg.height);
		tab.push( oImg.width);
		oImg = null;
		return tab;
	},
	addPanorama : function(_src,_index,_width,_height,_description1,_description2,_img,_show){
		if(this.elMaster.hasClass('back-logo'))
			this.elMaster.removeClass('back-logo')
		this.nbElement++;
		//this.options.tabImg.push(_src);
		var found = false;
		var previousIndex = _index.toInt() -1;
		var nextIndex = _index.toInt() + 1;
		
		for(var index=0; index<$('divMain'+this.elMasterId).getChildren().length; index++) {
			if($('divMain'+this.elMasterId).getChildren()[index].getAttribute('index').toInt()>_index.toInt()){
				new Element('DIV', {"id":this.elMasterId+"_element"+_index,"index":_index,
				"styles":{"display":"none","opacity":"0",'width':_width,'height':(parseInt(_height)),'position':"absolute",'left':this.elMaster.getPosition().x,'top':this.elMaster.getPosition().y}
							}).injectInside($('divMain'+this.elMasterId).getChildren()[index]);
				found = true;
				
				break;
			}
		}
		if(!found){
			new Element('DIV', {"id":this.elMasterId+"_element"+_index,"index":_index,
			"styles":{"display":"none","opacity":"0",'width':_width,'height':(parseInt(_height)),'position':"absolute",'left':this.elMaster.getPosition().x,'top':this.elMaster.getPosition().y}
						}).injectInside($('divMain'+this.elMasterId));
		}
		if(this.options.showoverflowX){
			$(this.elMasterId+"_element"+_index).setStyle('overflow','auto');
			
			$(this.elMasterId+"_element"+_index).setStyle('overflow-y','hidden');
			$(this.elMasterId+"_element"+_index).setStyle('overflow-x','auto');
			
		}
		else{
			$(this.elMasterId+"_element"+_index).setStyle('overflow','hidden');
			$(this.elMasterId+"_element"+_index).setStyle('overflow-x','hidden');
			$(this.elMasterId+"_element"+_index).setStyle('overflow-y','hidden');
		}
		
		var src = "";
		var tabSize= new Array();
		if(!_src){
			
			src = _img.src;
			if(_img.height >0){
				tabSize.push( _img.height);
				
				tabSize.push( _img.width);
			}
			else{
				tabSize= this.getSizeImg(src);
			}
			
		}
		else{
			src = _src;
			tabSize= this.getSizeImg(src);
		}
		$(this.elMasterId+"_element"+_index).setStyle('display','none');
		
		 new Element('DIV', {"id":this.elMasterId+"_elementint"+_index,"index":_index,
		 "styles":{"display":"block",'width':tabSize[1],'height':_height,'background-image':"url("+src+")",'background-position':"0px 0px"}
					}).injectInside($(this.elMasterId+"_element"+_index));
		if(this.options.showControls){
			$(this.elMasterId+"_elementint"+_index).setStyle('background-repeat',"repeat-x");
			this.addControls(_index);
		}
		else
			$(this.elMasterId+"_elementint"+_index).setStyle('background-repeat',"no-repeat");
		
		if(this.options.useHotSpot=="true"){
			$(this.elMasterId+"_elementint"+_index).setStyle('background-repeat',"repeat-x");
			this.addControlsHS(_index);
		}
		
			
		if(_description1 || _description2)
			this.addDescription(_index,_description1,_description2);
		
		
//		this.tabEffectsFadeIn.push(new Fx.Styles($(this.elMasterId+"_element"+_index), {duration:this.options.durationEffectOpacity, wait:false}));

		
		if(_show){
			this.showPanorama(_index,"fade");
			//this.fxScroll = new Fx.Scroll($(this.elMasterId+"_elementint"+_index));
		}
		
		$(this.elMasterId+"_element"+_index).setStyle('display','none');
		_img = null;
	},
	addPanoramaThumb : function(_src,_index,_description1,_description2,_img){
		if($(this.elMasterId+"_elementthumb"+_index))
			return;
		this.nbElementThumb++;
		var found = false;
		var previousIndex = _index.toInt() -1;
		var nextIndex = _index.toInt() + 1;
		
		for(var index=0; index<$('divThumb'+this.elMasterId).getChildren().length; index++) {
			if($('divThumb'+this.elMasterId).getChildren()[index].getAttribute('index').toInt()>_index.toInt()){
				new Element('DIV', {"id":this.elMasterId+"_elementthumb"+_index,"index":_index,
				"styles":{"opacity":"1","display":"block"}
							}).injectBefore($('divThumb'+this.elMasterId).getChildren()[index]);
				found = true;
				
				break;
			}
		}
		if(!found){
		new Element('DIV', {"id":this.elMasterId+"_elementthumb"+_index,"index":_index,
		"styles":{"opacity":"1","display":"block"}
					}).injectInside($('divThumb'+this.elMasterId));
		}
		
		new Element('DIV', {"id":this.elMasterId+"_elementthumbtitre"+_index,"index":_index,"styles":{"display":"block"}
					}).setHTML(_description1).injectInside($(this.elMasterId+"_elementthumb"+_index));
		
		
		var src = "";
		var tabSize= new Array();
		if(!_src){
			src = _img.src;
			tabSize.push( _img.height);
			tabSize.push( _img.width);
		}
		else{
			src = _src;
			tabSize= this.getSizeImg(src);
		}
		var srcMain = src.substring(0,src.indexOf("_thumb.jpg"))+"_PV.jpg";
		var width = this.elMaster.getSize().size.x-10;		
		var height = this.elMaster.getSize().size.y;	
		
		new Element('A', {"id":this.elMasterId+"_elementthumbAimg"+_index,"index":_index,
		"styles":{"display":"block"},
		'href':'javascript:myMooPanoramaHisto.removeAllPanoramas();myMooPanoramaHisto.addPanoramas(new Array("'+srcMain+'"),true,new Array("'+_description1+'"),new Array("'+_description2+'"));myMooPanoramaHisto.box.close();',
		'alt':_description1,
		'title':_description1}).injectInside($(this.elMasterId+"_elementthumb"+_index));	
		
		
		
		new Element('IMG', {"id":this.elMasterId+"_elementthumbimg"+_index,"index":_index,
		"styles":{"display":"block"},
		'src':src,
		'alt':_description1,
		'title':_description1}).injectInside($(this.elMasterId+"_elementthumbAimg"+_index));		
		
		new Element('A', {"id":this.elMasterId+"_elementthumbA2img"+_index,"index":_index,
		"styles":{"display":"block"},
		'href':'javascript:myMooPanoramaHisto.removeAllPanoramas();myMooPanoramaHisto.addPanoramas(new Array("'+srcMain+'"),true,new Array("'+_description1+'"),new Array("'+_description2+'"));myMooPanoramaHisto.box.close();',
		'alt':_description1,
		'title':_description1}).setText(lngTab[8]).injectInside($(this.elMasterId+"_elementthumb"+_index));
		
		new Element('BR' ).injectInside($(this.elMasterId+"_elementthumb"+_index));		
		
		
		
		_img = null;
		
	},
	addPanoramas : function(_tabImg,_asset,_tabDescription1,_tabDescription2){
		var width = this.elMaster.getSize().size.x-10;		
		var height = this.elMaster.getSize().size.y;
		if(_asset){
			this.assetPanoramas(_tabImg,_tabDescription1,_tabDescription2);
		}
		else{
			if(_tabImg.length>0){
				for(var index=0; index<_tabImg.length; index++) {
					this.addPanorama(_tabImg[index],index,width,height,_tabDescription1[index],_tabDescription2[index]);
					if(this.options.showPanoramaIndex==index){
						this.showPanorama(this.options.showPanoramaIndex,"fade");
						
					}
				}
				
			}
			if(this.options.showPanoramaIndex>-1)
				this.activeIndex = this.options.showPanoramaIndex;
			else
				this.activeIndex = 0;
			if(this.options.useHotSpot=="true"){
					this.addHotSpot(this.options.urlHotSpot);
				}
			if(this.options.autoSlide)
				this.clipMyPanorama();
			else if(this.options.autoPlay)
				this.playPanorama(this.activeIndex);
		}
	},
	addPanoramasThumb : function(_tabImg,_asset,_tabDescription1,_tabDescription2){
		$('divThumb'+this.elMasterId).innerHTML = "";
		if(_asset){
			this.assetPanoramas(_tabImg,_tabDescription1,_tabDescription2,true);
		}
		else{
			if(_tabImg.length>0){
				for(var index=0; index<_tabImg.length; index++) {
					this.addPanoramaThumb(_tabImg[index],index,_tabDescription1[index],_tabDescription2[index]);
					
				}
				
			}
			this.showPanoramaThumb();
			
		}
	},
	assetComplete:function(i,_tabImg,_thumb,tabOImg){
		if(i==(_tabImg.length-1)){
			
			this.hideLoading();
					
			if(_thumb == true){
				this.showPanoramaThumb();
				this.isThumbing = false;
			}	
			else{
					
				if(this.options.showPanoramaIndex>-1){
					this.activeIndex = this.options.showPanoramaIndex;
				}
				else{
					this.activeIndex = 0;
				}
				if(this.options.useHotSpot=="true"){
						this.addHotSpot(this.options.urlHotSpot,i);
					}
				
				if(this.options.autoSlide){
					this.clipMyPanorama();
				}
				else if(this.options.autoPlay){
					
					this.playPanorama(this.activeIndex);
				}
				
			}
			tabOImg = null;
		}
	},
	assetProgress:function(i,_tabImg,_thumb,_image,_tabDescription1,_tabDescription2,width,height){
		if((this.options.useSecondLoadingPosition!=null) && (i>0)){
			this.setLoadingSecondPosition();
		}
		widthBar = this.getLoadingValue();
		
		percent = ((i + 1)*widthBar ) / _tabImg.length;
		mypercent = ((i+1)*100)/_tabImg.length;
		if(mypercent.toString().indexOf(".")>-1){
			mypercent = mypercent.toString().substring(0,mypercent.toString().indexOf(".")+3);
		}
		this.setLoadingValue(percent,mypercent+"%");
		
		desc1 = "";
		if((_tabDescription1)&&(_tabDescription1[i])){
			desc1 = _tabDescription1[i];
		}
		desc2 = "";
		if((_tabDescription2)&&(_tabDescription2[i])){
			desc2 = _tabDescription2[i];
		}  
		if((_thumb)&&(_thumb == true)){
			this.addPanoramaThumb(null,i,desc1,desc2,_image);
			
		}
		else{
			
			this.addPanorama(null,i,width,height,desc1,desc2,[i]);
			if(this.options.showPanoramaIndex==(i)){
				
				this.showPanorama(this.options.showPanoramaIndex,"fade");
				
			}
			
		}
		this.assetComplete(i,_tabImg,_thumb);
	},
	
	assetMyImage:function(_index,_tabImg,_tabDescription1,_tabDescription2,_thumb,tabOImg,widthBar,percent,mypercent,desc1,desc2,stepBar,stepBarLoad,width,height){
		_index =parseInt(_index);
		if(parseInt(_index)<_tabImg.length){
			/*alert(tabOImg);
			alert(_index);*/
			var OImg = new Image();
			var OImg2 = new Image();
			OImg.setAttribute("index",_index);
			OImg2.src = _tabImg[parseInt(_index)];
			if(OImg2.complete){
				var fn = this;
				OImg.src = _tabImg[parseInt(_index)];
					/*if((fn.options.useSecondLoadingPosition!=null) && (this.getAttribute("index").toInt()>0)){
						fn.setLoadingSecondPosition();
					}*/
					//widthActBar = fn.getLoadingActValue();
					stepBarLoad+=stepBar;
					mypercent = ((parseInt(stepBarLoad)*100)/widthBar);
					if(mypercent.toString().indexOf(".")>-1){
						mypercent = mypercent.toString().substring(0,mypercent.toString().indexOf(".")+3);
					}
					fn.setLoadingValue(stepBarLoad,mypercent+"%");
					
					desc1 = "";
					if((_tabDescription1)&&(_tabDescription1[OImg.getAttribute("index").toInt()])){
						desc1 = _tabDescription1[OImg.getAttribute("index").toInt()];
					}
					desc2 = "";
					if((_tabDescription2)&&(_tabDescription2[OImg.getAttribute("index").toInt()])){
						desc2 = _tabDescription2[OImg.getAttribute("index").toInt()];
					}  
					if((_thumb)&&(_thumb == true)){
						fn.addPanoramaThumb(null,OImg.getAttribute("index").toInt(),desc1,desc2,OImg);
						
					}
					else{
						
						fn.addPanorama(null,OImg.getAttribute("index").toInt(),width,height,desc1,desc2,OImg);
						if(fn.options.showPanoramaIndex==(OImg.getAttribute("index").toInt())){
							
							fn.showPanorama(fn.options.showPanoramaIndex,"fade");
							if((fn.options.useSecondLoadingPosition!=null) ){
								fn.setLoadingSecondPosition();
							}
							
						}
						
					}
					fn.assetComplete(_index,_tabImg,_thumb,OImg);
					var img = OImg;
					//var _function = new function(){
						fn.assetMyImage(parseInt(_index)+1,_tabImg,_tabDescription1,_tabDescription2,_thumb,img,widthBar,percent,mypercent,desc1,desc2,stepBar,stepBarLoad,width,height);
					//};
					//setTimeout(_function,1000);
					
				
				
			}
			else{
					/*tabOImg[_index][1] = new Image();
				tabOImg[_index][1].onload = function(_index){*/
				var fn = this;
				OImg.onload = function(){
					/*if((fn.options.useSecondLoadingPosition!=null) && (this.getAttribute("index").toInt()>0)){
						fn.setLoadingSecondPosition();
					}*/
					//widthActBar = fn.getLoadingActValue();
					stepBarLoad+=stepBar;
					mypercent = ((parseInt(stepBarLoad)*100)/widthBar);
					if(mypercent.toString().indexOf(".")>-1){
						mypercent = mypercent.toString().substring(0,mypercent.toString().indexOf(".")+3);
					}
					fn.setLoadingValue(stepBarLoad,mypercent+"%");
					
					desc1 = "";
					if((_tabDescription1)&&(_tabDescription1[this.getAttribute("index").toInt()])){
						desc1 = _tabDescription1[this.getAttribute("index").toInt()];
					}
					desc2 = "";
					if((_tabDescription2)&&(_tabDescription2[this.getAttribute("index").toInt()])){
						desc2 = _tabDescription2[this.getAttribute("index").toInt()];
					}  
					if((_thumb)&&(_thumb == true)){
						fn.addPanoramaThumb(null,this.getAttribute("index").toInt(),desc1,desc2,this);
						
					}
					else{
						
						fn.addPanorama(null,this.getAttribute("index").toInt(),width,height,desc1,desc2,this);
						if(fn.options.showPanoramaIndex==(this.getAttribute("index").toInt())){
							
							fn.showPanorama(fn.options.showPanoramaIndex,"fade");
							if((fn.options.useSecondLoadingPosition!=null) ){
								fn.setLoadingSecondPosition();
							}
							
						}
						
					}
					fn.assetComplete(_index,_tabImg,_thumb,this);
					var img = this;
					//var _function = new function(){
						fn.assetMyImage(parseInt(_index)+1,_tabImg,_tabDescription1,_tabDescription2,_thumb,img,widthBar,percent,mypercent,desc1,desc2,stepBar,stepBarLoad,width,height);
					//}
					//setTimeout(_function,1000);
					
				};
				OImg.src = _tabImg[parseInt(_index)];
			}
			
		
		}
		else{
			
			
		}
	},
	assetPanoramas:function (_tabImg,_tabDescription1,_tabDescription2,_thumb){
		if(_thumb){
			if(!this.isThumbing){
				this.isThumbing = true;
			}
			else{
				alert(lngTab[11]);
				return;
			}
		}
		var width = this.elMaster.getSize().size.x.toInt()-10;
		
		var height = this.elMaster.getSize().size.y.toInt();
		
		this.showLoading();
		var widthBar=null;
		var percent=null;
		var mypercent=null;
		var desc1=null;
		var desc2=null;
		var tabOImg = new Array();
		widthBar = this.getLoadingValue();
		var stepBar =	widthBar/_tabImg.length;
		var stepBarLoad =	0;
		for(var i=0; i<_tabImg.length; i++) {
			tabOImg.push("");
		}
		$('divMain'+this.elMasterId).Empty;
			
		this.assetMyImage(0,_tabImg,_tabDescription1,_tabDescription2,_thumb,tabOImg,widthBar,percent,mypercent,desc1,desc2,stepBar,stepBarLoad,width,height);
		/*var fn = this;
		for(var i=0; i<_tabImg.length; i++) {
			tabOImg[i] = new Image();
			tabOImg[i].setAttribute("index",i);
			tabOImg[i].onload = function(){
				//alert(oImg.getAttribute("index"));
				
			};
			//tabOImg[i][1].src = _tabImg[i];
			
			
			
			
		}*/
		
		
		
		
	},
	showPanoramaThumb:function(){
		$('mb11'+this.elMasterId).setStyle('display','block');	
		
		
		this.box.open($('mb11'+this.elMasterId));
		
		
		$('mb11'+this.elMasterId).setStyle('display','none');
	},
	setLoadingValue:function(width,_value){
		
		$('progress-bar'+this.elMasterId).setStyle('width',width);
		$('progress-bar'+this.elMasterId).setText(_value);
		
	},
	getLoadingValue:function(){
		return $('progress'+this.elMasterId).getStyle('width').toInt();
		
		
	},
	getLoadingActValue:function(){
		return $('progress-bar'+this.elMasterId).getStyle('width').toInt();
		
		
	},
	showLoading:function(){
		$('progress-main'+this.elMasterId).setStyle('left',this.elMaster.getPosition().x+(this.elMaster.getSize().size.x/2)-($('progress-main'+this.elMasterId).getSize().size.x/2)-60);
		$('progress-main'+this.elMasterId).setStyle('top',this.elMaster.getPosition().y+(this.elMaster.getSize().size.y.toInt()/2));
	
		$('progress-main'+this.elMasterId).setStyle('display',"block");
		this.setLoadingValue(0,"0%");
		
	},
	setLoadingSecondPosition : function(){
		$('progress-main'+this.elMasterId).setStyle('left',$(this.options.useSecondLoadingPosition).getPosition().x);
		$('progress-main'+this.elMasterId).setStyle('top',$(this.options.useSecondLoadingPosition).getPosition().y);
	
	},
	hideLoading:function(){
		$('progress-main'+this.elMasterId).setStyle('display',"none");
		this.setLoadingValue(0,"0%");
	},
	addDescription : function (_index,_description,_description2){
		/*new Element('DIV', {"id":this.elMasterId+"_elementint"+_index+"_desc"+_index,"index":_index,
		"styles":{"display":"block","opacity":"0.7","background-color":"#000","width":"200px","height":this.options.heightMax,"color":"#FFF","z-index":1200,"float":"left"}
					}).addClass('info-meteo').injectInside($(this.elMasterId+"_elementint"+_index));
		new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%","height":"150px"}
					}).addClass('info').setHTML(_description).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
		new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%","height":"250px"}
					}).addClass('meteo').setHTML(_description2).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
					
		*/
		var elToInjectIn;
		if(this.options.info_secondaire){
			elToInjectIn = $(this.options.info_secondaire);
			new Element('DIV', {"id":this.elMasterId+"_elementint"+_index+"_desc"+_index,"index":_index,
			"styles":{"display":"block","opacity":"0.7","height":"100%","z-index":1200,"float":"left"}
						}).addClass('info-meteo-secondaire').injectInside(elToInjectIn);
			new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%"}
						}).addClass('info-secondaire').setHTML(_description).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
			new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%"}
						}).addClass('meteo-secondaire').setHTML(_description2).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
		}
		else{
			elToInjectIn = $(this.elMasterId+"_elementint"+_index);
			new Element('DIV', {"rel":"desc"+this.elMasterId,"id":this.elMasterId+"_elementint"+_index+"_desc"+_index,"index":_index,
			"styles":{"position":"absolute","display":"block","opacity":"0","height":this.options.heightMax,"z-index":1200,"float":"left"}
						}).addClass('info-meteo').injectInside($('divMain'+this.elMasterId));
			//"position":"absolute",
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("left",$('divMain'+this.elMasterId).getPosition().x.toInt()+'px');
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("top",$('divMain'+this.elMasterId).getPosition().y.toInt()+'px');
			if(this.options.showoverflowX)
				$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("height","395px");
			else
				$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("height","400px");
			
			new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%","height":"150px"}
						}).addClass('info').setHTML(_description).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
			new Element('DIV', {"index":_index,"styles":{"display":"block","opacity":"1","width":"100%","height":"250px"}
						}).addClass('meteo').setHTML(_description2).injectInside($(this.elMasterId+"_elementint"+_index+"_desc"+_index));
			//var fn = this;
			//$(this.elMasterId+"_elementint"+_index+"_desc"+_index).onmouseenter = function(){fn.endDrag.bind(fn);this.fireEvent('onblur')};
			/*$(this.elMasterId+"_elementint"+_index+"_desc"+_index).onselectstart=function() {
			return false;
			}
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).onmousedown=function() {
			return false;
			}
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).onmouseenter=function() {
			$(fn.elMasterId+"_elementint"+_index+"_desc"+_index).selectionStart = 0;
			$(fn.elMasterId+"_elementint"+_index+"_desc"+_index).selectionEnd = 0;
			}
						
			*/
		}
		
		
	},
	removeAllPanoramasThumb: function (){
		for(var index=0; index<this.nbElementThumb; index++) {
			this.removePanoramaThumb(index);
		}
		this.nbElementThumb = 0;
		if($("divThumb"+this.elMasterId)){
			$("divThumb"+this.elMasterId).innerHTML="";
		}
		
	},
	removePanoramaThumb : function (_index){
		//
		if($(this.elMasterId+"_elementthumb"+_index)){
			$(this.elMasterId+"_elementthumb"+_index).remove();
		}
		
		this.nbElementThumb--;
		this.options.tabImg = null;
	},
	removeAllPanoramas : function (){
		for(var index=0; index<this.nbElement; index++) {
			this.removePanorama(index);
		}
		this.tabEffectsFadeIn = new Array();
		clearTimeout(this.timerMaster);
		this.nbElement = 0;
		if($('divMain'+this.elMasterId)){
			$('divMain'+this.elMasterId).innerHTML="";
		}
	},
	removePanorama : function (_index){
		//
		$(this.elMasterId+"_element"+_index).remove();
		if(this.options.showControls)
			$('controls-main'+this.elMasterId+_index).remove();
		if(this.options.useHotSpot=="true")
			$('controls-mainhs'+this.elMasterId+_index).remove();
		this.nbElement--;
		this.options.tabImg = null;
	},
	setEffect : function (_strEffect){
		this.options.autoSlideMethod = _strEffect;
	},
	setDurationClip : function (_strDuration){
		this.options.durationAttenteAutoSlide = _strDuration;
	},
	showPanorama : function(_index,_type,_duration){
		
		if(!_type)
			_type = "fade";
		if(!$(this.elMasterId+"_element"+_index))
			return false;
			
		if(this.options.showControls)
			this.showControls(_index);
		if(this.options.useHotSpot=="true")
			this.showControlsHS(_index);
			
		$(this.elMasterId+"_element"+_index).setStyle('display','block');
		
		if(_type == "fade"){
			
			
			var opa = this.options.durationEffectOpacity;
			if(_duration){
				if(opa>_duration)
					opa = _duration-100;
			}
			var fn = this;
			var myMorph2 = new Fx.Morph(this.elMasterId+"_element"+_index, {wait: false});
		    myMorph2.start('morph1');
		   /* var myMorph3 = new Fx.Morph(this.elMasterId+"_elementint"+_index+"_desc"+_index, {wait: false});
		    myMorph3.start('morph3');*/
		    $(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("opacity","0.7");
		    
			/*new Fx.Styles($(this.elMasterId+"_element"+_index), {duration:opa, wait:false}).start({
					'opacity': 1
					
				});
				/*
			new Fx.Styles($(fn.elMasterId+"_elementint"+_index+"_desc"+_index), {duration:opa, wait:false}).start({
					'opacity': 0.7
					
				});*/
			/*if((_index>-1)&&(_index<this.tabEffectsFadeIn.length)){
				this.tabEffectsFadeIn[_index].options.duration =  opa;
				this.tabEffectsFadeIn[_index].start({
					'opacity': 1
				});
			}*/
			
		}
		else{
			
			$(this.elMasterId+"_element"+_index).setStyle("opacity","1");
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("opacity","0.7");
			
		}
		
	},
	setThumbSpace : function (_id_space_thumb){
		this.options.thumbSpace = _id_space_thumb;
	},
	hidePanorama : function(_index,_type,_duration){
		if(!_type)
			_type = "fade";
		if(!$(this.elMasterId+"_element"+_index))
			return false;
		if(this.options.showControls)
			this.hideControls(_index);
		if(this.options.useHotSpot=="true")
			this.hideControlsHS(_index);
		//$(this.elMasterId+"_element"+_index).setStyle("display","block");
		if(_type == "fade"){
			var opa = this.options.durationEffectOpacity;
			if(_duration){
				if(opa>_duration)
					opa = _duration-100;
			}
			/*alert(1);
			if((_index>-1)&&(_index<this.tabEffectsFadeIn.length)){
				this.tabEffectsFadeIn[_index].options.duration =  opa;
				this.tabEffectsFadeIn[_index].start({
					'opacity': 0
				});
			}*/
			/*new Fx.Styles($(this.elMasterId+"_element"+_index), {duration:opa, wait:false}).start({
					'opacity': 0
				});*/
			var myMorph2 = new Fx.Morph(this.elMasterId+"_element"+_index, {wait: false});
		    myMorph2.start('morph2');
		   /* var myMorph3 = new Fx.Morph(this.elMasterId+"_elementint"+_index+"_desc"+_index, {wait: false});
		    myMorph3.start('morph4');*/
		    $(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("opacity","0");
		}
		else{
			$(this.elMasterId+"_element"+_index).setStyle('display','none');
			$(this.elMasterId+"_element"+_index).setStyle("opacity","0");
			
			$(this.elMasterId+"_elementint"+_index+"_desc"+_index).setStyle("opacity","0");
		}
		
		
	},
	
	
	
	clipMyPanorama : function(){
		
		if(this.activeIndex < 0)
			this.activeIndex = 0;
		if(this.activeIndex>=this.nbElement)
			this.activeIndex = 0;
		
		clearTimeout(this.timerMaster);
		if(this.nbElement == 0){
			
			
			//this.timerMaster = setTimeout(returns,this.options.durationAttenteAutoSlide);
			return;
		}
		this.options.durationAttenteAutoSlide = 2000-(parseInt($('speedValue').innerHTML))*2000/4000;//(3000-parseInt($('speedValue').innerHTML));
		if(this.options.durationAttenteAutoSlide<0)
			this.options.durationAttenteAutoSlide = 100;
		var myscrollPosition = -1;
		if($(this.elMasterId+"_element"+this.activeIndex))
			myscrollPosition = this.getScrollBarHorizontalPosition($(this.elMasterId+"_element"+this.activeIndex));
		
		this.hidePanorama(this.activeIndex,this.options.autoSlideMethod,this.options.durationAttenteAutoSlide);
		this.activeIndex++;
		
		if(this.activeIndex>=this.nbElement)
			this.activeIndex = 0;
			
		this.showPanorama(this.activeIndex,this.options.autoSlideMethod,this.options.durationAttenteAutoSlide);
		
		if((myscrollPosition!=-1)&& $(this.elMasterId+"_element"+this.activeIndex))
			this.setScrollBarHorizontalPosition(myscrollPosition,$(this.elMasterId+"_element"+this.activeIndex));
		
		if(this.nbElement == 1){
			
			
			//this.timerMaster = setTimeout(returns,this.options.durationAttenteAutoSlide);
			return;
		}
		
		
		this.timerMaster = setTimeout(this.idExt+".clipMyPanorama();",this.options.durationAttenteAutoSlide);
		
	},
	playPanorama : function(_index){
		this.options.enableDrag = false;
		this.activeIndex = _index;
		clearTimeout(this.timerMaster);
		if($('divControlStart'+this.elMasterId+_index)){
			
			$('divControlStart'+this.elMasterId+_index).removeClass("control-start");
			$('divControlStart'+this.elMasterId+_index).addClass("control-start-selected");
			
			
			$('divControlStop'+this.elMasterId+_index).removeClass("control-stop-selected");
			$('divControlStop'+this.elMasterId+_index).addClass("control-stop");
			
			$('divControlMove'+this.elMasterId+_index).removeClass("control-move-selected");
			$('divControlMove'+this.elMasterId+_index).addClass("control-move");
			$(this.elMasterId+"_elementint"+this.activeIndex).setStyle('cursor','default');
			this.playAutoPanorama(_index);
		}
	},
	moveMyPanorama : function(_index,_pas,_pointToReachStep){
		if($(this.elMasterId+"_elementint"+_index)){
			
			if(_pas){
				this.oldOffsetPanorama = this.offsetPanorama ;
				/*if(this.offsetPanorama<= -$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
					this.offsetPanorama = 0;
				}
				else if(this.offsetPanorama>=$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
					this.offsetPanorama = 0;
				}*/
				this.offsetPanorama = this.offsetPanorama%$(this.elMasterId+"_elementint"+this.activeIndex).getStyle('width').toInt()
			    
				if(this.options.autoPlaySens == "left"){
					this.offsetPanorama = parseInt(this.offsetPanorama) + parseInt(this.options.autoPlayStep) ;
				}
				else{
					this.offsetPanorama = parseInt(this.offsetPanorama) - parseInt(this.options.autoPlayStep) ;
				}
			
			}
			else if(_pointToReachStep){
				/*if(this.offsetPanorama<= -$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
					this.offsetPanorama = 0;
				}
				else if(this.offsetPanorama>=$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
					this.offsetPanorama = 0;
				}*/
				this.oldOffsetPanorama = this.offsetPanorama ;
				
				this.offsetPanorama = _pointToReachStep;
				this.offsetPanorama = (this.offsetPanorama%$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt());
				
				
			}
			$(this.elMasterId+"_elementint"+_index).setStyle('background-position',this.offsetPanorama+"px 0px");
			
		}
		return this.offsetPanorama;
	},
	playAutoPanorama : function(_index){
		
		if($(this.elMasterId+"_elementint"+_index)){
			
			this.offsetPanorama = this.moveMyPanorama(_index,true);
		
			/*if(this.offsetPanorama<= -$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
				this.offsetPanorama = 0;
			}
			else if(this.offsetPanorama>=$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt()){
				this.offsetPanorama = 0;
			}
			if(this.options.autoPlaySens = "left"){
				this.offsetPanorama = parseInt(this.offsetPanorama) + parseInt(this.options.autoPlayStep) ;
			}
			else{
				this.offsetPanorama = parseInt(this.offsetPanorama) - parseInt(this.options.autoPlayStep) ;
			}
			
		
			$(this.elMasterId+"_elementint"+_index).setStyle('background-position',this.offsetPanorama+"px 0px");
			*/
			if(this.options.useHotSpot=="true"){
		    	this.moveHotSpots(this.offsetPanorama);
		    }
			var fn = this;
			var returns = function(){
				fn.playAutoPanorama(_index);
			};
			this.timerMaster = setTimeout(returns,this.options.durationAutoPlay);
		}
	},
	stopPanorama : function(_index){
		this.activeIndex = _index;
		clearTimeout(this.timerMaster);
		if($('divControlStart'+this.elMasterId+_index)){
			$('divControlStart'+this.elMasterId+_index).removeClass("control-start-selected");
			$('divControlStart'+this.elMasterId+_index).addClass("control-start");
		}
		if($('divControlStop'+this.elMasterId+_index)){
			$('divControlStop'+this.elMasterId+_index).removeClass("control-stop");
			$('divControlStop'+this.elMasterId+_index).addClass("control-stop-selected");
		}
		if($('divControlMove'+this.elMasterId+_index)){
			$('divControlMove'+this.elMasterId+_index).removeClass("control-move-selected");
			$('divControlMove'+this.elMasterId+_index).addClass("control-move");
		}
		$(this.elMasterId+"_elementint"+this.activeIndex).setStyle('cursor','default');
		this.options.enableDrag = false;
	},
	movePanorama : function(_index){
		this.activeIndex = _index;
		clearTimeout(this.timerMaster);
		if($('divControlStart'+this.elMasterId+_index)){
			$('divControlStart'+this.elMasterId+_index).removeClass("control-start-selected");
			$('divControlStart'+this.elMasterId+_index).addClass("control-start");
		}
		if($('divControlStop'+this.elMasterId+_index)){
			$('divControlStop'+this.elMasterId+_index).removeClass("control-stop");
			$('divControlStop'+this.elMasterId+_index).addClass("control-stop-selected");
		}
		if($('divControlMove'+this.elMasterId+_index)){
			$('divControlMove'+this.elMasterId+_index).removeClass("control-move");
			$('divControlMove'+this.elMasterId+_index).addClass("control-move-selected");
		}
		$(this.elMasterId+"_elementint"+this.activeIndex).setStyle('cursor','pointer');
		this.options.enableDrag = true;
	},
	getScrollBarHorizontalPosition:function(_el){
			if(_el)
			return _el.getSize().scroll.x;	
			else
			return 0;
			
			
	},
	setScrollBarHorizontalPosition:function(_value,_el){
			
			if(_el)
			_el.scrollLeft = _value;
		
	},
	initDrag : function (event)	  {
	  	if(this.options.enableDrag == true){
  			if (!event) event = window.event;
  			    var event = new Event(event);
  			    
		    this.options.xStart = parseInt(event.client.x);
	   		this.options.yStart = parseInt(event.client.y);
	   		var container = this.elMasterId+"_elementint"+this.activeIndex;
	   		 $(container).style.backgroundPosition = (parseInt((this.offsetPanorama)) ) + 'px 0px';
	   		  
		     $(container).onmouseup = this.endDrag.bind(this);
		     $(container).onmousemove = this.drag.bind(this);
		   
	 		
	  	}
	    
	},
	drag : function(event){
  	 	if(this.options.enableDrag == true){
		  	if (!event) event = window.event;
		  	var event = new Event(event);
		  	this.options.xDelta = this.options.xStart - parseInt(event.client.x);
	   		this.options.yDelta = this.options.yStart - parseInt(event.client.y);
		     
		    this.options.xStart = parseInt(event.client.x);
		    this.options.yStart = parseInt(event.client.y);
		    
		    
		    this.oldOffsetPanorama = this.offsetPanorama ;
		    
		    this.offsetPanorama = parseInt(this.offsetPanorama) - this.options.xDelta;
		    /*if(this.offsetPanorama<= -$(this.elMasterId+"_elementint"+this.activeIndex).getStyle('width').toInt()){
				this.offsetPanorama = 0;
			}
			else if(this.offsetPanorama>=$(this.elMasterId+"_elementint"+this.activeIndex).getStyle('width').toInt()){
				this.offsetPanorama = 0;
			}*/
		    this.offsetPanorama = this.offsetPanorama%$(this.elMasterId+"_elementint"+this.activeIndex).getStyle('width').toInt()
		    var container = this.elMasterId+"_elementint"+this.activeIndex;
		    
		  	$(container).style.backgroundPosition=this.offsetPanorama+'px 0px';
		  	if(this.options.useHotSpot=="true"){
		    	this.moveHotSpots(this.offsetPanorama);
		    }
   		}
    },
    endDrag: function(event){
    	var container = this.elMasterId+"_elementint"+this.activeIndex;
    	$(container).onmouseup = null;
		$(container).onmousemove = null;
		
    	
    },
	addHotSpot:function(url,_index){
    	if(this.loadingHS == true)
    		return;
		var fn=this;
		this.loadingHS = true;
		var index=_index;
		var request = new Json.Remote(url, {
			onComplete: function(jsonObj) {
				fn.addHots(jsonObj.hotspots,index);
			}
		}).send()
	},
	addHots : function(hotspots,_index) {
		
		//alert("En cours de mise � jour");
		var fn = this;
		var cptHot = 0;
		hotspots.each(function(hotspot) {
			
			var elA = new Element('a', {'id':fn.elMasterId+"_element"+_index+'-hot-link'+cptHot, 'class':fn.elMasterId+"_element"+_index+'-hot'});
			elA.setStyle('position','absolute');
			elA.setStyle('z-index','10');
			elA.setAttribute('title',hotspot.hotspot_name);
			elA.setAttribute('rel','width:700,height:600');
			var categorie = "General";
			if(hotspot.hotspot_categorie){
				categorie = hotspot.hotspot_categorie;
			}
			elA.setAttribute('categorie',categorie);
			if(hotspot.hotspot_img_pointer && (hotspot.hotspot_img_pointer != "")){
				
				elA.setStyle('background-image',"url('"+hotspot.hotspot_img_pointer+"')");
				elA.setStyle('background-repeat',"no-repeat");
			}
			
			elA.setStyle('width',hotspot.hotspot_w.toInt()+"px");
			elA.setStyle('height',hotspot.hotspot_h.toInt()+"px");
			elA.setStyle('height',hotspot.hotspot_h.toInt()+"px");
			elA.addClass('TipsHS');
			if(!hotspot.hotspot_description){
				hotspot.hotspot_description = "_";
			}
			elA.setAttribute('title','AJAX:php/inc-popup.php?hs='+cptHot); 
			if(hotspot.hotspot_border_color)
				elA.setStyle('border',"2px solid "+hotspot.hotspot_border_color);
			elA.setAttribute('originalLeft',hotspot.hotspot_x.toInt());
			
			//elA.setAttribute('href','php/inc-popup.php?hs='+cptHot);
			
			//($(fn.elMasterId+"_element"+_index).getPosition().x.toInt()+
			elA.setStyle('left',hotspot.hotspot_x.toInt()+"px");
			elA.setStyle('top',hotspot.hotspot_y.toInt()+"px");
			
			elA.injectInside($(fn.elMasterId+"_element"+_index));
			
			/*var elDesc = new Element('div', {'id':fn.elMasterId+"_element"+_index+'-hot'+cptHot, 'class':'multiBoxDesc '+fn.elMasterId+"_element"+_index+'-hot-link'+cptHot, "styles":{}});
			elDesc.setStyle('display','none');
			elDesc.injectInside($(fn.elMasterId+"_element"+_index));
			*/
			cptHot++;
			
			
		});
		
		 window.addEvent('domready', function(){
			 fn.TipsHS = new MooTips($$('.TipsHS'), {
					evalAlways: true,		// always run the eval statement
					maxTitleChars: 500,		// very long caption
					fixed: false,			// fixed in place; note tip mouseover does not hide tip
					offsets: {'x':15,'y':15},// offset by 100,100
					fixedCenter:true,
					showOnClick: true,		// click image to show tooltip
					showOnMouseEnter: false,
					hideOnMouseLeave:false,
					classElementsName:"TipsHS",
					initialize:function(){
						this.fx = new Fx.Style(this.toolTip, 'opacity', {duration: 500, wait: false}).set(0);
					},
					onShow: function(toolTip) {
						//alert(toolTip.innerHTML);
						this.fx.start(1);
					},
					test: function() {
						
						alert(1);
					},
					onHide: function(toolTip) {
						this.fx.start(0);
					}

				});

			 
			 //fn.boxHotSpot = new MultiBox(fn.elMasterId+"_element"+_index+'-hot', {descClassName: 'multiBoxDesc', useOverlay: true, onOpen:function(){fn.stopPanorama(fn.activeIndex);}});
			/* Tips HS 
			 * 
			 * */
			
			
				
		 });
	},
	moveHotSpots:function(_offsetPanorama){
		var offsetPanorama = _offsetPanorama;
		var fn = this;
		
		$$('.'+this.elMasterId+"_element"+this.activeIndex+'-hot').each(function(hotSpot){
			var myoffsetPanorama = offsetPanorama
			if(myoffsetPanorama<0){
				myoffsetPanorama = $(fn.elMasterId+"_elementint"+fn.activeIndex).getStyle('width').toInt()+ myoffsetPanorama;
			}
			var valueToAplly = (hotSpot.getAttribute('originalLeft').toInt()+myoffsetPanorama)%$(fn.elMasterId+"_elementint"+fn.activeIndex).getStyle('width').toInt();
			hotSpot.setStyle('left',valueToAplly+"px");
			
		})
		
	},
	visitAuto:function(_start){
		
		/*if(_start){
			if(this.mooLoopVisitauto && (this.mooLoopVisitauto.running == true)){
				this.mooLoopVisitauto.stopTimer();
			}
			
			$('divControlHSStop'+this.elMasterId+this.activeIndex).removeClass('control-stop-selected');
			$('divControlHSStop'+this.elMasterId+this.activeIndex).addClass('control-stop');	
			
			$('divControlHSStart'+this.elMasterId+this.activeIndex).removeClass('control-start');
			$('divControlHSStart'+this.elMasterId+this.activeIndex).addClass('control-start-selected');
			var fn = this;
			this.mooLoopVisitauto = new mooPeriodical(true,{"forceFirstTime":true,"laps":(20000),"panoJS":this,"nbLoop":null,"valueSup":0,"onUpdateMyPeriodical": function(){
				
				
					
			}});
		}
		else{
			if(this.mooLoopVisitauto)
			this.mooLoopVisitauto.stopTimer();
			if(this.boxHotSpot && (this.boxHotSpot.opened))
    			this.boxHotSpot.close();
			$('divControlHSStart'+this.elMasterId+this.activeIndex).removeClass('control-start-selected');
			$('divControlHSStart'+this.elMasterId+this.activeIndex).addClass('control-start');	
			
			$('divControlHSStop'+this.elMasterId+this.activeIndex).removeClass('control-stop');
			$('divControlHSStop'+this.elMasterId+this.activeIndex).addClass('control-stop-selected');
		}*/
		
		if(_start){
			this.setScrollBarHorizontalPosition(0,$(this.elMasterId+"_element"+this.activeIndex));
		
			if(this.mooLoopVisitauto && (this.mooLoopVisitauto.running == true)){
				this.mooLoopVisitauto.stopTimer();
			}
			//this.TipsHS.options.fixedCenter = true;
			$('divControlHSStop'+this.elMasterId+this.activeIndex).removeClass('control-stop-selected');
			$('divControlHSStop'+this.elMasterId+this.activeIndex).addClass('control-stop');	
			
			$('divControlHSStart'+this.elMasterId+this.activeIndex).removeClass('control-start');
			$('divControlHSStart'+this.elMasterId+this.activeIndex).addClass('control-start-selected');
			var fn = this;
			this.mooLoopVisitauto = new mooPeriodical(true,{"forceFirstTime":true,"laps":(10000),"panoJS":this,"nbLoop":null,"valueSup":0,"onUpdateMyPeriodical": function(){
				
				
					
			}});
		}
		else{
			if(this.mooLoopVisitauto)
				this.mooLoopVisitauto.stopTimer();
			//this.TipsHS.options.fixedCenter = false;
			$('divControlHSStart'+this.elMasterId+this.activeIndex).removeClass('control-start-selected');
			$('divControlHSStart'+this.elMasterId+this.activeIndex).addClass('control-start');	
			
			$('divControlHSStop'+this.elMasterId+this.activeIndex).removeClass('control-stop');
			$('divControlHSStop'+this.elMasterId+this.activeIndex).addClass('control-stop-selected');
		}
	},
	moveToHotSpot:function(_indexHotSpot,_index){
		if(!_index)
			_index = this.activeIndex;
		//stop the panorama
		this.stopPanorama(this.activeIndex);
		var hotSpot = $(this.elMasterId+"_element"+_index+'-hot-link'+_indexHotSpot);
		var centerPosition = (window.getWidth().toInt()/2);
		this.offsetPanorama = (this.offsetPanorama%$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt());
		var largeToReach = 0;
		largeToReach =  -hotSpot.getAttribute('originalLeft').toInt()+centerPosition;
		largeToReach = (largeToReach%$(this.elMasterId+"_elementint"+_index).getStyle('width').toInt());
		
		
		var fn = this;
		this.offsetPanorama = this.moveMyPanorama(_index,false,largeToReach);
		this.moveHotSpots(this.offsetPanorama);
		var myLoop = new mooPeriodical(true,{"laps":(1000),"nbLoop":1,"onUpdateMyPeriodical": function(){
			//fn.TipsHS.start($(fn.elMasterId+"_element"+_index+'-hot-link'+_indexHotSpot));
			//fn.TipsHS.options.onShow.bind(fn.TipsHS, [fn.TipsHS.toolTip]);
    		//fn.boxHotSpot.open($(fn.elMasterId+"_element"+_index+'-hot-link'+_indexHotSpot));
		}});
		
	}
	
		
	
});

var MooTips = new Class({
	fx:null,
	options: { // modded for X3
		onShow: function(tip){
			tip.setStyle('visibility', 'visible');
		},
		onHide: function(tip){
			tip.setStyle('visibility', 'hidden');
		},
		showOnClick: false,
		forceOnMouseLeaveClick: false,
		showOnMouseEnter: true,
		hideOnMouseLeave: true,
		maxTitleChars: 30,
		showDelay: 100,
		hideDelay: 100,
		className: 'tool',
		classElementsName: 'Tips',//HACK MACYMED
		offsets: {'x': 16, 'y': 16},
		fixed: false,
		fixedCenter: false,//HACK MACYMED
		loadingText: 'Loading...',
		errTitle: 'Error...',
		errText: 'There was a problem retrieving the contents of this tooltip.',
		evalAlways: false
	},

	initialize: function(elements, options){
		this.setOptions(options);
		fn = this;
		this.toolTip = new Element('div', {
			'class': this.options.className + '-tip',
			'styles': {
				'position': 'absolute',
				'top': '0',
				'left': '0',
				'visibility': 'hidden'
			},
			'events': {
					'mouseenter': function(event){
						//setting state property, needed on end function
						this.setProperty('state','mouseenter');
					},
					'mouseleave': function(event){
						//setting state property, needed on end function
						if(fn.options.hideOnMouseLeave){
							this.setProperty('state','mouseleave');
							this.pather.end(event);
						}
					}
			}
		}).inject(document.body);
		
		//didn't find other way to get owner of toolTip inside toolTip
		this.toolTip.pather = this;
			
		this.wrapper = new Element('div').inject(this.toolTip);
		$$(elements).each(this.buildEvents, this);
		$$(elements).each(this.build, this);
		if (this.options.initialize) this.options.initialize.call(this);
		
		if(!this.options.hideOnMouseLeave){
			this.toolTip.setProperty('state2','close');
		}
	},
	
	buildEvents: function(el) {
		//code with errors but works
		//that's why showOnClick option is false by default
		if (this.options.showOnClick) {
			el.addEvent('click', function(event){
				if(this.options.hideOnMouseLeave){
					this.start(el);
					if(this.options.fixedCenter) this.centerIt();
					else if (!this.options.fixed) this.locate(event);
					else this.position(el);
				}
				else{
					if(this.toolTip.getProperty('state2')=='close' && !this.options.forceOnMouseLeaveClick){
						this.options.forceOnMouseLeaveClick = true;
						this.toolTip.setProperty('state2','open');
						this.start(el);
						if(this.options.fixedCenter) this.centerIt();
						else if (!this.options.fixed) this.locate(event);
						else this.position(el);
					}
					/*else{
						this.options.forceOnMouseLeaveClick = false;
						this.toolTip.setProperty('state2','close');
						this.hide(this.toolTip);
					}*/
				}
			}.bindWithEvent(this));
		}
		
		if (this.options.showOnMouseEnter) {
			el.addEvent('mouseenter', function(event){
				this.start(el);
				if(this.options.fixedCenter) this.centerIt();
				else if (!this.options.fixed) this.locate(event);
				else this.position(el);
			}.bind(this));
		}
		
		if (!this.options.fixed && !this.options.fixedCenter) el.addEvent('mousemove', this.locate.bindWithEvent(this));
		
		var end = this.end.bind(this);
		
		if(this.options.hideOnMouseLeave){
			el.addEvent('mouseleave', end);
		}
		el.addEvent('trash', end);
	},

	build: function(el){ // modded for X3
		el.$tmp.myTitle = (el.href && el.getTag() == 'a') ? el.href.replace('http://', '') : (el.rel || false);
		if (el.title){
			
			if (el.title.test('^DOM:', 'i')) { // check if we need to extract contents from a DOM element
				el.title = $(el.title.split(':')[1].trim()).innerHTML;				
			} else if (el.title.test('^AJAX:', 'i')) { // check for an URL to retrieve content from
				el.title = this.options.loadingText + '::' + el.title;
			} else if (el.title.test('^EVAL:', 'i')) { // check for a statement to eval
				el.title = this.options.loadingText + '::' + el.title;
			}
								
			var dual = el.title.split('::');
			if (dual.length > 1) {
				el.$tmp.myTitle = dual[0].trim();
				el.$tmp.myText = dual[1].trim();
			} else {
				el.$tmp.myTitle = false;
				el.$tmp.myText = el.title;
			}					
			el.removeAttribute('title');
		} else {
			el.$tmp.myText = false;
		}
		if (el.$tmp.myTitle && el.$tmp.myTitle.length > this.options.maxTitleChars) el.$tmp.myTitle = el.$tmp.myTitle.substr(0, this.options.maxTitleChars - 1) + "&hellip;";
		
		
	},
	centerIt: function(){
		if(this.options.fixedCenter){
			this.toolTip.setStyles({
				'left': (window.getWidth().toInt()-this.toolTip.getStyle('width').toInt())/2,//pos.x + this.options.offsets.x,
				'top': '50px'//pos.y + this.options.offsets.y
			});
		}
	},
	start: function(el){ // modded for X3
		this.wrapper.empty();
			
		// check if we have an AJAX request - if so, show a loading animation and launch the request		
		if (el.$tmp.myText && el.$tmp.myText.test('^AJAX:', 'i')) {
			//if (this.ajax) this.ajax.cancel();
			if(this.options.evalAlways) {
				// save original text
				el.$tmp.myEvalAlwaysText = el.$tmp.myText;
			}
			this.ajax = new Ajax (el.$tmp.myText.replace(/AJAX:/i,''), {
				onComplete: function (responseText, responseXML) {
					el.title = responseText;
					this.build(el);
					
					this.start(el);
					//HACK MACYMED
					this.centerIt();
					//FIN
					this.toolTip.setProperty('state2','open');
					}.bind(this),
				onFailure: function () {
					el.title = this.options.errTitle + '::' + this.options.errText;
					this.build(el);
					this.start(el);
					}.bind(this),
				method: 'get'
				}).request();				
			el.$tmp.myText = '<div class="' + this.options.className + '-loading">&nbsp;</div>';			
		} else if (el.$tmp.myText && el.$tmp.myText.test('^EVAL:', 'i')) {
			var tmp;
			
			if(this.options.evalAlways) {
				// save original text to reevaluate on the fly (AJAX or EVAL only)
				el.$tmp.myEvalAlwaysText = el.$tmp.myText;
			}
			try {
				eval('tmp = ' + el.$tmp.myText.replace(/EVAL:/i, '') + ';');
				var dual = tmp.split('::');
				if (dual.length > 1) {
					el.$tmp.myTitle = dual[0].trim();
					el.$tmp.myText = dual[1].trim();
				} else {
					el.$tmp.myTitle = false;
					el.$tmp.myText = tmp;
				}
			} catch(err) {
				el.$tmp.myTitle = this.options.errTitle;
				el.$tmp.myText = this.options.errText + '<br />--------<br />' + err.description;
			}
		}
	
		if (el.$tmp.myTitle){
			this.title = new Element('span').inject(
				new Element('div', {'class': this.options.className + '-title'}).inject(this.wrapper)
			).setHTML(el.$tmp.myTitle);
		}
		if (el.$tmp.myText){
			this.text = new Element('span').inject(
				new Element('div', {'class': this.options.className + '-text'}).inject(this.wrapper)
			).setHTML(el.$tmp.myText);
			
			if((this.options.evalAlways) && (el.$tmp.myEvalAlwaysText)) {
				// reset text so that it will evaluate again
				el.$tmp.myText = el.$tmp.myEvalAlwaysText;
			}
		}
		$clear(this.timer);
		
		// setting initial state of tip
		this.toolTip.setProperty('state','mouseleave');
		this.toolTip.setProperty('state2','open');
		
		this.timer = this.show.delay(this.options.showDelay, this);
	},

	end: function(event){
		$clear(this.timer);
		this.timer = this.hide.delay(this.options.hideDelay, this);
	},

	position: function(element){
		var pos = element.getPosition();
		
			this.toolTip.setStyles({
				'left': pos.x + this.options.offsets.x,
				'top': pos.y + this.options.offsets.y
			});
		
	},

	locate: function(event){
		var win = {'x': window.getWidth(), 'y': window.getHeight()};
		var scroll = {'x': window.getScrollLeft(), 'y': window.getScrollTop()};
		var tip = {'x': this.toolTip.offsetWidth, 'y': this.toolTip.offsetHeight};
		var prop = {'x': 'left', 'y': 'top'};
		for (var z in prop){
			var pos = event.page[z] + this.options.offsets[z];
			if ((pos + tip[z] - scroll[z]) > win[z]) pos = event.page[z] - this.options.offsets[z] - tip[z];
			this.toolTip.setStyle(prop[z], pos);
		};
		
	},

	show: function(){
		if (this.options.timeout) this.timer = this.hide.delay(this.options.timeout, this);
		this.fireEvent('onShow', [this.toolTip]);
	},

	hide: function(){
		// if "fixed", tooltip is only hidden when mouse leaves the tooltip (itself)
		if ((this.toolTip.getProperty('state') == 'mouseleave') || (this.toolTip.getProperty('state2') == 'close') ||(!this.options.fixed))
			this.fireEvent('onHide', [this.toolTip]);
	}
});
mooPeriodical = new Class({
	running:false,
	options: {
		onUpdateMyPeriodical:null,
		laps:null,
		nbLoop:10,
		valueSup:null,
		forceFirstTime:false,
		panoJS:null,
		cpt:0
	},
	
	initialize: function(autoStart,options){
		this.setOptions(options);
	    
	    if(autoStart)
	    	this.startTimer();
    },

    update: function(){
    	
    	//alert(this.options.onUpdateMyPeriodical);
    	this.options.onUpdateMyPeriodical();
    	if(this.options.panoJS){
    		var fn = this;
    		/*if(this.options.panoJS.boxHotSpot && (this.options.panoJS.boxHotSpot.opened))
    			this.options.panoJS.boxHotSpot.close();*/
    		//fn.TipsHS.hide($(fn.elMasterId+"_element"+_index+'-hot-link'+_indexHotSpot));
    		//fn.options.panoJS.TipsHS.toolTip.setProperty('state','mouseleave');
    		fn.options.panoJS.TipsHS.hide(fn.options.panoJS.TipsHS.toolTip);
    		
    		var myLoop = new mooPeriodical(true,{"laps":(3000),"nbLoop":1,"onUpdateMyPeriodical": function(){
    			if(!$(fn.options.panoJS.elMasterId+"_element"+fn.options.panoJS.activeIndex+'-hot-link'+fn.options.valueSup)){
        			
    				fn.options.valueSup = 0;
    			}
        		fn.options.panoJS.moveToHotSpot(fn.options.valueSup);
        		
        		fn.options.panoJS.TipsHS.start($(fn.options.panoJS.elMasterId+"_element"+fn.options.panoJS.activeIndex+'-hot-link'+fn.options.valueSup));
        		
        		//fn.options.panoJS.boxHotSpot.open($(fn.options.panoJS.elMasterId+"_element"+fn.options.panoJS.activeIndex+'-hot-link'+fn.options.valueSup));
        		fn.options.valueSup++;
        		
			}});
			
			
    	}
    	this.options.cpt++;
    	if(this.options.nbLoop){    		
    		if(this.options.nbLoop == this.options.cpt)
    			this.stopTimer();
    	}
    },

    stopTimer: function(){
    	this.running = false;
        $clear(this.periodicalTimer);

    },

    startTimer: function(){
    	this.options.cpt = 0;
    	this.running = true;
    	if(this.options.forceFirstTime){
    		this.update();
    	}
        this.periodicalTimer = this.update.periodical(this.options.laps, this);

    }

});
mooPanorama.implement(new Options,new Events);
mooPeriodical.implement(new Options,new Events);
MooTips.implement(new Events, new Options);