Add `<iframe>` preview support for PDF files. Closes #53

docker/test/Dockerfile

@@ -17,6 +17,9 @@ RUN \
 \
   # add video
   curl -s -o /var/www/html/video.mp4 "http://techslides.com/demos/sample-videos/small.mp4" && \
+\
+  # add PDF
+  curl -s -o /var/www/html/dummy.pdf "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" && \
 \
   # set up apache
   echo >> /usr/local/apache2/conf/httpd.conf && \

src/lib/DAV/Entry.js

@@ -170,7 +170,8 @@ export default class Entry extends EventObject {
         image: /\.(?:jpe?g|gif|a?png|svg)$/i,
         video: /\.(?:mp(?:e?g)?4|mov|avi|webm|ogv)$/i,
         audio: /\.(?:mp3|wav|ogg)$/i,
-        font: /\.(?:woff2?|eot|[ot]tf)$/i
+        font: /\.(?:woff2?|eot|[ot]tf)$/i,
+        pdf: /\.pdf/i
       };
 
       for (const [key, value] of Object.entries(types)) {

src/lib/UI/NativeDOM/List/Item.js

@@ -29,7 +29,8 @@ export default class Item extends Element {
 <p style="font-family:'${fontName}'"><strong>${demoText}</strong></p>
 <p style="font-family:'${fontName}'"><em>${demoText}</em></p>`;
     },
-    text: (entry, content) => `<pre><code class="language-${entry.extension}">${content.replace(/[<>]/g, (c) => ({'<': '&lt;', '>': '&gt;'}[c]))}</code></pre>`
+    text: (entry, content) => `<pre><code class="language-${entry.extension}">${content.replace(/[<>]/g, (c) => ({'<': '&lt;', '>': '&gt;'}[c]))}</code></pre>`,
+    pdf: (entry) => `<iframe src="${entry.fullPath}" frameborder="0" border="0" height="100%" width="100%"></iframe>`
   });
 
   constructor(entry, base64Encoder = btoa) {
@@ -200,7 +201,7 @@ export default class Item extends Element {
       lightbox.show();
     };
 
-    if (['video', 'audio', 'image', 'font'].includes(entry.type)) {
+    if (['video', 'audio', 'image', 'font', 'pdf'].includes(entry.type)) {
       this.trigger('check', entry.fullPath, () => {
         launchLightbox(this.#templates[entry.type](entry));
       }, () => this.loading(false));