Effects = function ()
	{
		this.moveBox = function (box)
		{
			return new MoveBox(box);
		}
		this.opacityBox = function(box)
		{
			return new OpacityBox(box);
		}
		
		MoveBox = function(box)
		{	
			box.ToTop = box.getTop();
			box.ToLeft = box.getLeft();
			this.setFromTop = function(value){box.setTop(value);}
			this.setFromLeft = function(value){box.setLeft(value);}
			this.speed = function (value){box.speed=value;}	
				
			function moveBox ()
			{
				if (box.getLeft()==box.ToLeft && box.getTop()==box.ToTop)
				{
					clearInterval(this.start);
				}else{
					if (box.getTop()>box.ToTop) box.setTop(box.getTop()-10);
					if (box.getTop()<box.ToTop) box.setTop(box.getTop()+10);
					if (box.getLeft()>box.ToLeft) box.setLeft(box.getLeft()-10);
					if (box.getLeft()<box.ToLeft) box.setLeft(box.getLeft()+10);
				}
			}
			
			this.start=function()
			{	
				var start = window.setInterval(moveBox, box.speed);
			}
		}


		OpacityBox = function(box)
		{	
		
			OpacitySet = function(box)
			{
				oThis =this;
				this.obj = box;
				oThis.i = 1;
				this.setVar = function (value){i=value;}
				this.getVar = function (){return i;}
				this.getEnd = function(){return opacEnd}
			}
			var opacity = new OpacitySet(box);
		
			var opacEnd;
			var speed;
			this.setOpacCurrent = function(value){opacity.setVar(value);}
			this.setOpacEnd = function(value){opacEnd=value;}
			this.setSpeed = function (value){speed=value;}	

			this.start=function()
			{	
				setInterval(changeOpac, speed);
			}
						
			//change the opacity for different browsers
			function changeOpac() {
				
				if(opacity.getVar() == opacity.getEnd())
				{
					clearInterval(this.start);
				}else{	
					if(opacity.getVar() > opacity.getEnd())
						opacity.setVar(opacity.getVar()-1);
					if(opacity.getVar() < opacity.getEnd())
						opacity.setVar(opacity.getVar()+1);

					opacity.obj.setOpacity(opacity.getVar());
				}				
			}
				
			function shiftOpacity(id, millisec) {
				//if an element is invisible, make it visible, else make it ivisible
				if(document.getElementById(id).style.opacity == 0) {
					opacity(id, 0, 100, millisec);
				} else {
					opacity(id, 100, 0, millisec);
				}
			}

			function blendimage(divid, imageid, imagefile, millisec) {
				var speed = Math.round(millisec / 100);
				var timer = 0;
				
				//set the current image as background
				document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
				
				//make image transparent
				changeOpac(0, imageid);
				
				//make new image
				document.getElementById(imageid).src = imagefile;
			
				//fade in image
				for(i = 0; i <= 100; i++) {
					setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed));
					timer++;
				}
			}
		}
	}
	
	Util = function Util()
	{
	    this.addEvent = function (par_oHtmlElement, par_sEventName, par_rFunction, par_bUseCapture)
	    {   
	        if (par_oHtmlElement.addEventListener)
	        {
	            if(!par_bUseCapture && typeof(par_bUseCapture)=="undefined") par_bUseCapture = true;
	            par_oHtmlElement.addEventListener(par_sEventName, par_rFunction, par_bUseCapture);
	            return true;
	        }
	        else if (par_oHtmlElement.attachEvent)
	        {
	            var bReturnCode = par_oHtmlElement.attachEvent("on"+par_sEventName, par_rFunction);
	            return bReturnCode;
	        }
	        else return false;
	    }
	
	    this.getElementsByAttribute = function (oElm, strTagName, strAttributeName, strAttributeValue)
	    {
			var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
			var arrReturnElements = new Array();
			var oAttributeValue = (typeof strAttributeValue != "undefined")? new RegExp("(^|\\s)" + strAttributeValue + "(\\s|$)") : null;
			var oCurrent;
			var oAttribute;
			for(var i=0; i<arrElements.length; i++){
				oCurrent = arrElements[i];
				oAttribute = oCurrent.getAttribute && oCurrent.getAttribute(strAttributeName);
				if(typeof oAttribute == "string" && oAttribute.length > 0){
					if(typeof strAttributeValue == "undefined" || (oAttributeValue && oAttributeValue.test(oAttribute))){
						arrReturnElements.push(oCurrent);
					}
				}
			}
			return arrReturnElements;
		}
		
		this.random = function(value)
					{	var int = Math.floor(Math.random()*10)*value;
						return int;
					}
		this.IsNotUneven = function (numero)
		{
		    if (isNaN(numero) == false)
		    {
		        return (numero %2 == 1 ?  true : false);
		    }
		    else
		    {
		        return null;
		    }
		}
	}
	
	Menu = function Menu(par_oMenuBox)
			{
			
				var oThis = this;
				var cls_oMenuBox = par_oMenuBox,
					cls_oTarget=null;
				var mouseOver=null;
				
				var aVoiceBoxes = util.getElementsByAttribute(cls_oMenuBox, "*", "SD_selector", "button");
				
				var aVoices = new Array(aVoiceBoxes.length);
				var cls_iSelectedVoice;
				
				var loadTarget = function (par_Owner, par_oVoice)
								{
									var iSelectedVoiceIndex = par_oVoice.getIndex();
									var oTarget = oThis.getTarget();
									var imgFormat= "low";
									for(i=0;i < oThis.getVoices().length; i++)
									{	
										oThis.getVoices()[i].setState(false);
									}
									
									if(oTarget.getId()!='Display')
									{
										for (i=0; i < oTarget.getVoices().length; i++ )
										{	
											var sPath = "images/"+iSelectedVoiceIndex+"/"+imgFormat+i+".jpg";
											
											oTarget.getVoices()[i].getBox().src=sPath;
											oTarget.getVoices()[i].getBox().alt = sPath;
										}
									}else{
										var sPath1 = par_oVoice.getBox().src.replace("over","high");
										oTarget.getVoices()[0].getBox().src = sPath1;
										oTarget.getVoices()[0].getBox().alt = sPath1;
									}
									oTarget.setDisplay("block");
								}
				
				for (i=0;i < aVoiceBoxes.length; i++)
				{
					aVoices[i] = new Voice(oThis, aVoiceBoxes[i], i, loadTarget);
				}
				this.setTarget = function (par_oTarget){cls_oTarget=par_oTarget;}
				this.getTarget = function (){return cls_oTarget;}
				this.getVoices = function (){return aVoices;}
				this.getId = function (){return cls_oMenuBox.id;}
				this.setDisplay = function(par_sValue){cls_oMenuBox.style.display = par_sValue;}
				this.addMouseOver = function()
									{	
										for (i=0;i < aVoiceBoxes.length; i++)
										{
											aVoices[i].addMouseOver();
										}									
									}
			}
			
	Voice = function Voice(par_Owner, par_oVoiceBox, par_iIndex, par_callback)
			{
				var oThis = this;
				var cls_oVoiceBox = par_oVoiceBox,
					cls_iIndex = par_iIndex;
				var cls_bState = false;
				var defaultClassName = cls_oVoiceBox.className;
				cls_oVoiceBox.className = defaultClassName + "Off " + defaultClassName;
								
				var loadTarget = function ()
								{	
									document.getElementById('thumbnails').style.display='none';
									document.getElementById('Menu2').style.height='402px';
									//document.getElementById('Display').style.height='397px';
										
									//document.getElementById('Display').style.width='600px';
									//document.getElementById('Display').style.width='auto';
									par_callback(par_Owner, oThis);
									oThis.setState(cls_bState);
								}
				this.getBox = function (){return cls_oVoiceBox;}
				this.getIndex = function (){return cls_iIndex;}

				this.getState = function (){return cls_bState;}
				this.setState = function (bState)
								{
									if(bState==false)
									{
										cls_oVoiceBox.className = defaultClassName + "Off " + defaultClassName ;
										cls_bState=true;
									}else{
										cls_oVoiceBox.className = defaultClassName + "On " + defaultClassName;
										cls_bState=false;
									}
								}
				this.addMouseOver = function()
									{
										var changeState = function ()
										{
											var sPath1 = cls_oVoiceBox.src.replace("low","over");
											cls_oVoiceBox.src = sPath1;
											cls_oVoiceBox.alt = sPath1;
										}
										var resetState = function ()
										{
											var sPath1 = cls_oVoiceBox.src.replace("over","low");
											cls_oVoiceBox.src = sPath1;
											cls_oVoiceBox.alt = sPath1;
										}
										var bAddEvent;
										bAddEvent = util.addEvent(cls_oVoiceBox, "mouseover", changeState, true);
										bAddEvent = util.addEvent(cls_oVoiceBox, "mouseout", resetState, true);
									}
	
				var bAddEvent;
				this.addMouseClick = function(func)
								{
									
									bAddEvent = util.addEvent(cls_oVoiceBox, "click", func, true);
									bAddEvent = util.addEvent(cls_oVoiceBox, "click", loadTarget, true);
									
								}
				
				bAddEvent = util.addEvent(cls_oVoiceBox, "click", loadTarget, true);
			}		

			
	MagicBox=function(owner)
	{   
		var oThis = this;
		
		var effectCollection = new Array();
		oThis.div = owner;
		oThis.div.style.width='100%';
		
		oThis.debug = document.createElement('span');
		this.setDisplay = function(value){oThis.div.style.display=value;}
		this.setVisibility= function(value){oThis.div.style.visibility=value;}
		this.setPosition = function (value){oThis.div.style.position = value;}
		this.getStyle = function(){return oThis.div.style;}
		this.getText = function(){return oThis.div.innerHTML;}
		this.setTop =  function(value){oThis.div.style.top=value+'px';}
		this.getTop =  function(){return parseInt(oThis.div.style.top);}
		this.setLeft = function(value){oThis.div.style.left=value+'px';}
		this.getLeft = function(){return parseInt(oThis.div.style.left);}
		this.setOpacity = function(value)
							{
								var object = oThis.div.style; 
								object.opacity = (value / 100);
								object.MozOpacity = (value / 100);
								object.KhtmlOpacity = (value / 100);
								object.filter = 'alpha(opacity=' + value + ')';
							}

		this.setAlign = function(value) {oThis.div.style.textAlign=value;}
		this.setMargin = function(value) {oThis.div.style.margin=value;}
		this.writeDebug = function(value)
						{
							oThis.debug.innerHTML ="";
							oThis.debug.innerHTML =value;			
						}
						
		this.start = function()
		{
			for(i=0; i<effectCollection.length; i++)
			{
				effectCollection[i].start();
			}
		
		}
		
		this.addEffectMove = function()
			{
				var moveBox = effects.moveBox(oThis);
				effectCollection[effectCollection.length]=moveBox;
				return moveBox;
			}

		this.addEffectOpacity = function()
			{
				var opacityBox = effects.opacityBox(oThis);
				effectCollection[effectCollection.length]=opacityBox;
				return opacityBox;
				
			}
			
	}
	
	MagicParagraph = function (owner)
	{
		var oThis = this;
		oThis.owner = owner;
		oThis.paragraph = new Array();
		oThis.MagicBoxCollection = new Array();
		oThis.top=0;
		oThis.left=0;
		oThis.align='left';
		oThis.rowMargin="0px";
		oThis.display='block';
		this.addRows = function(value){oThis.paragraph = value;}
		this.setTop = function (value){oThis.top=value;}
		this.setleft = function (value){oThis.left=value;}
		this.setAlign = function(value){oThis.align=value;}
		this.setRowMargin = function(value){oThis.rowMargin=value;}
		this.setDisplay = function(value){oThis.display=value;}
		this.start = function()
					{
						for(x=0; x < oThis.paragraph.length; x++)
						{
							var magicBox = new MagicBox(oThis.paragraph[x]);
							oThis.MagicBoxCollection[x] = magicBox; 
							magicBox.setPosition('relative');
							magicBox.setDisplay(oThis.display); 
							magicBox.setTop(oThis.top);
							magicBox.setMargin(oThis.rowMargin);
							//magicBox.writeDebug(oThis.top+"*"+x+" + "+ oThis.spacing);
							magicBox.setLeft(oThis.left);
							magicBox.setAlign(oThis.align);
							magicBox.setOpacity(0);

							var moveBox = magicBox.addEffectMove();
							moveBox.setFromTop(util.random (20));
							moveBox.setFromLeft(util.random (20));
							moveBox.speed(util.random (30));

							var opacityBox = magicBox.addEffectOpacity();
							opacityBox.setOpacCurrent(0);
							opacityBox.setOpacEnd(100);
							opacityBox.setSpeed(100);
							magicBox.start();
						}
					}
		this.setDisplay = function(value)
					{
						for(i=0;i< oThis.MagicBoxCollection.length; i++)
						{
							oThis.MagicBoxCollection[i].setDisplay(value);
						}
					}
	}
	function setup ()
	{
		var oMenu1 = new Menu(document.getElementById("Menu1"));
		oMenu1.setDisplay("block");
		
		var oMenu2 = new Menu(document.getElementById("Menu2"));
		
		oMenu1.setTarget(oMenu2);
		oMenu2.addMouseOver();

		var displayBox = document.getElementById("Display");
		var oDisplay = new Menu(displayBox);
		oMenu2.setTarget(oDisplay);

		var magicParagraphIT = new MagicParagraph(displayBox);
		magicParagraphIT.addRows(util.getElementsByAttribute(displayBox, "*", "SD_selector", "textIT"));
		magicParagraphIT.setTop(10);
		magicParagraphIT.setRowMargin("0px 0px 5px 0px");
		magicParagraphIT.setAlign('right');
		magicParagraphIT.start();
		
		var magicParagraphDE = new MagicParagraph(displayBox);
		magicParagraphDE.addRows(util.getElementsByAttribute(displayBox, "*", "SD_selector", "textDE"));
		magicParagraphDE.setTop(80);
		magicParagraphDE.setRowMargin("0px 0px 5px 0px");
		magicParagraphDE.setAlign('left');
		magicParagraphDE.start();
		
		function clearIntro()
		{
			magicParagraphIT.setDisplay('none');
			magicParagraphDE.setDisplay('none');
		}
		for(i=0; i < oMenu1.getVoices().length; i++)
		{
			oMenu1.getVoices()[i].addMouseClick (clearIntro);
		}
		
		function loadOpacityImage()
		{
			var magicBox = new MagicBox(oDisplay.getVoices()[0].getBox());
			magicBox.setDisplay('block'); 
			magicBox.setVisibility('visible');
		/*	
			magicBox.setOpacity(100);
			var opacityBox = magicBox.addEffectOpacity();
			opacityBox.setOpacCurrent(100);
			opacityBox.setOpacEnd(0);
			opacityBox.setSpeed(70);*/
			magicBox.start();
		}
		for(i=0; i < oMenu1.getVoices().length; i++)
		{
			oMenu2.getVoices()[i].addMouseClick (loadOpacityImage);
		}
	}	


	var effects = new Effects();
	var util = new Util();