html / object-code

Status
Niet open voor verdere reacties.

jgcramer

Nieuwe gebruiker
Lid geworden
27 mei 2014
Berichten
4
Hallo,

Ik had een vraag wat betreft een code die ik nu werkend heb maar zou willen uitbreiden. Het verhaal is dat ik een beveiligings camera hem met 16 camera's.

De camera zelf heeft een beroerde web interface om te tonen op een scherm. Nu wou ik dit zelf gaan maken.

Ik zou onderstaande code elke x seconden willen vervangen door een volgende stream tot 16 en dan weer naar 1.

rtsp://admin:admin@192.168.53.100:801/live/h264/ch1
rtsp://admin:admin@192.168.53.100:801/live/h264/ch2
rtsp://admin:admin@192.168.53.100:801/live/h264/ch3

Heeft iemand een idee hoe dit zou moeten?

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<HTML >
  <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
     codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
     width="640" height="480" id="vlc" events="True">
   <param name="Src" value="rtsp://admin:admin@192.168.53.100:801/live/h264/ch2"/>
   <param name="ShowDisplay" value="True" />
   <param name="AutoLoop" value="False" />
   <param name="AutoPlay" value="True" />
   <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480"
target="rtsp://admin:admin@192.168.53.100:801/live/h264/ch2" ></embed>
</OBJECT>
  </BODY>
</HTML >
 
Welkom op Helpmij :)

Is dit wat je zoekt?
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
  <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
    <OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
     codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
     width="640" height="480" id="vlc" events="True">
       <param id="videoSrc" name="Src" value="rtsp://admin:admin@192.168.53.100:801/live/h264/ch1"/>
       <param name="ShowDisplay" value="True" />
       <param name="AutoLoop" value="False" />
       <param name="AutoPlay" value="True" />
       <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480" target="rtsp://admin:admin@192.168.53.100:801/live/h264/ch1" ></embed>
   </OBJECT>
   <script>
    var camera = 2;
    var switchCam = window.setInterval(function() {
        var camUrl = "rtsp://admin:admin@192.168.53.100:801/live/h264/ch" + camera;
        document.getElementById("videoSrc").value = camUrl;
        document.getElementById("vlcEmb").target = camUrl;
        camera++;
        console.log(camUrl);
        if(camera > 16) {
            camera = 1;
        }
    }, 5000);
   </script>
  </BODY>
</HTML>
Ik weet alleen niet of je dynamisch de waardes aan kunt passen. Maar in feite wijzigt deze elke 5 seconden de camera-url, tot hij bij 17 is dan zet hij hem weer op 1.

Werkend voorbeeld (qua roulatie) met kleine toevoeging (titel): http://jsfiddle.net/3Jjnm/
 
Laatst bewerkt:
Hallo,

Bedankt! Dit is inderdaad wat ik zoek. Alleen wil hij bij mij niet overgaan naar de andere camera's, blijft op cam 1 hier. getest met internet explorer en firefox.

Ik start het bestand trouwens gewoon van mijn desktop, of heb ik iets anders nodig ook?

Net het script aangepast als op het voorbeeld te zien is. Hij wijzigt alleen de titel en dus niet de stream.
 
Laatst bewerkt:
Zo'n vermoeden had ik al. Waarschijnlijk moet dan het hele <object> opnieuw gegenereerd worden:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
  <BODY marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
    <h1 id="camTitle">Camera 1</h1>
    <OBJECT id="camObj" classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
         codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
         width="640" height="480" id="vlc" events="True">
       <param id="videoSrc" name="Src" value="rtsp://admin:admin@192.168.53.100:801/live/h264/ch1"/>
       <param name="ShowDisplay" value="True" />
       <param name="AutoLoop" value="False" />
       <param name="AutoPlay" value="True" />
       <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480"
    target="rtsp://admin:admin@192.168.53.100:801/live/h264/ch1" ></embed>
    </OBJECT>
   <script>
    var camera = 2;
    var switchCam = window.setInterval(function() {
        var camUrl = "rtsp://admin:admin@192.168.53.100:801/live/h264/ch" + camera;
        
        var camObj = '<h1>Camera '+ camera +'</h1><OBJECT id="camObj" classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" width="640" height="480" id="vlc" events="True"><param id="videoSrc" name="Src" value="'+ camUrl +'"/><param name="ShowDisplay" value="True" /><param name="AutoLoop" value="False" /><param name="AutoPlay" value="True" /><embed type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480" target="'+ camUrl +'" ></embed></OBJECT>';
        
        document.getElementsByTagName("body")[0].innerHTML = camObj;
        camera++;
        if(camera > 16) {
            camera = 1;
        }
    }, 5000);
   </script>
  </BODY>
</HTML>
Voorbeeld: http://jsfiddle.net/3Jjnm/1/

Ik denk dat je het bestand juist vanaf je desktop moet starten (of een lokale webserver) want anders werken de URL's naar je camera's niet ;)
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan