/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

Gallbox.prototype.constructor = Gallbox;

function Gallbox() {
	this.imgArr = [];
}

/**
 * start the gallery box object
 */
Gallbox.prototype.init = function() {
	this.showInfo('Gallbox instanciado');
}

Gallbox.prototype.debug = 0;
/**
 * preloaded images array
 */
Gallbox.imgArr = [];
/**
 * present image Viewing
 */
Gallbox.imgP = null;

/**
 * Creates a gallery from the links inside the object with the id passed on
 * 
 * @param container_id
 *            as string
 * 
 */
Gallbox.prototype.setGalleryContainer = function(container_id) {
	if (document.getElementById(container_id) != null) {
		var links = document.getElementById(container_id).getElementsByTagName(
				'a');
		var preImg = 0;
		for ( var i = 0; i < links.length; i++) {
			preImg = this.loadIMG(links[i].href);
			links[i].href = 'javascript:Gallbox.prototype.showImage(' + preImg + ');';
		}
		this.showInfo('arr size=' + Gallbox.imgArr.length);
		this.container.load();
	}
}

/**
 * creates an image object from url and add it to the Gallbox.imgArr array
 * 
 * @param url
 *            as string
 * @return void
 */
Gallbox.prototype.loadIMG = function(url) {
	var img = new Image(); // document.createElement('img');
	var arrIndex = 0;
	this.showInfo('Gallbox.prototype.loadIMG');
	img.src = url;
	arrIndex = Gallbox.imgArr.length;
	Gallbox.imgArr[arrIndex] = img;
	return arrIndex;
}

/**
 * load the image object from Gallbox.imgArr insert it into a container and
 * shows it
 * 
 * @param img_index
 *            as integer
 */
Gallbox.prototype.showImage = function(img_index) {
	var img_obj = Gallbox.imgArr[img_index];
	this.showInfo("Index recebido" + img_index + "|" + Gallbox.imgP);
	if (Gallbox.imgP != null && Gallbox.imgP != img_index) {
		Gallbox.imgP = img_index;
		this.container.hide(this);
	} else {
		Gallbox.imgP = img_index;
		this.showInfo("Img Size" + img_obj.width + "x" + img_obj.height);
		this.container.setContent(img_obj);
		this.container.show();
	}
}

/**
 * Next Button handler of the container enables to load the next image in the
 * Gallbox.imgArr
 */
Gallbox.goNextImgHandler = function(evt) {
	Gallbox.prototype.showInfo('goToNextImg');
	if (Gallbox.imgP < Gallbox.imgArr.length - 1) {
		Gallbox.prototype.showImage(Gallbox.imgP + 1);
	}
}
/**
 * Previous Button handler of the container enables to load the previous image
 * in the Gallbox.imgArr
 */

Gallbox.goPrevImgHandler = function(evt) {
	if (Gallbox.imgP > 0) {
		Gallbox.prototype.showImage(Gallbox.imgP - 1);
	}
}

/**
 * Click Handler for the overlay div to hide the image container
 */
Gallbox.blanketClickHandler = function(evt) {

	Gallbox.prototype.container.hide();
}

