var timerId;		
// defaultStatus="Webcam en directe"
var error;
var error1;
var error2;
var ipcam1="llimiana.dyndns.tv:81";
var ipcam2="llimiana.dyndns.tv:82";

var tamanyX= 640;
var tamanyY= 480;
var tamanyX2= tamanyX/2 - 20;
var tamanyY2= tamanyY/2 - 20;

var ol_fgcolor="#ffffff";
var ol_bgcolor="#99CC66";
var appletWebcam= false;

var rutaImg;
var rutaImg1;
var rutaImg2;

var elapse= 20;
var cont_laps= 0;

var imgLoaded= false;
var imgLoaded1= false;
var imgLoaded2= false;

var horaPeticio= "";
var numcamsel= 1;

function findPosX(obj)
{
  var curleft = 0;
  if(obj.offsetParent)
      while(1) 
      {
        curleft += obj.offsetLeft;
        if(!obj.offsetParent)
          break;
        obj = obj.offsetParent;
      }
  else if(obj.x)
      curleft += obj.x;
  return curleft;
}

function findPosY(obj)
{
  var curtop = 0;
  if(obj.offsetParent)
      while(1)
      {
        curtop += obj.offsetTop;
        if(!obj.offsetParent)
          break;
        obj = obj.offsetParent;
      }
  else if(obj.y) {
      curtop += obj.y;
}
  return curtop;
}

function getObject(id) {
   var object = null;
   if (document.layers) {   
    object = document.layers[id];
   } else if (document.all) {
    object = document.all[id];
   } else if (document.getElementById) {
    object = document.getElementById(id);
   }
   return object;
}


