form-field-tooltip.js

Chinese Remainder theorem implementation. Its done in php. Its implemented with interactive gui.ind

/************************************************************************************************************

	Form field tooltip
	(C) www.dhtmlgoodies.com, September 2006

	This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.	
	
	Terms of use:
	Look at the terms of use at http://www.dhtmlgoodies.com/index.html?page=termsOfUse
	
	Thank you!
	
	www.dhtmlgoodies.com
	Alf Magne Kalleland

************************************************************************************************************/

var DHTMLgoodies_globalTooltipObj;


/** 
Constructor 
**/
function DHTMLgoodies_formTooltip()
{
	var tooltipDiv;
	var tooltipText;
	var tooltipContentDiv;				// Reference to inner div with tooltip content
	var imagePath;						// Relative path to images
	var arrowImageFile;					// Name of arrow image
	var arrowImageFileRight;			// Name of arrow image
	var arrowRightWidth;
	var arrowTopHeight;
	var tooltipWidth;					// Width of tooltip
	var roundedCornerObj;				// Reference to object of class DHTMLgoodies_roundedCorners
	var tooltipBgColor;
	var closeMessage;					// Close message
	var activeInput;					// Reference to currently active input
	var tooltipPosition;				// Tooltip position, possible values: "below" or "right"
	var tooltipCornerSize;				// Size of rounded corners
	var displayArrow;					// Display arrow above or at the left of the tooltip?
	var cookieName;						// Name of cookie
	var disableTooltipPossibility;		// Possibility of disabling tooltip
	var disableTooltipByCookie;			// If tooltip has been disabled, save the settings in cookie, i.e. for other pages with the same cookie name.
	var disableTooltipMessage;
	var tooltipDisabled;
	var isMSIE;
	var tooltipIframeObj;
	var pageBgColor;					// Color of background - used in ie when applying iframe which covers select boxes
	var currentTooltipObj;				// Reference to form field which tooltip is currently showing for
	
	this.currentTooltipObj = false,
	this.tooltipDiv = false,
	this.tooltipText = false;
	this.imagePath = 'images/';
	this.arrowImageFile = 'green-arrow.gif';
	this.arrowImageFileRight = 'green-arrow-right.gif';
	this.tooltipWidth = 200;
	this.tooltipBgColor = '#317082';
	this.closeMessage = 'Close';
	this.disableTooltipMessage = 'Don\'t show this message again';
	this.activeInput = false;
	this.tooltipPosition = 'right';
	this.arrowRightWidth = 16;			// Default width of arrow when the tooltip is on the right side of the inputs.
	this.arrowTopHeight = 13;			// Default height of arrow at the top of tooltip
	this.tooltipCornerSize = 10;
	this.displayArrow = true;
	this.cookieName = 'DHTMLgoodies_tooltipVisibility';
	this.disableTooltipByCookie = false;
	this.tooltipDisabled = false;
	this.disableTooltipPossibility = true;
	this.tooltipIframeObj = false;
	this.pageBgColor = '#FFFFFF';
	
	DHTMLgoodies_globalTooltipObj = this;
	
	if(navigator.userAgent.indexOf('MSIE')>=0)this.isMSIE = true; else this.isMSIE = false;
}


