var titulos=new Array(); 
/*---------------------------------------------*/
/*---------------------------------------------*/
titulos[1]="La buena batalla";
titulos[2]="The Chuo Line";
titulos[3]="Wood";
titulos[4]="Yermo Capital";
titulos[5]="An a Cow";
titulos[6]="Cubo de Luz";
titulos[7]="Radio";
titulos[8]="Graffity";
/*---------------------------------------------*/
/*---------------------------------------------*/

//imagen cargando
var crg=new Image(); 
crg.src="../images/cargando.gif";

//primera imagen de fondo que se carga
/*---------------------------------------------*/
/*---------------------------------------------*/
var ximg1=new Image(); 
ximg1.src="images/s1.jpg";
/*---------------------------------------------*/
/*---------------------------------------------*/

//imagenes de la cabecera

var bg=new Image(); 
bg.src="../images/bg_dw.png";

var logo=new Image(); 
logo.src="../images/logo.png";

//secciones
var bio=new Image();
bio.src="../images/bu_bio.png";
var contacto=new Image();
contacto.src="../images/bu_contacto.png";
var retoque=new Image(); 
retoque.src="../images/bu_retoque.png";
var dis=new Image(); 
dis.src="../images/bu_dis.png";

//imagenes de la botonera
/*---------------------------------------------*/
/*---------------------------------------------*/
var m1=new Image(); 
m1.src="images/bu_1.jpg";
var m2=new Image(); 
m2.src="images/bu_2.jpg";
var m3=new Image(); 
m3.src="images/bu_3.jpg";
var m4=new Image(); 
m4.src="images/bu_4.jpg";
var m5=new Image(); 
m5.src="images/bu_5.jpg";
var m6=new Image(); 
m6.src="images/bu_6.jpg";
var m7=new Image(); 
m7.src="images/bu_7.jpg";
var m8=new Image(); 
m8.src="images/bu_8.jpg";
/*---------------------------------------------*/
/*---------------------------------------------*/

//imagenes del boton menu
var b1=new Image(); 
b1.src="../images/bu_menu.png";
var b2=new Image(); 
b2.src="../images/bu_menub.png";

//pasafotos
var der=new Image(); 
der.src="../images/bu_next.png";
var izd=new Image(); 
izd.src="../images/bu_prev.png";

//imagenes del pie
var barraPie=new Image(); 
barraPie.src="../images/barra_foot.gif";
var flikr=new Image(); 
flikr.src="../images/bu_flick.png";
var logoPie=new Image(); 
logoPie.src="../images/logo_dw.png";

var ximg2=new Image(); 
var ximg3=new Image(); 
var ximg4=new Image(); 
var ximg5=new Image(); 
var ximg6=new Image(); 
var ximg7=new Image(); 
var ximg8=new Image(); 

var cargado1=false;
var cargado2=false;
var cargado3=false;
var cargado4=false;
var cargado5=false;
var cargado6=false;
var cargado7=false;
var cargado8=false;

var actual=1;

var numImgs=8;

var menuFuera=false;

var menu;
var contup;
var botonera;
var imgbu;
var foot;
var bunext;
var buprev;
var titulo;
var fondo;
var contenedor;

var tamVentana;
var altoCont;


function loading1(){
    if(ximg1.complete){	
		var img1=document.getElementById("img1");
		img1.src="images/s1.jpg";
		img1.className="bg";
		cargado1=true;
    }
	else setTimeout("loading1()", 10);
}


/*ximg1.onload=function(){
	var img1=document.getElementById("img1");
	img1.src="images/s1.jpg";
	img1.className="bg";
	cargado1=true;
}*/

ximg2.onload=function(){
	var img2=document.getElementById("img2");
	img2.src="images/s2.jpg";
	img2.className="bg";
	cargado2=true;
}

ximg3.onload=function(){
	var img3=document.getElementById("img3");
	img3.src="images/s3.jpg";
	img3.className="bg";
	cargado3=true;
}

