Enable upload of multiple files on mobile devices

closes #123

gossa.go

@@ -3,11 +3,17 @@ package main
 import (
 	"archive/zip"
 	"compress/gzip"
+	"crypto/md5"
+	"crypto/sha1"
+	"crypto/sha256"
+	"crypto/sha512"
 	_ "embed"
+	"encoding/hex"
 	"encoding/json"
 	"errors"
 	"flag"
 	"fmt"
+	"hash"
 	"html"
 	"html/template"
 	"io"
@@ -227,21 +233,42 @@ func zipRPC(w http.ResponseWriter, r *http.Request) {
 func rpc(w http.ResponseWriter, r *http.Request) {
 	var err error
 	var rpc rpcCall
-	defer exitPath(w, "rpc", rpc)
+	defer exitPath(w, "rpc", &rpc)
 	bodyBytes, err := io.ReadAll(r.Body)
 	check(err)
 	json.Unmarshal(bodyBytes, &rpc)
+	ret := []byte("ok")
 
-	if rpc.Call == "mkdirp" {
+	switch rpc.Call {
+	case "mkdirp":
 		err = os.MkdirAll(enforcePath(rpc.Args[0]), os.ModePerm)
-	} else if rpc.Call == "mv" {
+	case "mv":
 		err = os.Rename(enforcePath(rpc.Args[0]), enforcePath(rpc.Args[1]))
-	} else if rpc.Call == "rm" {
+	case "rm":
 		err = os.RemoveAll(enforcePath(rpc.Args[0]))
+	case "sum":
+		file, err := os.Open(enforcePath(rpc.Args[0]))
+		check(err)
+		var hash hash.Hash
+		switch rpc.Args[1] {
+		case "md5":
+			hash = md5.New()
+		case "sha1":
+			hash = sha1.New()
+		case "sha256":
+			hash = sha256.New()
+		case "sha512":
+			hash = sha512.New()
+		}
+		_, err = io.Copy(hash, file)
+		check(err)
+		checksum := hash.Sum(nil)
+		ret = make([]byte, hex.EncodedLen(len(checksum)))
+		hex.Encode(ret, checksum)
 	}
 
 	check(err)
-	w.Write([]byte("ok"))
+	w.Write(ret)
 }
 
 func enforcePath(p string) string {

ui/script.js

@@ -160,6 +160,7 @@ function rpc (call, args, cb) {
 const mkdirCall = (path, cb) => rpc('mkdirp', [prependPath(path)], cb)
 const rmCall = (path1, cb) => rpc('rm', [prependPath(path1)], cb)
 const mvCall = (path1, path2, cb) => rpc('mv', [path1, path2], cb)
+const sumCall = (path, type, cb) => rpc('sum', [prependPath(path), type], cb)
 
 // File upload
 let totalDone = 0
@@ -383,7 +384,7 @@ function resetView () {
   scrollToArrow()
 }
 
-window.quitAll = () => helpOff() || picsOff() || videosOff() || padOff() || pdfOff()
+window.quitAll = () => helpOff() || sumsOff() || picsOff() || videosOff() || padOff() || pdfOff()
 
 // Mkdir icon
 window.mkdirBtn = function () {
@@ -659,6 +660,40 @@ function helpOff () {
   return true
 }
 
+// checksums
+function getSum (type) {
+  upBarPc.style.display = 'block'
+  upBarPc.innerText = 'computing checksum...'
+  upBarPc.style.width = '100%'
+  sumsOff()
+  sumCall(getASelected().innerText, type, loaded => {
+    navigator.clipboard.writeText(loaded.target.responseText)
+    upBarPc.style.display = 'none'
+    flicker(okBadge)
+  })
+}
+
+const isSumsMode = () => sums.style.display === 'block'
+
+const sumsToggle = () => isSumsMode() ? sumsOff() : sumsOn()
+
+function sumsOn () {
+  if (isFolder(getASelected())) {
+    alert('cannot checksum a directory')
+    return
+  }
+  sums.style.display = 'block'
+  table.style.display = 'none'
+}
+
+window.sumsOff = sumsOff
+function sumsOff () {
+  if (!isSumsMode()) return
+  sums.style.display = 'none'
+  table.style.display = 'table'
+  return true
+}
+
 // Paste handler
 const cuts = []
 function onPaste () {
@@ -749,40 +784,69 @@ document.body.addEventListener('keydown', e => {
     return
   }
 
-  // Ctrl keys
-  if ((e.ctrlKey || e.metaKey) && !e.shiftKey) {
-    switch (e.code) {
-      case 'KeyC':
-        return prevent(e) || isRo() || cpPath()
+  // Modifier keys
+  if (!e.shiftKey) {
+    if (e.ctrlKey || e.metaKey) {
+      switch (e.code) {
+        case 'KeyC':
+          return prevent(e) || isRo() || cpPath()
 
-      case 'KeyH':
-        return prevent(e) || isRo() || helpToggle()
+        case 'KeyH':
+          return prevent(e) || isRo() || helpToggle()
 
-      case 'KeyX':
-        return prevent(e) || isRo() || onCut()
+        case 'KeyZ':
+          return prevent(e) || isRo() || sumsToggle()
 
-      case 'KeyR':
-        return prevent(e) || refresh()
+        case 'KeyX':
+          return prevent(e) || isRo() || onCut()
 
-      case 'KeyV':
-        return prevent(e) || isRo() || ensureMove() || onPaste()
+        case 'KeyR':
+          return prevent(e) || refresh()
 
-      case 'Backspace':
-        return prevent(e) || isRo() || window.rm(e)
+        case 'KeyV':
+          return prevent(e) || isRo() || ensureMove() || onPaste()
 
-      case 'KeyE':
-        return prevent(e) || isRo() || window.rename(e)
+        case 'Backspace':
+          return prevent(e) || isRo() || window.rm(e)
 
-      case 'KeyM':
-        return prevent(e) || isRo() || window.mkdirBtn()
+        case 'KeyE':
+          return prevent(e) || isRo() || window.rename(e)
 
-      case 'KeyU':
-        return prevent(e) || isRo() || manualUpload.click()
+        case 'KeyM':
+          return prevent(e) || isRo() || window.mkdirBtn()
 
-      case 'Enter':
-      case 'ArrowRight':
-        return prevent(e) || dl(getASelected())
+        case 'KeyU':
+          return prevent(e) || isRo() || manualUpload.click()
+
+        case 'Enter':
+        case 'ArrowRight':
+          return prevent(e) || dl(getASelected())
+      }
+    } else if (isSumsMode()) {
+        switch (e.code) {
+          case 'Digit1':
+            return prevent(e) || isRo() || getSum('sha1')
+
+          case 'Digit2':
+            return prevent(e) || isRo() || getSum('sha256')
+
+          case 'Digit3':
+            return prevent(e) || isRo() || getSum('sha512')
+
+          case 'Digit5':
+            return prevent(e) || isRo() || getSum('md5')
+        }
     }
+  } else {
+      // Workaround Firefox requirement for transient activation
+      // https://developer.mozilla.org/en-US/docs/Web/Security/User_activation
+      // Firefox requires user interaction (that is not reserved by the user agent)
+      // before a file picker can be displayed. This means that ctrl/meta are not
+      // usable as modifiers until the user clicks the page or presses another
+      // non-modifier key. To work around this, the shift key can be used, instead.
+      if (e.code == 'KeyU') {
+          return prevent(e) || isRo() || manualUpload.click()
+      }
   }
 
   switch (e.code) {

ui/style.css

@@ -344,12 +344,8 @@ h1 > span:hover {
   right: 30px;
 }
 
-#helpHead {
-  margin-top: 60px;
-  text-align: center;
-}
-
-#helpTable {
+#helpTable,
+#sumsTable {
   border-collapse: collapse;
   width: 70%;
   max-width: 790px;
@@ -360,7 +356,8 @@ h1 > span:hover {
   overflow-y: auto;
 }
 
-#helpTable td {
+#helpTable td,
+#sumsTable td {
   width: 200px;
   padding: 9px;
   border: 1px solid #fff;
@@ -369,7 +366,8 @@ h1 > span:hover {
   margin: 0;
 }
 
-#help {
+#help,
+#sums {
   background-color: black;
   position: absolute;
   top: 0px;

ui/ui.tmpl

@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta name="theme-color" content="rgb(45,52,54)">
     <meta name="msapplication-navbutton-color" content="rgb(45,52,54)">
-    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="mobile-web-app-capable" content="yes">
     <meta name="viewport" content="width=device-width">
 
     <link rel="manifest" href='data:application/manifest+json,{"name":"{{.Title}}","short_name":"{{.Title}}","description":"  ","icons":[{"src":"data:image/svg+xml;base64,favicon_will_be_here","sizes":"150x150","type":"image/svg+xml"}],"background":"rgb(45,52,54)","theme_color":"rgb(45,52,54)","display":"standalone"}' />
@@ -26,10 +26,11 @@
         <tr><td>Ctrl/Meta + C</td><td>copy URL to clipboard</td></tr>
         <tr><td>Ctrl/Meta + E</td><td>rename item</td></tr>
         <tr><td>Ctrl/Meta + Backspace</td><td>delete item</td></tr>
-        <tr><td>Ctrl/Meta + U</td><td>upload new file/folder</td></tr>
+        <tr><td>Ctrl/Meta/Shift + U</td><td>upload new file/folder</td></tr>
         <tr><td>Ctrl/Meta + M</td><td>create a new directory</td></tr>
         <tr><td>Ctrl/Meta + X</td><td>cut selected path</td></tr>
         <tr><td>Ctrl/Meta + V</td><td>paste previously selected paths to directory</td></tr>
+        <tr><td>Ctrl/Meta + Z</td><td>copy checksums of selected file</td></tr>
         <tr><td>Ctrl + click</td><td>download selected item as archive</td></tr>
         <tr><td>click file icon </td><td>rename item</td></tr>
         <tr><td>double click file icon</td><td>delete item</td></tr>
@@ -38,10 +39,18 @@
         <tr><td>any other letter</td><td>fuzzy search</td></tr>
     </tbody></table></div>
 
+    <div onclick="window.sumsOff()" style="display: none;" id="sums"><table id="sumsTable"><tbody>
+        <tr><td>Key</td><td>Hash Algorithm</td></tr>
+        <tr><td>1</td><td>copy sha1 sum</td></tr>
+        <tr><td>2</td><td>copy sha256 sum</td></tr>
+        <tr><td>3</td><td>copy sha512 sum</td></tr>
+        <tr><td>5</td><td>copy md5 sum</td></tr>
+    </tbody></table></div>
+
     <div style="display: none;" onclick="window.quitAll()" id="quitAll"><i style="display: none;" id="toast">cant reach server</i></div>
     <textarea style="display: none;" id="text-editor"></textarea>
     <div id="drop-grid"></div>
-    <input type="file" id="clickupload" style="display:none"/>
+    <input type="file" id="clickupload" multiple style="display:none"/>
 
     <h1 onclick="return titleClick(event)">.{{.Title}}</h1>