// JavaScript a medida.

// ANIMACION HOME
var visible = "bg2";
var oculto  = "bg1";
var intervalo = 2000;

var animacionHome = setTimeout(animacion, intervalo);

function animacion() {
	if (!$(oculto)) return false;
	intervalo = 6000;
	animacionHome = setTimeout(animacion, intervalo);
	$(oculto).setStyle({opacity: 0.01});
	var opacidad = 1;
	var avance = -0.1;
	new PeriodicalExecuter(function(periodica) {
		opacidad += avance;
		$(visible).setStyle({ opacity: opacidad });
		if (opacidad < 0.05) {
			var temp = visible;
			visible = oculto;
			oculto = temp;
			avance = -avance;
			$(oculto).setStyle({
							   	opacity: 0.01,
								zIndex: 1
							   });
			$(visible).setStyle({
								zIndex: 2
							   });
		} else if (opacidad > 0.95) {
			$(visible).setStyle({ opacity: 1 });
			periodica.stop();	
		}
	}, 0.05);
}
/*--------------------------------------------------------------------------------------------------------------------------------------------*/

// FUNCIONES PARA LA FICHA Y DISEÑOS.

var totalDisenyos = 0;
var sizexDisenyo  = 0;
var tiraPos       = 0;
var velocidadTira = 0;
var idTejidoAmpliado = 0;



function cambiaFeaturesDisenyos()
{
    f=document.getElementById('features');
    d=document.getElementById('disenyos');
    tabs=document.getElementById('ficha_up');

    if(f.style.display=="none"){
        d.style.display="none";
        f.style.display="block";
    }else{
        d.style.display="block";
        f.style.display="none";
    }
}



// Funciones para cargar la ficha via AJAX.

function cargarFicha( nombrePagina , id )
{
    var miAjo = new Ajax.Request(
	        nombrePagina,
	        {
		        method:     'get',
				parameters: {
				                sinCabecera:   true,
				                identificador: id
				            },
				onComplete: fichaRecibida
			}
		);

    return false;
}

function fichaRecibida(ajo)
{
    $("fichaAjax").innerHTML=ajo.responseText;
    if (window.attachEvent && navigator.userAgent.indexOf('MSIE 6')!=-1) correctPNG();  
    document.getElementById('disenyos').style.display="none";
    scrolea(555);
    tiraPos=0;
    velocidadTira=0;
    idTejidoAmpliado=0;
    totalDisenyos=parseInt($('totalDisenyos').innerHTML);
    sizexDisenyo=parseInt($('sizexDisenyo').innerHTML);
    $('muestras').style.width=(totalDisenyos * (sizexDisenyo + 15) + (250-sizexDisenyo)) +50+ "px"; //el 15 es el margin entre cada disenyo, el 250 es un extra por ancho máximo de la ampliación, 50 es un extra
}

function getIniScroll()
{
    return (window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop);
}

function scrolea(end)
{
    ini=getIniScroll();
    steps=20;
    for(i=1;i<=steps;i++){
        paso=Math.sin(i/steps * Math.PI/2);
        setTimeout('window.scrollTo(0,'+(Math.round(ini+(end-ini)*paso ))+')',i*40);
    }
}



// Funciones de movimiento de la tira de tejidos.

function eventoTiraMuestras(e)
{
    t=document.getElementById('tira_muestras');
    m=document.getElementById('muestras');

    //calculamos la posicion del ratón dentro de la tira
    posEnTira=e.clientX-offsetXElement(t);

    //La tira tiene 740 pixels. Si el ratón está cerca de los extremos, se moverá más rápido, que si está en el centro. De -3 pixes a +3 pixels de velocidad.
    nuevaVelocidad=Math.round( (740-posEnTira)/(740/6) ) -3;

    if(velocidadTira==0 && nuevaVelocidad!=0){  //arrancamos el movedor
        velocidadTira=nuevaVelocidad;
        movedorTiraMuestras();
    }else{                                      //el movedor ya estará vivo
        velocidadTira=nuevaVelocidad;
    }
}