ximg4.onload=function(){
	var img4=document.getElementById("img4");
	img4.src="images/s4.jpg";
	img4.className="bg";
	cargado4=true;
}

ximg5.onload=function(){
	var img5=document.getElementById("img5");
	img5.src="images/s5.jpg";
	img5.className="bg";
	cargado5=true;
}

ximg6.onload=function(){
	var img6=document.getElementById("img6");
	img6.src="images/s6.jpg";
	img6.className="bg";
	cargado6=true;
}

ximg7.onload=function(){
	var img7=document.getElementById("img7");
	img7.src="images/s7.jpg";
	img7.className="bg";
	cargado7=true;
}

ximg8.onload=function(){
	var img8=document.getElementById("img8");
	img8.src="images/s8.jpg";
	img8.className="bg";
	cargado8=true;
}

function muestra(quien){

	var objActual=document.getElementById("img"+actual);
	var objQuien=document.getElementById("img"+quien);
	var cargadoActual=eval("cargado"+actual);
	var cargadoQuien=eval("cargado"+quien);

	if(cargadoActual){
			for(var i=1;i<=numImgs;i++){
				document.getElementById("img"+i).style.display="none";
			}
			objQuien.style.display="block";
			objQuien.style.zIndex="2";
			titulo.innerHTML=titulos[quien];
			if(!cargadoQuien){
				objActual.style.zIndex="1";
				objActual.style.display="block";
				iniAlpha(fondo,0);
				alpha(fondo,0,0.6,400);
			}
			actual=quien;
			
			for(var i=0;i<numImgs;i++){
				imgbu.getElementsByTagName('div')[i].id="";
			}
			imgbu.getElementsByTagName('div')[Math.abs(actual-8)].id="selected";
	}
}

function pulsaMenu(){
	if(menuFuera)hideMenu1();
	else showMenu();
}

function pulsaDer(){
	var act=actual;
	if(act==numImgs) act=1;
	else act++;
	muestra(act);
}

function pulsaIzd(){
	var act=actual;
	if(act==1) act=numImgs;
	else act--;
	muestra(act);
}

function carga(){
	
	loading1();
	
	menu=document.getElementById("menu");
	contup=document.getElementById("contup");
	botonera=document.getElementById("botonera");
	imgbu=document.getElementById("imgbu");
	contenedor=document.getElementById("contenedor");
	foot=document.getElementById("foot");
	bunext=document.getElementById('bunext');
	buprev=document.getElementById('buprev');
	titulo=document.getElementById('titulo');
	fondo=document.getElementById("bgCargando");

	for(var i=0;i<numImgs;i++){
		imgbu.getElementsByTagName('div')[i].onmouseover=function(){
			if(!window.moviendoShow&&!window.moviendoHide1){
				this.style.width="115px";
				this.style.height="72px";
				this.style.cursor="pointer";
			}
		}
		imgbu.getElementsByTagName('div')[i].onmouseout=function(){
				this.style.width="73px";
				this.style.height="40px";
				this.style.cursor="default";
		}
	}

	menu.onclick=pulsaMenu;
	bunext.onclick=pulsaDer;
	buprev.onclick=pulsaIzd;
		
	iniAlpha(fondo,0);
	fondo.style.display="block";
		
	document.onkeydown=function(e){
		e= (window.event)? event : e;
		var tecla = (e.keyCode)? e.keyCode: e.charCode;
		switch(tecla){
			case 37:
				pulsaIzd();
			break;
			case 38:
				pulsaMenu();
			break; 
			case 39:
				pulsaDer();
			break;
			case 40:
				pulsaMenu();
			break; 
		}
	}
		
	titulo.innerHTML=titulos[1];
	showMenu();
	menu.style.display='block';
	/*---------------------------------------------*/
	/*---------------------------------------------*/		
	ximg2.src="images/s2.jpg";
	ximg3.src="images/s3.jpg";
	ximg4.src="images/s4.jpg";
	ximg5.src="images/s5.jpg";
	ximg6.src="images/s6.jpg";
	ximg7.src="images/s7.jpg";
	ximg8.src="images/s8.jpg";
	/*---------------------------------------------*/
	/*---------------------------------------------*/
}

