// sección actual
var seccion_actual="";
var id_actual="";

var seccion_anterior="";
var id_anterior="";

var iniciado=false;
var baseurl="http://www.uebart.com/";

var titulo_inicial="";

var espacio=30;

function idioma()
{
  var l=window.location+" ";
  if (l.indexOf("/va/")>=0) return "va"
  else if (l.indexOf("/en/")>=0) return "en"
  else return "cas"; 
}
  
function numeroColumnasVisibles()
{
  var n=Math.floor($(window).width()/330);
  return Math.max(3,n);
}

function anchoContenido()
{

  var columnas=numeroColumnasVisibles();
  var vw=(columnas*300+(columnas-1)*espacio);
  vw=Math.max(vw,$("#seccion_estudio").width());// como mínimo el ancho de la seccion estudio
  return vw;
}

function numeroFilasVisibles()
{
  var alto=$(window).height();
  alto=alto-$("#logo").height();
  alto=alto-$("#menu").height();
  var caben=Math.ceil(alto/$(".item").height());
  return caben;
}


function colocarItems(servicio,animacion,id,recargar,iniciando)
{
  
        var ini_top=20;

        var ancho=$(window).width();
        var selector= ((servicio=="" || servicio=="home")? ".item" : ".item_"+servicio)+".item_filtrado";
        var selector2=".item:not("+selector+")";
        var columnas=numeroColumnasVisibles();
        var n_items=$(selector).size();

        // ancho de #contenido
        var vw=anchoContenido();

        // alto de #contenido
        var vh=Math.ceil(n_items/columnas)*(160+espacio)+14;
        vh=Math.max(vh,$(window).height()-$("#pie").height()-$("#logo").height()-$("#menu").height());
        if (servicio=="estudio") vh=Math.max(vh,$("#seccion_estudio").height());
        if (id!="") vh=Math.max(vh,$("#detalle").height());

        
        if (animacion)
        {
          // para las animaciones en curso
          $(".item").stop();
          $("#contenido").stop();
          $("#cuerpo").stop();
          

          // coloca el cuerpo y el contenido          
          var vl=($(window).width()-vw)/2;          
          vl=Math.max(vl,0);
          $("#contenido").animate({width:vw,height:vh},1000);
          $("#cuerpo").animate({left:vl},1000);
          $("#menu").css("left",vw-$("#menu").width());
          $("#idiomas").css("left",vw-$("#idiomas").width()-$("#logo").width());
          
          
          // pone invisibles los de las demás secciones
          $(selector2).animate({opacity:0},500,function(){$(this).css("display","none")});

          // mostrar estudio
          if (servicio=="estudio")
          {
            ocultarListado();
            ocultarDetalle();

            $("#seccion_estudio").css("opacity","0");
            $("#seccion_estudio").css("display","block");
            $("#seccion_estudio").css("left",(vw-$("#seccion_estudio").width())/2+"px");

            $("#seccion_estudio").stop().animate({opacity:1}, function()
            {
            });
          }
          // mostrar un proyecto
          else if (id!="")
          {
            ocultarEstudio();
            ocultarListado();
            
            if (recargar)
            {
              $("#detalle").css("opacity","0");
              $("#detalle").css("display","block");
              $("#detalle").stop().animate({opacity:1});              
            }

            seleccionarItem(servicio,id,recargar);
            $("#detalle").css("left",(vw-$("#detalle").width())/2+"px");
                      
          }
          // mostrar listado
          else
          {
            ocultarEstudio();
            ocultarDetalle();
            
            $("#listado").css("opacity","1");
            $("#listado").css("display","block");

            // calcula la posición inicial de la animación para los proyectos invisibles
            $(".item").each(function(index){
              if ($(this).css("opacity")==0)
              {      
                var vleft=(index%columnas)*(300+espacio);
                var vtop=(ini_top+Math.floor(index/columnas)*(160+espacio));
                $(this).css("left",vleft);
                $(this).css("top",vtop);
              }
            });        
            // anima los proyectos
            if (iniciando)
            {
              $(selector).each(function(index){          
                var vleft=(index%columnas)*(300+espacio);
                var vtop=(ini_top+Math.floor(index/columnas)*(160+espacio));
                var vtiempo=1000;
                if (vleft==$(this).position().left && vtop==$(this).position().top) vtiempo=1600;
                $(this).css("display","block");              
                $(this).animate({left:vleft,top:vtop,opacity:0},vtiempo);
              });                    
            }
            else
            {
              $(selector).each(function(index){          
                var vleft=(index%columnas)*(300+espacio);
                var vtop=(ini_top+Math.floor(index/columnas)*(160+espacio));
                var vtiempo=1000;
                if (vleft==$(this).position().left && vtop==$(this).position().top) vtiempo=1600;
                $(this).css("display","block");              
                $(this).animate({left:vleft,top:vtop,opacity:1},vtiempo);
              });                    
            }
          }
          
        }      
        else
        {        

          
          $("#contenido").css("width",(columnas*300+(columnas-1)*espacio)+"px");
          $("#contenido").css("height",vh+"px");
          $("#cuerpo").css("left",($(window).width()-$("#contenido").width())/2);
          
          $(".item").css("opacity",0);
          
          $(selector).each(function(index){          
            var vleft=(index%columnas)*(300+espacio);
            var vtop=(ini_top+Math.floor(index/columnas)*(160+espacio));
            $(this).css("left",vleft+"px");
            $(this).css("top",vtop+"px");
            $(this).css("opacity",0);
          });
        }
        
}

