/*-----------------------------------------------------------------------------
 * Simple object used to control expanding/show collapsing/hide a container's 
 * contents.  This object is used by tree selection type pages, query module 
 * selection pages, query module builder pages, and any page wanting to have 
 * expanding/collapsing content.  This object also provides basic functions to
 * show/hide/toggle a container's style block attribute.  The real value added and 
 * intent of this code is to handle two HTML element blocks with the first being a 
 * clickable control block that controls the display of the actual container block 
 * element.  The control block display characteristics is handled via an optional
 * CSS class that is added/removed from the control block.  This allows a single
 * class to be able to control the apperance of the control block. 
 *
 * The key to this object being easily shared/used by all HTML elements is to have 
 * the control and container HTML element's id attribute named consistantly. This 
 * naming is of the form: 
 * <a id="controlX.Y.Z" href="someToggleContainerInstance.toggle('X.Y.Z');" class="SomeClass SomeOpenClass">
 * <div id="containerX.Y.Z" class="SomeClass">
 * 
 * As noted above, this object mainly deals with an HTML structure that has a 
 * control element which is always visible along with typically a peer container.  
 * This code also provides a more generic block control mechanism that allows for 
 * simple show/hide operations without being tied to a controller.
 *
 * NOTE ON PREVIOUS IMPLEMENTATION: This object could have been created 1:1 e.g. 
 * one control object for each control/container element set.  Along this same 
 * thought is to loop through and register all the control elements to have a
 * click and selected handler.  Either of these solutions requires more script 
 * and initialization time and really doesn't add any value.  This solution is much 
 * more straight forward as a simple onclick or href attribute can be used with 
 * a single instantiated control object.  
 *
 * Modifications:
 * Date        By          Description
 * ----------  ----------  -------------------------------------------------
 * 02/23/2007  Garth       Initial version.
 *---------------------------------------------------------------------------*/


// Constructor.  
// Arguments: 
//   - controlIDPrefix = Control Element's ID prefix.  If not specified then the
//     ID value provided in the show/hide/toggle calls MUST be a full ID.
//   - controlShowClassName = Control CSS class name that will be added to show
//     the control HTML element (based on the id) to set icons and any other 
//     visual effect that might be wanted on the control element (likewise will 
//     be removed when hiding).  If not specified then the control block will not
//     be modifiable.
//   - containerIDPrefix = Container's Element ID prefix.  Same comments about the
//     control ID prefix applies.
//   - containerShowClassName = Container CSS class name that will be added/removed
//     to the control HTML element (based on the id) to open/show/expand the container's 
//     contents or removed which if the CSS definitions are correct will hide/collapse 
//     the container.  If null, then the element's style attribute is manipulated to 
//     show/hide the contents.
// Returns: New Container Control object.
function ShowHideBlockControl(controlIDPrefix, controlShowClassName, containerIDPrefix, containerShowClassName)
{
	// set core properties
	this.controlIDPrefix        = controlIDPrefix;
	this.controlShowClassName   = controlShowClassName;
	this.containerIDPrefix      = containerIDPrefix;
	this.containerShowClassName = containerShowClassName;
} //~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Constructor ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~




// Toggles the control block and container block to show is hidden and hide if 
// showing.  This is accomplished by adding/removing the show class name property
// to from the control element and the container's element (uses the display 
// style attribute if class not specified).  The determining control mechanism 
// is the control element's class containing the control show classname property.
// If the control element's class contains the show class name property then the
// class will be removed and the container will be hidden.  Otherwise the class
// will be added to the control element will either have a class added or the 
// display style attribute set to block.
// Arguments: 
// - elementIDSuffix = HTML Element ID suffix that is concatinated with the 
//   controlIDPrefix property and containerIDPrefix property to get the unique 
//   control and container HTML element's ID in which to act on.
// Returns: nothing.

