nodebb-plugin-pdf-secure 1.2.20 → 1.2.21

package/package.json

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

package/static/viewer.html

@@ -1573,47 +1573,46 @@
             }
         }
 
-        /* Premium Lock Overlay */
-        #premiumLockOverlay {
+        /* Per-page lock overlay - her kilitli sayfa icin */
+        .page-lock-overlay {
+            position: absolute;
+            top: 0; left: 0; right: 0; bottom: 0;
             display: flex;
             flex-direction: column;
             align-items: center;
             justify-content: center;
-            padding: 60px 20px;
-            text-align: center;
             background: linear-gradient(180deg, rgba(31,31,31,0.95) 0%, rgba(20,20,20,0.98) 100%);
-            border-top: 2px solid rgba(255, 215, 0, 0.3);
-            min-height: 400px;
-            margin: 0 auto;
-            max-width: 100%;
+            z-index: 5;
+            text-align: center;
+            padding: 20px;
         }
 
-        .premium-lock-icon {
-            margin-bottom: 20px;
+        .page-lock-icon {
+            margin-bottom: 16px;
             opacity: 0.9;
         }
 
-        .premium-lock-pages {
-            font-size: 22px;
+        .page-lock-title {
+            font-size: 20px;
             font-weight: 600;
             color: #ffd700;
-            margin-bottom: 12px;
+            margin-bottom: 10px;
         }
 
-        .premium-lock-message {
-            font-size: 16px;
+        .page-lock-message {
+            font-size: 14px;
             color: #a0a0a0;
-            margin-bottom: 28px;
-            max-width: 400px;
+            margin-bottom: 24px;
+            max-width: 320px;
             line-height: 1.5;
         }
 
-        .premium-lock-button {
+        .page-lock-button {
             display: inline-block;
-            padding: 14px 40px;
+            padding: 12px 36px;
             background: linear-gradient(135deg, #ffd700 0%, #ffaa00 100%);
             color: #1a1a1a;
-            font-size: 16px;
+            font-size: 15px;
             font-weight: 700;
             border-radius: 8px;
             text-decoration: none;
@@ -1621,22 +1620,29 @@
             box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
         }
 
-        .premium-lock-button:hover {
+        .page-lock-button:hover {
             transform: translateY(-2px);
             box-shadow: 0 6px 20px rgba(255, 215, 0, 0.4);
         }
 
-        .premium-lock-secondary {
-            margin-top: 20px;
-            font-size: 14px;
+        .page-lock-secondary {
+            margin-top: 16px;
+            font-size: 13px;
             color: #888;
             font-style: italic;
         }
 
+        /* Blur locked page content - even if overlay removed, content unreadable */
+        .page-locked-blur canvas,
+        .page-locked-blur .textLayer,
+        .page-locked-blur .annotationLayer {
+            filter: blur(8px) !important;
+            -webkit-filter: blur(8px) !important;
+        }
+
         /* Locked Thumbnails */
         .thumbnail.locked {
-            opacity: 0.4;
-            cursor: not-allowed;
+            opacity: 0.5;
             position: relative;
         }
 
@@ -1654,22 +1660,17 @@
         }
 
         @media (max-width: 768px) {
-            #premiumLockOverlay {
-                padding: 40px 16px;
-                min-height: 300px;
-            }
-
-            .premium-lock-pages {
-                font-size: 18px;
+            .page-lock-title {
+                font-size: 17px;
             }
 
-            .premium-lock-message {
-                font-size: 14px;
+            .page-lock-message {
+                font-size: 13px;
             }
 
-            .premium-lock-button {
-                padding: 12px 32px;
-                font-size: 14px;
+            .page-lock-button {
+                padding: 10px 28px;
+                font-size: 13px;
             }
         }
     </style>
@@ -2224,24 +2225,53 @@
                 return data.buffer;
             }
 
-            function showPremiumLockOverlay(totalPages) {
-                var viewerEl = document.getElementById('viewer');
-                if (!viewerEl) return;
-
+            function injectPageLock(pageEl) {
+                if (!pageEl) return;
+                // Add blur class to page content
+                if (!pageEl.classList.contains('page-locked-blur')) {
+                    pageEl.classList.add('page-locked-blur');
+                }
+                // Don't duplicate overlay
+                if (pageEl.querySelector('.page-lock-overlay')) return;
                 var overlay = document.createElement('div');
-                overlay.id = 'premiumLockOverlay';
+                overlay.className = 'page-lock-overlay';
                 overlay.innerHTML = '\
-                    <div class="premium-lock-icon">\
-                        <svg viewBox="0 0 24 24" width="64" height="64" fill="#ffd700">\
+                    <div class="page-lock-icon">\
+                        <svg viewBox="0 0 24 24" width="48" height="48" fill="#ffd700">\
                             <path d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1s3.1 1.39 3.1 3.1v2z"/>\
                         </svg>\
                     </div>\
-                    <div class="premium-lock-pages">' + (totalPages - 1) + ' sayfa daha kilitli</div>\
-                    <div class="premium-lock-message">Bu icerigi goruntulemeye devam etmek icin Premium uyelik gereklidir.</div>\
-                    <a href="https://forumtest.ieu.app/premium" target="_blank" class="premium-lock-button">Premium Satin Al</a>\
-                    <div class="premium-lock-secondary">Materyal yukleyerek de Premium olabilirsiniz!</div>';
+                    <div class="page-lock-title">Kilitli</div>\
+                    <div class="page-lock-message">Bu sayfayi goruntulemeye devam etmek icin Premium uyelik gereklidir.</div>\
+                    <a href="https://forumtest.ieu.app/premium" target="_blank" class="page-lock-button">Premium Satin Al</a>\
+                    <div class="page-lock-secondary">Materyal yukleyerek de Premium olabilirsiniz!</div>';
+                pageEl.style.position = 'relative';
+                pageEl.appendChild(overlay);
+            }
+
+            function resetOverlayCSS(overlay) {
+                overlay.style.cssText = 'position:absolute;top:0;left:0;right:0;bottom:0;display:flex;z-index:5;opacity:1;visibility:visible;pointer-events:auto;';
+            }
 
-                viewerEl.appendChild(overlay);
+            function applyPageLocks() {
+                var pages = document.querySelectorAll('#viewer .page');
+                pages.forEach(function (page) {
+                    var pageNum = parseInt(page.dataset.pageNumber || '0', 10);
+                    if (pageNum > 1) {
+                        // Ensure page is visible (undo any old display:none)
+                        if (page.style.display === 'none') {
+                            page.style.display = '';
+                        }
+                        injectPageLock(page);
+                        // CSS integrity: reset overlay styles in case of tampering
+                        var existing = page.querySelector('.page-lock-overlay');
+                        if (existing) resetOverlayCSS(existing);
+                        // Ensure blur class is present
+                        if (!page.classList.contains('page-locked-blur')) {
+                            page.classList.add('page-locked-blur');
+                        }
+                    }
+                });
             }
 
             // ============================================
@@ -2250,18 +2280,7 @@
             function startPeriodicCheck() {
                 setInterval(function () {
                     if (!premiumInfo || premiumInfo.isPremium) return;
-                    var pages = document.querySelectorAll('#viewer .page');
-                    pages.forEach(function (page, idx) {
-                        if (idx > 0 && page.style.display !== 'none') {
-                            page.style.display = 'none';
-                        }
-                    });
-                    if (!document.getElementById('premiumLockOverlay')) {
-                        showPremiumLockOverlay(premiumInfo.totalPages);
-                    }
-                    if (pdfViewer && pdfViewer.currentPageNumber > 1) {
-                        pdfViewer.currentPageNumber = 1;
-                    }
+                    applyPageLocks();
                 }, 2000);
             }
 
@@ -2272,32 +2291,41 @@
                 var viewerEl = document.getElementById('viewer');
                 if (!viewerEl) return;
 
+                // Observer 1: Watch for lock overlay removal from any page
                 new MutationObserver(function (mutations) {
+                    if (!premiumInfo || premiumInfo.isPremium) return;
                     for (var i = 0; i < mutations.length; i++) {
                         var removed = mutations[i].removedNodes;
                         for (var j = 0; j < removed.length; j++) {
-                            if (removed[j].id === 'premiumLockOverlay') {
-                                showPremiumLockOverlay(premiumInfo.totalPages);
-                                return;
+                            if (removed[j].classList && removed[j].classList.contains('page-lock-overlay')) {
+                                var pageEl = mutations[i].target;
+                                if (pageEl && pageEl.classList && pageEl.classList.contains('page')) {
+                                    injectPageLock(pageEl);
+                                }
                             }
                         }
                     }
-                }).observe(viewerEl, { childList: true });
+                }).observe(viewerEl, { childList: true, subtree: true });
 
+                // Observer 2: Watch for style/class tampering on overlays and pages
                 new MutationObserver(function (mutations) {
+                    if (!premiumInfo || premiumInfo.isPremium) return;
                     for (var i = 0; i < mutations.length; i++) {
-                        var m = mutations[i];
-                        if (m.type === 'attributes' && m.attributeName === 'style') {
-                            var target = m.target;
-                            if (target.classList && target.classList.contains('page')) {
-                                var pageNum = parseInt(target.dataset.pageNumber || '0', 10);
-                                if (pageNum > 1 && target.style.display !== 'none') {
-                                    target.style.display = 'none';
-                                }
+                        var target = mutations[i].target;
+                        if (!target || !target.classList) continue;
+                        // Overlay CSS tampered - reset it
+                        if (target.classList.contains('page-lock-overlay')) {
+                            resetOverlayCSS(target);
+                        }
+                        // Blur class removed from locked page - re-add it
+                        if (target.classList.contains('page') && !target.classList.contains('page-locked-blur')) {
+                            var pageNum = parseInt(target.dataset.pageNumber || '0', 10);
+                            if (pageNum > 1) {
+                                target.classList.add('page-locked-blur');
                             }
                         }
                     }
-                }).observe(viewerEl, { childList: true, subtree: true, attributes: true, attributeFilter: ['style'] });
+                }).observe(viewerEl, { subtree: true, attributes: true, attributeFilter: ['style', 'class'] });
             }
 
             // Auto-load PDF if config is present (injected by NodeBB plugin)
@@ -2399,7 +2427,7 @@
                     // Premium Gate: Client-side page restriction for non-premium users
                     if (config.isPremium === false && pdfDoc && pdfDoc.numPages > 1) {
                         premiumInfo = Object.freeze({ isPremium: false, totalPages: pdfDoc.numPages });
-                        showPremiumLockOverlay(pdfDoc.numPages);
+                        applyPageLocks();
                         startPeriodicCheck();
                         setupAntiTampering();
                     } else {
@@ -2477,9 +2505,11 @@
                     }).promise;
 
                     const thumb = document.createElement('div');
-                    thumb.className = 'thumbnail' + (i === 1 ? ' active' : '');
+                    const isLocked = premiumInfo && !premiumInfo.isPremium && i > 1;
+                    thumb.className = 'thumbnail' + (i === 1 ? ' active' : '') + (isLocked ? ' locked' : '');
                     thumb.dataset.page = i;
-                    thumb.innerHTML = `<div class="thumbnailNum">${i}</div>`;
+                    thumb.innerHTML = `<div class="thumbnailNum">${i}</div>` +
+                        (isLocked ? '<div class="thumbnail-lock">\u{1F512}</div>' : '');
                     thumb.insertBefore(canvas, thumb.firstChild);
 
                     thumb.onclick = () => {
@@ -2525,6 +2555,12 @@
             eventBus.on('pagerendered', (evt) => {
                 injectAnnotationLayer(evt.pageNumber);
 
+                // Re-inject lock overlay if this is a locked page (PDF.js re-render removes it)
+                if (premiumInfo && !premiumInfo.isPremium && evt.pageNumber > 1) {
+                    var pageEl = document.querySelector('#viewer .page[data-page-number="' + evt.pageNumber + '"]');
+                    if (pageEl) injectPageLock(pageEl);
+                }
+
                 // Rotation is handled natively by PDF.js via pagesRotation
             });