/* ============================================================================================
 * Copyright (c) 2008 Muhammet TURŞAK (tursoft@gmail.com, www.tursoft.net)
 * Dual licensed
 *   - GPL http://www.gnu.org/licenses/gpl.html and 
 *   - MIT http://www.opensource.org/licenses/mit-license.php
 
===============================================================================================
# INFORMATION and META DATA ABOUT LIBRARY
-----------------------------------------------------------------------------------------------
NAME                : MyInputInfoBox
VERSION             : v1.0
UPDATE DATE         : 23.11.2008

AUTHOR              : Muhammet TURŞAK (tursoft@gmail.com, www.tursoft.net)
DESCRIPTION         : A jquery plugin to easiy show infobox for form input control on focus
LICENSING           : 
            - GPL http://www.gnu.org/licenses/gpl.html and 
            - MIT http://www.opensource.org/licenses/mit-license.php

DEPENDENT FILES     : 
    - jquery-1.2.6.js  (or higher)
    - tursoft.shared.v1.1.js
    - jquery.dimensions.js
    
    - default.css (MyInputInfoBox styles) 
    - info.gif
    - leftarrow.gif    

TESTED BROWSERS     : IE 8 Beta, Firefox 3.0.4

KNOWN BUGS / ISSUES : 
    - No known bugs or issues
    
===============================================================================================
# DOCUMENTATION
-----------------------------------------------------------------------------------------------
SUPPORTED TAGS      : input, select, textarea

METHODS             : 
    - MyImgButton($options)
        Function Options; 
            - Text		                : Text to show in infobox (if given, this will be shown statically)
			- Attr (default:'ToolTip') 	: Name of the attribute which the text data will be read dynamically
		
		Source Attributes;
		    - <Attr given in options>   

 ============================================================================================ */
 (function($){

	// ==================================================================
	var $$ = $.fn.MyInputInfoBox = function($options) {
		return $(this).each(function() {
							var $this=$(this);
							$this.$=function() {};
							$this.$.ID=this.id;
							         
                            // set default options
                            var $defaults = {
                                Attr     : 'ToolTip',
                                Text     : ''
                            };
                            	                        
                            $this.$.options = $.extend($defaults, $options);
                            
							$$.onParseData2($this);
							$$.onInitView($this);
						});
	};

	// ==================================================================
	$$.SupportedTags=new Array();
	$$.isSupportedTag=function($this) {
		if ($$.SupportedTags.length<=0)
			return true;
		 
		var i=0;
		for(i=0;i<$$.SupportedTags.length;i++)
		{
			if ($this[0].nodeName.toUpperCase()==$$.SupportedTags[i].toUpperCase())
				return true;
		}
		
		return false;
	};

	$$.onParseData2=function($this) {
		// check tagname is supported
		if (!$$.isSupportedTag($this))
			return;
			
		// parseData
		var tagName=$this[0].nodeName.toLowerCase().trim();
                   	                        				
		if (IsValueEmpty($this.$.options.Text)) {
                 if (!IsValueEmpty($this.$.options.Attr))                                     
                    $this.$.options.Text=_getAttrValue($this, $this.$.options.Attr, "");
         }
	};


	// ==================================================================
	$$.onInitView=function($this) {
		if (IsValueEmpty($this.$.options.Text))
            return;
            			
		// var $span=$(document.createElement("span"));
			var $input=$this;
			var $box=$(document.createElement("div")).addClass("MyInputInfoBox_box");
				
				var $tbl		=$(document.createElement("table")).attr({cellspacing:0, cellpadding:0, border:0});
				var $tr			=$(document.createElement("tr"));				
					var $tdImg	=$(document.createElement("td")).addClass("MyInputInfoBox_icon");
					var $tdText	=$(document.createElement("td")).addClass("MyInputInfoBox_text").attr("align","left").css("text-align","left");

				$tbl.append($tr);
				$tr.append($tdImg);				
				$tr.append($tdText);
		
				
				var $divArrow=$(document.createElement("div")).addClass("MyInputInfoBox_leftArrow");				
				
			$box.append($divArrow);
			$box.append($tbl);

		$('body').append($box);
	
		var $text=new String($this.$.options.Text);
		$tdText.append(""+$text);
		$box.hide();
				
		$input.focus(function(){
  			        var $p=$(this).offset();
				    var $width=$(this).width();
				    $box.css({left:($p.left+$width+5), top:$p.top});		
				    $box.fadeIn(400);	 
			});
		
		$input.blur(function(){
				    $box.fadeOut(200);	 
			});		
	}
		
})(jQuery);