pdf viewer

ui/script.js

@@ -19,6 +19,7 @@ const picsHolder = document.getElementById('picsHolder')
 const video = document.getElementById('video')
 const videoHolder = document.getElementById('videoHolder')
 const manualUpload = document.getElementById('clickupload')
+const pdf = document.getElementById('pdf')
 const help = document.getElementById('help')
 const okBadge = document.getElementById('ok')
 const sadBadge = document.getElementById('sad')
@@ -105,6 +106,9 @@ window.onClickLink = e => {
   // let html be displayed naturally
   } else if (a.innerText.endsWith('.html')) {
     return true
+  } else if (isPdf(a.href)) {
+    openPDF(a.href)
+    return false
   }
 
   // else just force download
@@ -371,11 +375,12 @@ function resetView () {
   table.style.display = 'table'
   picsHolder.src = transparentPixel
   videoHolder.src = ''
-  editor.style.display = pics.style.display = video.style.display = crossIcon.style.display = 'none'
+  pdf.innerHTML = ''
+  editor.style.display = pics.style.display = video.style.display = pdf.style.display = crossIcon.style.display = 'none'
   scrollToArrow()
 }
 
-window.quitAll = () => helpOff() || picsOff() || videosOff() || padOff()
+window.quitAll = () => helpOff() || picsOff() || videosOff() || padOff() || pdfOff()
 
 // Mkdir icon
 window.mkdirBtn = function () {
@@ -609,6 +614,30 @@ window.videodl = function () {
   dl(getASelected())
 }
 
+// PDF Viewer
+const pdfTypes = ['.pdf']
+const isPdf = src => src && pdfTypes.find(type => src.toLocaleLowerCase().includes(type))
+const isPdfMode = () => pdf.style.display === 'flex'
+function openPDF (src) {
+  const name = src.split('/').pop()
+  table.style.display = 'none'
+  crossIcon.style.display = 'block'
+  pdf.style.display = 'flex'
+  const pdfEmbed = document.createElement('embed')
+  pdfEmbed.setAttribute('src', src + '#toolbar=0')
+  pdfEmbed.setAttribute('type', 'application/pdf')
+  pdf.appendChild(pdfEmbed)
+  pushSoftState(decodeURI(name))
+  return false
+}
+
+function pdfOff () {
+  if (!isPdfMode()) { return }
+  resetView()
+  softPrev()
+  return true
+}
+
 // help
 const isHelpMode = () => help.style.display === 'block'
 

ui/style.css

@@ -35,6 +35,26 @@
     background: gray;
 }
 
+#pdf {
+  user-select: none;
+  -webkit-tap-highlight-color: transparent;
+  justify-content:center;
+  align-items:center;
+  position: fixed;
+  background-color: #000;
+  top: 0px;
+  bottom: 0px;
+  left: 0px;
+  right: 0px;
+  overflow: hidden;
+  z-index: 99;
+}
+
+#pdf embed {
+  width: 100%;
+  height: 100%;
+}
+
 html {
   color: #dfe6e9;
   background-color: #2d3436;

ui/ui.tmpl

@@ -58,6 +58,7 @@
         <div onclick="window.videodl()" class="icon-dl" id="video-dl"></div>
         <video controls id="videoHolder"> </video>
     </div>
+    <div id="pdf" style="display:none;"> </div>
 
     <table id="linkTable">
     {{range .RowsFolders}}