function movedorTiraMuestras()
{
    m=document.getElementById('muestras');
    tiraPos+=velocidadTira;
    
    if(tiraPos>0){     //tope izquierda
        velocidadTira=0;
        tiraPos=0;
    }
    max=(totalDisenyos * (sizexDisenyo + 15)) - 740 + (250-sizexDisenyo); //el 15 es el margin entre disenyos, el 250 es un extra por ancho máximo de la ampliación
    if(tiraPos<-max){    //tope derecha
        velocidadTira=0;
        tiraPos=-max;
    }
    m.style.left=tiraPos+"px";

    s=document.getElementById('scroll-square');
    posScroll=-Math.round(tiraPos*507/max); //regla de 3, siendo 507 el ancho del scroll
    s.style.left=posScroll+'px';

    if(velocidadTira!=0)
        setTimeout('movedorTiraMuestras()',20);
}



// 'Scroll' gris de los tejidos.

function eventoScroll(e){
    offsetScroll=offsetXElement(document.getElementById('scroll'));
    posScroll=e.clientX-offsetScroll-13; //13 es la mitad del ancho del rectángulo negro

    if(posScroll<0)
        posScroll=0;
    else if(posScroll>507)
        posScroll=507;
 
    s=document.getElementById('scroll-square');
    s.style.left=posScroll+'px';

    max=(totalDisenyos * (sizexDisenyo + 15)) - 740 + (250-sizexDisenyo); //el 15 es el margin entre disenyos, el 250 es un extra por ancho máximo de la ampliación
    tiraPos=-Math.round(posScroll*max/507);  //507 es el ancho del scroll gris
    velocidadTira=0;
    m=document.getElementById('muestras');
    m.style.left=tiraPos+"px";
}



// Funciones para hacer zoom en los tejidos.

function redimensiona(id,newx,newy,oldx,oldy)
{
    if(idTejidoAmpliado==id)    //para evitar eventos dobles
        return false;

    //primero zoom-out el actualmente ampliado
    if(idTejidoAmpliado){
        obj=document.getElementById(idTejidoAmpliado);
        steps=10;
        for(i=1;i<=steps;i++){
            paso=Math.sin(i/steps * Math.PI/2);
            setTimeout('redimensionaTejido("'+idTejidoAmpliado+'",'+(Math.round(obj.width+(obj.oldx-obj.width)*paso ))+','+(Math.round(obj.height+(obj.oldy-obj.height)*paso ))+')',i*20);
        }
        document.getElementById('info'+idTejidoAmpliado).style.display="none";
    }
    // guardamos la información del nuevo tejido a ampliar, para poder luego hacer el zoom-out
    idTejidoAmpliado=id;
    obj=document.getElementById(id);
    obj.oldx=oldx; //guardo en el propio objeto el tamaño original
    obj.oldy=oldy;

    // hacemos el zoom-in del nuevo tejido
    steps=10;
    for(i=1;i<=steps;i++){
        paso=Math.sin(i/steps * Math.PI/2);
        setTimeout('redimensionaTejido("'+id+'",'+(Math.round(oldx+(newx-oldx)*paso ))+','+(Math.round(oldy+(newy-oldy)*paso ))+')',i*20);
    }   
    document.getElementById('info'+id).style.display="block";
}

function redimensionaTejido(id,x,y)
{
    obj=document.getElementById(id);
    obj.width=x;
    obj.height=y;
    obj.style.marginTop=Math.round((380-y)/2)+'px';
}

