127 lines
4.7 KiB
JavaScript
127 lines
4.7 KiB
JavaScript
/**
|
|
* This model is used by admin/show_album.blade.php to handle photo uploads.
|
|
* @param album_id ID of the album the photos are being uploaded to
|
|
* @param queue_token Unique token of the upload queue to save the photos to
|
|
* @param language Array containing language strings
|
|
* @param urls Array containing URLs
|
|
* @constructor
|
|
*/
|
|
function UploadPhotosViewModel(album_id, queue_token, language, urls) {
|
|
this.el = '#upload-tab';
|
|
this.data = {
|
|
currentStatus: '',
|
|
imagesFailed: 0,
|
|
imagesTotal: 0,
|
|
isBulkUploadInProgress: false,
|
|
isUploadInProgress: false,
|
|
statusMessages: []
|
|
};
|
|
this.computed = {
|
|
// a computed getter
|
|
failedPercentage: function () {
|
|
return ((this.imagesFailed / this.imagesTotal) * 100).toFixed(2) + '%';
|
|
},
|
|
successfulPercentage: function () {
|
|
return ((self.imagesUploaded / self.imagesTotal) * 100).toFixed(2) + '%';
|
|
}
|
|
};
|
|
this.methods = {
|
|
// This method is called when an image is uploaded - regardless if it fails or not
|
|
onUploadCompleted: function () {
|
|
this.currentStatus = language.upload_status
|
|
.replace(':current', (this.imagesUploaded + this.imagesFailed))
|
|
.replace(':total', this.imagesTotal);
|
|
|
|
if ((this.imagesFailed + this.imagesUploaded) >= this.imagesTotal) {
|
|
this.isUploadInProgress = false;
|
|
|
|
if (this.imagesFailed == 0 && this.imagesUploaded > 0) {
|
|
window.location = urls.analyse;
|
|
}
|
|
}
|
|
},
|
|
// This method is called when an uploaded image fails
|
|
onUploadFailed: function (data, file_name) {
|
|
this.imagesFailed++;
|
|
this.statusMessages.push({
|
|
'message_class': 'text-danger',
|
|
'message_text': language.image_failed.replace(':file_name', file_name)
|
|
});
|
|
this.onUploadCompleted();
|
|
},
|
|
// This method is called when an uploaded image succeeds
|
|
onUploadSuccessful: function (data, file_name) {
|
|
if (data.is_successful) {
|
|
this.imagesUploaded++;
|
|
// Don't add to statusMessages() array so user only sees errors
|
|
/*self.statusMessages.push({
|
|
'message_class': 'text-success',
|
|
'message_text': language.image_uploaded.replace(':file_name', file_name)
|
|
});*/
|
|
this.onUploadCompleted();
|
|
}
|
|
else {
|
|
this.onUploadFailed(data, file_name);
|
|
}
|
|
},
|
|
uploadFile: function uploadImageFile(formObject, imageFile) {
|
|
var self = this;
|
|
var formData = new FormData();
|
|
formData.append('album_id', album_id);
|
|
formData.append('queue_token', queue_token);
|
|
formData.append('photo[]', imageFile, imageFile.name);
|
|
|
|
$.ajax(
|
|
{
|
|
contentType: false,
|
|
data: formData,
|
|
error: function (data) {
|
|
self.onUploadFailed(data, imageFile.name);
|
|
},
|
|
method: $(formObject).attr('method'),
|
|
processData: false,
|
|
success: function (data) {
|
|
self.onUploadSuccessful(data, imageFile.name);
|
|
},
|
|
url: $(formObject).attr('action')
|
|
}
|
|
);
|
|
this.isUploadInProgress = true;
|
|
},
|
|
uploadIndividualFiles: function(event) {
|
|
var fileSelect = $('input[type=file]', event.target);
|
|
|
|
// Get the selected files
|
|
var files = fileSelect[0].files;
|
|
|
|
// Reset statistics
|
|
this.currentStatus = '';
|
|
this.statusMessages = [];
|
|
this.imagesUploaded = 0;
|
|
this.imagesFailed = 0;
|
|
this.imagesTotal = files.length;
|
|
this.isUploadInProgress = true;
|
|
|
|
// Loop through each of the selected files and upload them individually
|
|
for (var i = 0; i < files.length; i++)
|
|
{
|
|
var file = files[i];
|
|
|
|
// We're only interested in image files
|
|
if (!file.type.match('image.*'))
|
|
{
|
|
alert(language.not_an_image_file.replace(':file_name', file.name));
|
|
this.onUploadFailed(null, file.name);
|
|
continue;
|
|
}
|
|
|
|
// Upload the file
|
|
this.uploadFile(event.target, file);
|
|
}
|
|
|
|
// Prevent standard form upload
|
|
event.preventDefault();
|
|
return false;
|
|
}
|
|
};
|
|
} |