Videoüberwachung

IP-Symcon Visualisierung
41

Hallo Rainer,

DANKE. Es kann so einfach sein, auch wenn ich jetzt ein Menge mehr Fehlermeldung habe, aber das Versuche ich erst einmal selber zu finden.

42

Hallo Rainer,

der Fehler war nur ein falscher Variablen-Typ. War ganz easy.

Frage am Rande…

… wie lange dauert die Aktualisierung wenn Du eine Variable änderst bis die im Webfront aktualisiert wird?

Bei mir können schon einmal 5 Sekunden vergehen bis sich die Anzeige an den Wert anpasst. Habe diesbezüglich auch schon den Updateintervall auf 500mSek geändert hat aber nicht gebracht.

43

Hallo Werner,

sofort nach Variablenänderung der eingestellten Updatezeit.

Ich hab das ganze eben auf einem separaten Webserver laufen.

Müsste ich dann mal probieren.

44

Hallo Rainer,

seltsam, bei mir sind es min. 10 Sek. Mal sehen ob ich irgendwo einen BUG finde.

45

Hallo Rainer,

irgendwo ist bei mir noch der Hund begraben.

Der Intervall für die Aktualisierung mit bis zu 10 Sekunden war nicht das Problem von koolajax sondern die Refreshrate wie in der costumconfig angegeben.

Habe diese jetzt auf NULL gesetzt und siehe da es wird nichts mehr aktualisiert.

Wenn ich koolajax richtig verstehe wird bei einer Änderung die in den ersten Zeilen definiert wid alles was sich zwischen

        <?php echo KoolScripting::Start();?>
          <updatepanel id="Variable">
            <content>

und

</content>
          </updatepanel>
        <?php echo KoolScripting::End();?>

befindet wie durch einen Refresh neu geladen, egal was darin steht.

Irgendwie tut es das aber nicht.

Hast Du einen Tip für mich.

46

Hallo Werner,

nö. Habs gerade mal in die laufende Applikation Webfront geladen, da tut sich bei mir auch nichts mehr.
Im Xampp läuft es einwandfrei. Ob da noch eine dll fehlt. :confused:

47

Hab mir mal paar Icon gegönnt.

WebVideo.png
WebVideo.png1280×878 176 KB

48

sieht klasse aus !

49

Gibts eigentlich zu CamUniversal noch Alternativen? Vielleicht sogar Freeware? Oder komme ich mit der Shareware Version total aus, im Moment habe ich nicht mehr als 2 Cams. Die zwei sollten ja laut Herstelleseite funktionieren…

50

webcamXP5, ist aber auch keine Freeware um die 30€. Alles was ich an Freeware getestet hatte, kannst Du vergessen.

51

Okay, danke RWN. Ich glaube auch bei der Webcam Einbindung wirst du wieder mein Held werden :smiley:

52

So WebCamXP läuft, kann mir auf dem Webserver der Software schon mein Cambild ansehen. Was muß ich jetzt in der Camera.php alles anpassen damit diese sich den Stream von WebCamXP holt?

Reicht dieser Teil so aus oder ist da mehr fällig:

// your settings ====================

// number of the camera (1..n)
var cam_nr = 1 ;

// port of the webserver
var cam_port = 8080 ;

// IP address of the PC
var cam_ip = "192.168.100.9" ;

// JPG picture quality
var jpg_quality = 50 ;

// receive interval in millisec
var interval_ms = 500 ;

//==============================
53

hier der richtige

