/*  brand_image_rotate.js : 2008.05.15
 * ----------------------------------------------------------------------------
 *   Install support to change the brand image on the fly without having to 
 *   reload the web page. This will make use of the AjaxContainer() object
 *   and the event handling functions found in ruthsarian_utilities.js 
 *
 *   CSS used to style the forms is embedded with the homepage theme
 *   stylesheet (as this should probably only be used on the homepage).
 */

var BirContainer = function() {

	// application variables
	var load_image_element = "loading-brand-box";
	var load_image_url = "/images/ajax-loader.gif";
	var container_element = "inside-brand-box";
	var image_element = "brand-box";
	var image_text_element = "brand-image-text-inside";
	var data_url = "/index.cfm?bic=xml";
	var form_id = "bir-controls";
	var active;
	var interval;
	var id = "";

	// initialize the system
	this.init = function () {

		// Install form controls
		var bb = document.getElementById( container_element );
		bb.innerHTML = '<form id="' + form_id + '"><input title="Load a new picture into the page." type="button" value="Next" onclick="bir.btn_change();"><input type="button" value="Play" onclick="bir.btn_play( this );" title="Play the images like a slideshow."></form>' + bb.innerHTML;

		// Install loading graphic
		var ii = document.getElementById( image_element );
		ii.style.backgroundColor = "transparent";

		var ll = document.getElementById( load_image_element );
		ll.style.backgroundColor = "#ccc";
		ll.style.backgroundImage = "url(" + load_image_url + ")";
		ll.style.backgroundPosition = "50% 50%";
		ll.style.backgroundRepeat = "no-repeat";

		// Detect if initial ID is available
		if ( bir_init_id ) {
			id = bir_init_id;
		}
	}

	// ajax response event handler
	this.ajax_handler = function ( xmlHttp ) {
		var a;
		var i;
		if ( document.getElementById ) {
			i = document.getElementById( image_element );
			// window.self.status = xmlHttp.responseXML.documentElement.getElementsByTagName( "image" )[0].childNodes[0].nodeValue;
			i.style.backgroundImage = "url(" + xmlHttp.responseXML.documentElement.getElementsByTagName( "image" )[0].childNodes[0].nodeValue + ")";
			i.style.backgroundPosition = xmlHttp.responseXML.documentElement.getElementsByTagName( "image_position" )[0].childNodes[0].nodeValue;
			a = document.getElementById( image_element ).getElementsByTagName( "h2" )[0].getElementsByTagName( "a" )[0];
			a.href = xmlHttp.responseXML.documentElement.getElementsByTagName( "imagefomlink" )[0].childNodes[0].nodeValue;
			a.innerHTML = xmlHttp.responseXML.documentElement.getElementsByTagName( "imagetext" )[0].childNodes[0].nodeValue;
			id = xmlHttp.responseXML.documentElement.getElementsByTagName( "id" )[0].childNodes[0].nodeValue;
		}
	}

	// "next" button handler
	this.btn_change = function () {
		if ( document.getElementById && ( typeof( AjaxContainer )).toLowerCase() == 'function' ) {
			i = document.getElementById( image_element );
			var aj = new AjaxContainer();
			aj.getByURL( this.ajax_handler, data_url + '&birid=' + id );
		}
	}

	// "stop/play" button handler
	this.btn_play = function ( button ) {
		if ( active != true ) {
			this.btn_change();
			interval = setInterval( "bir.btn_change()", 5000 );
			active = true;
			button.value = "Stop";
		} else {
			clearInterval( interval );
			active = false;
			button.value = "Play";
		}
	}

	// Setup initialization of BIR system
	if (( typeof( AjaxContainer )).toLowerCase() == 'function' 
		&& ( typeof( event_attach )).toLowerCase() == 'function' 
		&& document.getElementById
	) {
		// must not init this system until the page loads.
		event_attach( "onload", this.init );
	}
}
var bir = new BirContainer();