// IE has an odd behavior when bolding the text after clicking, if on the bottom
// the new active unbolding of current item will cause the mouse click to not
// retigster because the area will be resized via the css change before the mouse
// up event fires and thus the mouse up is off the area!  If hit high, then all 
// is good or if the title area is several lines high.  If this is a problem then
// don't set the CSS to bold on active or on focus!!!
ShowHideBlockControl.prototype.toggle = function(elementIDSuffix)
{
	var controlElement = new EnhancedElement(this.controlIDPrefix + elementIDSuffix);
	if(controlElement.containsClassName(this.controlShowClassName))
	{
		controlElement.removeClassName(this.controlShowClassName);
		this.hideContainer(this.containerIDPrefix + elementIDSuffix);
	}
	else
	{
		controlElement.addClassName(this.controlShowClassName);
		this.showContainer(this.containerIDPrefix + elementIDSuffix);
	}
//alert("show hide container: " +this.controlIDPrefix + elementIDSuffix +", class: " +this.controlShowClassName);
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


// Forces the control block to have the controller show class name property added
// to the control element.  The showContainer method is then called to show the
// actual container element (uses the classname property or if not specified uses
// the display style attribute).
// Arguments: 
// - elementIDSuffix = HTML Element ID suffix that is concatinated with the 
//   controlIDPrefix property and containerIDPrefix property to get the unique 
//   control and container HTML element's ID in which to act on.  If prefix property 
//   not specified in the constructor then this value must be complete.
// Returns: nothing.
ShowHideBlockControl.prototype.show = function(elementIDSuffix)
{
	var controlElement = new EnhancedElement(this.controlIDPrefix + elementIDSuffix);
	controlElement.addClassName(this.controlShowClassName);
	this.showContainer(this.containerIDPrefix + elementIDSuffix);
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


// Forces the control block to have the controller show class name property removed
// from the control element.  The hideContainer method is then called to hide the
// actual container element (uses the classname property or if not specified uses
// the display style attribute).
// Arguments: 
// - elementIDSuffix = HTML Element ID suffix that is concatinated with the 
//   controlIDPrefix property and containerIDPrefix property to get the unique 
//   control and container HTML element's ID in which to act on.  If prefix property 
//   not specified in the constructor then this value must be complete.
// Returns: nothing.
ShowHideBlockControl.prototype.hide = function(elementIDSuffix)
{
	var controlElement = new EnhancedElement(this.controlIDPrefix + elementIDSuffix);
	controlElement.removeClassName(this.controlShowClassName);
	this.hideContainer(this.containerIDPrefix + elementIDSuffix);
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~




// Toggles the container's display characterisics.  There are two different ways 
// this is done.  The primary method for expanding/collapsing containers is via
// appending/removing a CSS class to/from the element.  If the "this.containerShowClassName" 
// property does not exist, then the element's style attribite display property 
// is used.
// Arguments: 
//   - containerElementID = Container's Element ID.  
// Returns: nothing.
ShowHideBlockControl.prototype.toggleContainer = function(containerElementID)
{
	// if the control show class name property exists, then adjust accordingly
	// else base the toggle on the is expanded method.
	var containerElement = new EnhancedElement(containerElementID);
	if(this.controlShowClassName)
	{
		if(containerElement.containsClassName(this.controlShowClassName))
			containerElement.removeClassName(this.containerShowClassName);
		else
			containerElement.addClassName(this.containerShowClassName);
	}
	else
		containerElement.toggleDisplayBlockNone();
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


// Forces the container to be shown either by adding a CSS class or by adjusting the
// element's style display to block.  If "this.containerShowClassName" property  is
// set then the CSS class is added, otherwise the element's expand method is called.  
// Arguments: 
//   - containerElementID = Container's Element ID.  
// Returns: nothing.
ShowHideBlockControl.prototype.showContainer = function(containerElementID)
{
	var containerElement = new EnhancedElement(containerElementID);
	if(this.containerShowClassName) 
		containerElement.addClassName(this.containerShowClassName);
	else
		containerElement.setDisplayBlock();
// if preference to auto scroll to...
containerElement.scrollToShow();
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


// Forces the container to be hidden either by removing a CSS class or by adjusting
// the element's style display.  If "this.containerShowClassName" property is set
// then the CSS class is removed, otherwise the element's collapse method is called.  
// Arguments: 
//   - containerElementID = Container's Element ID.  
// Returns: nothing.
ShowHideBlockControl.prototype.hideContainer = function(containerElementID)
{
	var containerElement = new EnhancedElement(containerElementID);
	if(this.containerShowClassName) 
		containerElement.removeClassName(this.containerShowClassName);
	else
		containerElement.setDisplayNone();
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~



// Function that checks the container to be displaying or not.  First check is to
// see if the "this.containerShowClassName" property is set.  If set then this 
// function returns a true or false based on the element containing this class.
// Otherwise the element's isCollapsed method is called.  
// Arguments: 
//   - containerElementID = Container's Element ID.  
// Returns: true if collapsed/hidden, otherwise false.
ShowHideBlockControl.prototype.isContainerHidden = function(containerElementID)
{
	// if the control show class name property exists, then adjust accordingly
	// else base the toggle on the is expanded method.
	var containerElement = new EnhancedElement(containerElementID);
	if(this.controlShowClassName)
		return(containerElement.containsClassName(this.controlShowClassName));
	else
		return(containerElement.isDisplayNone());
} //~~~~~~~~~~~~~~~~~~~~~~~~~~~ End of Prototype ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

/*=============================== End of File ================================*/