/*
 * jsHelp - Javascript help popup classes
 * 
*/

if(typeof JF == "undefined" || ! JF){
	var JF = {};
}

JF.Help = function(){
	this.init();
}

JF.Help.prototype = {
	
	dom: YAHOO.util.Dom,
	event: YAHOO.util.Event,
	widget: YAHOO.widget,
	
	overlay: null, // YUI overlay for displaying help text
	
	init: function(){
		this.setupHelpIcons();
		this.setupOverlay();
	},
	
	setupHelpIcons: function(){
		
		var icons = YAHOO.util.Dom.getElementsByClassName('infoIcon', 'img');
		for(var i=0; i<icons.length; i++){
			var icon = icons[i];
			this.event.on(icon, 'click', (function(icon){
				return function(event){
					
					var helpText = icon.alt;
					if(helpText){
						this.overlay.setBody(helpText);
						this.overlay.cfg.setProperty('context', [icon.id, 'tl', 'bl', ['beforeShow']]);
						this.overlay.render(icon);
						this.overlay.show();
						
						// listen for clicks anywhere to hide the help
						this.event.addListener(document, 'click', function(event){
							this.overlay.hide();
							this.event.removeListener(document, 'click'); 
							}, this, true);
					}
					// prevent bubbling otherwise the onclick on the document is called directly
					this.event.stopPropagation(event); 
				}
			})(icon), this, true);
		}
	},
	
	setupOverlay: function(){
		
		this.overlay = new this.widget.Overlay('helpContainer', 
			{	width:"200px", 
				fixedcenter: false, 
				constraintoviewport: false, 
				underlay:"none",				 
				visible:false, 
				draggable:false
			});
		this.overlay.setBody('help text');
		this.overlay.render('body');
		
		this.styleOverlay();
	},
	
	styleOverlay: function(){
		
		var style = this.overlay.element.style;
		style.backgroundColor = '#fff799';
		style.borderWidth = '1px';
		style.borderColor = '#cccccc';
		style.borderStyle = 'solid';
		style.textAlign = 'left';
		style.fontSize = "80%";
		style.paddingTop = "3px";
		style.paddingBottom = "0px";
		style.paddingLeft = "5px";
		style.paddingRight = "5px";
	}
}