Gallbox.prototype.container = {
	modal : 1,
	closeButton : 1,
	autosize : 1,
	obj_id : 'gbox',
	center : 1,
	navigator : 1,
	_content : null,
	_container : null,
	majorClassName : null,
	_borderLeft : null,
	_borderRight : null,
	_borderTop : null,
	_borderBottom : null
}
Gallbox.prototype.container.load = function() {
	if (this.modal > 0)
		this.loadBlanket();
	this.loadContainer();
}
Gallbox.prototype.container.loadBlanket = function() {
	if (document.getElementById('gallboxBlanket') == null) {
		var blanket = document.createElement('div');
		blanket.id = 'gallboxBlanket';
		blanket.className = 'gallboxbg';
		blanket.style.zIndex = -1;
		if (window.addEventListener) {
			blanket
					.addEventListener('click', Gallbox.blanketClickHandler,
							true);
		} else {
			blanket.attachEvent('onclick', Gallbox.blanketClickHandler);
		}
		document.body.appendChild(blanket);
	}
}
Gallbox.prototype.container.loadContainer = function() {
	var closeBTN = null;
	var id_window = this.obj_id + 'container';
	var id_topmargin = id_window + '_top';
	var id_leftmargin = id_window + '_left';
	var id_rightmargin = id_window + '_right';
	var id_bottommargin = id_window + '_bottom';
	var id_content = id_window + '_content';
	this._content = id_content;
	this._container = id_window;
	if (document.getElementById(id_window) == null) {
		var divWindow = document.createElement('div');
		var divTopL = document.createElement('div');
		var divTop = document.createElement('div');
		var divTopR = document.createElement('div');
		var divLeft = document.createElement('div');
		var divContent = document.createElement('div');
		var divRight = document.createElement('div');
		var divBottomL = document.createElement('div');
		var divBottom = document.createElement('div');
		var divBottomR = document.createElement('div');
		if (this.closeButton) {
			closeBTN = document.createElement('div');
			closeBTN.id = 'gallboxClose';
			if (window.addEventListener) {
				closeBTN.addEventListener('click', Gallbox.blanketClickHandler,
						true);
			} else {
				closeBTN.attachEvent('onclick', Gallbox.blanketClickHandler);
			}
		}
		divTopL.className = this.obj_id + ' tl';
		divTop.className = this.obj_id + ' top';
		divTopR.className = this.obj_id + ' tr';
		divLeft.className = this.obj_id + ' left';
		divContent.className = this.obj_id + ' content';
		divRight.className = this.obj_id + ' right';
		divBottomL.className = this.obj_id + ' bl';
		divBottom.className = this.obj_id + ' bottom';
		divBottomR.className = this.obj_id + ' br';
		if (this.majorClassName) {
			divWindow.className = this.majorClassName;
		}
		divWindow.style.position = 'absolute';
		divWindow.style.zIndex = 1101;
		divWindow.style.display = 'none';
		divWindow.id = id_window;
		divTop.id = id_topmargin;
		divLeft.id = id_leftmargin;
		divContent.id = id_content;
		divRight.id = id_rightmargin;
		divBottom.id = id_bottommargin;
		if (closeBTN != null) {
			divWindow.appendChild(closeBTN);
		}
		divWindow.appendChild(divTopL);
		divWindow.appendChild(divTop);
		divWindow.appendChild(divTopR);
		divWindow.appendChild(divLeft);
		divWindow.appendChild(divContent);
		divWindow.appendChild(divRight);
		divWindow.appendChild(divBottomL);
		divWindow.appendChild(divBottom);
		divWindow.appendChild(divBottomR);
		var clearBoth = document.createElement('div');
		clearBoth.setAttribute('style', 'clear:both');
		divWindow.appendChild(clearBoth);
		if (this.navigator) {
			var btn_prev = document.createElement('button');
			var btn_next = document.createElement('button');
			btn_prev.className = 'btnPrev';
			btn_next.className = 'btnNext';
			btn_prev.style.display = 'none';
			btn_next.style.display = 'none';
			btn_prev.id = this.obj_id + '_bprev';
			btn_next.id = this.obj_id + '_bnext';

			if (window.addEventListener) {
				btn_prev.addEventListener('click', Gallbox.goPrevImgHandler,
						true);
				btn_next.addEventListener('click', Gallbox.goNextImgHandler,
						true);

			} else {
				btn_prev.attachEvent('onclick', Gallbox.goPrevImgHandler);
				btn_next.attachEvent('onclick', Gallbox.goNextImgHandler);
			}
			var extraContainer = document.createElement('div');
			extraContainer.appendChild(btn_prev);
			extraContainer.appendChild(divWindow);
			extraContainer.appendChild(btn_next);
			extraContainer.style.position = 'absolute';
			// extraContainer.style.zIndex ='1110';
			extraContainer.style.display = 'block';
			extraContainer.id = 'raiosteparta';
			// extraContainer.style.backgroundColor='pink';

			document.body.appendChild(extraContainer);
		} else {
			document.body.appendChild(divWindow);
		}
	}
}
Gallbox.prototype.container.setContent = function(nodeObj) {
	if (this.autosize)
		this.setSize(nodeObj.width, nodeObj.height);
	document.getElementById(this._content).innerHTML = '';
	var clearBoth = document.createElement('div');
	clearBoth.setAttribute('style', 'clear:both');
	document.getElementById(this._content).appendChild(nodeObj);
	document.getElementById(this._content).appendChild(clearBoth);
}
Gallbox.prototype.container.setSize = function(width, height) {
	var idBase = this._container;
	var hide = null;
	if (this.navigator) {
		document.getElementById(this._content).parentNode.style.display = 'block';
	}
	if (document.getElementById(idBase).style.display == 'none') {
		/* document.getElementById(idBase).style.visibility='hidden'; */
		hide = document.getElementById(idBase).style.zIndex;
		document.getElementById(idBase).style.zIndex = -100;
		document.getElementById(idBase).style.display = 'block';
	}
	if (this._borderLeft == null
			&& document.getElementById(idBase + '_left').offsetWidth > 0)
		this._borderLeft = document.getElementById(idBase + '_left').offsetWidth;

	if (this._borderRight == null
			&& document.getElementById(idBase + '_right').offsetWidth)
		this._borderRight = document.getElementById(idBase + '_right').offsetWidth;

	if (this._borderTop == null
			&& document.getElementById(idBase + '_top').offsetHeight > 0)
		this._borderTop = document.getElementById(idBase + '_top').offsetHeight;

	if (this._borderBottom == null
			&& document.getElementById(idBase + '_bottom').offsetHeight > 0)
		this._borderBottom = document.getElementById(idBase + '_bottom').offsetHeight;

	var wWidth = width;
	if (this._borderLeft != null && this._borderRight != null)
		wWidth += this._borderLeft + this._borderRight;
	var wHeight = height;
	if (this._borderTop != null && this._borderBottom != null)
		wHeight += this._borderTop + this._borderBottom;
	Gallbox.prototype.showInfo('container.setSize ' + wWidth + 'x' + wHeight
			+ '|' + document.getElementById(idBase + '_left').offsetWidth);

	document.getElementById(idBase).style.width = wWidth + 'px';
	document.getElementById(idBase).style.height = wHeight + 'px';

	document.getElementById(this._content).style.width = width + 'px';
	document.getElementById(idBase + '_top').style.width = width + 'px';
	document.getElementById(idBase + '_bottom').style.width = width + 'px';

	document.getElementById(this._content).style.height = height + 'px';

	document.getElementById(idBase + '_left').style.height = height + 'px';
	document.getElementById(idBase + '_right').style.height = height + 'px';

	if (hide != null) {
		document.getElementById(idBase).style.zIndex = hide;
		document.getElementById(idBase).style.display = 'none';
	}
	if (this.navigator) {
		// alert("setSize="+wWidth+"x"+wHeight);
		this.setExtraContainerSize();
		document.getElementById(this._content).parentNode.style.display = 'none';
	}
}

