// JavaScript Document
/**
 * This file contains the JavaScript Class for creating Bubble Widget - display helpful tips when certain form fields are clicked
 *
 * This file contains a single JavaScript Class that provides the said 
 * functionality
 *
 * Language: JavaScript
 * Depenedancies: MooTools 1.2 Core
 *
 * @package    	autCompleter
 * @author     	ProjectMiso.net <email@projectmiso.net>
 * @version    	1.0
 * @since      	September 2007
 * @deprecated 	N/A
 * @license		Developed by ProjectMiso for ProjectMiso's internal use only. This widget may be used for developing websites
 *				for ProjectMiso's clients. In that event, ProjectMiso grants license to the client for life time use of the 
 *				widget in the said website developed by ProjectMiso. ProjectMiso DOES NOT GRANT the Client or client's future 
 *				development teams the right of distribution or the right to use this widget on other websites created by the client. 
 * @copyright	Author
*/
var Bubble = new Class({    
	Implements: [Options, Events],
	initialize: function(className){
		var clss = this;
		
		//get all elements based on the class name
		this.elements = $(document.body).getElements("input." + className + ", select." + className);
		this.target = null;		//will be used to store the target input element
		//App.roar.alert("Message", "Els " + this.elements);
		
		//create the bubble
		this.bubble = new Element("div", {"id": "the_bubble", "class": className }).inject(document.body);
		
		//enter the HTML into the bubbble
		var req1 = new Request({
			url: "/assets/snippets/bubble.php", 
			method: "get",
			autoCancel: true,
			onSuccess: function(responseText, responseXML){
				clss.bubble.set("html", responseText);
				clss.body = clss.bubble.getElement("span.body");
				//App.roar.alert("Message", "Els " + clss.body);
			}
		}).send();
		
		//create the event handlers
		this.elements.addEvent("focus", function(event){
			clss.target = this;
			clss.show(this.getProperty("rel"));
		});
		this.elements.addEvent("blur", function(event){
			clss.hide();
			clss.target = null;
		});
		
	},
	getPosition: function(){
		var pos = null;
		if (this.target){
			var coords = this.target.getCoordinates();
			pos = {left: coords.right + 10, top: coords.top + (coords.height / 2) - (this.bubble.getCoordinates().height / 2)};
		}
		return pos;
	},
	show: function(txt){
		this.body.set("html", txt);
		
		//App.roar.alert("Message", "Els " + this.bubble.getCoordinates().width );
		
		var pos = this.getPosition();
		
		if (pos){
			this.bubble.setStyles(pos);
			this.bubble.setStyle("visibility", "visible");
		}
	},
	hide: function(){
		this.bubble.setStyle("visibility", "hidden");
	},
	unload: function(){
		$each(this, function(item, i){
			//if ($type(item) == "element"){ item.destroy(); }
			if ($type(item) == "array"){ item.empty(); }
			item = null;
		});
	}
});