iobroker.staticsfilefolder 0.0.21 → 0.0.23

package/README.md

@@ -64,6 +64,12 @@ Once configured and the instance is running (green status):
 	Placeholder for the next version (at the beginning of the line):
 	### **WORK IN PROGRESS**
 -->
+### 0.0.23
+* Added live rendering / auto-refresh in file explorer on file additions/deletions.
+
+### 0.0.22
+* Fixed PDF print layout to prevent vertical page overflow, and fixed zoom/scale rendering issues in PDF viewer.
+
 ### 0.0.21
 * Upgraded Express to major version 5.x and updated tsconfig to target Node 22.
 

package/io-package.json

@@ -1,20 +1,20 @@
 {
 	"common": {
 		"name": "staticsfilefolder",
-		"version": "0.0.21",
+		"version": "0.0.23",
 		"news": {
-			"0.0.21": {
-				"en": "Upgraded Express to major version 5.x and updated tsconfig to target Node 22.",
-				"de": "Express auf Major-Version 5.x aktualisiert und tsconfig auf Node 22 angepasst.",
-				"ru": "Обновлен Express до мажорной версии 5.x и обновлен tsconfig для поддержки Node 22.",
-				"pt": "Atualizado o Express para a versão principal 5.x e atualizado o tsconfig para o Node 22.",
-				"nl": "Express geüpgraded naar hoofdversie 5.x en tsconfig bijgewerkt naar Node 22.",
-				"fr": "Mise à niveau d'Express vers la version majeure 5.x et mise à jour de tsconfig pour cibler Node 22.",
-				"it": "Aggiornato Express alla versione principale 5.x e aggiornato tsconfig per Node 22.",
-				"es": "Se actualizó Express a la versión principal 5.x y se actualizó tsconfig para apuntar a Node 22.",
-				"pl": "Uaktualniono Express do głównej wersji 5.x i zaktualizowano tsconfig dla Node 22.",
-				"uk": "Оновлено Express до мажорної версії 5.x та оновлено tsconfig для підтримки Node 22.",
-				"zh-cn": "将Express升级到主版本5.x并更新tsconfig以针对Node 22。"
+			"0.0.23": {
+				"en": "Added live rendering / auto-refresh in file explorer on file additions/deletions.",
+				"de": "Live-Rendering / automatische Aktualisierung im Datei-Explorer bei Hinzufügung/Löschung von Dateien hinzugefügt.",
+				"ru": "Добавлено живое отображение / автообновление в проводнике файлов при добавлении/удалении файлов.",
+				"pt": "Adicionada renderização ao vivo / atualização automática no explorador de arquivos ao adicionar/excluir arquivos.",
+				"nl": "Live rendering / auto-refresh toegevoegd in de bestandsbrowser bij toevoeging/verwijdering van bestanden.",
+				"fr": "Ajout du rendu en direct / de l'actualisation automatique dans l'explorateur de fichiers lors de l'ajout/suppression de fichiers.",
+				"it": "Aggiunto rendering live / aggiornamento automatico in Esplora file all'aggiunta/eliminazione di file.",
+				"es": "Se agregó renderizado en vivo / actualización automática en el explorador de archivos al agregar o eliminar archivos.",
+				"pl": "Dodano renderowanie na żywo / automatyczne odświeżanie w eksploratorze plików przy dodawaniu/usuwaniu plików.",
+				"uk": "Додано живе відображення / автооновлення в провіднику файлів при додаванні/вилученні файлів.",
+				"zh-cn": "在文件资源管理器中添加了在添加/删除文件时的实时渲染/自动刷新。"
 			},
 			"0.0.15": {
 				"en": "Reverted minimum Node.js engine requirement to 20 to support GitHub Actions runners.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.staticsfilefolder",
-  "version": "0.0.21",
+  "version": "0.0.23",
   "description": "Static Files Folder",
   "author": {
     "name": "gokturk413",

package/www/app.js

@@ -7,6 +7,7 @@ let currentPath = '';
 let historyStack = [];
 let forwardStack = [];
 let currentItems = [];
+let pollInterval = null;
 
 // DOM Elements
 const breadcrumbEl = document.getElementById('breadcrumb');
@@ -227,6 +228,7 @@ document.addEventListener('DOMContentLoaded', () => {
     initTheme();
     initLang();
     loadPath('');
+    startPolling();
     
     // Event Listeners
     btnBack.addEventListener('click', goBack);
@@ -281,6 +283,39 @@ async function loadPath(path) {
     }
 }
 
+function startPolling() {
+    if (pollInterval) clearInterval(pollInterval);
+    pollInterval = setInterval(async () => {
+        if (document.hidden) return;
+        try {
+            const response = await fetch(`${API_URL}?path=${encodeURIComponent(currentPath)}`);
+            const data = await response.json();
+            if (data.success) {
+                const itemsChanged = JSON.stringify(data.items) !== JSON.stringify(currentItems);
+                if (itemsChanged) {
+                    currentItems = data.items;
+                    renderItems();
+                    
+                    if (currentOpenItem) {
+                        const fileStillExists = data.items.some(item => !item.isDirectory && item.name === currentOpenItem.name);
+                        if (!fileStillExists) {
+                            viewerModal.style.display = 'none';
+                            viewerBody.innerHTML = '';
+                            currentOpenItem = null;
+                            currentPdfDoc = null;
+                            currentPdfZoom = 1.5;
+                            modalPdfZoom.value = '1.5';
+                            modalPdfZoom.style.display = 'none';
+                        }
+                    }
+                }
+            }
+        } catch (e) {
+            console.warn('Polling error:', e);
+        }
+    }, 3000);
+}
+
 function navigateTo(path) {
     if (path !== currentPath) {
         historyStack.push(currentPath);
@@ -507,10 +542,13 @@ function printModalContent() {
                     color: black;
                 }
                 .pdf-page-img {
-                    width: 100%;
                     max-width: 100%;
+                    max-height: 100vh;
+                    width: auto;
                     height: auto;
                     display: block;
+                    margin: 0 auto;
+                    page-break-inside: avoid;
                     page-break-after: always;
                 }
                 .pdf-page-img:last-child {
@@ -582,9 +620,12 @@ async function renderPdfPages() {
             canvas.height = viewport.height;
             canvas.width = viewport.width;
             
+            canvas.style.width = `${viewport.width}px`;
+            canvas.style.height = `${viewport.height}px`;
+            canvas.style.maxWidth = 'none';
             canvas.style.display = 'block';
-            canvas.style.margin = '10px auto';
-            canvas.style.boxShadow = '0 4px 8px rgba(0,0,0,0.15)';
+            canvas.style.margin = '15px auto';
+            canvas.style.boxShadow = '0 4px 10px rgba(0,0,0,0.25)';
             
             viewerBody.appendChild(canvas);
             

package/www/style.css

@@ -234,16 +234,15 @@ body {
     flex-grow: 1;
     overflow: auto;
     background: var(--hover-color);
-    display: flex;
-    justify-content: center;
+    display: block;
+    text-align: center;
     color: var(--text-color);
 }
 
 #viewer-body canvas {
-    max-width: 100%;
-    margin: 10px auto;
+    margin: 15px auto;
     display: block;
-    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
+    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
 }
 
 /* Table styles for excel */