Gallbox.prototype.container.setHeight = function(height) {
	var idBase = this._container;
	document.getElementById(this._content).style.height = height + 'px';
	document.getElementById(idBase + '_left').style.height = height + 'px';
	document.getElementById(idBase + '_right').style.height = height + 'px';
}
Gallbox.prototype.container.setExtraContainerSize = function() {
	var extraContainer = document.getElementById(this._container).parentNode;
	var xWidth = 0;
	var xHeight = 0;
	var tmpHeight = 0;
	for ( var i = 0; i < extraContainer.childNodes.length; i++) {
		// alert( parseInt( extraContainer.childNodes[i].style.width) +"
		// "+(parseInt( extraContainer.childNodes[i].style.width)==NaN));
		xWidth += (isNaN(parseInt(extraContainer.childNodes[i].style.width))) ? extraContainer.childNodes[i].offsetWidth
				: parseInt(extraContainer.childNodes[i].style.width);
		tmpHeight = (isNaN(parseInt(extraContainer.childNodes[i].style.height))) ? extraContainer.childNodes[i].offsetHeigh
				: parseInt(extraContainer.childNodes[i].style.height);
		if (tmpHeight > xHeight) {
			xHeight = tmpHeight;
		}
	}
	// alert("setExtraContainerSize="+xWidth+"x"+xHeight);
	extraContainer.style.width = (xWidth + 10) + 'px';
	extraContainer.style.height = xHeight + 'px';
}

