Implement limitation / customize for attachments

Signed-off-by: Knut Ahlers <knut@ahlers.me>

README.md

@@ -81,6 +81,20 @@ overlayFSPath: /path/to/ots-customization
 # Languages not having a formal version will still display the normal
 # translations in the respective language.
 useFormalLanguage: false
+
+# Define which file types are selectable by the user when uploading
+# files to attach. This fuels the `accept` attribute of the file
+# select and requires the same format. Pay attention this is not
+# suited as a security measure as this is purely a frontend
+# implementation and can be circumvented.
+# https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept
+acceptedFileTypes: ''
+
+# Disable the file attachment functionality alltogether
+disableFileAttachment: false
+
+# Define how big all attachments might be in bytes
+maxAttachmentSizeTotal: 0
 ```
 
 To override the styling of the application have a look at the [`src/style.scss`](./src/style.scss) file how the theme of the application is built and present the compiled `app.css` in the `overlayFSPath`.

customize.go

@@ -12,16 +12,22 @@ import (
 
 type (
 	customize struct {
-		AppIcon               string  `json:"appIcon,omitempty" yaml:"appIcon"`
-		AppTitle              string  `json:"appTitle,omitempty" yaml:"appTitle"`
-		DisableAppTitle       bool    `json:"disableAppTitle,omitempty" yaml:"disableAppTitle"`
+		AppIcon              string `json:"appIcon,omitempty" yaml:"appIcon"`
+		AppTitle             string `json:"appTitle,omitempty" yaml:"appTitle"`
+		DisableAppTitle      bool   `json:"disableAppTitle,omitempty" yaml:"disableAppTitle"`
+		DisablePoweredBy     bool   `json:"disablePoweredBy,omitempty" yaml:"disablePoweredBy"`
+		DisableQRSupport     bool   `json:"disableQRSupport,omitempty" yaml:"disableQRSupport"`
+		DisableThemeSwitcher bool   `json:"disableThemeSwitcher,omitempty" yaml:"disableThemeSwitcher"`
+
 		DisableExpiryOverride bool    `json:"disableExpiryOverride,omitempty" yaml:"disableExpiryOverride"`
-		DisablePoweredBy      bool    `json:"disablePoweredBy,omitempty" yaml:"disablePoweredBy"`
-		DisableQRSupport      bool    `json:"disableQRSupport,omitempty" yaml:"disableQRSupport"`
-		DisableThemeSwitcher  bool    `json:"disableThemeSwitcher,omitempty" yaml:"disableThemeSwitcher"`
 		ExpiryChoices         []int64 `json:"expiryChoices,omitempty" yaml:"expiryChoices"`
-		OverlayFSPath         string  `json:"-" yaml:"overlayFSPath"`
-		UseFormalLanguage     bool    `json:"-" yaml:"useFormalLanguage"`
+
+		AcceptedFileTypes      string `json:"acceptedFileTypes" yaml:"acceptedFileTypes"`
+		DisableFileAttachment  bool   `json:"disableFileAttachment" yaml:"disableFileAttachment"`
+		MaxAttachmentSizeTotal int64  `json:"maxAttachmentSizeTotal" yaml:"maxAttachmentSizeTotal"`
+
+		OverlayFSPath     string `json:"-" yaml:"overlayFSPath"`
+		UseFormalLanguage bool   `json:"-" yaml:"useFormalLanguage"`
 	}
 )
 

i18n.yaml

@@ -28,6 +28,7 @@ reference:
     text-burn-hint: Please remember not to go to this URL yourself as that would destroy the secret. Just pass it to someone else!
     text-burn-time: 'If not viewed before, this secret will automatically be deleted:'
     text-hint-burned: <strong>Attention:</strong> You're only seeing this once. As soon as you reload the page the secret will be gone so maybe copy it now&hellip;
+    text-max-filesize-exceeded: The file(s) you chose are too big to attach.
     text-powered-by: Powered by
     text-pre-reveal-hint: To reveal the secret click this button but be aware doing so will destroy the secret. You can only view it once!
     text-pre-url: 'Your secret was created and stored using this URL:'

src/components/create.vue

@@ -38,21 +38,32 @@
             rows="5"
           />
         </div>
-        <div class="col-12 mb-3">
+        <div
+          v-if="!$root.customize.disableFileAttachment"
+          class="col-12 mb-3"
+        >
           <label for="createSecretFiles">{{ $t('label-secret-files') }}</label>
           <input
             id="createSecretFiles"
             ref="createSecretFiles"
             class="form-control"
             type="file"
             multiple
+            :accept="$root.customize.acceptedFileTypes"
+            @change="updateFileSize"
           >
+          <div
+            v-if="maxFileSizeExceeded"
+            class="alert alert-danger"
+          >
+            {{ $t('text-max-filesize-exceeded') }}
+          </div>
         </div>
         <div class="col-md-6 col-12 order-2 order-md-1">
           <button
             type="submit"
             class="btn btn-success"
-            :disabled="secret.trim().length < 1"
+            :disabled="secret.trim().length < 1 || maxFileSizeExceeded"
           >
             {{ $t('btn-create-secret') }}
           </button>
@@ -133,6 +144,10 @@ export default {
 
       return choices
     },
+
+    maxFileSizeExceeded() {
+      return this.$root.customize.maxAttachmentSizeTotal !== 0 && this.fileSize > this.$root.customize.maxAttachmentSizeTotal
+    },
   },
 
   created() {
@@ -142,6 +157,7 @@ export default {
   data() {
     return {
       canWrite: null,
+      fileSize: 0,
       secret: '',
       securePassword: null,
       selectedExpiry: null,
@@ -168,7 +184,7 @@ export default {
 
     // createSecret executes the secret creation after encrypting the secret
     createSecret() {
-      if (this.secret.trim().length < 1) {
+      if (this.secret.trim().length < 1 || this.maxFileSizeExceeded) {
         return false
       }
 
@@ -227,6 +243,15 @@ export default {
 
       return false
     },
+
+    updateFileSize() {
+      let cumSize = 0
+      for (const f of [...this.$refs.createSecretFiles.files]) {
+        cumSize += f.size
+      }
+
+      this.fileSize = cumSize
+    },
   },
 
   name: 'AppCreate',