From c6c33d611abca3fe9e0d5085674a151befde085d Mon Sep 17 00:00:00 2001
From: Eric <71648843+sbplat@users.noreply.github.com>
Date: Sun, 15 Sep 2024 00:24:04 -0700
Subject: [PATCH] Load pdf libs when needed (#1902)

* feat: only load pdf-lib when its used

* feat: only load pdfjs when its used
---
 src/main/resources/templates/convert/pdf-to-csv.html      | 1 +
 src/main/resources/templates/convert/pdf-to-pdfa.html     | 3 ++-
 src/main/resources/templates/crop.html                    | 1 +
 src/main/resources/templates/fragments/common.html        | 6 ------
 src/main/resources/templates/misc/add-image.html          | 2 ++
 src/main/resources/templates/misc/adjust-contrast.html    | 3 ++-
 src/main/resources/templates/misc/change-metadata.html    | 1 +
 src/main/resources/templates/misc/compare.html            | 1 +
 src/main/resources/templates/misc/remove-annotations.html | 1 +
 src/main/resources/templates/multi-tool.html              | 3 ++-
 src/main/resources/templates/rotate-pdf.html              | 3 ++-
 src/main/resources/templates/sign.html                    | 2 ++
 12 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/main/resources/templates/convert/pdf-to-csv.html b/src/main/resources/templates/convert/pdf-to-csv.html
index 98d2d80ee..a4e52e237 100644
--- a/src/main/resources/templates/convert/pdf-to-csv.html
+++ b/src/main/resources/templates/convert/pdf-to-csv.html
@@ -33,6 +33,7 @@
                 </div>
                 <canvas id="overlayCanvas" style="position: absolute; top: 0; left: 0; z-index: 2;"></canvas>
               </div>
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
               <script>
                 let pdfCanvas  = document.getElementById('crop-pdf-canvas');
                 let overlayCanvas = document.getElementById('overlayCanvas');
diff --git a/src/main/resources/templates/convert/pdf-to-pdfa.html b/src/main/resources/templates/convert/pdf-to-pdfa.html
index c89e3b616..33c07acb9 100644
--- a/src/main/resources/templates/convert/pdf-to-pdfa.html
+++ b/src/main/resources/templates/convert/pdf-to-pdfa.html
@@ -30,6 +30,7 @@
                 <div id="result" class="alert-warning"></div>
                 <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{pdfToPDFA.submit}"></button>
               </form>
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
               <script th:inline="javascript">
                 document.getElementById('fileInput-input').addEventListener('change', async () => {
                   pdfjsLib.GlobalWorkerOptions.workerSrc = './pdfjs-legacy/pdf.worker.mjs';
@@ -41,7 +42,7 @@
 
                   try {
                     const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
-                    
+
                     let hasSignature = false;
 
                     for (let i = 1; i <= pdf.numPages; i++) {
diff --git a/src/main/resources/templates/crop.html b/src/main/resources/templates/crop.html
index 96cc157b2..c0a0542ea 100644
--- a/src/main/resources/templates/crop.html
+++ b/src/main/resources/templates/crop.html
@@ -30,6 +30,7 @@
               </div>
             </div>
           </div>
+          <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
           <script>
             let pdfCanvas  = document.getElementById('crop-pdf-canvas');
             let overlayCanvas = document.getElementById('overlayCanvas');
diff --git a/src/main/resources/templates/fragments/common.html b/src/main/resources/templates/fragments/common.html
index 96d52157e..700c68fd2 100644
--- a/src/main/resources/templates/fragments/common.html
+++ b/src/main/resources/templates/fragments/common.html
@@ -34,12 +34,6 @@
     <!-- Bootstrap Icons -->
     <link rel="stylesheet" th:href="@{'/css/bootstrap-icons.min.css'}">
 
-    <!-- PDF.js -->
-    <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"  th:if="${currentPage != 'home'}"></script>
-
-    <!-- PDF-Lib -->
-    <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"  th:if="${currentPage != 'home'}"></script>
-
     <!-- Custom -->
     <link rel="stylesheet" th:href="@{'/css/general.css'}">
     <link rel="stylesheet" th:href="@{'/css/theme/theme.css'}">
diff --git a/src/main/resources/templates/misc/add-image.html b/src/main/resources/templates/misc/add-image.html
index 28a208c4b..78cdc4d5d 100644
--- a/src/main/resources/templates/misc/add-image.html
+++ b/src/main/resources/templates/misc/add-image.html
@@ -21,6 +21,7 @@
 
               <!-- pdf selector -->
               <div th:replace="~{fragments/common :: fileSelector(name='pdf-upload', multipleInputsForSingleRequest=false, accept='application/pdf')}"></div>
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
               <script>
                 let originalFileName = '';
                 document.querySelector('input[name=pdf-upload]').addEventListener('change', async (event) => {
@@ -66,6 +67,7 @@
               <!-- draggables box -->
               <div id="box-drag-container" class="show-on-file-selected">
                 <canvas id="pdf-canvas"></canvas>
+                <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
                 <script th:src="@{'/js/draggable-utils.js'}"></script>
                 <div class="draggable-buttons-box ignore-rtl">
                   <button class="btn btn-outline-secondary" onclick="DraggableUtils.deleteDraggableCanvas(DraggableUtils.getLastInteracted())">
diff --git a/src/main/resources/templates/misc/adjust-contrast.html b/src/main/resources/templates/misc/adjust-contrast.html
index d10ea8e63..de5e877e8 100644
--- a/src/main/resources/templates/misc/adjust-contrast.html
+++ b/src/main/resources/templates/misc/adjust-contrast.html
@@ -53,7 +53,8 @@
 
               </div>
               </form>
-
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
+              <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
               <script>
                 var canvas = document.getElementById('contrast-pdf-canvas');
                 var context = canvas.getContext('2d');
diff --git a/src/main/resources/templates/misc/change-metadata.html b/src/main/resources/templates/misc/change-metadata.html
index d6d886e9c..c056b757e 100644
--- a/src/main/resources/templates/misc/change-metadata.html
+++ b/src/main/resources/templates/misc/change-metadata.html
@@ -84,6 +84,7 @@
                 <br>
                 <br>
                 <button class="btn btn-primary" type="submit" id="submitBtn" th:text="#{changeMetadata.submit}"></button>
+                <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
                 <script>
                   const deleteAllCheckbox = document.querySelector("#deleteAll");
                   let inputs = document.querySelectorAll("input");
diff --git a/src/main/resources/templates/misc/compare.html b/src/main/resources/templates/misc/compare.html
index c67c386b5..8e5467a36 100644
--- a/src/main/resources/templates/misc/compare.html
+++ b/src/main/resources/templates/misc/compare.html
@@ -79,6 +79,7 @@
                   <div id="result2" class="result-column"></div>
                 </div>
               </div>
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
               <script>
                 // get the elements
                 var result1 = document.getElementById('result1');
diff --git a/src/main/resources/templates/misc/remove-annotations.html b/src/main/resources/templates/misc/remove-annotations.html
index 220d2afeb..cb65fa9bc 100644
--- a/src/main/resources/templates/misc/remove-annotations.html
+++ b/src/main/resources/templates/misc/remove-annotations.html
@@ -28,6 +28,7 @@
       </div>
       <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
     </div>
+    <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
     <script th:src="@{'/js/local-pdf-input-download.js'}"></script>
     <script>
       document.getElementById('pdfForm').addEventListener('submit', async (e) => {
diff --git a/src/main/resources/templates/multi-tool.html b/src/main/resources/templates/multi-tool.html
index 61fcc28e7..8f7f86b4f 100644
--- a/src/main/resources/templates/multi-tool.html
+++ b/src/main/resources/templates/multi-tool.html
@@ -75,7 +75,8 @@
     <div id="drag-container"></div>
     <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
   </div>
-
+  <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
+  <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
   <script type="module">
     import PdfContainer from './js/multitool/PdfContainer.js';
     import DragDropManager from "./js/multitool/DragDropManager.js";
diff --git a/src/main/resources/templates/rotate-pdf.html b/src/main/resources/templates/rotate-pdf.html
index 4e4054d57..5886ec618 100644
--- a/src/main/resources/templates/rotate-pdf.html
+++ b/src/main/resources/templates/rotate-pdf.html
@@ -49,6 +49,7 @@
       </div>
       <th:block th:insert="~{fragments/footer.html :: footer}"></th:block>
     </div>
+    <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
     <script>
       const angleInput = document.getElementById("angleInput");
       const fileInput = document.getElementById("fileInput-input");
@@ -58,7 +59,7 @@
         console.log("loading pdf");
 
         document.querySelector("#editSection").style.display = "";
-        
+
         const existingPreview = document.getElementById("pdf-preview");
         if (existingPreview) {
           existingPreview.remove();
diff --git a/src/main/resources/templates/sign.html b/src/main/resources/templates/sign.html
index 94210f71d..919226aef 100644
--- a/src/main/resources/templates/sign.html
+++ b/src/main/resources/templates/sign.html
@@ -37,6 +37,7 @@
 
               <!-- pdf selector -->
               <div th:replace="~{fragments/common :: fileSelector(name='pdf-upload', multipleInputsForSingleRequest=false, disableMultipleFiles=true,  accept='application/pdf')}"></div>
+              <script type="module" th:src="@{'/pdfjs-legacy/pdf.mjs'}"></script>
               <script>
                 let originalFileName = '';
                 document.querySelector('input[name=pdf-upload]').addEventListener('change', async (event) => {
@@ -229,6 +230,7 @@
               <!-- draggables box -->
               <div id="box-drag-container" class="show-on-file-selected">
                 <canvas id="pdf-canvas"></canvas>
+                <script th:src="@{'/js/thirdParty/pdf-lib.min.js'}"></script>
                 <script th:src="@{'/js/draggable-utils.js'}"></script>
                 <div class="draggable-buttons-box ignore-rtl">
                   <button class="btn btn-outline-secondary" onclick="DraggableUtils.deleteDraggableCanvas(DraggableUtils.getLastInteracted())">