function closeCont(){
	contenedor.style.display = "none";
	imgbu.style.display="block";
}

function showCont(quien){

	imgbu.style.display="none";
	contenedor.style.display = "block";
	iniAlpha(contenedor,0);
	iniCont();

	ajax=nuevoAjax();
	ajax.open("GET", "http://www.escenalogica.com/html/"+quien+".html",true);
	ajax.onreadystatechange=function() {
		if (ajax.readyState==4) {
			contenedor.innerHTML = ajax.responseText;
			alpha(contenedor,0,1,500);
		}
	}
	ajax.send(null);	
}

window.onresize=iniCont;

function iniCont(){
	tamVentana=calculaTam();
	altoCont=((tamVentana[1])-(botonera.offsetHeight+foot.offsetHeight));
	if(altoCont>0)contenedor.style.minHeight = altoCont+"px";
	contenedor.style.paddingTop=botonera.offsetHeight+"px";
	contenedor.style.paddingBottom=foot.offsetHeight+"px";
}

function calculaTam() {
return (window.innerWidth === undefined) ? (document.documentElement === undefined) ? [document.getElementsByTagName('body')[0].clientWidth, document.getElementsByTagName('body')[0].clientHeight] : [document.documentElement.clientWidth, document.documentElement.clientHeight] : [window.innerWidth, window.innerHeight];
}

function iniAlpha(quien,a){
	quien.style.opacity = a;
   	quien.style.MozOpacity = a;
	quien.style.KhtmlOpacity = a;
	quien.style.filter = 'alpha(opacity='+100*a+')';
	//quien.style.zoom=1;
}

function transicionShow(ultimo,curva,ms,callback){
    this.ant=0.01;
    this.done_=false;
    var _this=this;
    this.start=new Date().getTime();
    this.init=function(){
        setTimeout(function(){
                if(!_this.next()){
                    callback(1);
                    _this.done_=true;
                    if(ultimo){ 
			window.moviendoShow=0;
			bunext.style.display="none";
			buprev.style.display="none";
			menuFuera=true;
		    }
                    return;
                }
                callback(_this.next());
                _this.init();
            },13);
    }
    this.next=function(){
        var now=new Date().getTime();
        if((now-this.start)>ms)
            return false;
        return this.ant=curva((now-this.start+.001)/ms,this.ant);
    }
}



function transicionHide1(ultimo,ms,callback){
    this.ant=0.01;
    this.done_=false;
    var _this=this;
    this.start=new Date().getTime();
    this.init=function(){
        setTimeout(function(){
                if(!_this.next()){
                    callback(1);
                    _this.done_=true;
                    if(ultimo){
			window.moviendoHide1=0;
			contup.style.display="none";	
			foot.style.display="none";
		    }
                    return;
                }
                callback(_this.next());
                _this.init();
            },13);
    }
    this.next=function(){
        var now=new Date().getTime();
        if((now-this.start)>ms)
            return false;
        return this.ant=senoidal((now-this.start+.001)/ms,this.ant);
    }
}


function transicionHide2(ms,callback){
    this.ant=0.01;
    this.done_=false;
    var _this=this;
    this.start=new Date().getTime();
    this.init=function(){
        setTimeout(function(){
                if(!_this.next()){
                    callback(1);
                    _this.done_=true;
		    window.moviendoHide2=0;
		    menuFuera=false;
                    return;
                }
                callback(_this.next());
                _this.init();
            },13);
    }
    this.next=function(){
        var now=new Date().getTime();
        if((now-this.start)>ms)
            return false;
        return this.ant=desacelerado((now-this.start+.001)/ms,this.ant);
    }
}