function agregaCarrito(id)
{

    return false;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------*/

function addEvent(obj, evType, fn)
{
    if (obj.addEventListener){
        obj.addEventListener(evType, fn, true);
        return true;
    }else if (obj.attachEvent){
        var r = obj.attachEvent("on"+evType, fn);
        return r;
    }else{
        //alert("Handler could not be attached");
        return false;
    }
}


function removeEvent(obj, evType, fn)
{
    if (obj.removeEventListener){
        obj.removeEventListener(evType, fn, true);
        return true;
    }else if (obj.detachEvent){
        var r = obj.detachEvent("on"+evType, fn);
        return r;
    }else{
        //alert("Handler could not be removed");
        return false;
    }
}

/*--------------------------------------------------------------------------------------------------------------------------------------------*/

// Sistema de 'Drag'.

var dragElements  = new Object();
var dragElement   = 0;
var mousemoveFunc = function(event){ funcionDrag(event); return false; };
var mouseupFunc   = function(){ finDrag(); };



function hazDrag(id,func)
{
    dragElements[id]=func;
    dragElement=id;
    iniDrag();
    return false;
}

function iniDrag()
{
    addEvent(document.body,"mousemove",mousemoveFunc);
    addEvent(document.body,"mouseup",mouseupFunc);
}

function finDrag()
{
    removeEvent(document.body,"mousemove",mousemoveFunc);
    removeEvent(document.body,"mouseup",mouseupFunc);
}

function funcionDrag(e)
{
    dragElements[dragElement](e);
}

/*--------------------------------------------------------------------------------------------------------------------------------------------*/

// Funciones para el termómetro.

var termoInMotion = 0;
var termoPosEnd   = 0;
var termoPosNow   = 15;

function showSize()
{
    obj2=document.getElementById('catalog');
    obj2.style.display="block";
    layerOpen='pc';
    iniTermo('pc');

    //corrige las flechas en Explorer 6
    if (window.attachEvent && navigator.userAgent.indexOf('MSIE 6')!=-1)
    {
        document.getElementById('arrowl'+i).innerHTML='<a href="javascript:moveStripTo(\'pc'+i+'\',250);"><img src="img/left-arrow.png"/></a>';
        document.getElementById('arrowr'+i).innerHTML='<a href="javascript:moveStripTo(\'pc'+i+'\',-250);"><img src="img/right-arrow.png"/></a>';
        correctPNG();
    }
}


function iniTermo(idCapa)
{
    obj=document.getElementById(idCapa);
    posOld=obj.style.left;
    if(posOld=="") posOld="30px";
    posOld=posOld.substring(0,(posOld.length-2));

    setLeft(idCapa,posOld); 
    //termoPosEnd=capaLeft2termoLeft(document.getElementById(layerOpen),posOld);
    //slideTermo();
}


function setLeft(id,pos)
{
    capa=document.getElementById(id);
    ter=document.getElementById('termo-square');

    //primero el termometro
    posTer=capaLeft2termoLeft(capa,pos);
    if(posTer<15 || posTer>523){
        return 0; //Nos hemos pasado por fuera
    }
    ter.style.left=posTer+"px";
    termoPosNow=posTer;

    //ahora la capa
    capa.style.display="none";
    capa.style.left=pos+'px';
    capa.style.display="block";
}


function capaLeft2termoLeft(capa,pos)
{
    return 15-(pos-30)*(508/((capa.quantity-2.5)*250));
}


function termoLeft2capaLeft(capa,pos)
{
    return 30-(((capa.quantity-2.5)*250*(pos-15)/508));
}


function moveStripTo(id,increment)
{
    // Para el movimiento desde las flechas laterales.

    obj=document.getElementById(id);
    posOld=obj.style.left;
    if(posOld=="") posOld="30px";
    posOld=posOld.substring(0,(posOld.length-2));
    steps=50;
    for(i=1;i<=steps;i++){
        paso=Math.sin(i/steps * Math.PI/2);
        pos=parseInt(posOld) + parseInt(increment*paso*paso);
        setTimeout('setLeft("'+id+'",'+pos+')',i*20);
    }    
}


function termoMove(e)
{
    // Para el movimiento desde el termómetro.

    strip=document.getElementById('termo-strip');
    offsetStrip=offsetXElement(strip);
    posTermo=e.clientX-offsetStrip-13;
    if(posTermo<15)         posTermo=15;
    else if(posTermo>523)   posTermo=523;

    termoPosEnd=posTermo;
    if(!termoInMotion){
        slideTermo();
    }
}

function offsetXElement(element)
{
    var valueL = 0;
    do {
      valueL += element.offsetLeft || 0;
      element = element.offsetParent;
    } while (element);
    return valueL;
}


function slideTermo()
{
    termoInMotion=1;
    posTermo=parseInt(termoPosNow+Math.ceil((termoPosEnd-termoPosNow)*0.3));
    if(Math.abs((termoPosEnd-termoPosNow)*0.3)<1){
        if(termoPosEnd>termoPosNow) posTermo++;
        else                        posTermo--;
    }
    posCapa=termoLeft2capaLeft(document.getElementById('pc'),posTermo);
    setLeft('pc',posCapa);

    if(posTermo==termoPosEnd){
        termoInMotion=0;
        //document.getElementById('line_footer').innerHTML="<a>0</a>";
    }else{
        //document.getElementById('line_footer').innerHTML="<a>1</a>";
        setTimeout('slideTermo('+posTermo+')',20);
    }
}


/*--------------------------------------------------------------------------------------------------------------------------------------------*/

function desplegarPaises( id )
{
    $( "countriesAmerica" ).className = "";
    $( "countriesEurope"  ).className = "";
    $( "countriesAfrica"  ).className = "";
    $( "countriesAsia"    ).className = "";
    $( "countriesOceania" ).className = "";
    $( id                 ).className = "seleccionado";
}

/*--------------------------------------------------------------------------------------------------------------------------------------------*/

// CAMBIAR LA FOTO DE EMPRESA.

var cambiandoFlag = 0;

function cambiaFotoEmpresa( contenedor , num )
{
    if( !cambiandoFlag )
    {
        workDiv = contenedor.getElementsByTagName('DIV')[0];

        // Se posiciona absolutamente la imagen vieja.
		imgActual = workDiv.getElementsByTagName('IMG')[0];
		imgActual.style.position="absolute";
		imgActual.style.zIndex="3";

		// Se crea la otra imagen.
		newImg = document.createElement('IMG');
		newImg.src=imgActual.src.replace(/[0-9]/,num);
		newImg.style.position="absolute";
		newImg.style.zIndex="2";
		workDiv.appendChild(newImg);

		// Se ejecuta la animación.
		imgActual.id="imagen1";
		newImg.id="imagen2";
		cambiandoFlag=1;
		fundidoFotos(0);

        // Se cambian los 'thumbnails'.
        anchors = contenedor.getElementsByTagName('A');
        for(i=0;i<anchors.length;i++)
        {
	        if(i+1==num)
	        {
				anchors[i].style.background="#FACB00";
				anchors[i].style.color="#000";
			}
			else
			{
				anchors[i].style.background="#000";
				anchors[i].style.color="#FFF";
			}
		}
    }
}


// "val" entre 0 y 1.
function fundidoFotos( val )
{
	Element.setStyle('imagen1',{opacity:(1-val).toString()});
	Element.setStyle('imagen2',{opacity:val.toString()});

	if(val>=1)
	{
		// Se destruye la imagen vieja.
		Element.remove('imagen1');
		cambiandoFlag=0;
	}
	else
	{
		val=val+0.05;
		val=Math.round(val*100)/100;
		setTimeout('fundidoFotos('+val+')',50);
	}
}
//Corregir PNG en Explorer
function correctPNG() 
   {
   for(var i=0; i<document.images.length; i++)
      {
	  var img = document.images[i]
	 
	  var imgName = img.src.toUpperCase()
	
	  if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
	     {
		 alert(img.width);
		   alert(imgName);
		 var imgID = (img.id) ? "id='" + img.id + "' " : ""
		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""
		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
		 var imgStyle = "display:inline-block;" + img.style.cssText 
		 if (img.align == "left") imgStyle = "float:left;" + imgStyle
		 if (img.align == "right") imgStyle = "float:right;" + imgStyle
		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle		
		 var strNewHTML = "<span " + imgID + imgClass + imgTitle
		 + " style=\"" + "width:" + img.style.width + "px; height:" + img.style.height + "px;" + imgStyle + ";"
	     + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
		 + "(src=\'" + img.src + "\', sizingMethod='image');\"></span>" 
		 img.outerHTML = strNewHTML;
		
		 
		 alert(strNewHTML);
		 i = i-1
	     }
      }
   }
