Jump to content

ayuda con ipcam


Recommended Posts

buenas, espero estar en el luar indicado

 

mi problema es el siguiente (y sepan disculpar mi ignorancia ya q soy nuevo en esto)

 

tengo q crear una pagina a las cual pueda ver 4 camaras ip al mismo tiempo, el tema es q no se como hacer para ver solamente la imagen, ya q si hago la tabla y agrego el source q es una ip me tira la pagina completa con los comados, y yo solamente kiero q se vea la imagen sin controles ni nada, ademas de q cuando veo el cuadro donde deberia estar la camara tengo q estar ajustandolo hasta llegar a ver la imagen. alguien sabe como hacer esto? o estoy delirando?

 

muchas gracias de antemano

Link to comment
Share on other sites

busca en el fuente el objeto que representa el video, debe ser un <object>.....</object>.

Si te sigue mostrando elementos que no quieres, entonces con el firebug o el inspector del chrome puedes ir alterando el fuente de manera dimámica hasta llegar a lo deseado.

 

Saludos

Link to comment
Share on other sites

entiendo, pero no encuentro el object, puse inspeccionar elemento con firefox y tmb ver codigo fuente y aun asi nada. yo lo q intento es hacer q en un html se puedan ver 4 camaras ip q esten en diferentes lugares, pero solo ver la imagen y no todo el contenido de la web cam, subo un par de screen para q vean q es lo q intento y lo q me esta pasando

 

en la primera es como la estructura y el resultado q kiero. pero solo logro q se vea la pagina de la webcam y no solamente la webcam

screen0x1.jpg

 

aca esta el pobre diseño q estoy usando jajaja

screen0x2.jpg

 

 

Link to comment
Share on other sites

ok, según veo el objeto que contiene el video es un <img> haciendo uso de un cgi. Trata eliminando todo el html innecesario pero dejando los .js ya que puede que se haga uso de estos, por lo que veo en los screenshot ya estas teniendo lo que quieres.

Link to comment
Share on other sites

lo he hecho y fui eliminando todo de arriba abajo hasta kedar con la siguiente foto:

 

screen0x3.jpg