DHTMLgoodies_formTooltip.prototype = {
	// {{{ initFormFieldTooltip()
    /**
     *
	 *
     *  Initializes the tooltip script. Most set methods needs to be executed before you call this method.
     * 
     * @public
     */		
	initFormFieldTooltip : function()
	{
		var formElements = new Array();
		var inputs = document.getElementsByTagName('INPUT');
		for(var no=0;no<inputs.length;no++){
			var attr = inputs[no].getAttribute('tooltipText');
			if(!attr)attr = inputs[no].tooltipText;
			if(attr)formElements[formElements.length] = inputs[no];
		}
			
		var inputs = document.getElementsByTagName('TEXTAREA');
		for(var no=0;no<inputs.length;no++){
			var attr = inputs[no].getAttribute('tooltipText');
			if(!attr)attr = inputs[no].tooltipText;
			if(attr)formElements[formElements.length] = inputs[no];
		}
		var inputs = document.getElementsByTagName('SELECT');
		for(var no=0;no<inputs.length;no++){
			var attr = inputs[no].getAttribute('tooltipText');
			if(!attr)attr = inputs[no].tooltipText;
			if(attr)formElements[formElements.length] = inputs[no];
		}
			
		window.refToFormTooltip = this;
		
		for(var no=0;no<formElements.length;no++){
			formElements[no].onfocus = this.__displayTooltip;
		}
		this.addEvent(window,'resize',function(){ window.refToFormTooltip.__positionCurrentToolTipObj(); });
		
		this.addEvent(document.documentElement,'click',function(e){ window.refToFormTooltip.__autoHideTooltip(e); });
	}
	
	// }}}
	,		
	// {{{ setTooltipPosition()
    /**
     *
	 *
     *  Specify position of tooltip(below or right)
     *	@param String newPosition (Possible values: "below" or "right") 
     * 
     * @public
     */	
	setTooltipPosition : function(newPosition)
	{
		this.tooltipPosition = newPosition;
	}
	// }}}
	,		
	// {{{ setCloseMessage()
    /**
     *
	 *
     *  Specify "Close" message
     *	@param String closeMessage
     * 
     * @public
     */
	setCloseMessage : function(closeMessage)
	{
		this.closeMessage = closeMessage;
	}
	// }}}
	,	
	// {{{ setDisableTooltipMessage()
    /**
     *
	 *
     *  Specify disable tooltip message at the bottom of the tooltip
     *	@param String disableTooltipMessage
     * 
     * @public
     */
	setDisableTooltipMessage : function(disableTooltipMessage)
	{
		this.disableTooltipMessage = disableTooltipMessage;
	}
	// }}}
	,		
	// {{{ setTooltipDisablePossibility()
    /**
     *
	 *
     *  Specify whether you want the disable link to appear or not.
     *	@param Boolean disableTooltipPossibility
     * 
     * @public
     */
	setTooltipDisablePossibility : function(disableTooltipPossibility)
	{
		this.disableTooltipPossibility = disableTooltipPossibility;
	}
	// }}}
	,		
	// {{{ setCookieName()
    /**
     *
	 *
     *  Specify name of cookie. Useful if you're using this script on several pages. 
     *	@param String newCookieName
     * 
     * @public
     */
	setCookieName : function(newCookieName)
	{
		this.cookieName = newCookieName;
	}
	// }}}
	,		
	// {{{ setTooltipWidth()
    /**
     *
	 *
     *  Specify width of tooltip
     *	@param Int newWidth
     * 
     * @public
     */	
	setTooltipWidth : function(newWidth)
	{
		this.tooltipWidth = newWidth;
	}
	
	// }}}
	,		
	// {{{ setArrowVisibility()
    /**
     *
	 *
     *  Display arrow at the top or at the left of the tooltip?
     *	@param Boolean displayArrow
     * 
     * @public
     */	
	
	setArrowVisibility : function(displayArrow)
	{
		this.displayArrow = displayArrow;
	}
	
	// }}}
	,		
	// {{{ setTooltipBgColor()
    /**
     *
	 *
     *  Send true to this method if you want to be able to save tooltip visibility in cookie. If it's set to true,
     *	It means that when someone returns to the page, the tooltips won't show.
     * 
     *	@param Boolean disableTooltipByCookie
     * 
     * @public
     */	
	setDisableTooltipByCookie : function(disableTooltipByCookie)
	{
		this.disableTooltipByCookie = disableTooltipByCookie;
	}	
	// }}}
	,		
	// {{{ setTooltipBgColor()
    /**
     *
	 *
     *  This method specifies background color of tooltip
     *	@param String newBgColor
     * 
     * @public
     */	
	setTooltipBgColor : function(newBgColor)
	{
		this.tooltipBgColor = newBgColor;
	}
	
	// }}}
	,		
	// {{{ setTooltipCornerSize()
    /**
     *
	 *
     *  Size of rounded corners around tooltip
     *	@param Int newSize (0 = no rounded corners)
     * 
     * @public
     */	
	setTooltipCornerSize : function(tooltipCornerSize)
	{
		this.tooltipCornerSize = tooltipCornerSize;
	}
	
	// }}}
	,
	// {{{ setTopArrowHeight()
    /**
     *
	 *
     *  Size height of arrow at the top of tooltip
     *	@param Int arrowTopHeight
     * 
     * @public
     */	
	setTopArrowHeight : function(arrowTopHeight)
	{
		this.arrowTopHeight = arrowTopHeight;
	}
	
	// }}}
	,	
	// {{{ setRightArrowWidth()
    /**
     *
	 *
     *  Size width of arrow when the tooltip is on the right side of inputs
     *	@param Int arrowTopHeight
     * 
     * @public
     */	
	setRightArrowWidth : function(arrowRightWidth)
	{
		this.arrowRightWidth = arrowRightWidth;
	}
	
	// }}}
	,	
	// {{{ setPageBgColor()
    /**
     *
	 *
     *  Specify background color of page.
     *	@param String pageBgColor
     * 
     * @public
     */	
	setPageBgColor : function(pageBgColor)
	{
		this.pageBgColor = pageBgColor;
	}
	
	// }}}
	,		
	// {{{ __hideTooltip()
    /**
     *
	 *
     *  This method displays the tooltip
     *
     * 
     * @private
     */		
	__displayTooltip : function()
	{
		if(DHTMLgoodies_globalTooltipObj.disableTooltipByCookie){
			var cookieValue = DHTMLgoodies_globalTooltipObj.getCookie(DHTMLgoodies_globalTooltipObj.cookieName) + '';	
			if(cookieValue=='1')DHTMLgoodies_globalTooltipObj.tooltipDisabled = true;
		}	
		
		if(DHTMLgoodies_globalTooltipObj.tooltipDisabled)return;	// Tooltip disabled
		var tooltipText = this.getAttribute('tooltipText');
		DHTMLgoodies_globalTooltipObj.activeInput = this;
		
		if(!tooltipText)tooltipText = this.tooltipText;
		DHTMLgoodies_globalTooltipObj.tooltipText = tooltipText;

		
		if(!DHTMLgoodies_globalTooltipObj.tooltipDiv)DHTMLgoodies_globalTooltipObj.__createTooltip();