function ocultarEstudio()
{
  if ($("#seccion_estudio").css("display")=="block" || $("#seccion_estudio").css("opacity")>0)
  {
    $("#seccion_estudio").stop().animate({opacity:0},function()
    {
      $("#seccion_estudio").css("display","none");
    });
  }
}

function ocultarDetalle()
{
  if ($("#detalle").css("opacity")>0)
  {
    $("#detalle").animate({opacity:0},function()
    {
      $("#detalle").css("display","none");
      $("#detalle_titulo").html("");
      $("#detalle_imagenes").html("");
      $("#detalle_datos").html("");
    });
  }
}

function ocultarListado()
{
  if ($("#listado").css("opacity")>0)
  {
    $("#listado").animate({opacity:0},function()
    {
      $("#listado").css("display","none");
    });
  }
}


      
function seleccionarItem(servicio,id,recargar)
{

  if (recargar)
  {
    $("#detalle_imagenes").html("");
    $("#detalle_datos").html("");
    $("#detalle_titulo").html("");
  
    var array_imagenes=new Array();
    var url="proyecto.php?a=detalle_imagenes&seccion="+servicio+"&id="+id;
    $("#detalle_imagenes").load(url,function()
    {
      var url="proyecto.php?a=detalle_datos&seccion="+servicio+"&id="+id+"&idioma="+idioma();
      $("#detalle_datos").load(url,function(){

        var url="proyecto.php?a=detalle_titulo&seccion="+servicio+"&id="+id;
        $.get(url,function(datos){
          document.title=datos;

          var sel=".imagenDetalle .foto";
          $(sel).bind("load", function () { $(this).parent().stop().animate({opacity:1},500); });
          for (i=0;i<array_imagenes.length;i++)
          {
              el=$(array_imagenes[i]);    
              var src=el.attr("alt");
              el.attr("src",src);
              el.attr("alt","");
           }
           
          var vh=$(window).height()-$("#pie").height()-$("#logo").height()-$("#menu").height();
          vh=Math.max(vh,$("#detalle").height());
          $("#contenido").stop().animate({width:anchoContenido(),height:vh},1000);
          $(window).scrollTop(0);
          
        });              
      });    
    });

    

    //var url="proyecto.php?a=detalle_titulo&seccion="+servicio+"&id="+id;
    //$("#detalle_imagenes").load(url);


    /*
  
    var url="backoffice/datos.php?a=leer&servicio="+servicio+"&id="+id;
    $.getJSON(
      url,
      function(data)
      {
        for (i=1;i<data.imagenes.length;i++)
        {
          var txt="<div class='imagenDetalle'><img class='foto' alt='backoffice/data/"+servicio+"/"+id+"/imagenes/"+data.imagenes[i]+"' height='330' width='650' /><img src='images/shadow.jpg' class='sombra'></div>";
          $("#detalle_imagenes").append(txt);
        }
        var array_imagenes=new Array();
        $('.imagenDetalle .foto').each(function() {
            array_imagenes.push(this); 
        });

        var txt="";

        var titulo="";
        if (data.campos.titulo!="" && data.campos.titulo!=undefined)
        {
          titulo=data.campos.titulo;
          txt=txt+"<div class='campo_nombre'></div>";
          txt=txt+"<div class='campo_valor campo_cliente'><strong>"+data.campos.titulo.toUpperCase()+"</strong></div><br>";
        }

        var descripcion="";
        if (data.campos.descripcion_cas!="" && data.campos.descripcion_cas!=undefined && idioma()=="cas")
          descripcion=data.campos.descripcion_cas;
        if (data.campos.descripcion_va!="" && data.campos.descripcion_va!=undefined && idioma()=="va")
          descripcion=data.campos.descripcion_va;
        if (data.campos.descripcion_en!="" && data.campos.descripcion_en!=undefined && idioma()=="en")
          descripcion=data.campos.descripcion_en;
        
        if (descripcion!="")
        {
          txt=txt+"<div class='campo_nombre'>Descripci&oacute;n: </div>";
          txt=txt+"<div class='campo_valor'>"+descripcion+"</div><br>";
        }
        
        if (data.campos.tecnologia!="" && data.campos.tecnologia!=undefined)
        {
          txt=txt+"<div class='campo_nombre'>Tecnolog&iacute;a: </div>";
          txt=txt+"<div class='campo_valor'>"+data.campos.tecnologia+"</div><br>";
        }

        if (data.campos.url!="" && data.campos.url!=undefined)
        {
          txt=txt+"<div class='campo_nombre'>http://</div>";
          txt=txt+"<div class='campo_valor'><a href='"+data.campos.url+"' target='_blank'>"+data.campos.url.replace("http://","")+"</a></div><br>";
        }

        if (data.campos.fecha!="" && data.campos.fecha!=undefined)
        {
          var ano="";
          var temp=data.campos.fecha.split("/");
          if (temp.length==3) ano=temp[2];
          txt=txt+"<div class='campo_nombre'>Año: </div>";
          txt=txt+"<div class='campo_valor'>"+ano+"</div><br/><br/>";
        }

        document.title="uebart.com "+titulo+" "+descripcion;

        var vurl=""+window.location;
        vurl=vurl.replace("#","?s=");
        vurl=vurl.replace("/va/","/").replace("/en/","/"); // castellano
        vurl2=escape(vurl);
        vurl2=vurl2.replace("/va/","/").replace("/en/","/");
        vvia="uebart";
        txt=txt+"<div class='campo_nombre'></div>";
        txt=txt+"<div class='campo_valor redes_sociales'>";
        txt=txt+'<iframe src="http://www.facebook.com/plugins/like.php?href='+escape(vurl)+'&amp;layout=button_count&amp;show_faces=false&amp;width=120&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:120px; height:21px;" allowTransparency="true"></iframe>';
        //txt=txt+'<a href="http://twitter.com/share" class="twitter-share-button" data-counturl="'+vurl+'"  data-url="'+vurl+'" data-count="horizontal">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>';
        //txt=txt+'<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://twitter.com/widgets/tweet_button.html"        style="width:130px; height:50px;"></iframe>';

                
        //txt=txt+'<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script><div><a href="http://twitter.com/share?url='+vurl2+'&amp;counturl='+vurl2+'&amp;via=uebart" class="twitter-share-button">Tweet</a></div>';

        txt=txt+"</div>";

        $("#detalle_datos").append(txt);

        $("#detalle_datos").append("<div style='clear:both'></div>");

        // al cargar cada imagen, hace un fadeIn del div
        var sel=".imagenDetalle .foto";
        $(sel).bind("load", function () { $(this).parent().stop().animate({opacity:1},500); });
        for (i=0;i<array_imagenes.length;i++)
        {
            el=$(array_imagenes[i]);    
            var src=el.attr("alt");
            el.attr("src",src);
            el.attr("alt","");
         }
         
        var vh=$(window).height()-$("#pie").height()-$("#logo").height()-$("#menu").height();
        vh=Math.max(vh,$("#detalle").height());
        $("#contenido").stop().animate({width:anchoContenido(),height:vh},1000);
        $(window).scrollTop(0);
        
      

      }

   );*/

  }  
  else
  {
    var vh=$(window).height()-$("#pie").height()-$("#logo").height()-$("#menu").height();
    vh=Math.max(vh,$("#detalle").height());
    $("#contenido").stop().animate({width:anchoContenido(),height:vh},1000);
  }
         


}

