/* Hints ============================================================== */

	/* KashmaNiaC.com.au 2010 uses many 'hints' which are activated by Javascript. Instead of relying on frameworks
	such as MooTools and JQuery, I decided to develop my own with which to 'animate' and give depth to the web site.
	As a result here is one of my first classes for new site which is still in the Alpha stages.
	
	This hints script has been designed to interface with Mouvement, a small and efficient javascript animation
	library also created by me for use on my 2010 website. You can find the source at:
	
	kashmaniac.com/scripts/mouvement.js
	
	© Kashi Samaraweera 2009 | KashmaNiaC.com.au

	*/

function Hint(bodyString) {
	this.id = 0;
	this.element = null;
	this.mouvement = null;
	this.parentElement = null;
	this.pageRel = "";
	
	this.hover = false;
	this.parentHover = false;
	
	this.display = {
		"x": 0,
		"y": 0,
		"width": 0,
		"height": 0,
		"visible": false,
		"orientation": "topLeft"
	}
	
	this.bodyString = (bodyString == undefined)? "" : bodyString;

	this.showHint = function() {
		var evt = window.event || arguments.callee.caller.arguments[0];
		this.parentElement = evt.target || evt.srcElement;

		if (document.getElementById("hint" + this.id) == undefined) { // If we haven't already created this hint, create it as so...
			this.constructHint();
		}
		this.element = this.mouvement.domElement;

		this.element.style.visibility = "hidden";
		this.element.style.display = "block";
		this.element.style.width = this.display.width + "px";
		this.display.height = this.element.clientHeight;
		
		this.display.x = (this.parentPosition()[0] - this.display.width) - 60;
		this.display.y = (this.parentPosition()[1] - this.display.height);	
		
//		this.element.style.left = this.display.x + "px";
//		this.element.style.top = this.display.y + "px";	
		Page.snapMove(this.mouvement, this.display.x , this.display.y);
		
		this.element.style.visibility = "visible";
		this.display.visible = true;

		this.mouvement.alpha(100, .35);
		
		var elementId = this.mouvement.index;
		
		if (!this.parentElement.attachEvent) {
			this.parentElement.addEventListener('mouseout', hintShow = function(event) {hideHint(elementId);}, false);
		} else {
			this.parentElement.attachEvent('onmouseout', hintShow = function(event) { hideHint(elementId); });
		}
	}
	
	this.constructHint = function() {
		
		var leftHint = document.createElement("div");
		leftHint.id = "hint" + this.id;
		leftHint.className = "hint";
		
		var hintShell = document.createElement("div");
		hintShell.className = "hintShell";
		
		var hintTL = document.createElement("img");
		hintTL.className = "hintTL";
		hintTL.src = this.pageRel + "images/hintTL.png";
		hintTL.alt = "hintTopLeft";
		
		hintShell.appendChild(hintTL);
		
		var hintTop = document.createElement("div");
		hintTop.className = "hintTop";
		
		hintShell.appendChild(hintTop);
		
		var hintTR = document.createElement("img");
		hintTR.className = "hintTR";
		hintTR.src = this.pageRel + "images/hintTR.png";
		hintTR.alt = "hintTopRight";

		hintShell.appendChild(hintTR);

		var hintLeft = document.createElement("div");
		hintLeft.className = "hintLeft";

		hintShell.appendChild(hintLeft);
		
		var hintBody = document.createElement("div");
		hintBody.className = "hintBody";
			hintBody.innerHTML = this.bodyString;
				
			hintShell.appendChild(hintBody);
			
			
		var hintRight = document.createElement("div");
		hintRight.className = "hintRight";

		hintShell.appendChild(hintRight);

		var hintBL = document.createElement("img");
		hintBL.className = "hintBL";
		hintBL.src = this.pageRel + "images/hintBL.png";
		hintBL.alt = "hintBottomLeft";

		hintShell.appendChild(hintBL);
		
		var hintBottom = document.createElement("div");
		hintBottom.className = "hintBottom";

		hintShell.appendChild(hintBottom);

		var hintBR = document.createElement("img");
		hintBR.className = "hintBR";
		hintBR.src = this.pageRel + "images/hintBR.png";
		hintBR.alt = "hintBottomRight";
		
		hintShell.appendChild(hintBR);
		
		leftHint.appendChild(hintShell);
		
		document.getElementById("wholePage").appendChild(leftHint);
		if (Page != undefined) {
			this.mouvement = Page.grabItem("hint" + this.id);	
			this.mouvement.display.alpha = 0;
		}

/*		if (!this.parentElement.attachEvent) {
			this.parentElement.addEventListener('mouseover', hintShow = function(event) {showHint();}, false);
		} else {
			this.parentElement.attachEvent('onmouseover', hintShow = function(event) {showHint(); });
		}*/
	}
	
	this.hideHint = function(hideElement) {
		if (hideElement == undefined) {
			hideElement = this.element;
		} else {
			hideElement = document.getElementById(hideElement);
		}
		
		this.mouvement.alpha(0, .85);
		this.mouvement.resize(1,1,.75);
		
		/*hideElement.style.display = "none";
		hideElement.visible = false;*/
	}
	
	this.parentPosition = function() {
		var left = 0;
		var top = 0;
		
		var element = this.parentElement;

		try {
			if (element.offsetParent != null) {
				do {
					left += element.offsetLeft;
					top += element.offsetTop;
				} while (element = element.offsetParent);
			}
		} catch (ex) {}
		return [left, top];
	}
}

function hideHint(hideElement) {
	elementId = Page.elements[hideElement].domElement.id;
	Page.alpha(Page.elements[hideElement], 0, .35, 1);
	//setTimeout("document.getElementById(elementId).style.display = 'none'", 350);
}

/*
	© Kashi Samaraweera 2009 | KashmaNiaC.com.au
*/