tmb por las dudas puse ver codigo fuente y no aparece ningun "object" y son mas de 400 lineas y mucho no se para estar leyendo :(

 

screen0x4.jpg

quisiera saber mas T_T

Link to comment
Share on other sites

disculpa q no pude mandar antes respuesta, me dieron mucho trabajo para hacer :P

 

bueno, lo q hice fue eliminar todo lo q estaba de mas y editar el htm para q kede de la misma forma a como lo estaba viendo, pero no dio ningun fruto. al final se sigue viendo todo de la misma forma con los controles q no kiero q se vean

 

aca dejo adjunto el htm a como lo habia editado a ver donde meti la pata o si estoy haciendo mal:

 

[hide]

<html>
	<body bgcolor=#fafcb1>
	<center>
		<table width=1100 border=1 height=750>
			<tr>
				<td width=350 height=250><center>
					<iframe width=350 height=250 src="http://192.168.0.221:81">
						#document
						<html>
							<head>

								<title>IPCam</title>

								<link rel="stylesheet" href="style.css" type="text/css">

								<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

								<meta name="keywords" content="camera">

								<style type="text/css">
body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;background-color:#999999;}
.style2 {font-size: 12px}
</style>

								<script src="public.js"></script>
								<script src="spanish/string.js"></script>
								<script src="spanish/oem.js"></script>

								<script src="check_user.cgi"></script>

								<script src="get_status.cgi"></script>

								<script src="get_camera_params.cgi"></script>

								<script type="text/javascript">
									
if(sys_ver.charAt(0)!='4')

										location = 'vererr.htm';
									
try{

										user;
									
}
									
catch(exception){
									
	location='index.htm';

									}
									
var record_osd=1;
									
var ptz_type=0;

									var ERROR_TIMEOUT=-3;
									
var ERROR_CANCEL=-5;
									var current=0;

									var PRI_REFUSE=0;

									var PRI_VISITOR=1;

									var PRI_OPERATOR=2;

									var PRI_ADMINISTRATOR=3;

									var R160_120=2;

									var R320_240=8;

									var R640_480=32;

									var PTZ_STOP=1;

									var TILT_UP=0;

									var TILT_UP_STOP=1;

									var TILT_DOWN=2;

									var TILT_DOWN_STOP=3;

									var PAN_LEFT=4;

									var PAN_LEFT_STOP=5;

									var PAN_RIGHT=6;

									var PAN_RIGHT_STOP=7;

									var PTZ_LEFT_UP=90;

									var PTZ_RIGHT_UP=91;

									var PTZ_LEFT_DOWN=92;

									var PTZ_RIGHT_DOWN=93;

									var PTZ_CENTER=25;

									var PTZ_VPATROL=26;

									var PTZ_VPATROL_STOP=27;

									var PTZ_HPATROL=28;

									var PTZ_HPATROL_STOP=29;

									var PTZ_PELCO_D_HPATROL=20;

									var PTZ_PELCO_D_HPATROL_STOP=21;

									var IO_ON=94;
var IO_OFF=95;

									var cameras={};

									var listen_src="";

									var talk_src="";

									var listen_on_src="";

									var talk_on_src="";

									var record_src="";

									var record_on_src="";

									if(pri == PRI_ADMINISTRATOR)

										document.write('<script src="get_misc.cgi"><\/script>');

									cameras.alias=new Array();

									cameras.host=new Array();

									cameras.port=new Array();

									cameras.user=new Array();

									cameras.pwd=new Array();

									cameras.pri=new Array();

									cameras.valid=new Array();

									cameras.restart=new Array();

									cameras.retry_times=new Array();

									cameras.count=1;

									cameras.first=0;

									cameras.pri[0]=cameras.pri[1]=cameras.pri[2]=cameras.pri[3]=0;

									cameras.pri[4] = cameras.pri[5] = cameras.pri[6] = cameras.pri[7] = 0;

									cameras.pri[8] = 0;

									cameras.set_params=function(index,alias,host,port,user,pwd)	{
									 
	 if ((index > 8) || (index < 0))

											return;
	this.alias[index]=alias;

										this.host[index]=host;
									
	this.port[index]=port;
									
	this.user[index]=user;
									
	this.pwd[index]=pwd;
									}
cameras.set_count=function(current,count){
									  
	if(count > 9)

											count = 9;

										if ((count > 4) && (count < 9))

											count = 4;

										if (count < 1 || ((count > 1) && (count <4)))

											count = 1;
									
	this.count=count;

										if (parseInt(current) + parseInt(count) > 9)

											this.first = 9 - count;
									
	else

											this.first=current;

										for (i = 0;i < 9;++ i)

											this.valid[i]=0;

										for (i=this.first;i<parseInt(this.first)+parseInt(this.count);++i)

											this.valid[i]=1;	}

									function decoder_control(command)
									
{
 
										action_zone.location='decoder_control.cgi?command='+command;

									
}

									function camera_control(param,value)
									
{ action_zone.location='camera_control.cgi?param='+param+'&value='+value;}
									
function pic_rspeed(value)
									
{
										video_stream.src='videostream.cgi?user='+ user +'&pwd='+ pwd +'&resolution='+ resolution +'&rate='+value;
									
}

									function set_reversal(){if (flip&0x01){
									
		flip=flip&0x02;
									
	}else
									
		flip=flip|0x01;
									
	camera_control(5,flip);}
									
function set_mirror(){	if (flip&0x02)
									
		flip=flip&0x01;

										else

											flip=flip|0x02;
									
	camera_control(5,flip);}

									function body_onload(){
										
var port;
									
	if (location.port=='')

											port=80;

										else
									
		port=location.port;
									
	cameras.set_params(0,alias,location.hostname,port,user,pwd);
									
	for(i=1;i<=8;i++)
									
		cameras.set_params(i,'','',0,'','');
									
	current=0;
									
	for(i=0;i<9;i++){
									
		cameras.pri[i]=PRI_REFUSE;
									
		cameras.retry_times[i]=0;

											cameras.restart[i]=0;
									
	}
									
	cameras.set_count(current,1);
									
	var bOpe = pri>PRI_VISITOR;

										var bAdmin = pri>PRI_OPERATOR;
									 
	if(!bOpe){

											ptzpanel.style.display='none';

											hpatrol.style.display='none';

											vpatrol.style.display='none';

											img_reversal.style.display='none';

											img_mirror.style.display='none';

											bvoption.style.display='none';

											img_option.style.display='none';
			
								img_switchon.style.display='none';
			
								img_switchoff.style.display='none';
		
								}
									
	else if(!bAdmin){

											img_option.style.display='none'; }
									
	if(pri == PRI_ADMINISTRATOR)
									
		document.getElementById('curpos').innerText = ptz_patrol_rate;
									
}

									function showhint(str){
									
hint_span.innerText=str;
									
}

									function OnResolutionChanged(nValue){
									
	camera_control(0,nValue);
									
	setTimeout('location.reload()',2000);}
									
function up_onmousedown() {

										(flip&0x01)?decoder_control(TILT_DOWN):decoder_control(TILT_UP);}
									
function up_onmouseup() {

										if (!ptz_type)

											decoder_control(PTZ_STOP);
									
	else if (flip&0x01)
									
		decoder_control(TILT_DOWN_STOP);
									
	else
										
	decoder_control(TILT_UP_STOP);}
									
function down_onmousedown() {
									
	(flip&0x01)?decoder_control(TILT_UP):decoder_control(TILT_DOWN);}
									
function down_onmouseup() {
									
	if (!ptz_type)

											decoder_control(PTZ_STOP);
									
	else if (flip&0x01)
									
		decoder_control(TILT_UP_STOP);

										else

											decoder_control(TILT_DOWN_STOP);	}
									
function left_onmousedown() {
									
	(flip&0x02)?decoder_control(PAN_RIGHT):decoder_control(PAN_LEFT);}

									function left_onmouseup() {

										if (!ptz_type)

											decoder_control(PTZ_STOP);

										else if (flip&0x02)

											decoder_control(PAN_RIGHT_STOP);

										else
	
										decoder_control(PAN_LEFT_STOP);	}

									function right_onmousedown() {

										(flip&0x02)?decoder_control(PAN_LEFT):decoder_control(PAN_RIGHT);}

									function right_onmouseup() {
	if(!ptz_type)

											decoder_control(PTZ_STOP);

										else if(flip&0x02)

											decoder_control(PAN_LEFT_STOP);

										else
										
	decoder_control(PAN_RIGHT_STOP);}

									function image_switchon_onclick(){

										decoder_control(IO_ON);}

									function image_switchoff_onclick(){

										decoder_control(IO_OFF);}

									var s_hpatrol=true;

									var s_vpatrol=true;

									function hpatrol_onclick() {

										if(s_hpatrol){

											ptz_type?decoder_control(PTZ_PELCO_D_HPATROL):decoder_control(PTZ_HPATROL);

											s_hpatrol = false;

									}else{

											ptz_type?decoder_control(PTZ_PELCO_D_HPATROL_STOP):decoder_control(PTZ_HPATROL_STOP);

											s_hpatrol=true;

										}}
									function vpatrol_onclick() {

										if(s_vpatrol){

											if (!ptz_type) decoder_control(PTZ_VPATROL);

											s_vpatrol = false;

										}	else{

											if (!ptz_type) decoder_control(PTZ_VPATROL_STOP);

											s_vpatrol=true; }}

									function getX(elem){

									  var x = 0;

									  while(elem){

 									   x = x + elem.offsetLeft;

 									   elem = elem.offsetParent;

 									 }return x;}
									
function getY(elem){

 									 var y = 0;
									
 while(elem){

 									   y = y + elem.offsetTop;

 									   elem = elem.offsetParent;}

 									 return y;}

									function showpostable(){
	
									hidep();

										var tb=document.getElementById('pt');

										var curpos=document.getElementById('curpos');

										var nleft=getX(curpos);

										var ntop=getY(curpos);

										tb.style.left=nleft-90;

										tb.style.top=ntop-2;

										tb.style.display = "block";}

									function setspeed(nValue){

										action_zone.location='set_misc.cgi?ptz_patrol_rate='+nValue;

										document.getElementById('curpos').innerText = nValue;}

									function showppos(panel,btn){
										
hidep();

										var tb=document.getElementById(panel);

										var curpos=document.getElementById(btn);

										var nleft=getX(curpos);

										var ntop=getY(curpos);
										tb.style.left=nleft-90;

										tb.style.top=ntop;

										tb.style.display = "block";}

									function hideppos(panel){
										var tb=document.getElementById(panel);

										tb.style.display = "none";}

									function callcmd(cmd){

										if(current>=0 && current<9)

											decoder_control(cmd);

											}

									function hidep(){

									hideppos('cp');

									hideppos('sp');

									hideppos('pt')

									}

									function MM_reloadPage(init) {
									 
 if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {

									  document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}

									 else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();

									}

									MM_reloadPage(true);

								</script>
								<script src="get_misc.cgi"></script>

							</head>

							<body align="center" onload="body_onload()">

								<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
 
									<tbody>
										<tr>
											<td onclick="hidep();" align="center" height="100%" valign="middle">
												<table border="0" cellpadding="0" cellspacing="0" height="281" width="320">
													<tbody>
														<tr>
															<td rowspan="3">
																<div name="ipcamdiv" id="ipcamdiv" align="center">
  
																	<span>
																		<img src="videostream.cgi?user=admin&pwd=admin&resolution=8&rate=0" id="video_stream">
																	</span>
																</div>
															</td>
  
														</tr>
    
    
    
													</tbody>
												</table>
											</td>
   
										</tr>

									</tbody>
								</table>






							</body>
						</html>
					</iframe>
				<td width=350 height=250><center>
				<td width=350 height=250><center>
			</tr>
			<tr>
				<td width=350 height=250><center>
				<td width=350 height=250><center>
				<td width=350 height=250><center>
			</tr>
			<tr>
				<td width=350 height=250><center>
				<td width=350 height=250><center>
				<td width=350 height=250><center>
			</tr>
		</table>
	</body>
</html>

[/hide]

 

PD: perdon por semejante codigo, no se como esconderlo en esas solapitas q cierran y abren :P

si alguien sabe como achicarlo lo edito ^^

Edited by FTN
Link to comment
Share on other sites

Una pregunta, el server 192.168.0.221 es distinto al server en donde ejecutas la página de los 9 iframes? Si es otro server, entonces vas a tener que crear otro html con el código reduicido en el 192.168.0.221 para que presentes este en los iframes. Me parece que en esta imagen se ve que puedes eliminar los componentes no deseados.

screen0x3.jpg

Saludos



			
		
Link to comment
Share on other sites

cada iframe es el resultado de una ipcam diferente, a la ip donde estoy llamando es la mismisima ipcam y el resultado de la foto es la pagina q me brinda la camara ip. desde firefox elimine todo lo q estaba alrededor de la imagen pero solo para verlo en el momento, cuando recargo la pagina me devuelve la pantalla anterior con todos sus controles. yo ahora estoy haciendo la prueba local con una sola camara ip, pero a futuro planeo cambiar la ip por un dyndns para poder ver las camaras a travez de internet y desde cualkier lugar y desde cualkier navegador. o sea, escribir la direccion de dyndns desde mi casa y poder ver las diferentes camaras ip en el mismo navegador con esa estructura q mostre antes con las tablas. tal vez estoy haciendo todo mal ya q mi conocimiento es muy basico y al mismo tiempo estoy leyendo guias a ver si puedo hacer algo xD

 

PD: voy a ver si con el deramweaver puedo hacer algo y de ahi extraer el codigo fuente...

Edited by FTN
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...