var opacity = 0.6;
var animate = true;
var inAction = false;
var scaleDuration = 0.6;
var scaleDelay = 0.4;
var highlightDuration = 0.5;
var origWidth = 0;
var origHeight = 0;
var whxLightbox = Class.create();

whxLightbox.prototype = {
	overlay: 'overlay',
	currElement: 0,
	highlightContainer: 'highlightContainer',
	highlightElements: new Array(),
	
	initialize: function() {
		// hide the overlay Container's
		$('overlay').hide();
		$('highlightContainer').hide();
		
		// hide all childs of the 'highlightContainer'
		var childs = $('highlightContainer').immediateDescendants();
		for( i=0; i != childs.length; i++ ) { // save original container size's
			var element = childs[i];
			element.hide();
		}
		this.activateTags();
	},
	
	activateTags: function() {
		if (!document.getElementsByTagName){ return; }
		var arrTags = document.getElementsByTagName('*');
		for (var i=0; i<arrTags.length; i++) { // loop through all html tags
			var tag = arrTags[i];
			relAttribute = String(tag.getAttribute('rel'));
			classAttribute = String(tag.className);
			// ACTIVATE LIGHTBOX
			if ( relAttribute.toLowerCase().match('aktivate') ) { // use the string.match() method to catch 'aktivate' references in the rel attribute
				if ( classAttribute == 'mySiteSettings' ) {
					tag.onclick = function () { myLightbox.start('mySiteSettings'); return false; }
					tag.onmouseover = function () { this.style.cursor='pointer' };
				}	else return false;
			}		
		}
	},
 
	start: function( element ) {
		if(inAction) return false;
		inAction = true;
		hideFlash();
		if( getBrowserName() == 'MSIE6.0' ) { hideSelectBoxes(); }
		var currElement = element;
		var objLayer = $('overlay');
		new Effect.Appear( 'overlay', { duration: scaleDuration, from: 0.0, to: opacity } );
		new Effect.Appear( 'highlightContainer', { duration: scaleDuration, from: 0.0, to: 1.0 } );
		this.switchToElement(currElement, true);
		objLayer.onclick = function () { myLightbox.end(currElement); return false; }
	},
	
	switchToElement: function(element, animate) {
		var resizeWidth = 420;
		var resizeHeight = 300;
		var oldElement = '';
		if ( animate ) {
			var currBody = element;
			var currBodyContent = element+'Content';
			var currBodyOptions = element+'Options';
			new Effect.Appear( currBody, { duration: scaleDuration, from: 0.0, to: 1.0 } );
			new Effect.Appear( currBodyContent, {
				duration: scaleDuration, delay: 1.0,from: 0.0,to: 1.0,
				afterFinish: function() {
					new Effect.SlideDown( currBodyOptions, { afterFinish: function() { inAction=false; } });
				}
			});			
		} else {
			$(element).show();
		}
		//this.resizeLayer( element, resizeWidth, resizeHeight );
	},
	
	resizeLayer: function( element, newWidth , newHeight ) {
		var stylesWidth = $(element).getStyle('width');
		var stylesHeight = $(element).getStyle('height');
		var currWidth = stylesWidth.slice(0, stylesWidth.length - 2);
		var currHeight = stylesHeight.slice(0, stylesHeight.length - 2);
		var diffWidth =  (newWidth / currWidth) * 100;
		var diffHeight =  (newHeight / currHeight) * 100;
		new Effect.Scale( element, diffWidth , { scaleY: false, duration: scaleDuration } );
		new Effect.Scale( element, diffHeight , { scaleX: false, duration: scaleDuration, delay: scaleDelay } );
	},
	
	end: function(element) {
		if(inAction) return false;
		new Effect.SlideUp( element+'Options', { duration: 0.6,
			afterFinish: function() {
				new Effect.Fade(element+'Content', { duration: 0.4,
					afterFinish: function() {
						new Effect.Fade( element, { duration: 0.4,
							afterFinish: function() {
								new Effect.Fade( 'overlay', {	duration: 0.2, afterFinish: function() {
									inAction=false;
									showFlash();
									if( getBrowserName() == 'MSIE6.0' ) { showSelectBoxes(); }
								} });
							}
						});
					}
				});
			}
		});
	}
}

// --------------------------------------------


function showSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}

function hideSelectBoxes(){
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}

function showInputBoxes(){
	var selects = document.getElementsByTagName("input");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}

function hideInputBoxes(){
	var selects = document.getElementsByTagName("input");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}

function showFlash(){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		flashObjects[i].style.visibility = "visible";
		flashObjects[i].style.opacity = "1.0";
	}
	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		flashEmbeds[i].style.visibility = "visible";
	}
}

function hideFlash(){
	var flashObjects = document.getElementsByTagName("object");
	for (i = 0; i < flashObjects.length; i++) {
		flashObjects[i].style.visibility = "hidden";
		flashObjects[i].style.opacity = "0.0";
	}
	var flashEmbeds = document.getElementsByTagName("embed");
	for (i = 0; i < flashEmbeds.length; i++) {
		flashEmbeds[i].style.visibility = "hidden";
	}
}

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