/**
 * Client side code for image fading
 *
 * Copyright (c) 2008 - 2011 TOLRA Micro Systems Limited. All rights reserved.
 *
 * THIS SOFTWARE IS PROVIDED "AS IS" AND WITHOUT ANY EXPRESS OR IMPLIED
 * WARRANTIES, INCLUDING, WITHOUT LIMITATION, THE IMPLIED WARRANTIES OF
 * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.
 */

function imageFade(images, delay, i1name, i2name, txtname, withclick) {
	var self = this;

	this.handlers = new Array();
	this.images = images;
	this.liveimg = 0;
	this.opacity = 100;
	this.opacityd = -10;
	this.delay = delay;
	this.i1name = i1name;
	this.i2name = i2name;
	this.txtname = txtname;

	this._findHandler = function(target, eventName, fnHandler) {
		for(i in this.handlers) {
			if(this.handlers[i].target == target && this.handlers[i].eventName == eventName && this.handlers[i].fnHandler == fnHandler)
				return i;
		}

		return -1;
	};

	// Attach to an event
	this.observe = function(target, eventName, fnHandler) {
		// if given a string look up the object
		if(typeof target == "string") target = document.getElementById(target);

		// Look for an existing handler
		if(this._findHandler(target, eventName, fnHandler) != -1) return;

		// create wrapper event function to fix browser differences
		var fn = function(evt) {
			evt = evt ? evt : (window.event ? window.event : null);
			if(evt) {
				// For IE convert srcElement to target
				if(!evt.target) evt.target = evt.srcElement;

				// if handler returns false don't run default
				if(!fnHandler(evt)) {
					if(evt.stopPropagation) {
						evt.stopPropagation();
						evt.preventDefault();
					}
					else if(evt.cancelBubble) {
						evt.cancelBubble = true;
						evt.returnValue = false;
					}
					return false;
				}
			}
		};

		// Remember handler
		this.handlers.push({target: target, eventName: eventName, fnHandler: fnHandler, fn: fn});

		// Attach event to object
		if(target.addEventListener)
			target.addEventListener(eventName, fn, false);
		else {
			target.attachEvent("on" + eventName, fn);

			// For IE add unloader to remove all handlers
			if(!window._fusionLibEventUnload) {
				window._fusionLibEventUnload = true;
				this._removeAllEvents = function() {
					for(i in this.handlers) {
						this.handlers[i].target.detachEvent("on" + this.handlers[i].eventName, this.handlers[i].fn);
					}
				}

				var _oldOnUnload = window.onunload;
				if(typeof window.onunload != 'function') window.onunload = this._removeAllEvents;
				else window.onunload = function() { this._removeAllEvents(); _oldOnUnload(); };
			}
		}
	};

	this.onClickImage = function(e) {
		window.location = self.images[self.liveimg][1];
		return false;
	}

	this.animateRestart = function() {
		var image2 = document.getElementById(self.i2name);

		self.opacity = 100;

		image2.style.opacity = self.opacity / 100;
		image2.style.MozOpacity = self.opacity / 100;
		image2.style.filter = "alpha(opacity=" + self.opacity + ")";

		// Set next as fade
		document.getElementById(self.i1name).style.backgroundImage = 'url(' +self.images[(self.liveimg+1) % self.images.length][0] + ')';

		var e = document.getElementById(self.txtname);
		if(e)
			e.innerHTML = self.images[self.liveimg][2];

		// Wait and start animating
		setTimeout(self.animateFade, self.delay);
	};

	this.animateFade = function() {
		self.opacity += self.opacityd;

		var image2 = document.getElementById(self.i2name);
		image2.style.opacity = self.opacity / 100;
		image2.style.MozOpacity = self.opacity / 100;
		image2.style.filter = "alpha(opacity=" + self.opacity + ")";

		if(self.opacity >= 0)
			setTimeout(self.animateFade, 50);
		else {
			// Faded so make old bg image fade image
			self.liveimg = (self.liveimg + 1) % self.images.length;
			image2.style.backgroundImage = 'url(' + self.images[self.liveimg][0] + ')';

			setTimeout(self.animateRestart, 50);
		}
	}

	if(withclick) {
		this.observe(typeof withclick == 'string' ? withclick : this.i2name, 'click', this.onClickImage);
		this.observe(this.txtname, 'click', this.onClickImage);
	}

	document.getElementById(this.i2name).style.backgroundImage = 'url(' + this.images[this.liveimg][0] + ')';
	document.getElementById(this.i1name).style.backgroundImage = 'url(' + this.images[this.liveimg+1][0] + ')';
	var e = document.getElementById(this.txtname);
	if(e)
		e.innerHTML = this.images[this.liveimg][2];

	setTimeout(this.animateFade, this.delay);
}
