Image de mon parlophone ne se raffraichit pas !

Version imprimable

Bonsoir à toutes et à tous,

Avec ce code, dès le lancement je vois la vue de la caméra de mon vidéo parlophone mais après le reload, plus.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <script language="JavaScript" type="text/javascript"> function reload() {setTimeout('reloadImg("refresh")',350)}; function reloadImg(id) { var obj = document.getElementById(id); var rand = Math.random(); obj.src = "http://IPADRESS:81/snapshot.cgi?user=xxx&pwd=xxx&t="+rand; } </script> <img src="http://IPADRESS:81/snapshot.cgi?user=xxx&pwd=xxx&t=" name="refresh" width="640" height="480" id="refresh" onload='reload()'>
Y a t'il une faute de ma part, n'étant pas trop orienté JavaScript.

Merci d'une réponse éventuelle.

@+,

Cincap

28/10/2015, 23h11
NoSmoking

Bonjour,
quand est appelée la fonction reload ?

Voir également la différence entre setTimeout et setInterval !

Bonjour à toutes et à tous,

@NoSmoking, merci de ta réponse.

En fait sur un autre test, j'utilise le plugin VLC et cela fonctionne correctement.

Et pour comprendre mieux le système, je m'étais dit pourquoi pas essayer simplement d'utiliser l'image et de faire le refresh de la page.

J'ai testé de placer le onload dans le Body ou directement dans la fonction mais sans succès.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
<head>
<title>PARLOPHONE</title>
<script language="JavaScript" type="text/javascript">
  function reload() {setTimeout('reloadImg("refresh")',1000)};
  function reloadImg(id)
  {
   var obj = document.getElementById(id);
   var rand = Math.random();
   obj.src = "http:/192.168.1.63:81/snapshot.cgi?user=admin&pwd=champion1953&t="+rand;
  }
window.onload = reload;
</script>
</head> 
<BODY BACKGROUND="0102.jpg" marginwidth="50" marginheight="50" topmargin="50" 

leftmargin="center">

<img src="http://192.168.1.263:89/snapshot.cgi?user=&pwd=&t=" name="refresh" 

width="640" height="480" id="refresh" onload='reload()'>

 </BODY>
</html>

Changement de la fonction et cela fonctionne correctement :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
<head>
<title>PARLOPHONE</title>
</head>
 
<BODY BACKGROUND="0102.jpg" marginwidth="50" marginheight="50" topmargin="50" 
 
leftmargin="center">
 
<div class="style1" align="center">
 <IMG src="http://192.168.1.263:89/snapshot.cgi?user=&pwd=t=" name="refresh" 
width="640" height="480" border="1"> 
 
 <SCRIPT language="JavaScript" type="text/javascript"> 
 var t = 20 // Interval in Seconds
 image = "http://192.168.1.263:89/snapshot.cgi?user=&pwd=&t=" 
 function Start() { 
 tmp = new Date(); 
 tmp = "?"+tmp.getTime() 
 document.images["refresh"].src = image+tmp 
 setTimeout("Start()", t*100) 
 } 
 Start(); 
 </SCRIPT>
 </div>
 
<iframe src="streammjpg.html" name="frm-content" frameborder="0" marginheight="0" marginwidth="1" 
 
scrolling="no" width="100%" style="border-style: solid; border-width: 0px" align="center" height="220" />
 </iframe>
 
 </BODY>
</html>

@+,

cincap

29/10/2015, 11h25
SpaceFrog

Code:

document.images["refresh"].src = image+tmp

=>

Code:

document.getElementById("refresh").src = image+tmp

?
29/10/2015, 12h41
NoSmoking

Tu as résolu ton soucis simplement en rappelant la fonction via un setTimeout dans la fonction ce qui n'était pas le cas dans ton premier code où après avoir appeler la fonction celle ci ne l'était plus.

Voilà le pourquoi de

Citation:

Voir également la différence entre setTimeout et setInterval !

Nota : sans argument

Code:

setTimeout("Start()", t*100)

peut avantageusement s'écrire

Code:

setTimeout( Start, t*100)
29/10/2015, 12h58
cincap

Merci à vous deux.

@ SpaceFrog, le fait de modifier le code avec ta suggestion, ne rafraichit pas l'image de la caméra, avec le code d'origine,

Citation:

document.images["refresh"].src = image+tmp

on voit l'image de la caméra comme si c'était une vidéo.

Citation:

document.getElementById("refresh").src = image+tmp

L'image à l'air figée.

@ NoSmoking, j'ai remplacé ta suggestion et cela fonctionne sans bug.

Merci à tous.

@+,

cincap

Désolé, j'avais commis une erreur suite à la suggestion de SpaceFrog !

Bonjour à toutes et à tous,

Je tenais à m'excuser auprès de SpaceFrog, sa suggestion fonctionne correctement.

Citation:

document.getElementById("refresh").src = image+tmp

J'avais confondu name= "refresh" et id="refresh".

J'en profite aussi pour ceux qui veulent rafraichir une image fixe de vidéoparlophone comme celui de la marque Konx, la fonction directement dans l'objet image fonctionne comme si c'était le flux de la caméra :
Code:

1 2 <img src="http://192.168.1.263:89/snapshot.cgi?cmd=snapPicture2&user=&pwd=&t= name="vdp" width="790" height="495" border="5" onload='setTimeout(function() {src = src.substring(0, (src.lastIndexOf("t=")+2))+(new Date()).getTime()}, 100)' onerror='setTimeout(function() {src = src.substring(0, (src.lastIndexOf("t=")+2))+(new Date()).getTime()}, 500)' alt='' />
Il suffit de rentrer l'Ip du vidéoparlophone, le port en général 81, l'user et le pwd.

Merci encore pour vos réponses,.

@+,

Cincap