/*******************************************************************************
Using the AjaxStatusDisplay class:

Required Files:
<script src="ajax_lib/bind.js" type="text/javascript" language="JavaScript"></script>
<script src="ajax_lib/ajax_status_display.js" type="text/javascript" language="JavaScript"></script>

	Instantiate AjaxStatusDisplay.
	Set optional properties.
	Set an external Ajax::ReadyStateDisplayHandler to DefaultAjaxStatusDisplay_Handler
	        Note: you must bind the current object to its DefaultAjaxStatusDisplay_Handler
	                when setting Ajax::ReadyStateDisplayHandler or the box_id will be lost.
			Example (ajax_obj=external Ajax object, ajax_display_obj = current AjaxStatusDisplay obj):
				ajax_obj.ReadyStateDisplayHandler = ajax_display_obj.DefaultAjaxStatusDisplay_Handler.bind(ajax_display_obj).

optional properties:
	this.box_id:
		set in constructor. Stores the id of the display tag.
	this.fade_delay_ms:
		default=1000;
		The time in milliseconds before the fade out begins.
		If set to -1 the fade timer will never start
		Use DefaultAjaxStatusDisplay_SetFadeDelayms
	this.fade_speed:
		default=1;
		The speed that the fade occurs.
		Higher = faster & choppier.
		Max=100;
	this.starting_box_opacity_percent:
		default=100;
		the opacity percentage that is considered full opacity (used if you always want some opacity).
		100=100% visible.
		Use DefaultAjaxStatusDisplay_SetStartingBoxOpacityPercent
	this.in_fade_delay_ms:
		default=10;
		Stores the time in milliseconds between each stage of a fade.
		Total fade time(ms) = (100/fade_speed * in_fade_delay_ms )
	this.css_show_class_name:
		default=null;
		Use DefaultAjaxStatusDisplay_SetCSSShowClassName
	this.css_hide_class_name
		default=null;
		Use DefaultAjaxStatusDisplay_SetCSSHideClassName
	this.style_display_show_value
		default='block';
		Use DefaultAjaxStatusDisplay_SetStyleDisplayShowValue
	this.style_display_hide_value
		default='none';
		Use DefaultAjaxStatusDisplay_SetStyleDisplayHideValue

	Also:
	DefaultAjaxStatusDisplay_SetBoxOpacityPercent: Sets the current opacity of the box.  Will be reset automatically if a change or fade occurs.

Custom Ready State Messages:
	If you want to display custom messages, just create a function that receives two parameters, the ready state number and http status number, respectively,
	and set DefaultAjaxStatusDisplay_ConvertValuesToMessage equal to it.


*******************************************************************************/
function AjaxStatusDisplay(box_id)
{
	this.box_id = box_id;
	this.fade_delay_ms = 1000;
	this.fade_speed = 1;
	this.starting_box_opacity_percent = 100;
	this.in_fade_delay_ms = 10;
	this.css_show_class_name = null;
	this.css_hide_class_name = null;
	this.style_display_show_value = 'block';
	this.style_display_hide_value = 'none';

	this._fade_in_progress = false;
	this._in_fade_timer_id = null;
	this._fade_timeout_id = null;
	this._current_box_opacity_percent = this.starting_box_opacity_percent;

	this.DefaultAjaxStatusDisplay_SetFadeDelayms = function(delay_ms)
	{
	        this.fade_delay_ms = delay_ms;
	}
}
// normally you have to bind this handler to whatever object will be using it.  If you don't
//      the box_id will be lost.
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_Handler = function(ready_state, http_status)
{
	this.DefaultAjaxStatusDisplay_StopFadeOut();
	this.DefaultAjaxStatusDisplay_ShowStatusBox(this.DefaultAjaxStatusDisplay_ConvertValuesToMessage(ready_state, http_status));
	//alert(ready_state+', '+http_status);
	if(ready_state == 4 && http_status == 200)
	{
	        if(this.fade_delay_ms > -1)
			this.DefaultAjaxStatusDisplay_BeginFadeOutTimer()
		else
			this.DefaultAjaxStatusDisplay_HideStatusBox();
	}
}

AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_ShowStatusBox = function(message)
{
	var status_box_obj = document.getElementById(this.box_id);
	status_box_obj.style.zoom = '100%';     // fuck IE, if this isn't done (to create a "hasLayout" thing) the box will not fade out.
	status_box_obj.innerHTML = message;
	if(this.css_hide_class_name != null)
	{
		status_box_obj.className = this.css_show_class_name;
	}
	else
	{
		status_box_obj.style.display = this.style_display_show_value;
	}
	this.DefaultAjaxStatusDisplay_ResetBoxOpacityPercent();
}

AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_HideStatusBox = function()
{
	var status_box_obj = document.getElementById(this.box_id);
	if(this.css_hide_class_name != null)
	{
	        status_box_obj.className = this.css_hide_class_name;
	}
	else
	{
		status_box_obj.style.display = this.style_display_hide_value;
	}
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_BeginFadeOutTimer = function()
{
	if(this._fade_timeout_id != null)
	{
	        clearTimeout(this._fade_timeout_id);
	        this._fade_timeout_id = null;
	}
	this._fade_timeout_id = setTimeout(this.DefaultAjaxStatusDisplay_FadeOutStatusBox.bind(this), this.fade_delay_ms);
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_FadeOutStatusBox = function()
{
	this._fade_in_progress = true;
	this._in_fade_timer_id = null;
	this._fade_timeout_id = null;
	if(this._current_box_opacity_percent > 0)
	{
		this.DefaultAjaxStatusDisplay_SetBoxOpacityPercent(this._current_box_opacity_percent - this.fade_speed);
		this._in_fade_timer_id = setTimeout(this.DefaultAjaxStatusDisplay_FadeOutStatusBox.bind(this), this.in_fade_delay_ms);
	}
	else
	{
		this._fade_in_progress = false;
		this._in_fade_timer_id = null;
		this.DefaultAjaxStatusDisplay_HideStatusBox();
	}
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_StopFadeOut = function()
{
	// stop overall timer
	if(this._fade_timeout_id != null)
	{
		clearTimeout(this._fade_timeout_id);
		this._fade_timeout_id = null;
	}

	// stop fade step timer
	if(this._in_fade_timer_id != null)
	{
	        clearTimeout(this._in_fade_timer_id);
	        this._in_fade_timer_id = null;
	}
        this.DefaultAjaxStatusDisplay_ResetBoxOpacityPercent();
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_ResetBoxOpacityPercent = function(percentage)
{
        this.DefaultAjaxStatusDisplay_SetBoxOpacityPercent(this.starting_box_opacity_percent);
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetStartingBoxOpacityPercent = function(percentage)
{
	this.starting_box_opacity_percent = percentage;
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetBoxOpacityPercent = function(percentage)
{
	this._current_box_opacity_percent = percentage;
	var status_box_obj = document.getElementById(this.box_id);
	status_box_obj.style.opacity = (this._current_box_opacity_percent/100).toString();	// Firefox
	status_box_obj.style.filter = "alpha(opacity="+this._current_box_opacity_percent+")";	// IE
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetCSSShowClassName = function(class_name)
{
	this.css_show_class_name = class_name;
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetCSSHideClassName = function(class_name)
{
	this.css_hide_class_name = class_name;
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetStyleDisplayShowValue = function(style_text)
{
	this.style_display_show_value = style_text;
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_SetStyleDisplayHideValue = function(style_text)
{
	this.style_display_hide_value = style_text;
}
AjaxStatusDisplay.prototype.DefaultAjaxStatusDisplay_ConvertValuesToMessage = function(ready_state, http_status)
{
	var message = '';
	if(ready_state == 4 && http_status != 200)
	{
	        message = "HTTP Error: "+http_status;
	}
	else
	{
	        switch(ready_state)
	        {
	                case 4:	message = 'Done.';
	                	break;
	                case 3:	message = 'Displaying...';
	                	break;
			case 2: message = 'Loading...';
			        break;
			case 1: message = 'Transmitting...';
			        break;
	        }
	}
	return message;
}