/*
	vigilante.js
	adaptacion del banner de king kong hecho para audi por doubleyou.
	2003-feb-27 edu luis
	
	Instrucciones de uso:

	paso 1.
	
		en el codigo de la pagina incluir :
	
	  	<script src="vigilante.js"></script>
	  	
	  	<script>
	  		vigilar(200, 50, 20, 21, 40, 21, "face2.gif", "ojo.gif");
	  	</script>
	
		y modificar los argumentos a conveniencia
		
		los argumentos son:
			1,2 posicion en pixels para la imagen
			3,4 posicion relativa del ojo izquierdo
			5,6 posicion relativa del ojo derecho
			7. Imagen de la cara (los ojos deben ser transparentes).
			8. Imagen de la pupila.
			 
	paso 2.
	
		en el directorio de la pagina copiar:
			
			* este fichero (vigilante.js)
			* los ficheros con las imagenes.
			
*/
	


function DynLayer(id,nestref) 
{
	if (ns4) 
	{
		this.css = (nestref)? eval("document."+nestref+".document."+id) : document.layers[id]
		this.x = this.css.left 
		this.y = this.css.top 
	}
	else if (ie4) 
	{
		this.css = document.all[id].style
		this.x = document.all[id].offsetLeft
		this.y = document.all[id].offsetTop
	}
	this.moveTo = DynLayerMoveTo
	this.moveBy = DynLayerMoveBy
	this.show = DynLayerShow
	this.hide = DynLayerHide
}

function DynLayerMoveTo(x,y) 
{
	if (x!=null  && !isNaN(x))  
	{
		this.x = x
		this.css.left = this.x
	}
	if (y!=null  && !isNaN(y)) 
	{
		this.y = y
		this.css.top = this.y
	}
}

function DynLayerMoveBy(x,y) 
{
	this.moveTo(this.x+x,this.y+y)
}

function DynLayerShow() 
{
	this.css.visibility = (ns4)? "show" : "visible"
}

function DynLayerHide() 
{
	this.css.visibility = (ns4)? "hide" : "hidden"
}


// averiguar que navegador nos esta viendo

ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false

function init(x, y, xoi, yoi, xod, yod, imagen_cara, imagen_ojo) 
{

	  	situar_vigilante_en(x, y, xoi, yoi, xod, yod, imagen_cara, imagen_ojo) ; 

		allt 		= new DynLayer("alltDiv");
		mascara 	= new DynLayer("mascaraDiv","alltDiv");
		ojo1 		= new DynLayer("ojo1Div","alltDiv");
		ojo2 		= new DynLayer("ojo2Div","alltDiv");
		pestania1 	= new DynLayer("pestania1Div","alltDiv");
		left  		= new eye(xoi, yoi, 4, 3, ojo1, allt);
		right 		= new eye(xod, yod, 4, 3, ojo2, allt);
				
				
		allt.show(); 
		mascara.show(); 
		ojo1.show(); 
		ojo2.show(); 

		blinka();
		
		document.onmousemove = mouseMove
		if (ns4) document.captureEvents(Event.MOUSEMOVE)

}


function mouseMove(e) 
{
		var yy=0;
		var y=0;
		var xx=0;
		var abajo=0;
	
		if (ns4) {var x=e.pageX; var y=e.pageY}
		if (ie4) {var x=event.x; var y=event.y} //+document.body.scrollTop}
		
		if (left) mirar (x,y,left)
		if (right) mirar (x,y,right)
		
		if (y>yy) abajo=1; else abajo=0;
		
		yy=y; xx=x;
}

function eye (cx, cy, radioh, radiov, layer, layerRel) 
{
	  this.cx = cx;
	  this.cy = cy;
	
	  
	  this.centrox = cx + layerRel.x; 
	  this.centroy = cy + layerRel.y;
	  
	  this.lrel = layerRel;
	  this.radioh = radioh;
	  this.radiov = radiov;
	  this.layer = layer;
	  
	  return (this)
}

function obtenerAngulo (x,y) 
{
	  var deg
	  deg = Math.atan(y/x)
	  if (x<0)   deg +=Math.PI;
	  if (deg<0) deg+=2*Math.PI;
	  if (x==0 && y==0) return 0;
	  return (deg);
}

function atoi(num) 
{
	  var nums = num+''
	  if (nums.indexOf('e-')>=0) return 0
	  if (nums.substring(0,1)=='.') 
	  {
	    if (num<=0.5) return 0 
	        else return 1
	  }
	  if (nums.substring(0,2)=='-.') 
	  { 
	    if (num<=-0.5) return -1 
	        else return 0 
	  }
	  return parseInt(nums)
}