Gallbox.prototype.container.show = function(callbackObject) {
	Gallbox.prototype.showInfo('show Container');
	Gallbox.prototype.showInfo(document.getElementById(this._container)
			.getAttribute('style'));
	var zIndex = 1100;
	var desgracado = this._container;
	if (this.modal) {
		document.getElementById('gallboxBlanket').style.zIndex = zIndex;
		document.getElementById('gallboxBlanket').style.display = 'block';
		document.getElementById(this._container).style.zIndex = zIndex;
	}
	if (this.navigator) {
		document.getElementById(this._container).style.display = 'block';
		document.getElementById(this._container).parentNode.style.display = 'block';
		document.getElementById(this.obj_id + '_bprev').style.display = 'block';
		document.getElementById(this.obj_id + '_bnext').style.display = 'block';

		this.setExtraContainerSize();
		document.getElementById(this._container).parentNode.style.zIndex = zIndex;
		desgracado = document.getElementById(this._container).parentNode.id;

	}
	if (this.center) {
		this.setPositionCenter();
	}
	if (document.getElementById('gallboxBlanket') != null) {
		var browserHeight = Utils.getBrowserHeight();
		if (browserHeight < Utils.marker.offsetTop) {
			browserHeight = Utils.marker.offsetTop;
		}
		document.getElementById('gallboxBlanket').style.height = browserHeight + 'px';
	}
	Gallbox.prototype.animation.fadeIn(desgracado, callbackObject);
}
Gallbox.prototype.container.hide = function(callbackObject) {
	if (this.navigator) {
		document.getElementById(this._container).style.position = 'absolute';
		Gallbox.prototype.animation.fadeOut(document
				.getElementById(this._container).parentNode.id, callbackObject);

	} else {
		Gallbox.prototype.animation.fadeOut(this._container, callbackObject);
	}
	if (this.modal) {
		document.getElementById('gallboxBlanket').style.zIndex = -10;
		document.getElementById('gallboxBlanket').style.display = 'none';
	}

}

