﻿// ATTENTION, doit tourner sur ie < 9 !
	
/*
*	TODO
*		- méthode permettant de définir que le imageScroller s'adapte aux dimensions du container (owner)
*	
*/

/*
*	- 2010.09.30
*		- ajout prop : 'fillOwnerViewport' : [bool] - indique si l'imageScroller remplit le viewport du container (owner)
*
*/


	function img_mOver(e) {
		var ev = (!e) ? event : e;
		var el = null;
		el = (!ev.target) ? ev.srcElement : ev.target;
		el.src = el.getAttribute('overImg');
	}

	function img_mOut(e) {
		var ev = (!e) ? event : e;
		var el = null;
		el = (!ev.target) ? ev.srcElement : ev.target;
		el.src = el.getAttribute('refImg');
		
	}
	
	
	function img_mClick(e) {
		var ev = (!e) ? event : e;
		var el = null;
		el = (!ev.target) ? ev.srcElement : ev.target;
		
		var href = el.getAttribute('action');
		//href = (href.indexOf('javascript:') == 0) ? href.substring(11) : 'window.open(\'' + href + '\', \'foo\');';
		
		if(href.indexOf('javascript:') == 0) {
			eval(href.substring(11));
		}
		else {
			window.open(href, '');
		}
		
		
	}


	/**
	*	soit : var imgS = new ImageScroller('idScrollerACreer', idDuParentOuParent, xmlcontent);
	*	soit : var imgS = new ImageScroller('idScrollerACreer', idDuParentOuParent, xmlcontent, x, y, width, height);	// avec x et y relatifs au parent (owner)
	*	
	*/
	//function ImageScroller(id, owner, xmlcontent, x, y, w, h) {
	//function ImageScroller(id, owner, xmlcontent, x, y, w, h, fillOwnerViewport) {
	function ImageScroller(id, owner, xmlcontent, x, y, w, h) {
		
		var _fillViewport = false;
		if(arguments.length == 3) {
			_fillViewport = true;
			
		}
		else if(arguments.length == 7) {
			_fillViewport = false;
			
		}
		
		
		this.id = (id != null) ? id : 'imgScroller';
		this.owner = (owner != null && owner.length != null && owner.length > 0) ? $e(owner) : (owner != null) ? owner : document.body;
		
		this._ct = $new('div');
		this.x = (x != null && !isNaN(x)) ? parseInt(x) : 0;
		this.y = (y != null && !isNaN(y)) ? parseInt(y) : 0;
		this.width = ((w != null && !isNaN(w)) ? parseInt(w) : 320);
		this.height = ((h != null && !isNaN(h)) ? parseInt(h) : 200);
		
		this._dec = null;
		this._tab = new Array();		// array imgs
		this._timer = null;
		this._pos = 0;
		//this._val = 0;
		// 2010.09.30
		this._val = -2;
		this._delay = 500;
		this._oui = true;
		this._ct.style.cssText = 'position:relative; display:inline-block; overflow:hidden; left:' + this.x + 'px; top:' + this.y + 'px; width:' + this.width + 'px; height:' + this.height + 'px;';
		var xel = (xmlcontent.nodeType == 9) ? xmlcontent.documentElement : xmlcontent;
		var imgs = xel.getElementsByTagName('img');
		var nbImg = imgs.length;
		var tmpImg = null;
		this._dec = parseInt(this._ct.style.left) + parseInt(this._ct.style.width) / 2; // position horizontale au centre de la boîte;
		
		
		var self = this;
		
		var imgOv = null;
		var tmpW, tmpH;
		
		// imgs
		for (i = 0; i < nbImg; i++) {
			tmpImg = imgs[i];
			
			this._tab[i] = new Image();
			this._tab[i].src = tmpImg.getAttribute('src');
			this._tab[i].setAttribute('title', tmpImg.getAttribute('tooltip'));
			this._tab[i].style.cssText = 'cursor: pointer; position:absolute; display:none;';
			
			
			
			// 2010.10.01
			
			imgOv = tmpImg.getAttribute('overImg');
			imgOv = (imgOv != null && imgOv.length != null && imgOv.length > 0) ? imgOv : '';
			if(imgOv.length > 0) {
			
				this._tab[i].setAttribute('overImg', imgOv);
				this._tab[i].setAttribute('refImg', tmpImg.getAttribute('src'));
				
				//this._tab[i].setAttribute('onMouseOver', 'img_mOver(this);');
				//this._tab[i].setAttribute('onMouseOut', 'img_mOut(this);');
				
				this._tab[i].onmouseover = function(e) {
					img_mOver(e);
				};	//('onMouseOver', 'img_mOver(this);');
				this._tab[i].onmouseout = function(e) {
					img_mOut(e);
				};	//setAttribute('onMouseOut', 'img_mOut(this);');
				
				
				
				
			}
			
			
			
			
			// imgOv = tmpImg.getAttribute('overImg');
			// imgOv = (imgOv != null && imgOv.length != null && imgOv.length > 0) ? imgOv : '';
			// if(imgOv.length > 0) {
				// this._tab[i].setAttribute('onmouseover', 'this.src =\'' + imgOv + '\'');
				// this._tab[i].setAttribute('onmouseout', 'this.src =\'' + tmpImg.getAttribute('src') + '\'');
			// }
			
			// 2010.09.30	->	fix bug image.height vaux 0 (tant que pas entiérement chargée !?, même si dans le dom
			//tmpH =  (this._tab[i].height == null || this._tab[i].height == 0) ? tmpImg.getAttribute('imgHeight') : this._tab[i].height;
			tmpH =  (this._tab[i].height != null && this._tab[i].height > 0) ? this._tab[i].height : tmpImg.getAttribute('imgHeight');
			if(tmpH == 0) {
				
			}
			this._tab[i].height = tmpH;
			
			
			tmpW =  (this._tab[i].width != null && this._tab[i].width > 0) ? this._tab[i].width : tmpImg.getAttribute('imgWidth');
			if(tmpW == 0) {
				
			}
			this._tab[i].width = tmpW;
			
			var href = tmpImg.getAttribute('href');
			//href = (href.indexOf('javascript:') == 0) ? href.substring(11) : 'window.open(\'' + href + '\', \'foo\');';
			//this._tab[i].setAttribute('onclick', href);
			this._ct.appendChild(this._tab[i]);
			//this._tab[i].setAttribute('onclick', href);
			
			this._tab[i].setAttribute('action', href);
			this._tab[i].onclick = function(e) {
				img_mClick(e);
			}
			
			
		}
		this.owner.appendChild(this._ct);
		
		
		// 2010.09.30	-> on tient compte de fillOwnerViewport si présent..
		//var _fillViewport = (fillOwnerViewport != null) ? fillOwnerViewport : false;
		if(_fillViewport) {	// attention, this._ct doit être en position relative...
			this._ct.style.left = 0;
			this._ct.style.top = 0;
			this._ct.style.width = '100%';
			this._ct.style.height = '100%';
			
			this.x = 0;
			this.y = 0;
			this.width = this.owner.clientWidth;
			this.height = this.owner.clientHeight;
		}
		
		this._ct.onmousemove = associateWithEvent(this, '_speed');
		
		
		// 2010.09.30
		//var self = this;
		
		if(this._ct.addEventListener) {
			
			this._ct.addEventListener('mouseover', function(e) {
				self._timer = clearTimeout(self._timer);
				self._timer = null;
			}, false);
			
			this._ct.addEventListener('mouseout', function(e) {
				self._timer = setTimeout(Get_RefFonction(self, '_go'), self._delay);
			}, false);
			
			window.addEventListener('resize', function(e) {
				self.width = self.owner.clientWidth;
				self._ct.style.width = self.width + 'px';
			}, false);
		}
		else if(this._ct.attachEvent) {
			this._ct.attachEvent('onmouseover', function(e) {
				self._timer = clearTimeout(self._timer);
				self._timer = null;
			});
			
			this._ct.attachEvent('onmouseout', function(e) {
				self._timer = setTimeout(Get_RefFonction(self, '_go'), self._delay);
			});
			
			window.attachEvent('onresize', function(e) {
				self.width = self.owner.clientWidth;
				self._ct.style.width = self.width + 'px';
			});
			
		}
		else {
			this._ct.onmouseover = function(e) {
				self._timer = clearTimeout(self._timer);
				self._timer = null;
			};
			
			this._ct.onmouseout = function(e) {
				self._timer = setTimeout(Get_RefFonction(self, '_go'), self._delay);
			};
			
			window.onresize = function(e) {
				self.width = self.owner.clientWidth;
				self._ct.style.width = self.width + 'px';
			};
			
		}
		
		
		this._ct.style.display = "block";
		for (i in this._tab) {
			this._tab[i].style.left = this._pos + 'px';
			this._tab[i].style.top = (this._ct.clientHeight - this._tab[i].height) / 2 + 'px';
			this._tab[i].style.display = "inline";
			this._pos += this._tab[i].width;
		}
		this._go();
	}
	
	
	ImageScroller.prototype.start = function() {
		this._go();
	}
	
	ImageScroller.prototype.stop = function() {
		this._timer = clearTimeout(this._timer);
	}
	
	
	
	ImageScroller.prototype._go = function() {
		for (i in this._tab) {
            var lf = parseInt(this._tab[i].style.left);
            var w = this._tab[i].width;
            this._tab[i].style.left = lf + this._val + "px";
            if (lf > this._pos - w) {
                this._tab[i].style.left = lf - this._pos + "px"
            };
            if (lf < this._ct.clientWidth - this._pos) {
                this._tab[i].style.left = lf + this._pos + "px"
            };
        }
        this._timer = setTimeout(Get_RefFonction(this, '_go'), this._delay);
	}
	
	ImageScroller.prototype._speed = function(e) {
		//var el = (!e) ? event.clientX : e.pageX;
		var el = (!e) ? event.clientX : e.pageX;
        if (el >= this._dec) {
            this._delay = this._ct.clientWidth / 2 + 2 - (el - this._dec); 
			this._val = 2 // val=déplacement
        } 
        else {
            this._delay = this._ct.clientWidth / 2 - 1 - (this._dec - el); 
			this._val = -2 // val=déplacement
        }; 
		// 2010.09.30 (tests)
		this._val = -2;
	}
	
	
	ImageScroller.prototype.setPosition = function(x, y) {
		this.x = x;
		this.y = y;
		this._ct.style.left = x + 'px';
		this._ct.style.top = y + 'px';
	}
	
	
	ImageScroller.prototype.setSize = function(w, h) {
		this.width = w;
		this.height = h;
		this._ct.style.width = w + 'px';
		this._ct.style.height = h + 'px';
		
		// redraw all !! (img, maj prop...)
		var nbi = this._tab.length;
		for(var i = 0; i < nbi; i++) {
			this._tab[i].style.top = (this._ct.clientHeight - this._tab[i].height) / 2 + "px";
		}
	}
	
	
	
	
	
	// utils
	
	function $e(id) {
		return document.getElementById(id);
	}
	
	function $new(tag) {
		return document.createElement(tag);
	}
	
	/*
	Utility method to associate an object with an event.
		Usage Note: 	Suppose a class A has a method doSomething which needs to be called
			onclick event of a DOMElement. Then you will write
			domElement.onclick = associateWithEvent(this, "doSomething");
		@param obj		The object instance on which has to be associated with an event.
		@param methodName	The method to be called on that object.
	*/
	function associateWithEvent(obj, methodName)	{
		return (function(e)	{
			e = e || window.event;
			e = e ? e : null;
			return obj[methodName](e, this);
		});
	}
	
	function Get_RefFonction( o_, fct_){
		return( function(){o_[ fct_]()});
	}
	
	
		
	function Ajax()
	{
		this.xhr = null;
		this.method = 'get';
		this.async = true;
		this.allowLocalStatus = true;
		this.updateTime = -1;
		this.onComplete = null;
		this.onDownload = null;
		this.onError = null;
		this.body = null;
		//return this;
	}

	Ajax.prototype.request = function(url, onComplete, onDownload, onError)
	{
		this.xhr = getXhr();
		this.onComplete = onComplete ? onComplete:null;
		this.onDownload = onDownload ? onDownload:null;
		this.onError = onError ? onError:null;
		this.xhr.open(this.method, url, this.async);
		this.xhr.setRequestHeader('Content-type','text/xml; charset=iso-8859-1');
		
		var that = this;
		this.xhr.onreadystatechange = function ()
		{
			
			if(that.xhr.readyState == 3 && that.onDownload) that.onDownload(that.xhr);
			if(that.xhr.readyState == 4 && (that.xhr.status == 200 || that.xhr.status == 0))
			{
				if(that.onComplete) that.onComplete(that.xhr);
			}
			else if(that.xhr.readyState == 4 && (that.xhr.status < 200 || that.xhr.status >= 300))
			{
				if(that.onError) that.onError(that.xhr);
			}
		}
		this.xhr.send(this.body);
	}

	Ajax.loadXml = function(url)
	{
		var xhr = getXhr();
		if (window.XMLHttpRequest)
		{
			xhr.open('get',url,false);
			xhr.send(null);
			return xhr.responseXML;
		}
		else if (window.ActiveXObject)
		{
			xhr.async=false;
			xhr.load(url);
			return xhr;
		}
		alert("Error loading document");
		return null;
	}

	Ajax.loadText = function(url)
	{
		var xhr = getXhr();
		xhr.open('get', url, false);
		xhr.send(null);
		return xhr.responseText;
	}


	function getXhr()
	{
		if (window.XMLHttpRequest) return new XMLHttpRequest();
		if (window.ActiveXObject)
		{
			var names = ['Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.3.0', 'Msxml2.XMLHTTP', 'Microsoft.XMLHTTP'];
			for(var i = 0; i < names.length; ++i) 
			{
				try{ return new ActiveXObject(names[i]); }
				catch(e){}
			}
		}
		alert("XMLHttpRequest is not supported.\nXMLHttpRequest n'est pas supporté.");
		return null;
	}

	// Indique si Ajax est supporté ou non
	Ajax.isSupported = function() {
		var supported = false;
		if (window.XMLHttpRequest) supported = true;
		else if(window.ActiveXObject)
		{
			var names = ['Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.3.0', 'Msxml2.XMLHTTP', 'Microsoft.XMLHTTP'];
			for(var i = 0; i < names.length; ++i) 
			{
				var axo;
				try{ 
					axo = new ActiveXObject(names[i]); 
					supported = true;
					break;
				}
				catch(e){}
			}
		}
		return supported;
	}


