File upload progress

This commit is contained in:
jendib 2014-01-19 18:46:07 +01:00
parent 6aaecb473f
commit d76b8e32c8
2 changed files with 38 additions and 13 deletions

View File

@ -1 +1,2 @@
- Automatic backup system using Quartz (server) - Automatic backup system using Quartz (server)
- Handle error while uploading a file

View File

@ -94,7 +94,7 @@ App.controller('DocumentEdit', function($rootScope, $scope, $q, $http, $state, $
$scope.resetForm(); $scope.resetForm();
$scope.loadDocuments(); $scope.loadDocuments();
} }
} };
if (_.size($scope.newFiles) == 0) { if (_.size($scope.newFiles) == 0) {
navigateNext(); navigateNext();
@ -104,6 +104,13 @@ App.controller('DocumentEdit', function($rootScope, $scope, $q, $http, $state, $
// Send a file from the input file array and return a promise // Send a file from the input file array and return a promise
var sendFile = function(key) { var sendFile = function(key) {
var deferred = $q.defer();
var getProgressListener = function(deferred) {
return function(event) {
deferred.notify(event);
};
};
// Build the payload // Build the payload
var file = $scope.newFiles[key]; var file = $scope.newFiles[key];
var formData = new FormData(); var formData = new FormData();
@ -111,20 +118,37 @@ App.controller('DocumentEdit', function($rootScope, $scope, $q, $http, $state, $
formData.append('file', file); formData.append('file', file);
// Send the file // Send the file
var promiseFile = $http.put('api/file', $.ajax({
formData, { type: 'PUT',
headers: { 'Content-Type': undefined }, url: 'api/file',
transformRequest: function(data) { return data; } data: formData,
}); cache: false,
contentType: false,
processData: false,
success: function(response) {
deferred.resolve(response);
},
error: function(jqXHR, textStatus, errorThrown) {
deferred.reject(errorThrown);
},
xhr: function() {
var myXhr = $.ajaxSettings.xhr();
myXhr.upload.addEventListener(
'progress', getProgressListener(deferred), false);
return myXhr;
}
});
// TODO Handle progression when $q.notify will be released // Update progress bar and title on progress
var startProgress = $scope.fileProgress;
promiseFile.then(function() { deferred.promise.then(null, null, function(e) {
$scope.fileProgress += 100 / _.size($scope.newFiles); var done = 1 - (e.total - e.position) / e.total;
var chunk = 100 / _.size($scope.newFiles);
$scope.fileProgress = startProgress + done * chunk;
$rootScope.pageTitle = Math.round($scope.fileProgress) + '% - Sismics Docs'; $rootScope.pageTitle = Math.round($scope.fileProgress) + '% - Sismics Docs';
}); });
return promiseFile; return deferred.promise;
}; };
// Upload files sequentially // Upload files sequentially