janis/system0-2.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixing webcam issues

Browse Source
This commit is contained in:
Janis Steiner
2024-10-14 12:38:32 +01:00
parent 5e853f4000
commit 3e1380ca47
2 changed files with 42 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
sys0-code/api/download_image.php Normal file
View File

@@ -0,0 +1,12 @@
<?php
// Get parameters
$username = htmlspecialchars($_GET["username"]);
$printer_url = $_GET["url"];
// Path to save the downloaded image
$path = "/var/www/html/user_files/$username/$printer_url.jpeg";
// Download the latest snapshot from the printer URL
exec("wget --quiet \"http://$printer_url/webcam/?action=snapshot\" -O $path");
?>

37
sys0-code/app/webcam.php
View File

@@ -7,20 +7,35 @@
?> ?>
<head> <head>
<title>Webcam</title> <title>Webcam</title>
</head> </head>
<body> <body>
<?php <!-- Display the first image -->
$path = "/var/www/html/user_files/$username/$printer_url.jpeg"; <img id="webcam-image" style="transform: rotate(<?php echo $rotation; ?>deg);" width="100%" src="/user_files/<?php echo $username; ?>/<?php echo $printer_url; ?>.jpeg" alt="Webcam Feed">
unlink($path);
exec("wget --quiet \"http://$printer_url/webcam/?action=snapshot\" -O $path");
echo("<img style='transform: rotate(".$rotation."deg);' loading='lazy' width='100%' src='/user_files/$username/$printer_url.jpeg'>");
?>
<script> <script>
setInterval(function() { // Function to call PHP script to download the latest image and then swap it
location.reload(); function loadAndSwapImage() {
}, 5000); // Make an AJAX call to PHP to trigger the image download
let xhr = new XMLHttpRequest();
xhr.open('GET', '/api/download_image.php?username=<?php echo $username; ?>&url=<?php echo $printer_url; ?>', true);
xhr.onload = function() {
if (xhr.status === 200) {
// Preload the new image once the PHP script has completed downloading
let img = new Image();
img.src = '/user_files/<?php echo $username; ?>/<?php echo $printer_url; ?>.jpeg?rand=' + Math.random(); // Add cache buster to avoid caching issues
// Swap the image when it is loaded
img.onload = function() {
let webcamImage = document.getElementById('webcam-image');
webcamImage.src = img.src;
}
}
};
xhr.send(); // Execute the request
}
// Reload the image every 5 seconds
setInterval(loadAndSwapImage, 5000);
</script> </script>
</body> </body>
</html> </html>