aboutsummaryrefslogtreecommitdiffstats
path: root/app
diff options
context:
space:
mode:
authorJavan Makhmali <javan@javan.us>2018-02-14 14:35:34 -0500
committerJavan Makhmali <javan@javan.us>2018-02-14 14:35:34 -0500
commit55e2df15cdf86671801a22caaa4ea26d4e8497d5 (patch)
treed97b5cff03a91ab7bd86df1944b4de97c63ccb95 /app
parentba71c73836c084c95ca89021f9c9a455d8c94134 (diff)
downloadrails-55e2df15cdf86671801a22caaa4ea26d4e8497d5.tar.gz
rails-55e2df15cdf86671801a22caaa4ea26d4e8497d5.tar.bz2
rails-55e2df15cdf86671801a22caaa4ea26d4e8497d5.zip
Extract AttachmentUpload
Diffstat (limited to 'app')
-rw-r--r--app/javascript/activetext/attachment_upload.js45
-rw-r--r--app/javascript/activetext/index.js33
2 files changed, 50 insertions, 28 deletions
diff --git a/app/javascript/activetext/attachment_upload.js b/app/javascript/activetext/attachment_upload.js
new file mode 100644
index 0000000000..a716f1f589
--- /dev/null
+++ b/app/javascript/activetext/attachment_upload.js
@@ -0,0 +1,45 @@
+import { DirectUpload } from "activestorage"
+
+export class AttachmentUpload {
+ constructor(attachment, element) {
+ this.attachment = attachment
+ this.element = element
+ this.directUpload = new DirectUpload(attachment.file, this.directUploadUrl, this)
+ }
+
+ start() {
+ this.directUpload.create(this.directUploadDidComplete.bind(this))
+ }
+
+ directUploadWillStoreFileWithXHR(xhr) {
+ xhr.upload.addEventListener("progress", event => {
+ const progress = event.loaded / event.total * 100
+ this.attachment.setUploadProgress(progress)
+ })
+ }
+
+ directUploadDidComplete(error, attributes) {
+ if (error) {
+ throw new Error(`Direct upload failed: ${error}`)
+ }
+
+ this.attachment.setAttributes({
+ sgid: attributes.attachable_sgid,
+ url: this.createBlobUrl(attributes.signed_id, attributes.filename)
+ })
+ }
+
+ createBlobUrl(signedId, filename) {
+ return this.blobUrlTemplate
+ .replace(":signed_id", signedId)
+ .replace(":filename", encodeURIComponent(filename))
+ }
+
+ get directUploadUrl() {
+ return this.element.dataset.directUploadUrl
+ }
+
+ get blobUrlTemplate() {
+ return this.element.dataset.blobUrlTemplate
+ }
+}
diff --git a/app/javascript/activetext/index.js b/app/javascript/activetext/index.js
index e1c59dd50d..c149eda952 100644
--- a/app/javascript/activetext/index.js
+++ b/app/javascript/activetext/index.js
@@ -1,34 +1,11 @@
import * as Trix from "trix"
-import { DirectUpload } from "activestorage"
+import { AttachmentUpload } from "./attachment_upload"
addEventListener("trix-attachment-add", event => {
- const { attachment } = event
- if (!attachment.file) return
+ const { attachment, target } = event
- const { directUploadUrl, blobUrlTemplate } = event.target.dataset
-
- const delegate = {
- directUploadWillStoreFileWithXHR: (xhr) => {
- xhr.upload.addEventListener("progress", event => {
- const progress = event.loaded / event.total * 100
- attachment.setUploadProgress(progress)
- })
- }
+ if (attachment.file) {
+ const upload = new AttachmentUpload(attachment, target)
+ upload.start()
}
-
- const directUpload = new DirectUpload(attachment.file, directUploadUrl, delegate)
-
- directUpload.create((error, attributes) => {
- if (error) {
- console.warn("Failed to store file for attachment", attachment, error)
- } else {
- const sgid = attributes.attachable_sgid
-
- const url = blobUrlTemplate
- .replace(":signed_id", attributes.signed_id)
- .replace(":filename", encodeURIComponent(attributes.filename))
-
- attachment.setAttributes({ sgid, url })
- }
- })
})