function cambiarSeccion(s)
{
  var temp=s.replace("!","");
  temp=temp.split('/');
  var id="";

  if (temp.length==2) {s=temp[0]; id=temp[1]; }

  seccion_anterior=seccion_actual;
  id_anterior=id_actual;

  seccion_actual=s;
  id_actual=id;


  document.title=titulo_inicial;

  if (seccion_actual=="estudio")
  {
    // refresca el mapa
    var txt=$("#mapa").html();
    $("#mapa").html("");
    $("#mapa").html(txt);  
  }

  if (!iniciado) 
  {
    iniciar(s,id);
    iniciado=true;
  }
  else
  { 
    colocarItems(seccion_actual,true,id_actual,true,false);
  }
  
  $("#nuevo_proyecto").css("display",(seccion_actual==""?"none":"block"));

  if (seccion_actual=="estudio")
    borrarBusqueda();
}

function inicio(recargar)
{
  if (seccion_actual=="")
  {
    borrarBusqueda();
    colocarItems(seccion_actual,true,"",false,false);      
  }
  else if (recargar)
  {
    window.location="/";
  }
  else  
  {  
    borrarBusqueda(); 
    window.location.hash="";
  }
}

function borrarBusqueda()
{
    $(".item").addClass("item_filtrado");
    $("#texto_busqueda").val("");
}
      
      
function shuffle(array) {
    var tmp, current, top = array.length;

    if(top) while(--top) {
        current = Math.floor(Math.random() * (top + 1));
        tmp = array[current];
        array[current] = array[top];
        array[top] = tmp;
    }

    return array;
}
      
      

