RHeactorJS/web-app

View on GitHub
js/directives/avatar-upload.js

Summary

Maintainability
B
4 hrs
Test Coverage
import {httpProblemfromHttpError, httpProblemfromException} from '../util/http-problem'
import {HttpProgress, accept, auth} from '../util/http'
import Promise from 'bluebird'
import {URIValue} from '@rheactorjs/value-objects'
import {RHeactorJSImageServiceService} from '../services/image-service'
import {HttpProblem} from '@rheactorjs/models'

export const AvatarUploadDirective = (Upload, $timeout, imageService, ClientStorageService, TokenService) => ({
  restrict: 'E',
  scope: {
    label: '=',
    avatar: '=',
    success: '=',
    successBindThis: '=?'
  },
  templateUrl: '/directive/avatar-upload-form.html',
  link: scope => {
    scope.p = new HttpProgress()
    scope.uploadFiles = (file, errFiles) => {
      scope.f = file
      scope.errFile = errFiles && errFiles[0]
      if (!file) return
      scope.p.activity()
      return Promise
        .join(
          ClientStorageService.getValidToken().then(token => TokenService.createUserToken(token, 'image-service')),
          imageService.getUploadURI(),
          Upload.base64DataUrl(file)
        )
        .spread((token, uploadURI, fileData) => {
          const headers = Object.assign({}, auth(token).headers, accept(RHeactorJSImageServiceService.mimeType).headers)
          file.upload = Upload.http({
            url: uploadURI.toString(),
            data: {
              $context: RHeactorJSImageServiceService.$context.toString(),
              image: fileData.substr(fileData.match(/data:[^;]+;base64,/)[0].length),
              mimeType: file.type
            },
            headers: headers
          })
          file.upload.then(
            response => {
              if (response.status >= 400) return error(response)
              $timeout(() => {
                file.result = response.data.url
                file.progress = 0
                scope.success.call(scope.successBindThis, new URIValue(response.data.url))
                  .then(() => {
                    scope.p.success()
                  })
                  .catch(err => {
                    scope.p.error(HttpProblem.is(err) ? err : httpProblemfromException(err))
                  })
              })
            },
            response => error(response),
            progressEvent => {
              file.progress = Math.min(100, parseInt(100.0 * progressEvent.loaded / progressEvent.total))
            }
          )
        })
    }

    const error = (response) => {
      if (response.status > 0) {
        scope.f = undefined
        scope.p.error(httpProblemfromHttpError(response))
      }
    }
  }
})