/* LIGHTBOX */
Object.extend(Element, {
	getHeight: function(element) {
		element = $(element);
		return element.offsetHeight; 
	},
	getWidth: function(element) {
		element = $(element);
		return element.offsetWidth; 
	},
	getWidth: function(element) {
		element = $(element);
		return element.offsetWidth; 
	},
	setHeight: function(element, h) {
		element = $(element);
		element.style.height = h + 'px';
	},
	setWidth: function(element, w) {
		element = $(element);
		element.style.width = w + 'px';
	},
	setTop: function(element, t) {
		element = $(element);
		element.style.top = t + 'px';
	},
	setLeft: function(element, l) {
		element = $(element);
		element.style.left = l + 'px';
	}, 
	setInnerHTML: function(element, content) {
		element = $(element);
		element.innerHTML = content;
	}
});

var Lightbox = Class.create();
var Lightbox_Height = 0;
var Lightbox_Width = 0;

Lightbox.prototype = {
	// initialize() - lightbox constructor 
	initialize: function() {

		// bind lightbox to hrefs with attribute 'rel'
		var anchors = document.getElementsByTagName('a');
		for (var i=0; i<anchors.length; i++) {
			var relAttribute = String(anchors[i].getAttribute('rel'));
			if (anchors[i].getAttribute('href') && (relAttribute.toLowerCase().match('lightbox')))
				anchors[i].onclick = function () { myLightbox.start(this); return false;}
		}

		// create lightbox HTML with DOM
		var objBody = document.getElementsByTagName('body').item(0);

		var objOverlay = document.createElement('div');
		objOverlay.setAttribute('id', 'overlay');
		objOverlay.style.display = 'none';
		objOverlay.onclick = function() { myLightbox.end(); return false; }
		objBody.appendChild(objOverlay);

		var objLightbox = document.createElement('div');
		objLightbox.setAttribute('id', 'lightbox');
		objLightbox.className = 'lightbox';
		objLightbox.style.visibility = 'hidden';
		objBody.appendChild(objLightbox);
		Lightbox_Width = Element.getWidth('lightbox');
		Lightbox_Height = Element.getHeight('lightbox');
		objLightbox.style.display = 'none';
		objLightbox.style.visibility = 'visible';

		var objContainer1 = document.createElement('div');
		objContainer1.setAttribute('id', 'container1');
		objContainer1.style.display = 'none';
		objLightbox.appendChild(objContainer1);

		var objContainer2 = document.createElement('div');
		objContainer2.setAttribute('id', 'container2');
		objContainer2.style.display = 'none';
		objLightbox.appendChild(objContainer2);

		var objLightboxImage = document.createElement('img');
		objLightboxImage.setAttribute('id', 'lightboxloadingimage');
		objLightboxImage.setAttribute('src', 'img/lightbox/loading.gif'); 
		objLightboxImage.setAttribute('width', '16');
		objLightboxImage.setAttribute('height', '16');
		objContainer1.appendChild(objLightboxImage);
	},
	// start(aLink) - link executer
	start: function(aLink) {

		$('container1').style.display = 'block'; 
		$('container2').style.display = 'none'; 
		
		var arrayPageSize = getPageSize();
		var arrayPageScroll = getPageScroll();

		Element.setHeight('overlay', arrayPageSize[1]);
		new Effect.Appear('overlay', { duration: 0.1, from: 0.0, to: 0.7 });
		
		Element.setTop('lightbox', arrayPageScroll[1] + ((arrayPageSize[3] - Lightbox_Height) / 2));
		Element.show('lightbox');
		
		this.ajaxrequest(aLink);
	},
	// ajaxrequest(aLink) - AJAX request
	ajaxrequest: function(aLink) { 
		// workarround with generated random value what disables IE AJAX caching
		var params = 'timestamp=' + parseInt(Math.random() * 99999999);
		// AJAX request with Prototype
		var aRequest = new Ajax.Request(aLink.toString(), {method: 'get', parameters: params, onComplete: this.ajaxresponse});
	},
	// ajaxresponse(aResponse) - AJAX response
	ajaxresponse: function(aResponse) {
		$('container1').style.display = 'none'; 
		Element.setInnerHTML('container2', aResponse.responseText);
		$('container2').style.display = 'block'; 
	},
	// end() - hides the lightbox
	end: function() {
		Element.hide('lightbox');
		new Effect.Fade('overlay', { duration: 0.2 });
	}
	}

	function getPageScroll(){

	var yScroll;

	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
	} else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
	} else if (document.body) {// all other Explorers
		yScroll = document.body.scrollTop;
	}

	arrayPageScroll = new Array('',yScroll) 
	return arrayPageScroll;
	}

	function getPageSize(){

	var xScroll, yScroll;

	if (window.innerHeight && window.scrollMaxY) {
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}

	var windowWidth, windowHeight;
	if (self.innerHeight) { // all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	

	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight)
		pageHeight = windowHeight;
	else
		pageHeight = yScroll;

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth)
		pageWidth = windowWidth;
	else
		pageWidth = xScroll;

	arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight);
	return arrayPageSize;
}

