// ============================================================= 
//          ===== Composite Parallax Diaporama  ===== 
// script written by Gerard Ferrandez - June, 2009 
// http://www.dhteumeuleu.com 
// ------------------------------------------------------- 
// in association with Gabriel Uribe 
// credit all photos & GFX content 
// http://www.crealpha.fr 
// ============================================================= 
 
 
var m3D = function () { 
	/* ---- private vars ---- */ 
	var imagesPath = "./images/"; 
	var composDef  = []; 
	var compos     = []; 
	var pos        = 0; 
	var nbrCompos  = 0; 
	var nbrImages  = 0; 
	var loadedImg  = 0; 
	var xm         = 0; 
	var ym         = 0; 
	var nw         = 0; 
	var nh         = 0; 
	var nx         = 0; 
	var ny         = 0; 
	var obak       = ""; 
	var scr, structure; 
	/* ---- Easing function ---- */ 
	var Ease = function () { 
		this.target = 0; 
		this.position = 0; 
	} 
	Ease.prototype.move = function (target, speed) { 
		this.position += (target - this.position) * speed; 
	} 
	/* ---- camera setup ---- */ 
	var camera = { 
		x : new Ease(), 
		y : new Ease(), 
		focalLength : 300 
	} 
	/* ==== composite image Constructor ==== */ 
	var Compo3D = function (i, p) { 
		/* ---- insert HTML element ---- */ 
		if (p[0] == "text") { 
			/* ---- text ---- */ 
			this.img = document.getElementById(p[4]).cloneNode(true); 
			this.img.className = "txt"; 
			this.img.style.zIndex = 1; 
			this.wt = true; 
		} else { 
			/* ---- image ---- */ 
			this.img = document.createElement('img'); 
			this.img.className = "img"; 
			this.img.src = imagesPath + p[0] + (p[0].indexOf(".") > 0 ? "" : ".png"); 
			if (i >= 0) nbrImages++; 
		} 
		scr.appendChild(this.img); 
		this.ims = this.img.style; 
		if (i < 0) { 
			/* ---- particles ---- */ 
			this.particle = true; 
			this.active   = true; 
		} else { 
			this.moving = true; 
			if (p[6] * 1 == 1) this.originFountain = true; 
			this.active = false; 
			this.startDelay = Math.round(i * (100 / structure.length)); 
		} 
		/* ---- slide in ---- */ 
		var sx = p[1] * 20 * (p[7] || 1); 
		var sy = p[2] * 5 * (p[7] || 1); 
		/* ---- 3D variables ---- */ 
		this.point3D = { 
			x  : sx, 
			y  : sy, 
			z  : p[3] * 1, 
			x0 : p[1] * 1, 
			y0 : p[2] * 1, 
			z0 : p[3] * 1, 
			vx : sx - p[1] * 1, 
			vy : sy - p[2] * 1, 
			vz : 0, 
			w  : 0, 
			h  : 0, 
			zi : (p[8] || 0) * 1 
		} 
		/* ---- variables ---- */ 
		this.id      = i; 
		this.xs      = 1; 
		this.i       = 0; 
		this.frm     = 0; 
		this.timeout = 0; 
		this.loading = true; 
		this.loaded  = false; 
		/* --- lissajou --- */ 
		if (p[9] || p[10]) { 
			this.lx  = p[9] * 1; 
			this.ly  = p[10] * 1; 
			this.sx  = p[11] * 1; 
			this.sy  = p[12] * 1; 
			this.rx  = p[13] * 1 || (Math.random() * Math.PI); 
			this.lis = true; 
		} 
	} 
	/* ==== Particles animation ==== */ 
	/*Compo3D.prototype.animParticle = function () { 
		var p = this.point3D; 
		if (!this.initParticle) { 
			this.initParticle = true; 
			this.life = Math.random() * 200; 
		} 
		var a = .5 / this.life--; 
		p.x  += p.vx; 
		p.y  += p.vy; 
		p.z  += p.vz; 
		p.vx += (Math.random() * 50 - 25) * a; 
		p.vy += (Math.random() * 50 - 25) * a; 
		p.vz += -Math.random() * a; 
		if (this.life < 0) { 
			p.x = p.x0; 
			p.y = p.y0; 
			p.z = p.z0; 
			this.life = 200; 
			p.vx = 0; 
			p.vy = 0; 
			p.vz = 0; 
		} 
	} */
	/* ==== 3D parallax Animation ==== */ 
	Compo3D.prototype.animate = function () { 
		if (this.loaded) { 
			if (this.active) { 
				var p = this.point3D; 
				/* ---- move to position ---- */ 
				if (this.moving) { 
					if (this.frm <= 100) { 
						this.i += this.xs; 
						p.x -= (p.vx * this.i * .0004); 
						p.y -= (p.vy * this.i * .0004); 
						if (this.i == 50) this.xs = -1; 
					} else { 
						p.x = p.x0; 
						p.y = p.y0; 
						this.moving = false; 
						/* ---- particles origin ---- */ 
						if (this.originFountain) { 
							for (var i = 0; i < compos.length; i++) { 
								var o = compos[i]; 
								if (o.particle) { 
									o.point3D.x0 = p.x0; 
									o.point3D.y0 = p.y0; 
									o.point3D.z0 = p.z0; 
								} 
							} 
						} 
						/* --- kill object --- */ 
						/*if (this.remove) { 
							scr.removeChild(this.img); 
							return false; 
						} */
					} 
				} 
				/* ---- parallax ---- */ 
				var x = p.x + camera.x.position; 
				var y = p.y + camera.y.position; 
				var scale = camera.focalLength / (camera.focalLength + p.z); 
				x *= scale; 
				y *= scale; 
				/* ---- lissajou ---- */ 
				if (this.lis) { 
					x += Math.sin(this.frm * this.sx) * this.lx; 
					y += Math.sin(this.rx + this.frm * this.sy) * this.ly; 
				} 
				/* ---- positioning ---- */ 
				this.ims.left = Math.round((-camera.x.position * .9) + x + nw - p.w) + 'px'; 
				this.ims.top  = Math.round((-camera.y.position * .9) + y + nh - p.h) + 'px'; 
				this.frm++; 
			} else { 
				/* ---- delay ---- */ 
				this.startDelay--; 
				if (this.startDelay < 0) this.active = true; 
			} 
		} else { 
			if (this.loading) { 
				/* ---- Image loaded ---- */ 
				if (this.img.complete) { 
					if (!this.particle) loadedImg++; 
					this.loading = false; 
					this.point3D.w = this.img.width * .5; 
					this.point3D.h = this.img.height * .5; 
					this.img.style.zIndex = 1; 
					//this.img.style.zIndex = Math.round(1000 - (this.particle ? -1000 : (this.point3D.z0 + this.point3D.zi))); 
				} 
				this.timeout++; 
			} 
			if (loadedImg == nbrImages) { 
				/* ---- Composition loaded ---- */ 
				loaded = true; 
				for (var i = 0; i < compos.length; i++) { 
					var o = compos[i]; 
					o.loaded = true; 
					o.loading = false; 
					if (o.remove) { 
						o.frm = 0; 
						o.moving = true; 
					} 
				} 
			} 
			if (this.timeout > 1000) { 
				this.remove = true; 
				this.img.style.display = "none"; 
				nbrImages--; 
			} 
		} 
		return true; 
	} 
	/* ==== position html ==== */ 
	var position = function (param) { 
		var i = 0, o; 
		while( o = param[i++] ) { 
			var id = document.getElementById(o[0]) || o[0]; 
			if (o.length > 3) { 
				id.style.width  = Math.round(o[3]) + "px"; 
				id.style.height = Math.round(o[4]) + "px"; 
			} 
			id.style.left = Math.round(o[1]) + "px"; 
			id.style.top  = Math.round(o[2]) + "px"; 
		} 
	} 
	/* ==== Inject new structure ==== */ 
	var loadStructure = function (pos) { 
		structure = composDef[pos].split(";"); 
		for (var i = 0; i < structure.length; i++) { 
			var p = structure[i].replace(/^\s+/g,'').replace(/\s+$/g,'').split(","); 
			if (p != "") compos.push(new Compo3D(i, p)); 
		} 
	} 
	
	/* ==== Initialize image structures ==== */ 
	var initScript = function () { 
		/* --- create particles --- */ 
		/*for (var i = 0; i < 40; i++) 
			compos.push(new Compo3D(-1, [ 
				Math.random()>.7 ? "sphere_moy_v3" : "sphere_min_v3", -999, -999, 0, '', '', 1 
			])); */
		/* --- decode HTML structure --- */ 
		var d = document.getElementById("data"); 
		if (d) { 
			nbrCompos = 0; 
			for (var i = 0, k = 0; i < d.childNodes.length; i++) { 
				if (d.childNodes[i].nodeType == 1) { 
					var c = composDef[nbrCompos++] = d.childNodes[i].innerHTML; 
					/* ---- color ---- */ 
					c = c.split(";"); 
					c = c[c.length - 2].split(','); 
					if (obak == "") obak = c[c.length - 1]; 
				} 
			} 
		} 
		/* --- load first compo --- */ 
		loadStructure(0); 
	} 
	//////////////////////////////////////////////////////////////////////////// 
	/* ==== DOM events ==== */ 
	function addEvent (o, e, f) { 
		if (window.addEventListener) o.addEventListener(e, f, false); 
		else if (window.attachEvent) r = o.attachEvent('on' + e, f); 
	} 
	/* ==== screen position and dimensions ==== */ 
	function resize() { 
		/* --- resize --- */ 
		//var h = Math.max(200, Math.min(700, document.body.offsetHeight)); 
		//var w = Math.max(320, Math.min(1000, document.body.offsetWidth)); 
		var h = 700; 
		var w = 1000; 
		nx = Math.round(30 + (document.body.offsetWidth - w) * .5); 
		ny = Math.round(50 + (document.body.offsetHeight - h) * .5); 
		nw = (w - 60) * .5; 
		nh = (h - 100) * .5; 
		/* --- borders --- */ 
		position([ 
			[scr, nx, ny, w - 60, h - 100]
			]); 
		return false; 
	} 
	/* ==== browser events ==== */ 
	var initEvents = function () { 
		/* ---- mouse move ---- */ 
		addEvent(scr, 'mousemove', function (e) { 
			if (window.event) e = window.event; 
			xm = e.clientX; 
			ym = e.clientY; 
		}); 
		/* ---- screen resize ---- */ 
		resize(); 
		addEvent(window, 'resize', resize); 
		scr.onselectstart = function () { return false; } 
		scr.ondrag        = function () { return false; } 
		scr.ondblclick    = function () { return false; } 
	} 
	//////////////////////////////////////////////////////////////////////////// 
	/* ==== main loop ==== */ 
	var run = function () { 
		/* --- move camera --- */ 
		camera.x.move(xm - nw - nx, .1); 
		camera.y.move(ym - nh - ny, .1); 
		/* --- loop through images --- */ 
		var i = 0, o; 
		while( o = compos[i++] ) { 
			//if (o.particle) o.animParticle(); 
			if (!o.animate()) compos.splice(--i, 1); 
		} 
		/* --- loop --- */ 
    	setTimeout(run, 16); 
	} 
	return { 
		//////////////////////////////////////////////////////////////////////////// 
		/* ==== initialize script ==== */ 
		init : function () { 
			addEvent(window, 'load', function () { 
				/* ---- init script ---- */ 
				if (!document.getElementById('ie6')) { 
					scr = document.getElementById("screen"); 
					initEvents(); 
					initScript(); 
					run(); 
				} 
			}); 
		}, 
		/* ---- extrenal access ---- */ 
		button : function (o, src, i) { 
			if (i != pos) { 
				o.src = document.getElementById(src).src; 
			} 
		}, 
		next : function () { 
			transition(); 
		}, 
		goto : function (p) { 
			if (p != pos) transition(p + 1); 
		} 
	} 
}(); 
 
/* ==== start script ==== */ 
m3D.init();