<img src=„http://HOMESERVER:8080/loading.jpg“ class=„webcam“ id=„webcam1“ onmousedown=„PTZMouseDown1(event)“ width=„768“ height=„576“ alt=„Live Stream“ />
<script type=„text/javascript“>
<!–
currentCamera1= 1;
errorimg1= 0;
document.images.webcam1.onload = DoIt1;
document.images.webcam1.onerror = ErrorImage1;
function LoadImage1()
{
uniq1 = Math.random();
document.images.webcam1.src = „http://HOMESERVER:8080/cam_“ + currentCamera1 + „.jpg?uniq=“+uniq1;
document.images.webcam1.onload = DoIt1;
}
function PTZMouseDown1(e)
{
var IE = document.all?true:false;
var x,y;
var myx,myy;
var myifr = document.getElementById(„iframe-ptz");
tp = getElPos1();
myx = tp[0];
myy = tp[1];
if(IE){
var scrollX = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft;
var scrollY = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
x = event.clientX - myx + scrollX;
y = event.clientY - myy + scrollY;
} else {
x = e.pageX - myx;
y = e.pageY - myy;
}
if ((width_array[currentCamera1] != null) && (width_array[currentCamera1] > 0)) x = Math.round((x * 400) / width_array[currentCamera1]);
if ((height_array[currentCamera1] != null) && (height_array[currentCamera1] > 0)) y = Math.round((y * 300) / height_array[currentCamera1]);
if (x > 400) x = 400;
if (y > 300) y = 300;
if (myifr != null) myifr.src = „http://HOMESERVER:8080/ptz?src=“ + currentCamera1 + „&moveto_x=“ + x + „&moveto_y=“ + y +"";
return true;
}
function getElPos1()
{
el = document.images.webcam1;
x = el.offsetLeft;
y = el.offsetTop;
elp = el.offsetParent;
while(elp!=null)
{ x+=elp.offsetLeft;
y+=elp.offsetTop;
elp=elp.offsetParent;
}
return new Array(x,y);
}
function ErrorImage1()
{
errorimg1++;
if (errorimg1>3){
document.images.webcam1.onload = „“;
document.images.webcam1.onerror = „“;
document.images.webcam1.src = „offline.jpg“;
}else{
uniq1 = Math.random();
document.images.webcam1.src = "http://HOMESERVER:8080/cam“ + currentCamera1 + „.jpg?uniq=“+uniq1;
}
}
function DoIt1()
{
errorimg1=0;
window.setTimeout(„LoadImage1();“, 40);
}
//–>
</script>

54

Hm, kommt noch kein Bild an, sehe nur das schwarze Bild auf der IPS Seite und da steht Camera1 drin. Muß ich in diesem Camserver was besonderes einstellen, ausser halt die Cams da drin zu aktivieren? Also in diesem Server und auf der Homepage des Camservers sehe ich ein Bild. hab dort eine Linksys Cam eingebunden!

Script habe ich jetzt so hergneommen wie du mir das oben vorgeschlagen hast!

55

Du kannst Dir doch den kompletten Code von XP5 generieren lassen, diesen dann einfach einfügen.

Tools => HTML Quelltext Assistent => Stream Javascript.

Habs oben geändert, war von was anderem, sorry.

56

Okay, danke, habs gefunden! Werd mir das heute Abend mal gründlich ansehen.

57

Hi,

wie werden die Kameras zum schwenken neigen zoomen angesprochen, RS485?
Wie habt ihr das in PHP umgesetzt?

Gruß.

58

…kommt auf die Cam drauf an. Javascript.

59

Ähm, ne blöde Frage, wo muß ich drehen damit das Bild der Cam in den vorgesehenen Bereich kommt :smiley:

Mein Code schaut jetzt so aus:

<!--
<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-->

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

<style type="text/css">@import "camera.css";</style>
<style type="text/css">
html, body { margin: 0; padding: 0; }
</style>

</head><body>

<img src="http://192.168.100.9:8080/loading.jpg" class="webcam" id="webcam1" onmousedown="PTZMouseDown1(event)" width="320" height="240" alt="Live Stream" />

<script type="text/javascript">
<!--
currentCamera1= 1;
errorimg1= 0;
document.images.webcam1.onload = DoIt1;
document.images.webcam1.onerror = ErrorImage1;
function LoadImage1()
{
        uniq1 = Math.random();
        document.images.webcam1.src = "http://192.168.100.9:8080/cam_" + currentCamera1 + ".jpg?uniq="+uniq1;
        document.images.webcam1.onload = DoIt1;
}
function PTZMouseDown1(e)
{
        var IE = document.all?true:false;
        var x,y;
        var myx,myy;
        var myifr = document.getElementById("_iframe-ptz");
        tp = getElPos1();
        myx = tp[0];
        myy = tp[1];
        if(IE){
        var scrollX = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft;
        var scrollY = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
        x = event.clientX - myx + scrollX;
        y = event.clientY - myy + scrollY;
        } else {
        x = e.pageX - myx;
        y = e.pageY - myy;
        }
        if (width_array[currentCamera1] > 0) x = Math.round((x * 400) / width_array[currentCamera1]);
        if (height_array[currentCamera1] > 0) y = Math.round((y * 300) / height_array[currentCamera1]);
        if (x > 400) x = 400;
        if (y > 300) y = 300;
        if (myifr != null) myifr.src = "http://192.168.100.9:8080/ptz?src=" + currentCamera1 + "&moveto_x=" + x + "&moveto_y=" + y +"";
        return true;
}
function getElPos1()
{
            el = document.images.webcam1;
            x = el.offsetLeft;
            y = el.offsetTop;
            elp = el.offsetParent;
            while(elp!=null)
              { x+=elp.offsetLeft;
                y+=elp.offsetTop;
                elp=elp.offsetParent;
              }
            return new Array(x,y);
}
function ErrorImage1()
{
        errorimg1++;
        if (errorimg1>3){
              document.images.webcam1.onload = "";
              document.images.webcam1.onerror = "";
              document.images.webcam1.src = "offline.jpg";
              }else{
                uniq1 = Math.random();
            document.images.webcam1.src = "http://192.168.100.9:8080/cam_" + currentCamera1 + ".jpg?uniq="+uniq1;
              }
}
function DoIt1()
{
        errorimg1=0;
        window.setTimeout("LoadImage1();", 40);
}
//-->
</script>
<table style="width: 100%; height: 100%; border: 0;"><tbody><tr><td align="center" valign="top">
<div style="border: 10px solid #3A3D40; width: 340; height: 260;">
<div style="border: 1px solid white; padding: 10px; background: black; width: 320; height: 240;">
<img src=ImageAddress name=CamPicture alt="Camera1" border="0">
</div></div>
</td></tr>
</tbody></table>

</body></html>

Cam.PNG.jpg
Cam.PNG.jpg1395×660 56 KB

60

Füge die Camdaten in src in den Rahmen ein. :slight_smile:

<!--
<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-->

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

<style type="text/css">@import "camera.css";</style>
<style type="text/css">
html, body { margin: 0; padding: 0; }
</style>

</head><body>



<script type="text/javascript">
<!--
currentCamera1= 1;

document.images.webcam1.onload = DoIt1;

function LoadImage1()
{
        uniq1 = Math.random();
        document.images.webcam1.src = "http://192.168.100.9:8080/cam_" + currentCamera1 + ".jpg?uniq="+uniq1;
        document.images.webcam1.onload = DoIt1;
}

function DoIt1()
{
        
        window.setTimeout("LoadImage1();", 40);
}
//-->
</script>
<table style="width: 100%; height: 100%; border: 0;"><tbody><tr><td align="center" valign="top">
<div style="border: 10px solid #3A3D40; width: 340; height: 260;">
<div style="border: 1px solid white; padding: 10px; background: black; width: 320; height: 240;">
<img src="http://192.168.100.9:8080/loading.jpg" class="webcam" id="webcam1" width="320" height="240" alt="Live Stream" />
</div></div>
</td></tr>
</tbody></table>

</body></html>