joachim/openwebrx-clone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

introduce spinner during file uploads

Browse Source
This commit is contained in:
Jakob Ketterl 2021-05-07 17:33:10 +02:00
parent 484b829b90
commit 0206a6f94c
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
htdocs/lib/settings/ImageUpload.js
View File

@ -20,18 +20,22 @@ $.fn.imageUpload = function() {
$this.removeClass('is-invalid'); $this.removeClass('is-invalid');
}; };
$uploadButton.click(function(){ $uploadButton.click(function(){
$uploadButton.prop('disabled', true);
var input = document.createElement('input'); var input = document.createElement('input');
input.type = 'file'; input.type = 'file';
input.accept = 'image/jpeg, image/png, image/webp'; input.accept = 'image/jpeg, image/png, image/webp';
input.onchange = function(e) { input.onchange = function(e) {
$uploadButton.prop('disabled', true);
var $spinner = $('<span class="spinner-border spinner-border-sm mr-1" role="status"></span>');
$uploadButton.prepend($spinner);
var reader = new FileReader() var reader = new FileReader()
reader.readAsArrayBuffer(e.target.files[0]); reader.readAsArrayBuffer(e.target.files[0]);
reader.onprogress = function(e) { reader.onprogress = function(e) {
if (e.loaded > maxSize) { if (e.loaded > maxSize) {
handleError('Maximum file size exceeded'); handleError('Maximum file size exceeded');
$uploadButton.prop('disabled', false); $uploadButton.prop('disabled', false);
$spinner.remove();
reader.abort(); reader.abort();
} }
}; };
@ -39,6 +43,7 @@ $.fn.imageUpload = function() {
if (e.loaded > maxSize) { if (e.loaded > maxSize) {
handleError('Maximum file size exceeded'); handleError('Maximum file size exceeded');
$uploadButton.prop('disabled', false); $uploadButton.prop('disabled', false);
$spinner.remove();
return; return;
} }
$.ajax({ $.ajax({
@ -60,6 +65,7 @@ $.fn.imageUpload = function() {
} }
}).always(function(){ }).always(function(){
$uploadButton.prop('disabled', false); $uploadButton.prop('disabled', false);
$spinner.remove();
}); });
} }
}; };