only use images that have a minimum size and delete outdated images

This commit is contained in:
2023-07-10 22:34:51 +02:00
parent 9290cf195b
commit 52ddfe1f59
9 changed files with 95 additions and 15 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 244 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 352 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View File

@ -25,12 +25,12 @@
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
<h3 class="w3-container w3-left cameratext">Blick auf die Piste</h3>
<img src="data/msvcamN.avif" class="w3-center current_webcam_image" style="width:100%;" alt="Bild der Webcam mit Blick auf die Piste">
<img src="data/camera/msvcamN.avif" class="w3-center current_webcam_image" style="width:100%;" alt="Bild der Webcam mit Blick auf die Piste">
</div>
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
<h3 class="w3-container w3-left cameratext">Blick nach Süden</h3>
<img src="data/msvcamS.avif" class="w3-center current_webcam_image" style="width:100%;" alt="Bild der Webcam mit Blick nach Süden">
<img src="data/camera/msvcamS.avif" class="w3-center current_webcam_image" style="width:100%;" alt="Bild der Webcam mit Blick nach Süden">
</div>
<div class="w3-panel w3-card-4 w3-white w3-padding w3-center">
@ -42,7 +42,7 @@
<div class="w3-panel w3-card w3-dark-gray">
<div class="w3-center-align w3-text-black infobox">
<a style="text-decoration: none" href="mailto:pressewart@msv-buehl-moos.de?subject=MSV%20Webcam"><h6>pressewart@msv-buehl-moos.de</h6></a>
<p>Last update: 2023/07/07<p>
<p>Last update: 2023/07/10<p>
<a style="text-decoration: none" href="https://git.mosad.xyz/localhorst/msv-webcam-frontend" target="_blank" rel="noopener noreferrer"><h6>View code in GIT</h6></a>
</div>
</div>

35
www/js/webcam.js Normal file
View File

@ -0,0 +1,35 @@
const images = document.getElementsByClassName('current_webcam_image');
const reload_interval = setInterval(reloadImages, 10000);
window.onload = function() {
reloadImages();
};
function checkImageSource(image_url) {
var http_request = new XMLHttpRequest();
http_request.open('HEAD', image_url, false);
http_request.send();
return http_request.status;
}
function reloadImages() {
console.log('reload in progress');
Array.prototype.forEach.call(images, function(image) {
if (checkImageSource(image.src) == 200) {
if (!image.src.includes('?')) {
image.src = `${image.src}?${Date.now()}`;
} else {
image.src = image.src.slice(0, image.src.indexOf('?') + 1) + Date.now();
}
} else {
console.log('unable to find image on server');
image.alt = "Webcam nicht erreichbar."
}
});
console.log('reload finished');
}