function showMenu(){
	if(!window.moviendoShow) window.moviendoShow=1; 
    	else return;

	menu.style.backgroundImage="url('../images/bu_menu.png')";
	contup.style.display="block";
	imgbu.style.display="block";	
	foot.style.display="block";
	var altoCabe=contup.offsetHeight;
	var altoPie=foot.offsetHeight;
	contup.style.top='-'+altoCabe+'px';
	foot.style.bottom='-'+altoPie+'px';
	var inicio1=-altoCabe;
	var fin1=0;
	var inicio2=-altoPie;
	var fin2=0;
	var inicio3=1;
	var fin3=0;
	var inicio4=20;
	var fin4=40;

	var tCabe=new transicionShow(true,senoidal,800,function(p1){  
    		var delta1=fin1-inicio1; 
        	contup.style.top=(inicio1+(p1*delta1))+"px"; 
    	}); 
    	tCabe.init(); 
    	tCabe=null;
	var tPie=new transicionShow(false,senoidal,600,function(p2){ 
    		var delta2=fin2-inicio2; 
        	foot.style.bottom=(inicio2+(p2*delta2))+"px"; 
    	}); 
   	tPie.init(); 
    	tPie=null;
	
	var tDer=new transicionShow(false,linear,400,function(p3){  
		var delta3=fin3-inicio3; 
		var delta4=fin4-inicio4;
		bunext.style.right= (inicio4+(p3*delta4))+"px";  
		//bunext.style.zoom=1; 
		bunext.style.opacity = (inicio3+(p3*delta3));
		bunext.style.MozOpacity = (inicio3+(p3*delta3)); 
		bunext.style.KhtmlOpacity = (inicio3+(p3*delta3)); 
		bunext.style.filter='alpha(opacity='+100*(inicio3+(p3*delta3))+')'; 
	}); 
	tDer.init(); 
	tDer=null;
		
	var tIzd=new transicionShow(false,linear,400,function(p3){  
		var delta3=fin3-inicio3;
		var delta4=fin4-inicio4;
		buprev.style.left= (inicio4+(p3*delta4))+"px";  
		//buprev.style.zoom=1;
		buprev.style.opacity = (inicio3+(p3*delta3));
		buprev.style.MozOpacity = (inicio3+(p3*delta3)); 
		buprev.style.KhtmlOpacity = (inicio3+(p3*delta3)); 
		buprev.style.filter='alpha(opacity='+100*(inicio3+(p3*delta3))+')'; 
	}); 
	tIzd.init(); 
	tIzd=null;

}


function hideMenu1(){
	if(!window.moviendoHide1&&!window.moviendoHide2) window.moviendoHide1=1; 
	else return;

	
	contenedor.style.display="none";
	menu.style.backgroundImage="url('../images/bu_menub.png')";
	var altoCabe=contup.offsetHeight;
	var altoPie=foot.offsetHeight;
	var inicio1=0;
	var fin1=-altoCabe;
	var inicio2=0;
	var fin2=-altoPie;

	setTimeout(function(){hideMenu2();},600);

	var tCabe=new transicionHide1(true,800,function(p1){  
    		var delta1=fin1-inicio1; 
        	contup.style.top=(inicio1+(p1*delta1))+"px"; 
    	}); 
    	tCabe.init(); 
    	tCabe=null;
	var tPie=new transicionHide1(false,600,function(p2){ 
    		var delta2=fin2-inicio2; 
        	foot.style.bottom=(inicio2+(p2*delta2))+"px"; 
    	}); 
   	tPie.init(); 
    	tPie=null;
}