function mirar (x, y, elojo) 
{
  
	  var xrel = (x-elojo.centrox) 
	  var yrel = (y-elojo.centroy) 
	  
	  yrel *= -1
	  
	  var ang = obtenerAngulo(xrel, yrel)
	  
	  var posx = atoi (elojo.radioh*Math.cos(ang))
	  var posy = atoi (elojo.radiov*Math.sin(ang))
	  
	  xrel = elojo.cx+posx
	  yrel = elojo.cy-posy
	  elojo.layer.moveTo(xrel,yrel)
}

function blinka()
{
		setTimeout('pestania1.show()',2000);
		setTimeout('pestania1.hide()',2100);
		setTimeout('blinka()',8000);
}


function vigilar() 
{
	  var i;
	  
	  // valores por defecto
      // xoi, yoi es la posicion relativa con respecto a x, y del ojo izquierdo.
      
	  var x   = 500, y   = 100;
	  var xoi =  20, yoi =  21;
	  var xod =  40, yod =  21;
	    
	  var imagen_cara="face2.gif";
	  var imagen_ojo="ojo.gif";
	
	  if (arguments.length >= 1)   	x = arguments[0];
	  if (arguments.length >= 2)   	y = arguments[1];
	  if (arguments.length >= 3)   	xoi = arguments[2];
	  if (arguments.length >= 4)   	yoi = arguments[3];
	  if (arguments.length >= 5)   	xod = arguments[4];
	  if (arguments.length >= 6)   	yod = arguments[5];
	  if (arguments.length >= 7)   	imagen_cara = arguments[6];
	  if (arguments.length >= 8)   	imagen_ojo = arguments[7];
	  
	
	  for (i=0; i<document.images.length; i++) 
	  {
	    	if (document.images[i].name.substring(0,3)=='k-k' && ! document.images[i].complete) 
	    		break;
	  }
	  if (i==document.images.length)
	  {
	  	init(x, y, xoi, yoi, xod, yod, imagen_cara, imagen_ojo);
	  }
	  else 
	  	setTimeout('vigilar()', 100);
}


function jseyesobj(id) 
{ 
		// no se usa
	  var i, x;
	  x= document[id];
	  if (!x && document.all) x= document.all[id];
	  for (i=0; !x && i<document.forms.length; i++) x= document.forms[i][id];
	  if (!x && document.getElementById) x= document.getElementById(id);
	  return(x);
}



function situar_vigilante_en(x, y, xoi, yoi, xod, yod, imagen_cara, imagen_ojo)
{
	  // crear codigo html de estilos. (NOTA: el write No funciona en netscape 4.7).
      // x, y corresponden a las posiciones left, top de la esquina superior derecha
      // en pixels.
    		
	
	  document.write( 
		"<div id='alltDiv' style='Z-INDEX: 60; LEFT: " + x + "px; TOP: " + y + "px; VISIBILITY: hidden; WIDTH: 60px; POSITION: absolute; HEIGHT: 60px; BACKGROUND-COLOR: #ffffff; layer-background-color: #ffffff'>" +
		"<div id='mascaraDiv' style='Z-INDEX: 60; VISIBILITY: hidden; WIDTH: 55px; POSITION: absolute'><IMG src='" + imagen_cara + "' border=0 name=k-k1></div>" +
		"<div id='ojo1Div' style='Z-INDEX: 50; VISIBILITY: hidden; WIDTH: 6px; POSITION: absolute; HEIGHT: 6px'><IMG height=6  src='" + imagen_ojo + "' width=6 border=0 name=k-k2></div>" +
		"<div id='ojo2Div' style='Z-INDEX: 50; VISIBILITY: hidden; WIDTH: 6px; POSITION: absolute; HEIGHT: 6px'><IMG height=6  src='" + imagen_ojo + "' width=6 border=0 name=k-k3></div>" +
		"<div id='pestania1Div' style='Z-INDEX: 55; VISIBILITY: hidden; LEFT: " + ( xoi - 5 ) + "px; TOP: " + ( yoi - 5 ) + "px; WIDTH: " + (xod + 10 - xoi + 10) + "px; HEIGHT: " + (yod + 10 - yoi + 10) + "px; CLIP: rect(0px " + (xod + 10 - xoi + 10) + "px " + (yod + 10 - yoi + 10) + "px 0px); POSITION: absolute; BACKGROUND-COLOR: #494900; layer-background-color: #494900'></div></div>" 
		);
}