function initLightbox() {
	myLightbox = new Lightbox(); 
}
Event.observe(window, 'load', initLightbox, false);


/* TOOLTIP */

Object.extend(Element, {
	getHeight: function(element) {
		element = $(element);
		return element.offsetHeight; 
	},
	getWidth: function(element) {
		element = $(element);
		return element.offsetWidth; 
	},
	getWidth: function(element) {
		element = $(element);
		return element.offsetWidth; 
	},
	setHeight: function(element, h) {
		element = $(element);
		element.style.height = h + 'px';
	},
	setWidth: function(element, w) {
		element = $(element);
		element.style.width = w + 'px';
	},
	setTop: function(element, t) {
		element = $(element);
		element.style.top = t + 'px';
	},
	setLeft: function(element, l) {
		element = $(element);
		element.style.left = l + 'px';
	},
	setInnerHTML: function(element, content) {
		element = $(element);
		element.innerHTML = content;
	}
});

var Tooltip = Class.create();

Tooltip.prototype = {

	// initialize() - Tooltip constructor 
	initialize: function() {

		var anchors = null;
		
		// change IUPAC (labda)
		anchors = document.getElementsByTagName('a');
		
		for (var i = 0; i < anchors.length; i++) {
			var relAttribute = String(anchors[i].getAttribute('tooltip'));
			
			if (anchors[i].getAttribute('href') && (relAttribute.toLowerCase().match('tooltip')))
				anchors[i].onclick = function () { 
					myTooltip.start(this); 
					return false;
				}
				
			// replace "^{" and "}" strings with start <sup> and end <sup> tags
			if (String(anchors[i].getAttribute('makeSupFormating')) == "true")
				anchors[i].innerHTML = addSupTags(anchors[i].innerHTML);
		}
		
		// hilight searched values with <span>
		anchors = document.getElementsByTagName('p');
		
		for (var i = 0; i < anchors.length; i++) {
			
			var isTextSearch = String(anchors[i].getAttribute('isTextSearch'));
			var textSearchValue = String(anchors[i].getAttribute('textSearchValue'));
			
			if (isTextSearch == 'true' && textSearchValue != '') {
				
				var textSearchType = String(anchors[i].getAttribute('textSearchType'));
				var stringDataType = String(anchors[i].getAttribute('stringDataType'));
				var spanStart = "<span class=\"textSearchColoring\">";
				var spanEnd = "</span>";

				if (textSearchType == stringDataType) {
					
					// extract text
					var inputValue = anchors[i].childNodes[0].innerHTML;
					var outputValue = inputValue;
					
					if (inputValue != undefined) {

						var positionIndexStart = 0;
						var positionIndexEnd = 0;
						
						while (positionIndexStart != -1) {

							inputValue = outputValue;

							positionIndexStart = inputValue.toUpperCase().indexOf(textSearchValue.toUpperCase(), positionIndexEnd);

							if (positionIndexStart != -1) {
								outputValue = inputValue.substring(0, positionIndexStart) + spanStart + inputValue.substring(positionIndexStart, positionIndexStart + textSearchValue.length) + spanEnd + inputValue.substring(positionIndexStart + textSearchValue.length);
								positionIndexEnd = positionIndexStart + textSearchValue.length + spanStart.length + spanEnd.length;
								
							}
						}
						anchors[i].childNodes[0].innerHTML = outputValue;
					}
				}
			} 
		}

	// create tooltip object
	if ($('tooltip') == null) {
	
		// create Tooltip HTML with DOM
		var objBody = document.getElementsByTagName('body').item(0);
		var objToolTip = document.createElement('div');
		objToolTip.setAttribute('id', 'tooltip');
		objToolTip.className = 'tooltip';
		objToolTip.style.visibility = 'hidden';
		objBody.appendChild(objToolTip);
		objToolTip.style.display = 'none';
		objToolTip.style.visibility = 'visible';
	
		objToolTip.innerHTML = 
			'<div width="100%" style="background-color: #F7F7F7; border: solid 1px #333333;">'+
			'    <div id="tooltipTitle"></div>'+
			'    <div style="margin: 2px 2px 2px 4px;">'+
			'       <div id="tooltipText"></div>'+
			'    </div>'+
			'    <div id="tooltipClosePanel"><a href="javascript: myTooltip.end();">Close</a></div>'+
			'</div>';
	
	}
	
},

// start(aLink) - link executer
start: function(aLink, aTitle, aText) {

	if (aTitle == 'Group description') {
		$('tooltipTitle').innerHTML = aTitle;
		$('tooltipText').innerHTML = aText;
	}
	else {
		$('tooltipTitle').innerHTML = aTitle + ' values';
		$('tooltipText').innerHTML = aText + '<br><a href="javascript: myTooltip.end();">Copy to text search</a>';
	}

	var y = 0;
	var x = 0;
	var currentObject = aLink;

	while (currentObject.offsetParent) {
		y += currentObject.offsetTop;
		x += currentObject.offsetLeft;
		currentObject = currentObject.offsetParent;
	}

	Element.setTop('tooltip', y + 17);
	Element.setLeft('tooltip', x - 2);
	Element.show('tooltip');

},

// start(aLink) - link executer
startLink: function(aLink, aTitle, aAxajLink, aId, aKey) {

	$('tooltipTitle').innerHTML = aTitle + ' values';
	
	// workarround with generated random value what disables IE AJAX caching
	var params = '&id=' + aId + '&key=' + aKey;
	// AJAX request with Prototype
	var aRequest = new Ajax.Request(aAxajLink.toString(), {method: 'get', parameters: params, onComplete: this.ajaxresponse});

	var y = 0;
	var x = 0;
	var currentObject = aLink;

	while (currentObject.offsetParent) {
		y += currentObject.offsetTop;
		x += currentObject.offsetLeft;
		currentObject = currentObject.offsetParent;
	}

	Element.setTop('tooltip', y + 17);
	Element.setLeft('tooltip', x - 2);
	Element.show('tooltip');

},

ajaxresponse: function(aResponse) {
	$('tooltipText').innerHTML = aResponse.responseText;
},

// the same as start, + addEnterAfterComma feature (search comma in aText,replace spaces with '', and add'\n' element after comma)
showTooltip: function(aLink, aTitle, aText, addEnterAfterComma) {

	var aDisplayText = '';
	
	var aTextSearchType = ''; 
	var temp = '';
	var tempescaped = '';
	
	if (aTitle == 'IUPAC')
		aTextSearchType = 'IUPAC or Name';
	if (aTitle == 'CAS#')
		aTextSearchType = 'CAS Number';
	if (aTitle == 'Name')
		aTextSearchType = 'IUPAC or Name';
	
	var strAarray = aText.split(';');
	for (var i = 0; i < strAarray.length; i++){
		temp = strAarray[i];
		tempescaped = temp.split('\'').join('\\\'');
		
		aDisplayText += '<p class="tooltipValueText"><b><u>' + (i + 1) + '.</u></b> ' + correctValue(temp);
		aDisplayText += '<br><img src="img/icons/copy.gif" style="vertical-align: top;" title="Copy value to text search" alt="Copy value to text search"> <a href="javascript: {}" onclick="javascript: $(\'searchValue\').value = \'' + tempescaped + '\'; scroll(0, 0); myTooltip.end();">Copy to text search</a></p>';
	}

	$('tooltipTitle').innerHTML = aTitle + ' values';
	$('tooltipText').innerHTML = aDisplayText;
	var y = 0;
	var x = 0;
	var currentObject = aLink;

	while (currentObject.offsetParent) {
		y += currentObject.offsetTop;
		x += currentObject.offsetLeft;
		currentObject = currentObject.offsetParent;
	}

	Element.setTop('tooltip', y + 17);
	Element.setLeft('tooltip', x - 2);
	Element.show('tooltip');
	
},

// end() - hides the Tooltip
end: function() {
	Element.hide('tooltip');
}

}