function randomInt(min, max)
{		
	var randomNum = Math.random() * (max-min); 
	return(Math.round(randomNum) + min); 
}
          
      
function iniciar(seccion,id)
{
  var isIE6 = $.browser.msie && parseFloat($.browser.version) < 7;
  jQuery.fx.off = isIE6;
  
  var selector=".item";
  var seccion_inicial=seccion;

  
  if (seccion_inicial!="") selector=".item_"+seccion_inicial;
  
      
  // cambio display a none temporalmente porque colocarItems() pone la opacidad a 1
  $(".item").css("display","none");
  // coloca los items (estando invisibles)
  colocarItems(seccion_inicial,false,id,true,true);
  // vuelvo a poner la opacidad a 0
  $(".item").css("opacity",0);
  $(".item").css("display","block");

///  $(".itemSobre").css("opacity","0");
  $(".itemTitulo").css("opacity","0");

  // construye un array con todos los items, en el orden en que se van a cargar
  // los primeros (los que caben en la pantalla) se ordenan aleatoriamente
  // los que no caben en la pantalla van en orden
  var numItemsVisibles=numeroColumnasVisibles()*numeroFilasVisibles();        
  var arr = new Array();
  var arr1 = new Array();
  var arr2 = new Array();
  $('.itemImagen img.ret').each(function() {    
    if (arr1.length<numItemsVisibles && ($(this).parent().parent().hasClass("item_"+seccion_inicial) || seccion_inicial==""))
      arr1.push(this); 
    else
      arr2.push(this); 
  });
  arr=shuffle(arr1);
  for (i=0;i<arr2.length;i++)
    arr.push(arr2[i]);

  // al cargar cada imagen, hace un fadeIn del div
  var sel=selector+" .itemImagen img.ret";
  $(sel).bind("load", function () {
    $(this).parent().parent().css("opacity",0);
    $(this).parent().parent().css("display","block");
    $(this).parent().parent().animate({opacity:1},500); 
  });
  for (i=0;i<arr.length;i++)
  {
    el=$(arr[i]);    
    var src=el.attr("alt");
    el.attr("src",src);
    el.attr("alt","");
  }
  
  
  colocarItems(seccion_inicial,true,id,true,true);

  $('.item').click(function(){
    var txt=$(this).parent().attr("href");
    window.location=baseurl+txt;
  });
  
  $('.item').mouseover(function(){
    $(".itemImagen",this).stop().animate({opacity:0.7},200);
    $(".itemTitulo",this).stop().animate({opacity:1},200);
  });

  $('.item').mouseout(function(){
    $(".itemImagen",this).stop().animate({opacity:1},200);
    $(".itemTitulo",this).stop().animate({opacity:0},200);
  });
  
  $('.itemQue').mouseover(function(){
    $("img",this).css("display","block");
    $("img",this).stop().animate({opacity:1},200);
    $(".itemQueTitulo",this).stop().animate({color:"#DD0000"},500);
  });
  
  $('.itemQue').mouseout(function(){
    $("img",this).stop().animate({opacity:0},200);
    $(".itemQueTitulo",this).stop().animate({color:"#777777"},500);
  });
  

   $('#texto_busqueda').keyup(buscar);  
                           
}      

function buscar()
{
  $(".item").addClass("item_filtrado");
  var texto=$('#texto_busqueda').val().toLowerCase();
  if (texto!="")
  {  
    $(".item").each(function(index){    
      cliente=$(".itemTitulo",this).html();
      descripcion=$(".itemDescripcion",this).html();
      if (cliente!=null)
      {
        if (cliente.toLowerCase().indexOf(texto)>=0) $(this).addClass("item_filtrado");
        else if (descripcion.toLowerCase().indexOf(texto)>=0) $(this).addClass("item_filtrado");
        else $(this).removeClass("item_filtrado");
      }
    });
  }  
  if (seccion_actual!="estudio") // cambia a home
    colocarItems(seccion_actual,true,"",false,false);  
  else 
    window.location.hash="";
}