src/common/services/api.service.js

@@ -141,6 +141,51 @@ class ApiService {
  }
  }
 
+ /**
+ * Upload file to s3, differences with generic upload are headers and formData (wich is not necessary)
+ * @param {any} lease 
+ * @param {any} file 
+ * @param {function} progress 
+ */
+ uploadToS3(lease, file, progress) {
+
+ return new Cancelable((resolve, reject, onCancel) => {
+
+ let xhr = new XMLHttpRequest();
+
+ // handle cancel
+ onCancel((cb) => {
+ xhr.abort();
+ cb();
+ });
+
+ if (progress) {
+ xhr.upload.addEventListener("progress", progress);
+ }
+ const url = lease.presigned_url;
+ xhr.open('PUT', url);
+ xhr.setRequestHeader('Content-Type', file.type);
+ xhr.onload = () => {
+ if (xhr.status == 200) {
+ resolve(true);
+ } else {
+ reject('Ooops: upload error');
+ }
+ };
+ xhr.onerror = function() {
+ reject(new TypeError('Network request failed'));
+ }
+
+ xhr.send(file);
+ })
+ .catch( error => {
+ if (error.name !== 'CancelationError') {
+ logService.exception('[ApiService] upload', error);
+ throw error;
+ }
+ });
+ }
+
  async delete(url, body={}) {
  const headers = this.buildHeaders();
 

src/common/services/attachment.service.js

@@ -11,7 +11,7 @@ class AttachmentService {
  * @param {object} media
  * @param {function} onProgress
  */
- attachMedia(media, extra, onProgress=null) {
+ async attachMedia(media, extra, onProgress=null) {
 
  let type = 'image'
 
@@ -22,10 +22,38 @@ class AttachmentService {
  name: media.fileName || 'test'
  };
 
- return api.upload('api/v1/media/', file, extra, (e) => {
+ const progress = (e) => {
  let pct = e.loaded / e.total;
  if (onProgress) onProgress(pct);
- });
+ }
+
+ if(file.type.includes('video')){
+ return this.uploadToS3(file,progress);
+ }
+
+ return api.upload('api/v1/media/', file, extra, progress);
+ }
+
+ /**
+ * Handles upload to s3 in three steps:
+ * 1) prepare request return lease with signed url
+ * 2) upload file to S3 with signed url
+ * 3) complete upload
+ * @param {any} file 
+ * @param {function} progress 
+ */
+ async uploadToS3(file, progress){
+ // Prepare media and wait for lease => {media_type, guid}
+ const {lease} = await api.put(`api/v2/media/upload/prepare/video`);
+
+ // upload file to s3 
+ await api.uploadToS3(lease, file, progress);
+
+ // complete upload and wait for status
+ const {status} = await api.put(`api/v2/media/upload/complete/${lease.media_type}/${lease.guid}`); 
+
+ // if false is returned, upload fails message will be showed
+ return status === 'success' ? {guid: lease.guid} : false;
  }
 
  /**

src/common/stores/AttachmentStore.js

@@ -70,7 +70,7 @@ export default class AttachmentStore {
 
  const result = await uploadPromise;
  // ignore canceled
- if (uploadPromise.isCanceled() || !result) return;
+ if ((uploadPromise.isCanceled && uploadPromise.isCanceled()) || !result) return;
  this.guid = result.guid;
  } catch (err) {
  this.clear();