From f2ede11c6042d77af1ee89280a11ef1036921f1f Mon Sep 17 00:00:00 2001 From: Ambrose Chua Date: Sat, 3 Jul 2021 20:25:53 +0800 Subject: [PATCH] Improve inline documentation --- web/create.tmpl | 9 +++- web/help.tmpl | 105 ++++++++++++++++++++++++++++++++++++++++++++++ web/src/create.js | 2 + web/upload.tmpl | 8 ++-- 4 files changed, 119 insertions(+), 5 deletions(-) create mode 100644 web/help.tmpl diff --git a/web/create.tmpl b/web/create.tmpl index 78f9e3e..7f0c80b 100644 --- a/web/create.tmpl +++ b/web/create.tmpl @@ -86,7 +86,7 @@ placeholder="">

- Your keys will be stored in the database until the dropbox link expires. + Your keys will be stored in the database until the dropbox link expires. See creating credentials for more information.

@@ -113,7 +113,7 @@ value="">

- Specify a canned ACL. Otherwise, object access permissions will follow bucket defaults. + Specify a canned ACL. Otherwise, object access permissions will follow bucket defaults, usually private unless public access is configured.

@@ -164,6 +164,11 @@ data-derive-notice="#expiry-notice">
+ + Help + + +
+

Creating a dropbox

+ +
+

Before you can create a dropbox, you need an S3-compatible bucket and credentials for that bucket. Any service that implements S3-compatible multipart uploads are supported by this tool:

+ +
+ +
+

Creating a bucket

+

Create a bucket for use with this tool. For security, avoid sharing a bucket with another system. On platforms protected by CORS like AWS, configure CORS to allow requests from this tool:

+ 
+[
+    {
+        "AllowedHeaders": [
+            "*"
+        ],
+        "AllowedMethods": [
+            "GET",
+            "PUT",
+            "POST",
+            "DELETE"
+        ],
+        "AllowedOrigins": [
+            "http://UPL_HOSTNAME",
+            "https://UPL_HOSTNAME"
+        ],
+        "ExposeHeaders": [
+            "ETag"
+        ]
+    }
+]
+
+

Additionally, consider setting up a lifecycle policy to automatically abort incomplete multipart uploads. +

+ +
+

Creating credentials

+

Create an access and secret key pair for use with this tool. Follow your platform configuration for more information. On AWS, this can be done by creating a user in IAM. The access key must have the following capabilities:

+ 
+{
+    "Version": "2012-10-17",
+    "Statement": [
+        {
+            "Effect": "Allow",
+            "Action": [
+                "s3:PutObject",
+                "s3:AbortMultipartUpload",
+                "s3:ListMultipartUploadParts"
+            ],
+            "Resource": "arn:aws:s3:::BUCKET_NAME/*"
+        }
+    ]
+}
+
+
+ +
+

Allowing public access

+

You can optionally allow users to access the uploaded files. This can be done by attaching the following bucket policy:

+ 
+{
+    "Version": "2012-10-17",
+    "Statement": [
+        {
+            "Sid": "PublicRead",
+            "Effect": "Allow",
+            "Principal": "*",
+            "Action": "s3:GetObject",
+            "Resource": "arn:aws:s3:::BUCKET_NAME/*"
+        }
+    ]
+}
+
+
+ +
+ +
+
+ +
+

Uploading files

+ +
+

Work in progress...

+
+
+ +
+ + +{{template "foot.tmpl"}} diff --git a/web/src/create.js b/web/src/create.js index 8546a12..8ff75c9 100644 --- a/web/src/create.js +++ b/web/src/create.js @@ -38,6 +38,7 @@ createAreas.forEach(createArea => { noticeArea.classList.add('hidden'); noticeArea.innerText = message; } + window.scrollTo({ top: 0 }); } createArea.addEventListener('submit', e => { @@ -65,6 +66,7 @@ Prefix: ${data.get('Prefix')} Expires: ${data.get('ExpiresNumber')}${data.get('ExpiresUnits')} `.trim(), }); + window.scrollTo({ top: 0 }); }) .catch(showError); }); diff --git a/web/upload.tmpl b/web/upload.tmpl index 6b37c46..530e126 100644 --- a/web/upload.tmpl +++ b/web/upload.tmpl @@ -1,9 +1,11 @@ {{template "head.tmpl" "Dropbox"}} -
+
-

Drop a file

+
+

Drop a file

+ + -