diff options
Diffstat (limited to 'app/javascript/actiontext/attachment_upload.js')
-rw-r--r-- | app/javascript/actiontext/attachment_upload.js | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/app/javascript/actiontext/attachment_upload.js b/app/javascript/actiontext/attachment_upload.js new file mode 100644 index 0000000000..a716f1f589 --- /dev/null +++ b/app/javascript/actiontext/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 + } +} |