/* ================================================================================ 
 *                         ===== ologons talantis ===== 
 * 
 * JavaScript written by Gerard Ferrandez 
 * http://www.dhteumeuleu.com 
 * Date: Fri May 14, 2010 
 * Last Update: Wednesday 9 June, 2010 22:03 CET 
 * 
 * Use under a CC-BY-NC license 
 * http://www.dhteumeuleu.com/about/license/ 
 * 
 * other credits: 
 * Inspired from http://www.daftalive.com/alive.php 
 * Images from Flickr (EVE online screen captures): 
 * http://www.flickr.com/search/?q=EVE+online&l=deriv&ct=0&mt=all&adv=1&s=int 
 * ================================================================================ */ 
 
var dp = function () 
{ 
	// private variables 
	var object = { 
			cell: [], 
			menu: [], 
			text: [] 
		}, 
		scr, imagesPath, params, fullImage, loader, 
		P, Pn, Pt, lastMenuOver, pc, backgroundImage, 
		preload, mibar, nx, ny, nw, nh, sw, sh; 
 
	/* ===== append HTML Element function ==== */ 
	var appendHTML = function (p) 
	{ 
		var i, object = document.createElement(p.tagName);   // create HTML element 
		for (i in p.attributes) object[i] = p.attributes[i]; // copy attributes 
		for (i in p.style) object.style[i] = p.style[i];     // copy style properties 
		if (p.parentNode) p.parentNode.appendChild(object);  // insert object 
		return object; 
	}; 
	/* ===== copy JS object ==== */ 
	var clone = function (obj) 
	{ 
		if (typeof(obj) != "object" || obj == null) return obj; 
		var newObj = obj.constructor(); 
		for (var i in obj) newObj[i] = clone(obj[i]); 
		return newObj; 
	} 
	/* ==== text constructor ==== */ 
	var Text = function () 
	{ 
		// text content 
		this.div = appendHTML({ 
			parentNode: scr, 
			tagName: "div", 
			attributes: 
			{ 
				className: "txt", 
				onmouseover: function () { hideLastMenu(); } 
			} 
		}); 
		this.css = this.div.style; 
	}; 
 
	Text.prototype = 
	{ 
		/* ==== start typewriter ==== */ 
		startTypewriter: function (t) 
		{ 
			this.k = 0; 
			this.html = t.id ? ( 
				document.getElementById(t.id) ? 
					document.getElementById(t.id).innerHTML : t.id + " undefined" 
			) : t.html + " "; 
			this.html = this.html.replace(/\n/g, ""); 
			this.l    = this.html.length; 
			this.css.visibility = "visible"; 
			this.css.left       = Math.round(t.x * sw) + "px"; 
			this.css.top        = Math.round(t.y * sh) + "px"; 
			this.css.width      = Math.round(t.w * sw) + "px"; 
			this.css.height     = Math.round(t.h * sh) + "px"; 
			this.div.innerHTML  = ""; 
			// typewriter loop 
			var self = this; 
			this.interval = setInterval( 
				function () { self.typeLoop(); } 
			, 32); 
		}, 
 
		/* ==== skip HTML tag ==== */ 
		skipTag: function() 
		{ 
			if (this.html.charAt(this.k) === "<") 
				this.k += this.html.slice(this.k).indexOf(">") + 1; 
		}, 
 
		/* ==== typewriter loop ==== */ 
		typeLoop: function () 
		{ 
			if (this.k <= this.l) 
			{ 
				this.skipTag(); 
				var n = this.html.slice(this.k).indexOf(" "); 
				this.k += (n >= 0) ? n : 1; 
				this.skipTag(); 
				this.div.innerHTML = this.html.slice(0, this.k++); 
			} 
			else 
			{ 
				clearInterval(this.interval); 
				this.interval = false; 
			} 
		} 
	}; 
 
	/* ==== menu constructor ==== */ 
	var Menu = function (n, p) 
	{ 
		// menu wrapper 
		this.div = appendHTML({ 
			parentNode: scr, 
			tagName: "div", 
			attributes: 
			{ 
				parent: this, 
				className: "menu", 
				onclick: function () { this.parent.click(); }, 
				onmouseover: function () { this.parent.over(); } 
			}, 
			style: { visibility: "hidden" } 
		}); 
		// Color backround 
		var bgc = appendHTML({ 
			parentNode: this.div, 
			tagName: "div", 
			attributes: { className: "menubackgroundcolor" }, 
			style: { position: "absolute" } 
		}); 
		this.bgc = bgc.style; 
		// menu container 
		this.menuDiv = appendHTML({ 
			parentNode: this.div, 
			tagName: "div", 
			attributes: 
			{ 
				parent: this, 
				className: "menucontent", 
				innerHTML: p.html, 
				onclick: function () { this.parent.click(); }, 
				onmouseover: function () { this.parent.over(); } 
			} 
		}); 
 
		this.css = this.div.style; 
		this.pageTarget = p.target; 
 
		// sub menu construction 
		if (p.submenu) 
		{ 
			this.submenuDiv = appendHTML({ 
				tagName: "div", 
				parentNode: this.div, 
				attributes: { className: "submenucontent" }, 
				style: { visibility: "hidden" } 
			}); 
 
			// title 
			if (p.submenu.title) 
			{ 
				appendHTML({ 
					parentNode: this.submenuDiv, 
					tagName: "div", 
					attributes: 
					{ 
						className: "submenutitle", 
						innerHTML: p.submenu.title, 
						onclick: function () { 
							resetLoops(); 
							Pt = P.text; 
							displayPage(); 
							return false; 
						} 
					} 
				}); 
			} 
 
			// submenu container 
			this.submenuContent = appendHTML({ 
				parentNode: this.submenuDiv, 
				tagName: "div", 
				attributes: { className: "submenu" } 
			}); 
 
			// submenu lines 
			this.menuitem = []; 
			var i = 0, o; 
			while (o = p.submenu.lines[i++]) 
			{ 
				this.menuitem.push( 
					new Submenuitem(this, o) 
				); 
			} 
		} 
	}; 
 
	Menu.prototype = 
	{ 
		/* ==== menu over ==== */ 
		over: function () 
		{ 
			if (this.pageTarget != Pn && lastMenuOver != this) 
			{ 
				hideLastMenu(); 
				lastMenuOver = this; 
				this.menuDiv.style.visibility = "visible"; 
				/* ---- flash ---- */ 
				this.c = clone(params.flash); 
				var self = this, k = 0; 
				var overflash = function () 
				{ 
					if (k++ < 12) 
					{ 
						self.fadeColor(0.2); 
						setTimeout(overflash, 32); 
					} 
					else self.fadeColor(0); 
				}; 
				overflash(); 
			} 
		}, 
 
		/* ==== menu click ==== */ 
		click: function () 
		{ 
			var t = this.pageTarget; 
			if (t !== Pn && params.page[t]) 
			{ 
				// new page 
				resetLoops(); 
				Pn = t; 
				P = params.page[t]; 
				Pt = P.text; 
				displayPage(); 
			} 
		}, 
 
		/* ==== target move ==== */ 
		move: function (i) 
		{ 
			// targets 
			this.xt = P.menuTarget[i].x; 
			this.yt = P.menuTarget[i].y; 
			this.ct = clone(P.menuBackgroundColor); 
			// init menu dimension 
			this.css.visibility = "visible"; 
			this.css.width      = this.bgc.width = Math.round(sw - 1) + "px"; 
			this.css.height     = this.bgc.height = Math.round(sh - 1) + "px"; 
			// content visibility 
			this.menuDiv.style.visibility = (this.pageTarget === Pn) ? "visible" : "hidden"; 
			if (this.submenuDiv) this.displayMenuitem(false); 
			// moving menu loop 
			var self = this; 
			this.interval = setInterval( 
				function () { self.moving(); } 
			, 32); 
		}, 
 
		fadeColor: function (speed) 
		{ 
			// transition 
			if (speed) 
			{ 
				this.c.r += (this.ct.r - this.c.r) * speed; 
				this.c.g += (this.ct.g - this.c.g) * speed; 
				this.c.b += (this.ct.b - this.c.b) * speed; 
			} 
			else this.c = clone(this.ct); 
			// HTML background color 
			this.bgc.backgroundColor = "RGB(" 
				+ Math.round(this.c.r) + "," 
				+ Math.round(this.c.g) + "," 
				+ Math.round(this.c.b) + ")"; 
		}, 
		/* ==== move ==== */ 
		moving: function () 
		{ 
			// distance to target 
			var speed = 0; 
			var dx = this.xt - this.x; 
			var dy = this.yt - this.y; 
			if (Math.abs(dx) > 0.01 || Math.abs(dy) > 0.01) 
			{ 
				// inc position 
				this.x += dx * .2; 
				this.y += dy * .2; 
				speed = 0.1; 
			} 
			else 
			{ 
				// init values 
				this.x = this.xt; 
				this.y = this.yt; 
				// stop animation 
				clearInterval(this.interval); 
				// submenu 
				if (this.submenuDiv && this.pageTarget === Pn) 
				{ 
					// display submenu 
					this.menuDiv.style.visibility = "hidden"; 
					this.displayMenuitem(true); 
				} 
			} 
			// update HTML 
			this.css.left = Math.round(this.x * sw) + "px"; 
			this.css.top  = Math.round(this.y * sh) + "px"; 
			this.fadeColor(speed); 
		}, 
 
		/* ---- show menu items ---- */ 
		displayMenuitem: function (visible) 
		{ 
			var i = 0, o, menuitem = this.menuitem; 
			while (o = menuitem[i++]) o.div.style.visibility = "hidden"; 
			this.submenuDiv.style.visibility = "hidden"; 
			if (visible) 
			{ 
				i = 0; 
				this.submenuEnabled = true; 
				var self = this; 
				var displayMenuitem = function () 
				{ 
					var o = menuitem[i++]; 
					if (o && self.submenuEnabled) 
					{ 
						o.div.style.visibility = "visible"; 
						// complementary bar colors 
						o.bar.style.background = "RGB(" + 
							Math.round((256 - P.menuBackgroundColor.r) * 0.25) + "," + 
							Math.round((256 - P.menuBackgroundColor.g) * 0.25) + "," + 
							Math.round((256 - P.menuBackgroundColor.b) * 0.25) + ")"; 
						setTimeout(displayMenuitem, 64); 
					} 
				}; 
				setTimeout(displayMenuitem, 256); 
				this.submenuDiv.style.visibility = "visible"; 
			} else this.submenuEnabled = false; 
		} 
	}; 
 
	/* ==== sub menu item constructor ==== */ 
	var Submenuitem = function (parent, p) 
	{ 
		this.parent = parent; 
		this.text = p.text; 
		this.k = 100; 
		this.fullImage = p.fullImage; 
		this.div = appendHTML({ 
			tagName: "div", 
			parentNode: parent.submenuContent, 
			attributes: 
			{ 
				className: "submenuline", 
				parent: this, 
				onclick:     function () { this.parent.click(); }, 
				onmouseover: function () { this.parent.over(); } 
			} 
		}); 
		this.bar = appendHTML({ 
			tagName: "div", 
			parentNode: this.div, 
			style: 
			{ 
				position: "absolute", 
				width: "100%", 
				height: "100%", 
				left: "100%" 
			} 
		}); 
		this.txt = appendHTML({ 
			tagName: "div", 
			parentNode: this.div, 
			attributes: 
			{ 
				innerHTML: p.html 
			}, 
			style: 
			{ 
				position: "absolute", 
				marginLeft: "10px" 
			} 
		}); 
	}; 
 
	/* ---- menu items functions ---- */ 
	Submenuitem.prototype = 
	{ 
		/* ---- select ---- */ 
		click: function () 
		{ 
			resetLoops(); 
			resetText(); 
			Pt = this.text; 
			if (this.fullImage) 
			{ 
				// display full image 
				fullImage = this.fullImage; 
				displayPage(); 
			} 
			// update text 
			else nextText(); 
		}, 
 
		/* ---- bar left ---- */ 
		over: function () 
		{ 
			mibar = this; 
			var i = 0, o; 
			while (o = this.parent.menuitem[i++]) if (o != this && !o.r) o.out(); 
			var self = this; 
			this.r = false; 
			var barLeft = function () 
			{ 
				if (self === mibar) 
				{ 
					self.bar.style.left = Math.round(self.k *= .25) + "%"; 
					if (Math.round(self.k) > 0) setTimeout(barLeft, 32); 
				} 
			}; 
			barLeft(); 
		}, 
 
		/* ---- bar right ---- */ 
		out: function () 
		{ 
			if (this.k < 100) 
			{ 
				if (this.k < 1) this.k = 1; 
				var self = this; 
				this.r = true; 
				var barRight = function () 
				{ 
					self.bar.style.left = Math.round(self.k *= 2) + "%"; 
					if (Math.round(self.k) < 100) setTimeout(barRight, 32); 
				}; 
				barRight(); 
			} 
		} 
	}; 
 
	/* ==== cell constructor ==== */ 
	var Cell = function (n, x, y) 
	{ 
		this.n  = n; 
		this.x0 = x; 
		this.y0 = y; 
		// next directions 
		this.dir = [ 
			(x - 1 >= 0 ? n - ny : n), 
			(x + 1 < nx - 1 ? n + ny : n), 
			(y - 1 >= 0 ? n - 1 : n), 
			(y + 1 < ny - 1 ? n + 1 : n) 
		]; 
 
		// fade in-out div 
		this.opc = appendHTML({ 
			parentNode: scr, 
			tagName: "div", 
			attributes: 
			{ 
				onmouseover: function () { hideLastMenu(); } 
			}, 
			style: 
			{ 
				position: "absolute", 
				filter: "alpha(opacity=100)", 
				opacity: 1, 
				background: "#000", 
				left:   Math.round(x * sw) + "px", 
				top:    Math.round(y * sh) + "px", 
				width:  Math.round(sw - 1) + "px", 
				height: Math.round(sh - 1) + "px" 
			} 
		}); 
 
		// white flash div 
		this.fla = appendHTML({ 
			parentNode: scr, 
			tagName: "div", 
			style: 
			{ 
				position: "absolute", 
				background: "#fff", 
				visibility: "hidden", 
				left:   Math.round(x * sw) + "px", 
				top:    Math.round(y * sh) + "px", 
				width:  Math.round(sw - 1) + "px", 
				height: Math.round(sh - 1) + "px" 
			} 
		}); 
 
		// grid horizontal 
		if (x == 0 && y > 0) 
		{ 
			this.hor = appendHTML({ 
				parentNode: scr, 
				tagName: "div", 
				attributes: { className: "grid" }, 
				style: 
				{ 
					top: Math.round(y * sh - 1) + "px", 
					width: nw + "px", 
					height: "1px" 
				} 
			}); 
		} 
		// grid vertical 
		if (y == 0 && x > 0) 
		{ 
			this.ver = appendHTML({ 
				parentNode: scr, 
				tagName: "div", 
				attributes: { className: "grid" }, 
				style: 
				{ 
					left: Math.round(x * sw - 1) + "px", 
					width: "1px", 
					height: nh + "px" 
				} 
			}); 
		} 
	}; 
 
	Cell.prototype = 
	{ 
		/* ==== crossbrowser opacity function ==== */ 
		opacity: function (alpha) 
		{ 
			if (this.opc.filters && this.opc.filters.alpha) 
			{ 
				// redefine function for IE<9 
				Cell.prototype.opacity = function (alpha) 
				{ 
					this.opc.filters.alpha.opacity = Math.round(alpha); 
				}; 
				this.opacity(alpha); 
			} 
			else 
			{ 
				// redefine function for CSS3 
				Cell.prototype.opacity = function (alpha) 
				{ 
					this.opc.style.opacity = alpha * 0.01; 
				}; 
				this.opacity(alpha); 
			} 
		}, 
 
		/* ==== display image ==== */ 
		displayCell: function () 
		{ 
			// mark cell as displayed 
			this.displayed = true; 
			// flash 
			this.fla.style.visibility = "visible"; 
			// fading loop 
			var self = this; 
			this.interval = setInterval( 
				function () { self.displayCellLoop(); } 
			, 32); 
		}, 
 
		/* ==== display cell loop ==== */ 
		displayCellLoop: function () 
		{ 
			var o; 
			if (this.alpha !== this.alphaTarget) 
			{ 
				// opacity 
				this.alpha += this.step; 
				this.opacity(this.alpha); 
				// find next cell 
				if (this.alpha === this.nextCell) 
				{ 
					var i = 0, 
						s = false; 
					while (i++ < 8) 
					{ 
						o = object.cell[ 
							this.dir[Math.floor(Math.random() * 4)] 
						]; 
						// cell is available 
						if (!o.displayed) 
						{ 
							o.displayCell(); 
							s = true; 
							break; 
						} 
					} 
					if (!s) 
					{ 
						// find new starting point 
						o = startingCell(); 
						if (o !== false) o.displayCell(); // next cell 
						else this.startNext = true; // the end 
					} 
				} 
				// stop flash 
				if (this.alpha === this.endFlash) this.fla.style.visibility = "hidden"; 
				if (this.startNext && this.alpha === this.nextStep) 
				{ 
					// start typeWriter 
					if (this.txt && (this.id || this.html)) object.text[pc].startTypewriter(this); 
					// next phase 
					if (P.text[pc] && !fullImage) nextText(); 
				} 
			} 
			else 
			{ 
				// stop animation loop 
				clearInterval(this.interval); 
				this.interval = false; 
				this.fla.style.visibility = "hidden"; 
			} 
		} 
	}; 
 
	/* ==== return random available cell ==== */ 
	var startingCell = function () 
	{ 
		var o, i = 0, avail = []; 
		while (o = object.cell[i++]) if (!o.displayed) avail.push(o); 
		if (!avail.length) return false; // no available cell 
		else 
		{ 
			// return random available cell 
			return avail[ 
				Math.floor(Math.random() * avail.length) 
			]; 
		} 
	}; 
 
	/* ==== initialize cells ==== */ 
	var initCell = function (p, fx, txt) 
	{ 
		var i = 0, o; 
		while (o = object.cell[i++]) 
		{ 
			// is Cell active 
			if (o.x0 >= p.x && o.x0 <= (p.x + p.w - 1) && 
				o.y0 >= p.y && o.y0 <= (p.y + p.h - 1)) 
			{ 
				// copy variables 
				o.displayed = false; 
				o.startNext = false; 
				o.id = false; 
				o.txt = txt; 
				for (var j in p)  o[j] = p[j]; 
				for (var k in fx) o[k] = fx[k]; 
			} 
		} 
	}; 
 
	/* ==== reset text ==== */ 
	var resetText = function () 
	{ 
		// reset text containers 
		pc = 0; 
		var i = 0, o; 
		while (o = object.text[i++]) 
		{ 
			o.div.innerHTML = ""; 
			o.css.visibility = "hidden"; 
		} 
		// reset opacity 
		i = 0; 
		while (o = object.cell[i++]) 
		{ 
			o.t = true; 
			o.opacity(0); 
		} 
	}; 
 
	/* ==== display next bloc text ==== */ 
	var nextText = function () 
	{ 
		var o = Pt[pc++]; 
		if (o) 
		{ 
			initCell(o, params.fadeout, true); 
			o = startingCell(); 
			o.displayed = true; 
			o.displayCell(); 
		} 
	}; 
 
	/* ==== menu mouse out ==== */ 
	var hideLastMenu = function () 
	{ 
		if (lastMenuOver) 
		{ 
			lastMenuOver.menuDiv.style.visibility = "hidden"; 
			lastMenuOver = false; 
		} 
	}; 
 
	/* ==== reset setIntervals ==== */ 
	var resetLoops = function () 
	{ 
		if (preload) { 
			clearInterval(preload); 
			preload = false; 
		} 
		var i, j, k, o; 
		for (j in object) 
		{ 
			k = object[j]; 
			i = 0; 
			while (o = k[i++]) 
			{ 
				if (o.interval) 
				{ 
					// stop loop 
					clearInterval(o.interval); 
					o.interval = false; 
					// stop flash 
					if (o.fla) o.fla.style.visibility = "hidden"; 
				} 
			} 
		} 
	}; 
 
	/* ==== images display sequence ==== */ 
	var displayPage = function () 
	{ 
		var i, j, m, o; 
		// reset 
		lastMenuOver = false; 
		resetText(); 
		if (!fullImage) 
		{ 
			// move Menus 
			i = 0; 
			while (o = object.menu[i]) o.move(i++); 
			// background images 
			var img = P.backgroundImage; 
		} 
		else 
		{ 
			// full Image 
			var img = fullImage; 
			// hide Menus 
			i = 0; 
			while (o = object.menu[i++]) o.css.left = "-1000px"; 
		} 
		// preload image 
		var timeout    = params.timeout; 
		var preloadImg = new Image(); 
		preloadImg.src = imagesPath + img; 
		/* ---- loading function ---- */ 
		var preloading = function () 
		{ 
			if ((preloadImg.complete && preloadImg.width) || timeout === 0) 
			{ 
				// load complete - hide loader 
				loader.innerHTML = ""; 
				loader.style.visibility = "hidden"; 
				// hide image 
				var i = 0, o; 
				while (o = object.cell[i++]) 
				{ 
					o.opacity(100); 
					if (fullImage) 
					{ 
						// close full image 
						o.opc.style.cursor = "pointer"; 
						o.opc.onclick = function () 
						{ 
							resetLoops(); 
							fullImage = false; 
							Pt = P.text; 
							displayPage(); 
						} 
					} 
					else 
					{ 
						o.opc.style.cursor = "default"; 
						o.opc.onclick = null; 
					} 
 
				} 
				// display background image 
				var css = backgroundImage.style; 
				if (timeout > 0) 
				{ 
					backgroundImage.src = imagesPath + img; 
					css.left = Math.round((nw - preloadImg.width) * 0.5) + "px"; 
					css.top  = Math.round((nh - preloadImg.height) * 0.5) + "px"; 
					css.visibility = "visible"; 
				} 
				else css.visibility = "hidden"; 
				setTimeout(function() { 
					// display image 
					initCell( 
						{ 
							x: 0, 
							y: 0, 
							w: nx, 
							h: ny 
						}, 
						params.fadein, false 
					); 
					// random starting point 
					o = startingCell(); 
					o.displayed = true; 
					o.displayCell(); 
				}, 64); 
			} 
			else 
			{ 
				// waiting 
				timeout--; 
				if (timeout < params.timeout - 3) 
				{ 
					// display ajax loader 
					loader.style.visibility = "visible"; 
					loader.innerHTML = (params.timeout - timeout - 3); 
				} 
				preload = setTimeout(preloading, 64); 
			} 
		}; 
		preloading(); 
	}; 
 
	//////////////////////////////////////////////////////////////////////////// 
 
	/* ==== screen dimensions ==== */ 
	var resize = function () 
	{ 
		nw = scr.offsetWidth; 
		nh = scr.offsetHeight; 
		sw = Math.round(nw / nx); 
		sh = Math.round(nh / ny); 
	}; 
 
	/* ==== init script ==== */ 
	var init = function (p) 
	{ 
		var k, i, j, o; 
		params = p; 
		scr = document.getElementById(p.containerID); 
		nx = p.gridX; 
		ny = p.gridY; 
		imagesPath = p.imagesPath; 
		Pn = 0; 
		P  = p.page[Pn]; 
		Pt = P.text; 
		resize(); 
		// create background image 
		backgroundImage = appendHTML({ 
			parentNode: scr, 
			tagName: "img", 
			style: 
			{ 
				position: "absolute", 
				visibility: "hidden" 
			} 
		}); 
		// ajax loader 
		loader = appendHTML({ 
			parentNode: scr, 
			tagName: "div", 
			attributes: { id: "loader" }, 
			style: { visibility: "hidden" } 
		}); 
		// create cells 
		k = 0; 
		for (i = 0; i < nx; i++) 
		{ 
			for (j = 0; j < ny; j++) 
			{ 
				object.cell.push( 
					new Cell(k++, i, j) 
				); 
			} 
		} 
		// create txt objects 
		for (i = 0; i < 6; i++) 
		{ 
			object.text.push( 
				new Text() 
			); 
		} 
		// create menu objects 
		i = 0; 
		while (o = p.menu[i]) 
		{ 
			object.menu.push( 
				new Menu(i++, o) 
			); 
		} 
		// load first page 
		setTimeout( 
			function () { displayPage(); } 
		, 250); 
	}; 
	return { 
		// initialize script 
		init : init 
	} 
}();