function hideMenu2(){
	window.moviendoHide2=1;

	iniAlpha(bunext,0);
	bunext.style.display="block";	
	iniAlpha(buprev,0);
	buprev.style.display="block";
	var inicio3=0;
	var fin3=1;
	var inicio4=80;
	var fin4=20;

	var tDer=new transicionHide2(400,function(p3){  
		var delta3=fin3-inicio3; 
		var delta4=fin4-inicio4;
		bunext.style.right= (inicio4+(p3*delta4))+"px";  
		//bunext.style.zoom=1; 
		bunext.style.opacity = (inicio3+(p3*delta3));
		bunext.style.MozOpacity = (inicio3+(p3*delta3)); 
		bunext.style.KhtmlOpacity = (inicio3+(p3*delta3)); 
		bunext.style.filter='alpha(opacity='+100*(inicio3+(p3*delta3))+')'; 
	}); 
	tDer.init(); 
	tDer=null;
		
	var tIzd=new transicionHide2(400,function(p3){  
		var delta3=fin3-inicio3;
		var delta4=fin4-inicio4;
		buprev.style.left= (inicio4+(p3*delta4))+"px";  
		//buprev.style.zoom=1;
		buprev.style.opacity = (inicio3+(p3*delta3));
		buprev.style.MozOpacity = (inicio3+(p3*delta3)); 
		buprev.style.KhtmlOpacity = (inicio3+(p3*delta3)); 
		buprev.style.filter='alpha(opacity='+100*(inicio3+(p3*delta3))+')'; 
	}); 
	tIzd.init(); 
	tIzd=null;


}
 
function transicionAlpha(ms,callback){
    this.ant=0.01;
    this.done_=false;
    var _this=this;
    this.start=new Date().getTime();
    this.init=function(){
        setTimeout(function(){
                if(!_this.next()){
                    callback(1);
                    _this.done_=true;
		    window.moviendoAlpha=0;
                    return;
                }
                callback(_this.next());
                _this.init();
            },13);
    }
    this.next=function(){
        var now=new Date().getTime();
        if((now-this.start)>ms)
            return false;
        return this.ant=linear((now-this.start+.001)/ms,this.ant);
    }
}

function alpha(obj,inicio,fin,ms){
    if(!window.moviendoAlpha) window.moviendoAlpha=1; 
    else return;   
    var t=new transicionAlpha(ms,function(p){  
    	var delta=fin-inicio;
	//obj.style.zoom=1; 
	obj.style.opacity = (inicio+(p*delta)); 
        obj.style.MozOpacity = (inicio+(p*delta)); 
        obj.style.KhtmlOpacity = (inicio+(p*delta)); 
        obj.style.filter='alpha(opacity='+100*(inicio+(p*delta))+')';
    }); 
    t.init(); 
    t=null;
}

function linear(p,ant){
    var maxValue=1, minValue=.001, totalP=1, k=1;
    var delta = maxValue - minValue; 
    var stepp = minValue+(Math.pow(((1 / totalP) * p), k) * delta); 
    return stepp; 
}
function senoidal(p,ant){
    return (1 - Math.cos(p * Math.PI)) / 2;
}

function desacelerado(p,ant){
    var maxValue=1, minValue=.001, totalP=1, k=.25;
    var delta = maxValue - minValue; 
    var stepp = minValue+(Math.pow(((1 / totalP) * p), k) * delta); 
    return stepp; 
}

function acelerado(p,ant){
    var maxValue=1, minValue=.001, totalP=1, k=7;
    var delta = maxValue - minValue; 
    var stepp = minValue+(Math.pow(((1 / totalP) * p), k) * delta); 
    return stepp; 
}

function elasticoFuerte(p,ant){
    if(p<=0.6){
        return Math.pow(p*5/3,2);}
    else{
        return Math.pow((p-0.8)*5,2)*0.6+0.6;
    }
}

function elasticoSuave(p,ant){
    if(p<=0.6){
        return Math.pow(p*5/3,2);
    }else{
        return Math.pow((p-0.8)*5,2)*0.4+0.6;
    }
}

function nuevoAjax(){
	var xmlhttp=false;
 	try {
 		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
 	} catch (e) {
 		try {
 			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 		} catch (E) {
 			xmlhttp = false;
 		}
  	}

	if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
 		xmlhttp = new XMLHttpRequest();
	}
	return xmlhttp;
}