function correctValue(inputValue){

	var result = '';
	var temp = '';
	var t = 0;

	var mySplitResult = inputValue.split("-");

	for (i = 0; i < mySplitResult.length; i++) {
		if (t + mySplitResult[i].length <= 50) {
			temp = (result == '' ? '' : '-') + mySplitResult[i];
			result += temp;
			t += temp.length;
		}
		else {
			temp = '-<br>' + mySplitResult[i];
			result += temp;
			t = mySplitResult[i].length;
		}
	}

	return result ;

}


function initTooltip() { 
	myTooltip = new Tooltip(); 
}

Event.observe(window, 'load', initTooltip, false);

//replace ^{ and } strings with start <sup> and end <sup> tags
function addSupTags(inputValue){

	var positionIndexStart = 0;
	var positionIndexEnd = inputValue.indexOf("^{", 0);

	var outputValue = inputValue;
	var tagStart = "<sup>";
	var tagEnd = "</sup>";
	var pos = 0;

	while (positionIndexStart!=-1) {

		inputValue = outputValue;
		startPos = inputValue.indexOf("^{", positionIndexEnd);
		endPos = inputValue.indexOf("}", positionIndexEnd);
		positionIndexStart = startPos;

		if (endPos == -1 && startPos != -1)
			endPos = inputValue.length;

		if (positionIndexStart != -1) {
			outputValue = inputValue.substring(0, startPos) + tagStart + inputValue.substring(startPos + 2, endPos) + tagEnd + inputValue.substring(endPos + 1, inputValue.length);
			positionIndexEnd = startPos + (endPos - (startPos + 2)) + tagStart.length + tagEnd.length;
		}
	}

	//replace $l, $2, etc with lambda
	outputValue = outputValue.split('$l').join('&lambda;');
	outputValue = outputValue.split('$2').join('&lambda;');
	outputValue = outputValue.split('$3').join('&lambda;');
	outputValue = outputValue.split('$4').join('&lambda;');
	outputValue = outputValue.split('$5').join('&lambda;');
	outputValue = outputValue.split('$6').join('&lambda;');
	outputValue = outputValue.split('$7').join('&lambda;');
	outputValue = outputValue.split('$8').join('&lambda;');
	outputValue = outputValue.split('$9').join('&lambda;');
	outputValue = outputValue.split('$10').join('&lambda;');
	outputValue = outputValue.split('$11').join('&lambda;');
	outputValue = outputValue.split('$12').join('&lambda;');
	outputValue = outputValue.split('$13').join('&lambda;');
	outputValue = outputValue.split('$14').join('&lambda;');
	outputValue = outputValue.split('$15').join('&lambda;');

	return outputValue;

}