lespoupeesrusses/promethee

<script type="text/ng-template" id="promethee_uploader">
  <div class="form-group" ngf-drop="prometheeUploader.upload($file)" ngf-pattern="{{limits || ''}}">
    <div class="label-control" ng-show="label != ''">{{label}}</div>
    <div class="button btn btn-default btn-light" ngf-select="prometheeUploader.upload($file, ngModel)" ngf-accept="{{limits || ''}}" class="drop-box" style="margin-top: 5px; margin-bottom: 5px;">Select a file</div>
    <div ng-show="ngModel.id != undefined" class="promethee_uploader--preview">
      <img ng-src="/promethee/blob/{{ngModel.id}}" />
      {{ngModel.name}}
      <span class="promethee_uploader--preview__delete fa fa-trash" ng-click="ngModel = { id: undefined, name: '' }"></span>
    </div>
    <div class="progress" ng-show="prometheeUploader.upload_progress != undefined && prometheeUploader.upload_progress != 0 && prometheeUploader.upload_progress != 100">
      <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: {{prometheeUploader.upload_progress}}%"></div>
    </div>
    <div class="alert alert-danger" ng-show="upload_error">{{upload_error}}</div>
  </div>
</script>

<script>
  promethee.directive('prometheeUploader', ['Upload', function(Upload) {
    return {
      restrict: 'E',
      scope: {
        ngModel: '=',
        label: '@',
        limits: '@',
      },
      templateUrl: 'promethee_uploader',
      controller: function($scope) {
        var self = this;
        this.upload_error = '';
        this.upload_progress = 0;

        this.upload = function (file) {
          if (file == undefined) return;
          Upload.upload({
            url: '<%= promethee_active_storage_create_path %>',
            data: { file: file },
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }
          }).then(function (resp) {
            $scope.ngModel = resp.data;
            self.upload_error = undefined;
            self.upload_error = "une erreur grave !";
          }, function (resp) {
            self.upload_error = "An error occured (error " + resp.status + ": " + resp.statusText + ")";
          }, function (evt) {
            var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
            self.upload_progress = progressPercentage;
          });
        };

      },
      controllerAs: 'prometheeUploader'
    }
  }]);

</script>