function webcamError(evt)
{
	// alert('webcam error '+ numcamsel+', target='+evt.target);
	error=1;
	getObject('webcam').onload= null;
	getObject('webcam').onerror= null;
	getObject('webcam').src= "imatges/webcam_error.jpg";
	status= "ERROR en la webcam, no funciona";
	var elemWait;
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function webcamError1(evt)
{
	// alert('webcam error '+ numcamsel+', target='+evt.target);
	error1=1;
	getObject('webcam1').onload= null;
	getObject('webcam1').onerror= null;
	getObject('webcam1').src= "imatges/webcam_error.jpg";
	status= "ERROR en la webcam 1, no funciona";
	var elemWait;
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function webcamError2(evt)
{
	// alert('webcam error '+ numcamsel+', target='+evt.target);
	error2=1;
	getObject('webcam2').onload= null;
	getObject('webcam2').onerror= null;
	getObject('webcam2').src= "imatges/webcam_error.jpg";
	status= "ERROR en la webcam 2, no funciona";
	var elemWait;
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function webcamLoad(evt)
{
	error=0;
	imgLoaded= true;
	var elemWait;
	//var elemImg= getObject("webcam");	
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function webcamLoad1(evt)
{
	error1=0;
	imgLoaded1= true;
	var elemWait;
	//var elemImg= getObject("webcam1");	
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function webcamLoad2(evt)
{
	error2=0;
	imgLoaded2= true;
	var elemWait;
	//var elemImg= getObject("webcam2");	
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
}

function fijarZona(num, clase) {
	if(num==1) {
		var td= getObject("td11");
		td.className= clase;
		td= getObject("td21");
		td.className= clase;
		td= getObject("td22");
		td.className= clase;
	} else if(num==2) {
		var td= getObject("td12");
		td.className= clase;
		td= getObject("td23");
		td.className= clase;
		td= getObject("td24");
		td.className= clase;
	}	else if(num==3) {
		var td= getObject("td13");
		td.className= clase;
		td= getObject("td25");
		td.className= clase;
	}
}

function carregarWebcam(id)
{
	if(timerId) clearTimeout(timerId);
	numcamsel= id;
	
	var elemWait= getObject("webcam_wait");
	var elemFons= getObject("webcam_fons");
	var elem= getObject("webcam_loc");
	
	redimensionar();
	
	//document.images.webcam.src="webcamload.jpg"
	error=0;
	appletWebcam= false;
	var filename= '';
	if(id==1) {
		filename= 'imatges/webcamload1.jpg';
		fijarZona(2, 'capTaulaInac');
		fijarZona(3, 'capTaulaInac');
		fijarZona(1, 'capTaula');
	}	else if(id==2) {
		filename='imatges/webcamload2.jpg';
		fijarZona(1, 'capTaulaInac');
		fijarZona(3, 'capTaulaInac');
		fijarZona(2, 'capTaula');
	} else if(id==3) {
		filename='imatges/webcamload3.jpg';
		fijarZona(1, 'capTaulaInac');
		fijarZona(2, 'capTaulaInac');
		fijarZona(3, 'capTaula');
	}
	
	elemFons.style.backgroundImage= "url("+filename+")";
	if(id < 3) {
		
		if(id==1) {
			document.images.cam1b.src= "iconos/webcamA.gif";
			document.images.cam1a.src= "iconos/webcam.gif";
			document.images.cam2a.src= "iconos/webcam.gif";
			document.images.cam2b.src= "iconos/webcam.gif";
			document.images.cam3a.src= "iconos/webcam.gif";
			rutaImg= "http://"+ipcam1+"/jpg/foto.jpg";
		} else if(id==2) {
			document.images.cam2b.src= "iconos/webcamA.gif";
			document.images.cam2a.src= "iconos/webcam.gif";
			document.images.cam1b.src= "iconos/webcam.gif";
			document.images.cam1a.src= "iconos/webcam.gif";
			document.images.cam3a.src= "iconos/webcam.gif";
			rutaImg= "http://"+ipcam2+"/jpg/foto.jpg";
		}
		
		// elemFons.style.display= "block";	
		elem.innerHTML= '<img alt="carregant webcam" title="carregant webcam" src="'+rutaImg+'" id="webcam" />';
		
		var elemImg= getObject("webcam");
		elemImg.zIndex= -1;
		elemImg.onerror= webcamError;
		elemImg.onload= webcamLoad;
		elemImg.style.width= tamanyX+"px";
		elemImg.style.height= tamanyY+"px";
		//document.images.webcam.width= tamanyX
		//document.images.webcam.heigth= tamanyY	
		cont_laps= elapse-1;
		imgLoaded= true;
		//elemImg.src= rutaImg;
		elemWait.style.display= 'block';
		CarregarPeriod();
	} else if(id==3){
		
		document.images.cam2b.src= "iconos/webcam.gif";
		document.images.cam2a.src= "iconos/webcam.gif";
		document.images.cam1b.src= "iconos/webcam.gif";
		document.images.cam1a.src= "iconos/webcam.gif";
		document.images.cam3a.src= "iconos/webcamA.gif";
		rutaImg1= "http://"+ipcam1+"/jpg/foto.jpg";
		rutaImg2= "http://"+ipcam2+"/jpg/foto.jpg";
		
		var elem= getObject("webcam_loc");
		elem.innerHTML= '<img alt="carregant webcam" title="carregant webcam" src="'+rutaImg1+'" id="webcam1" /><img alt="carregant webcam" title="carregant webcam" src="'+rutaImg2+'" id="webcam2" />';
		var elemImg1= getObject("webcam1");
		elemImg1.zIndex= -1;
		elemImg1.onerror= webcamError1;
		elemImg1.onload= webcamLoad1;
		elemImg1.style.width= tamanyX2+"px";
		elemImg1.style.height= tamanyY2+"px";
		var elemImg2= getObject("webcam2");
		elemImg2.zIndex= -1;
		elemImg2.onerror= webcamError2;
		elemImg2.onload= webcamLoad2;
		elemImg2.style.width= tamanyX2+"px";
		elemImg2.style.height= tamanyY2+"px";
		
		cont_laps= elapse-1;
		imgLoaded1= true;
		imgLoaded2= true;
		//elemImg1.src= rutaImg1;
		//elemImg2.src= rutaImg2;
		CarregarPeriodMulti();
	}
	
}

function CarregarPeriod()
{
	var str="";
	cont_laps++;
	
	if(imgLoaded) str="<font color='green'>ok</font>"; else str="transf...";
	if(error==1) 
	{
		str="<font color='red'>error</font>";
		cont_laps= 1;
		error= 0;
		imgLoaded= false;
		mostrar(" "+ horaPeticio + " " + "<font color='yellow'>"+(elapse-cont_laps) + "</font> "+ str);
		return
	}
	else if(cont_laps>=elapse)
	{
	 	if(imgLoaded)
	 	{
			imgLoaded= false;
			reloadImage();
		} else {
			str="<font color='red'>possible error</font>";
		}
		cont_laps= 1;
	}
	mostrar(" "+ horaPeticio + " " + "<font color='yellow'>"+(elapse-cont_laps) + "</font> "+ str);
	timerId = setTimeout("CarregarPeriod()", 1000);
}

function CarregarPeriodMulti()
{
	var str="";
	cont_laps++;
	
	if(imgLoaded1) str="<font color='green'>ok.1</font>&nbsp;"; else str="transf 1...";
	if(imgLoaded2) str+="<font color='green'>ok.2</font>"; else str+="transf 2...";
	
	if(error1==1) 
	{
		str="<font color='red'>error 1</font>";
		cont_laps= 1;
		error1= 0;
		imgLoaded1= false;
	}
	
	if(error2==1) 
	{
		str +="<font color='red'>error 2</font>";
		cont_laps= 1;
		error2= 0;
		imgLoaded2= false;
	}
	
	if(cont_laps>=elapse)
	{
	 	if(imgLoaded1)
	 	{
			imgLoaded1= false;
			reloadImage(1);
		}
				
	 	if(imgLoaded2)
	 	{
			imgLoaded2= false;
			reloadImage(2);
		}
		cont_laps= 1;
	}
		
	mostrar(" "+ horaPeticio + " " + "<font color='yellow'>"+(elapse-cont_laps) + "</font> "+ str);
	timerId = setTimeout("CarregarPeriodMulti()", 1000);
}

function reloadImage(num)
{
	uniq = new Date();
	uniq = "?"+uniq.getTime();
	if(num==null) {
		img = document.images.webcam;
	} else if(num==1) {
		img = document.images.webcam1;
	} else if(num==2) {
		img = document.images.webcam2;
	}
	newImage = img.src;
	index = newImage.indexOf("?", 0);
	if (index > 0)
	{
		newImage = newImage.substr(0, index);
	}
	horaPeticio= new Date;
	img.src = newImage+uniq;
}

function carregarWebcamJava(id)
{
	if(timerId) clearTimeout(timerId);
	numcamsel= id;
 	appletWebcam= true;
 	
 	var elemWait;
	elemWait= getObject("webcam_wait");
	elemWait.style.display= 'none';
 	
	var elem= getObject("status");
 	elem.innerHTML="";
	if(id==1) { 
		ipcam= ipcam1; port="81"; 
	} else { 
		ipcam= ipcam2; port="82";
	}

	var elem2= getObject("webcam_loc");
	elem2.innerHTML='<APPLET code="LoadJpg.class" ARCHIVE="loadjpg.jar" name="NCApplet" WIDTH="'+tamanyX+'" height="'+tamanyY+'" codebase="http://'+ipcam+'" VIEWASTEXT>'+
    '<PARAM NAME="hashingkey" VALUE="0">'+
	'<PARAM NAME="behindfirewall" VALUE="true">'+
	'<PARAM NAME="imagetransferport" VALUE="'+port+'">'+
	'<PARAM NAME="FPS" VALUE="5">'+
	'<PARAM NAME="timestamp" VALUE="true">'+
	'<PARAM NAME="id" VALUE="guest">'+
	'<PARAM NAME="password" VALUE="guest">'+
	'<PARAM NAME="ver_flip" VALUE="0">'+
	'<PARAM NAME="hor_flip" VALUE="0">'+
	'</APPLET>';
	if(id==1) {
		document.images.cam2a.src= "iconos/webcam.gif";
		document.images.cam2b.src= "iconos/webcam.gif";
		document.images.cam1a.src= "iconos/webcamA.gif";
		document.images.cam1b.src= "iconos/webcam.gif";
		fijarZona(2, 'capTaulaInac');
		fijarZona(1, 'capTaula');
	}
	if(id==2) {
		document.images.cam1a.src= "iconos/webcam.gif";
		document.images.cam1b.src= "iconos/webcam.gif";
		document.images.cam2a.src= "iconos/webcamA.gif";
		document.images.cam2b.src= "iconos/webcam.gif";
		fijarZona(1, 'capTaulaInac');
		fijarZona(2, 'capTaula');
	}
}

/*
function CarregarWebcamJava2()
{
	if(timerId) clearTimeout(timerId);
	numcamsel= 2;
 	appletWebcam= true;
 	getObject("status").innerHTML=""
    getObject("webcam_loc").innerHTML='<APPLET code="LoadJpg.class" ARCHIVE="loadjpg.jar" name="NCApplet" WIDTH="'+tamanyX+'" height="'+tamanyY+'" codebase="http://'+ipcam2+'" VIEWASTEXT>'+
    '<PARAM NAME="hashingkey" VALUE="0">'+
	'<PARAM NAME="behindfirewall" VALUE="true">'+
	'<PARAM NAME="imagetransferport" VALUE="82">'+
	'<PARAM NAME="FPS" VALUE="5">'+
	'<PARAM NAME="timestamp" VALUE="true">'+
	'<PARAM NAME="id" VALUE="guest">'+
	'<PARAM NAME="password" VALUE="guest">'+
	'<PARAM NAME="ver_flip" VALUE="0">'+
	'<PARAM NAME="hor_flip" VALUE="0">'+
	'</APPLET>'
	document.images.cam1a.src= "iconos/webcam.gif"
	document.images.cam1b.src= "iconos/webcam.gif"
	document.images.cam2a.src= "iconos/webcamA.gif"
	document.images.cam2b.src= "iconos/webcam.gif"
}
*/

function clic_normal()
{
	tamanyX= 360;
	tamanyY= 270;
	if(numcamsel==1)
	{
		if(appletWebcam) carregarWebcamJava(1);
		else carregarWebcam(1);
	}
	else
	{
		if(appletWebcam) carregarWebcamJava(2);
		else carregarWebcam(2);
	}
}

function clic_gran()
{
	tamanyX= 480;
	tamanyY= 360;
	if(numcamsel==1)
	{
		if(appletWebcam) carregarWebcamJava(1);
		else carregarWebcam(1);
	} else
	{
		if(appletWebcam) carregarWebcamJava(2);
		else carregarWebcam(2);
	}
}

function clic_expandit()
{
	tamanyX= 640;
	tamanyY= 480;
	if(numcamsel==1)
	{
		if(appletWebcam) carregarWebcamJava(1);
		else carregarWebcam(1);
	} else
	{
		if(appletWebcam) carregarWebcamJava(2);
		else carregarWebcam(2);
	}
}

function mostrar(str)
{
	getObject("status").innerHTML=str;
}

function clic_vel30()
{
	elapse= 30;
	cont_laps= 0;
}

function clic_vel10()
{
	elapse= 10;
	cont_laps= 0;
}

function clic_vel3()
{
	elapse= 3;
	cont_laps= 0;
}

function redimensionar() {
	
	var elemWait= getObject("webcam_wait");
	var elemFons= getObject("webcam_fons");
	var elem= getObject("webcam_loc");
	elemWait.style.top= findPosY(elemFons)+1+"px";
	elemWait.style.left= findPosX(elemFons)+1+"px";
	elem.style.top= elemWait.style.top;
	elem.style.left= elemWait.style.left;
}