Reload images if mjpegplexer is broken

This commit is contained in:
Christian Franke 2014-03-19 16:35:56 +01:00
parent 47685493bc
commit 80efed22b3
4 changed files with 32 additions and 9 deletions

View File

@ -6,6 +6,7 @@
#cam { width: 100%; height: auto; min-height: 100%; min-width: 1024px; position: fixed; top: 0; left: 0; margin: 0; padding: 0 } #cam { width: 100%; height: auto; min-height: 100%; min-width: 1024px; position: fixed; top: 0; left: 0; margin: 0; padding: 0 }
body { padding: 0px; margin: 0px; } body { padding: 0px; margin: 0px; }
</style> </style>
<script src="view.js"></script>
</head> </head>
<body> <body>
<img id="cam" src="../stream.mjpeg"></img> <img id="cam" src="../stream.mjpeg"></img>

8
cam_public/view.js Normal file
View File

@ -0,0 +1,8 @@
function reloadSrc() {
var camImage = document.getElementById('cam');
if (camImage)
camImage.setAttribute('src', camImage.getAttribute('src'));
window.setTimeout(reloadSrc, 5000);
}
reloadSrc();

View File

@ -8,6 +8,7 @@
</head> </head>
<body onkeydown="keyDown(event)" id='body'> <body onkeydown="keyDown(event)" id='body'>
<div id="screen"> <div id="screen">
<p class="camNumber">23</p>
<img src="img/testbild.gif" id="camImage"> <img src="img/testbild.gif" id="camImage">
</div> </div>
<div id="form"> <div id="form">

View File

@ -12,9 +12,9 @@
// This Software is licensed under the GPL Version 3, 29 June 2007 // This Software is licensed under the GPL Version 3, 29 June 2007
var cam = 0; var cam = 0;
var camHost = "192.168.1.20:8080"; var camHost = "192.168.1.66:8080";
var controlHost = "192.168.1.20:8080"; var controlHost = "192.168.1.66:8080";
var submitHost = "192.168.1.20:8080"; var submitHost = "192.168.1.66:8080";
var formActive = 0; //crazy errors if boolean is used here... var formActive = 0; //crazy errors if boolean is used here...
//create event which is triggered when DOM is ready //create event which is triggered when DOM is ready
@ -30,9 +30,16 @@ function initReady(fn) {
} }
} }
function reloadSrc() {
var camImage = document.getElementById('camImage');
camImage.setAttribute('src', camImage.getAttribute('src'));
window.setTimeout(reloadSrc, 5000);
}
//hide the form, and switch on camera //hide the form, and switch on camera
function initViewer() { function initViewer() {
var display = document.getElementById('screen'); var display = document.getElementById('screen');
var camImage = document.getElementById('camImage');
var tempCam = parseInt(localStorage.getItem('cam')); var tempCam = parseInt(localStorage.getItem('cam'));
formActive = localStorage.getItem("formActive"); formActive = localStorage.getItem("formActive");
@ -43,7 +50,8 @@ function initViewer() {
//if form was displayed, when page was reloaded, display form //if form was displayed, when page was reloaded, display form
if (formActive == 1) { if (formActive == 1) {
displayCamNumber(); displayCamNumber();
display.innerHTML += '<img id="camImage" src="http://' + camHost + '/cam/' + cam + '/stream.mjpeg" />'; camImage.setAttribute('src',
'http://' + camHost + '/cam/' + cam + '/stream.mjpeg');
showForm(); showForm();
} }
else { else {
@ -51,25 +59,30 @@ function initViewer() {
document.getElementById('form').style.visibility = "hidden"; document.getElementById('form').style.visibility = "hidden";
changeCam(); changeCam();
} }
reloadSrc();
} }
function displayCamNumber() { function displayCamNumber() {
var display = document.getElementById('screen'); var camNumber = cam + 1;
camDisplay = cam + 1; var camDisplay = document.getElementsByClassName('camNumber')[0];
display.innerHTML = '<p class="camNumber">' + camDisplay + '</p>';
camDisplay.innerText = camNumber;
} }
//change currently displayed camera to the one in cam variable //change currently displayed camera to the one in cam variable
function changeCam() { function changeCam() {
var display = document.getElementById('screen'); var display = document.getElementById('screen');
var camImage = document.getElementById('camImage');
if (cam <= 7 && cam >= 0) { if (cam <= 7 && cam >= 0) {
displayCamNumber(); displayCamNumber();
display.innerHTML += '<img id="camImage" src="http://' + camHost + '/cam/' + cam + '/stream.mjpeg" />'; camImage.setAttribute('src',
'http://' + camHost + '/cam/' + cam + '/stream.mjpeg');
localStorage.setItem("cam", cam); localStorage.setItem("cam", cam);
} }
else { else {
display.innerHTML = '<img id="camImage" src="img/testbild.gif" />'; camImage.setAttribute('src', 'img/testbild.gif');
} }
} }