//Agregar caja negra al html
Event.observe( window, 'load', function(){
   var cajanegra = document.createElement('div');
   cajanegra.setAttribute('id', 'cajanegra');
   cajanegra.style.display = 'none';
   document.body.appendChild(cajanegra);
   
   Event.observe('cajanegra', 'click', function(){
      hideCajaNegra();      
   });
});  

//Mostrar con cajanegra
function buildCajaBlanca( contenido ){
  contenidoDiv = document.createElement('div');
  if(typeof(contenido) == "string")
    contenidoDiv.innerHTML = contenido;
  else
    contenidoDiv.appendChild(contenido);

  contenedor = document.createElement('div');
  contenedor.className = 'imgCajaBlanca';
  contenedor.style.display = 'none';
  
  cerrar = document.createElement('div');
  cerrar.className = 'cajablanca_cerrar';
  cerrar.innerHTML = 'CERRAR';
  Event.observe( cerrar, 'click', hideCajaNegra );
  
  contenedor.appendChild(cerrar);
  contenedor.appendChild(contenidoDiv);
  
  document.body.appendChild(contenedor);
  
  contenedor.style.top = ($('header').cumulativeScrollOffset()[1]+85)+'px';

  return contenedor;
}

//efectos caja negra
function showCajaNegra( cajablanca ){
   //oscurecer
   $('cajanegra').style.display = 'block';
   new Effect.Opacity('cajanegra', { from: 0, to: 0.7, duration: 0, 
     afterFinish: function(){
       new Effect.BlindDown( cajablanca, {duration:0.5} );
     }
   } );
   
   window.CajaNegra_blanca = cajablanca;
}
function hideCajaNegra(){
  new Effect.BlindUp(window.CajaNegra_blanca, {duration:0.5,
    afterFinish: function(){
      //desoscurecer
      new Effect.Opacity('cajanegra', { from: 0.7, to: 0.0, duration: 0,
         afterFinish: function(){
           $('cajanegra').style.display = 'none';
         }
      } );
    }
  });
}
function changeCajaNegra( cajablanca ){
  cajaAnterior = window.CajaNegra_blanca;
  window.CajaNegra_blanca = cajablanca;
  new Effect.BlindUp(cajaAnterior, {duration:0.5,
    afterFinish: function(){
      new Effect.BlindDown( window.CajaNegra_blanca, {duration:0.5} );
    }
  });
}