Gallbox.prototype.container.setPositionCenter = function() {
	var tmpDisplay = document.getElementById(this._container).style.display;
	var tmpzIndex = document.getElementById(this._container).style.zIndex;
	document.getElementById(this._container).style.zIndex = '-1000';
	document.getElementById(this._container).style.display = 'block';
	var left = Math.round(((document.body.offsetWidth - document
			.getElementById(this._container).offsetWidth) / 2), 0);
	var top = Math.round(((document.body.offsetHeight - document
			.getElementById(this._container).offsetHeight) / 2), 0);
	document.getElementById(this._container).style.display = tmpDisplay;
	document.getElementById(this._container).style.zIndex = tmpzIndex;
	document.getElementById(this._container).style.top = top + 'px';
	document.getElementById(this._container).style.left = left + 'px';
	if (this.navigator) {
		// alert('top='+top+'left='+left);
		var extraContainer = document.getElementById(this._container).parentNode;
		var widthDIFF = 0;
		// this.setExtraContainerSize();
		widthDIFF = Math.round((extraContainer.offsetWidth - document
				.getElementById(this._container).offsetWidth) / 2);
		extraContainer.style.top = top + 'px';
		extraContainer.style.left = (left - widthDIFF) + 'px';
		document.getElementById(this._container).style.top = '0px';
		document.getElementById(this._container).style.left = '0px';
		document.getElementById(this._container).style.position = 'relative';
		// document.getElementById(this._container).style.zIndex='0px';

		// alert(extraContainer.getAttribute('style'));
	}
}
Gallbox.prototype.animation = {
	timer : [],
	tm : 75,
	ltimer:null,
	callback : null
}
Gallbox.prototype.animation.fadeIn = function(obj_id, callbackObject) {
	if (document.getElementById(obj_id) != null) {
		Gallbox.prototype.animation.ltimer=obj_id;
		Gallbox.prototype.showInfo('fadeIn ' + obj_id);
		var animObj = document.getElementById(obj_id);
		animObj.style.opacity = 0;
		animObj.style.filter = 'alpha(opacity=' + 0 + ')';
		animObj.style.display = 'block';

		Gallbox.prototype.animation.timer[obj_id] = setInterval(
				function() {
					if (animObj.style.opacity < 1) {
						animObj.style.opacity = Number(animObj.style.opacity) + 0.1;
						animObj.style.filter = 'alpha(opacity=' + Math
								.round(animObj.style.opacity * 100) + ')';
					} else {
						Gallbox.prototype
								.showInfo('IntervalTimers=' + Gallbox.prototype.animation.timer.length);
						clearInterval(Gallbox.prototype.animation.timer[obj_id]);
						
					}
				}, this.tm);
		 
	}
}
Gallbox.prototype.animation.fadeOut = function(obj_id, callbackObject) {
	if (document.getElementById(obj_id) != null) {
	
		if(Gallbox.prototype.animation.ltimer!=null){
			clearInterval(Gallbox.prototype.animation.timer[Gallbox.prototype.animation.ltimer]);	
			Gallbox.prototype.animation.ltimer=null;
		}		
		
		Gallbox.prototype.showInfo('fadeOut ' + obj_id);
		var animObj = document.getElementById(obj_id);
		Gallbox.prototype.animation.timer[obj_id] = setInterval(
				function() {
					if (animObj.style.opacity > 0) {
						animObj.style.opacity = Number(animObj.style.opacity) - 0.1;
						animObj.style.filter = 'alpha(opacity=' + (Number(animObj.style.opacity) * 100) + ')';
					} else {
						animObj.style.display = 'none';
						clearInterval(Gallbox.prototype.animation.timer[obj_id]);
						if (callbackObject != null) {
							callbackObject.showImage(Gallbox.imgP);
						}
					}
				}, this.tm);
	}
}
Gallbox.prototype.animation.setSpeed = function(value) {
	this.tm = value;
}
Gallbox.prototype.animation.getSpeed = function() {
	return this.tm;
}

Gallbox.prototype.Browser = {
	type : null,
	version : null
}
Gallbox.prototype.Browser.detect = function() {
	alert(navigator.userAgent.replace(/^([^\(]*)/, ''));
	alert(/\)([^\)\(]*)$/.exec(navigator.userAgent));
	alert(navigator.product);
}
// Gallbox.prototype.Browser.detect();
/**
 * debug function
 */
Gallbox.prototype.showInfo = function(msg) {
	if (this.debug) {
		if (document.getElementById('gallInfoDiv') == null) {
			this.loadInfoDiv();
		}
		if (msg.length > 0) {
			document.getElementById('gallInfoDiv').innerHTML = '<p>' + msg
					+ '</p>' + document.getElementById('gallInfoDiv').innerHTML;
		}
	}
}

/**
 * add a floating div into document.body where is displayed the showInfo
 * messages
 */
Gallbox.prototype.loadInfoDiv = function() {
	var infoDIV = document.createElement("div");
	infoDIV
			.setAttribute(
					'style',
					'background-color:#0f0f0f;color:#FFFFFF;position:absolute;top:0px;left:0px;width:300px;height:250px;overflow:scroll;z-index:1113');
	infoDIV.id = 'gallInfoDiv';
	document.getElementsByTagName('body')[0].appendChild(infoDIV);
}

