nodebb-plugin-pdf-secure 1.2.17 → 1.2.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-pdf-secure",
-  "version": "1.2.17",
+  "version": "1.2.18",
   "description": "Secure PDF viewer plugin for NodeBB - prevents downloading, enables canvas-only rendering with Premium group support",
   "main": "library.js",
   "repository": {

package/static/lib/main.js

@@ -194,7 +194,9 @@
 		iframe.style.top = '0';
 		iframe.style.left = '0';
 		iframe.style.width = '100vw';
+		iframe.style.width = '100dvw';   // Override: dynamic viewport (excludes browser chrome)
 		iframe.style.height = '100vh';
+		iframe.style.height = '100dvh';  // Override: dynamic viewport (excludes address bar on mobile)
 		iframe.style.zIndex = '2147483647';
 
 		// Lock body scroll

package/static/viewer-app.js

@@ -2417,12 +2417,22 @@
     // ERGONOMIC FEATURES
     // ==========================================
 
-    // Fullscreen toggle function
+
+    // Fullscreen state (tracks both native and simulated fullscreen)
+    let isFullscreen = false;
+
+    // Fullscreen toggle function — delegates to parent iframe handler via postMessage
     function toggleFullscreen() {
-        if (document.fullscreenElement) {
-            document.exitFullscreen();
+        if (window.self !== window.top) {
+            // Inside iframe: ask parent to handle fullscreen
+            window.parent.postMessage({ type: 'pdf-secure-fullscreen-toggle' }, '*');
         } else {
-            document.documentElement.requestFullscreen().catch(() => { });
+            // Standalone mode: use native fullscreen
+            if (document.fullscreenElement) {
+                document.exitFullscreen();
+            } else {
+                document.documentElement.requestFullscreen().catch(() => { });
+            }
         }
     }
 
@@ -2430,7 +2440,7 @@
     function updateFullscreenIcon() {
         const icon = document.getElementById('fullscreenIcon');
         const btn = document.getElementById('fullscreenBtn');
-        if (document.fullscreenElement) {
+        if (isFullscreen) {
             icon.innerHTML = '<path d="M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z"/>';
             btn.classList.add('active');
         } else {
@@ -2439,32 +2449,36 @@
         }
     }
 
-    document.addEventListener('fullscreenchange', updateFullscreenIcon);
-
-    // Fullscreen button click
-    document.getElementById('fullscreenBtn').onclick = () => toggleFullscreen();
+    // Apply fullscreen CSS class and touch restrictions
+    function applyFullscreenTouchRestrictions() {
+        document.body.classList.toggle('viewer-fullscreen', isFullscreen);
+        if (isFullscreen) {
+            document.documentElement.style.touchAction = 'pan-y pinch-zoom';
+            document.documentElement.style.overscrollBehavior = 'none';
+        } else {
+            document.documentElement.style.touchAction = '';
+            document.documentElement.style.overscrollBehavior = '';
+        }
+    }
 
-    // Double-click on page for fullscreen
-    let lastClickTime = 0;
-    container.addEventListener('click', (e) => {
-        const now = Date.now();
-        if (now - lastClickTime < 300) {
-            toggleFullscreen();
+    // Listen for fullscreen state from parent (simulated fullscreen)
+    window.addEventListener('message', (event) => {
+        if (event.data && event.data.type === 'pdf-secure-fullscreen-state') {
+            isFullscreen = event.data.isFullscreen;
+            updateFullscreenIcon();
+            applyFullscreenTouchRestrictions();
         }
-        lastClickTime = now;
     });
 
-    // Auto-fullscreen when viewer loads inside iframe
-    if (window.self !== window.top && window.PDF_SECURE_CONFIG) {
-        // We're inside an iframe - request fullscreen on first user interaction
-        const autoFullscreen = () => {
-            document.documentElement.requestFullscreen().catch(() => { });
-            container.removeEventListener('click', autoFullscreen);
-            container.removeEventListener('touchstart', autoFullscreen);
-        };
-        container.addEventListener('click', autoFullscreen, { once: true });
-        container.addEventListener('touchstart', autoFullscreen, { once: true });
-    }
+    // Local fullscreen events (standalone mode)
+    document.addEventListener('fullscreenchange', () => {
+        isFullscreen = !!(document.fullscreenElement || document.webkitFullscreenElement);
+        updateFullscreenIcon();
+        applyFullscreenTouchRestrictions();
+    });
+
+    document.getElementById('fullscreenBtn').onclick = () => toggleFullscreen();
+
 
     // Mouse wheel zoom with Ctrl (debounced, clamped 0.5x-5x)
     let zoomTimeout;

package/static/viewer.css

@@ -1482,3 +1482,15 @@ body {
         height: 56px;
     }
 }
+
+/* ==========================================
+   FULLSCREEN STATE (simulated fullscreen on mobile)
+   ========================================== */
+/* Ensure bottom toolbar is visible and viewer container makes room for it */
+body.viewer-fullscreen #bottomToolbar {
+    display: block;
+}
+
+body.viewer-fullscreen #viewerContainer {
+    bottom: calc(var(--bottom-bar-height) + var(--safe-area-bottom));
+}

package/static/viewer.html

@@ -1353,6 +1353,18 @@
             }
         }
 
+        /* ==========================================
+           FULLSCREEN STATE (simulated fullscreen on mobile)
+           ========================================== */
+        /* Ensure bottom toolbar is visible and viewer container makes room for it */
+        body.viewer-fullscreen #bottomToolbar {
+            display: block;
+        }
+
+        body.viewer-fullscreen #viewerContainer {
+            bottom: calc(var(--bottom-bar-height) + var(--safe-area-bottom));
+        }
+
         /* ==========================================
            TABLET BREAKPOINT (600px - 1024px)
            ========================================== */
@@ -4463,6 +4475,7 @@
 
             // Apply touch restrictions when entering/exiting fullscreen
             function applyFullscreenTouchRestrictions() {
+                document.body.classList.toggle('viewer-fullscreen', isFullscreen);
                 if (isFullscreen) {
                     document.documentElement.style.touchAction = 'pan-y pinch-zoom';
                     document.documentElement.style.overscrollBehavior = 'none';