Update online.html

online.html

@@ -94,6 +94,8 @@ document.addEventListener("DOMContentLoaded", function () {
 </nav>
 
 
+    <h1>Текущее состояние растения</h1>
+    <img id="plantImage" src="/last_image" alt="Изображение растения">
   
 <div class="container mt-3">
 
@@ -842,6 +844,7 @@ function updateAlW(value) {
     document.getElementById("tA").textContent = data.tA;
     document.getElementById("hDm").textContent = data.hDm;
     document.getElementById("sVen").textContent = data.sVen;
+    
     updateRFul(data.rFul);
     updateRLi(data.rLi);
     updateRWat(data.rWat);
@@ -967,7 +970,31 @@ function updateAlW(value) {
     setInterval(fetchValues, 10000);
   };
 </script>
-
+    <script>
+        function updateImage() {
+            // Добавляем timestamp для предотвращения кеширования
+            const timestamp = new Date().getTime();
+            const imgElement = document.getElementById("plantImage");
+            
+            // Показываем индикатор загрузки
+            imgElement.style.opacity = "0.9";
+            
+            // Обновляем источник изображения
+            imgElement.src = "/last_image?t=" + timestamp;
+            
+            // Возвращаем нормальную прозрачность после загрузки
+            imgElement.onload = function() {
+                imgElement.style.opacity = "1";
+            }
+        }
+        // Первичная загрузка при открытии страницы
+        document.addEventListener('DOMContentLoaded', function() {
+            updateImage();
+            
+            // Автоматическое обновление каждые 10 секунд
+            setInterval(updateImage, 10000);
+        });
+    </script>
   
 </body>
 </html>