first page as blurred jpeg, TIL: some css properties seem to affect the z-index https://stackoverflow.com/a/57327698/1359903, applying blur hid everything else under it.

globalworming · globalworming · commit d90c6eb8deae · 2023-01-10T11:17:33.000+01:00
diff --git a/TODO.md b/TODO.md
@@ -28,7 +28,7 @@
 - [x] set response header on donwload
 
 - [ ] send 404 for unknown links and don't log
-- [ ] generate preview page as blury jpeg. extracting the first page from the PDF does not reduce file size much
+- [x] generate preview page as blurry jpeg. extracting the first page from the PDF does not reduce file size much
 - [ ] set proper filename for download
 
 - [ ] circle e2e test
diff --git a/src/main/java/com/headissue/servlet/SeePdfs.java b/src/main/java/com/headissue/servlet/SeePdfs.java
@@ -15,6 +15,7 @@
 import jakarta.servlet.http.HttpServletRequest;
 import jakarta.servlet.http.HttpServletResponse;
 import jakarta.servlet.http.Part;
+import java.awt.image.BufferedImage;
 import java.io.*;
 import java.nio.file.Files;
 import java.nio.file.NoSuchFileException;
@@ -27,9 +28,11 @@
 import java.util.Base64;
 import java.util.Collection;
 import java.util.Map;
+import javax.imageio.ImageIO;
 import org.apache.pdfbox.Loader;
-import org.apache.pdfbox.multipdf.PageExtractor;
 import org.apache.pdfbox.pdmodel.PDDocument;
+import org.apache.pdfbox.rendering.ImageType;
+import org.apache.pdfbox.rendering.PDFRenderer;
 import org.eclipse.jetty.http.MimeTypes;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
@@ -165,8 +168,8 @@ private void writePreviewPage(HttpServletResponse resp, String accessId, AccessR
                 accessId,
                 "accessRule",
                 accessRule,
-                "base64Pdf",
-                firstPageAsBase64String(pdfPath),
+                "base64Jpeg",
+                firstPageAsBase64Jpeg(pdfPath),
                 "formKey",
                 formKeyService.getFormKey()),
             resp.getWriter());
@@ -181,17 +184,16 @@ private void writeExpiredPage(HttpServletResponse resp, AccessRule accessRule)
         .apply(Map.of("accessRule", accessRule), resp.getWriter());
   }
 
-  private static String firstPageAsBase64String(Path pdfPath) throws IOException {
-    String base64Pdf;
+  private static String firstPageAsBase64Jpeg(Path pdfPath) throws IOException {
+    String base64Jpeg;
     try (PDDocument load = Loader.loadPDF(pdfPath.toFile())) {
-      PageExtractor pageExtractor = new PageExtractor(load, 1, 1);
-      try (PDDocument pdDocument = pageExtractor.extract()) {
-        ByteArrayOutputStream baos = new ByteArrayOutputStream();
-        pdDocument.save(baos);
-        base64Pdf = Base64.getEncoder().encodeToString(baos.toByteArray());
-      }
+      PDFRenderer pdfRenderer = new PDFRenderer(load);
+      BufferedImage bim = pdfRenderer.renderImageWithDPI(0, 300, ImageType.RGB);
+      ByteArrayOutputStream baos = new ByteArrayOutputStream();
+      ImageIO.write(bim, "JPEG", baos);
+      base64Jpeg = Base64.getEncoder().encodeToString(baos.toByteArray());
     }
-    return base64Pdf;
+    return base64Jpeg;
   }
 
   private static String readPart(Part req) throws IOException {
diff --git a/src/main/resources/static/docs/preview.hbs b/src/main/resources/static/docs/preview.hbs
@@ -42,7 +42,7 @@
 </head>
 <body onload="document.getElementById('id-form').style.opacity=1">
 <main>
-    <div id="id-form">
+    <div id="id-form" style="z-index: 999">
         <div>
             <p>
                 Please enter your email to get access to the document.
@@ -75,8 +75,9 @@
         </div>
 
     </div>
-    <div style="max-height: 100vh; overflow: hidden">
-        {{> organism/pdfCanvas.hbs}}
+    <div style="max-height: 100vh; overflow: hidden; display: flex; flex-direction: column; align-items: center;">
+        <img style="display:block; height:100vh; -webkit-filter: blur(2px); filter: blur(2px);"
+             src="data:image/jpeg;base64, {{base64Jpeg}}"/>
     </div>
 </main>
 <div style=" position: absolute;
diff --git a/src/main/resources/static/molecule/footer.hbs b/src/main/resources/static/molecule/footer.hbs
@@ -14,6 +14,7 @@
         padding: 1rem;
         position: relative;
         margin-top: auto;
+        z-index: 999;
     }
     footer a {
         color: #eb5d10;

Original file line number	Diff line number	Diff line change
`@@ -14,6 +14,7 @@`
`14`	`14`	`padding: 1rem;`
`15`	`15`	`position: relative;`
`16`	`16`	`margin-top: auto;`
	`17`	`+ z-index: 999;`
`17`	`18`	`}`
`18`	`19`	`footer a {`
`19`	`20`	`color: #eb5d10;`