0
1
Fork 0
hedera-web-mindshore/forms/admin/photos/photos.js

214 lines
4.6 KiB
JavaScript
Raw Normal View History

(function() {
var Status = {
NONE : 0
,WAITING : 1
,UPLOADING : 2
,UPLOADED : 3
};
2015-02-01 03:21:54 +00:00
2022-05-26 06:08:31 +00:00
Hedera.Photos = new Class({
2016-09-26 09:28:47 +00:00
Extends: Hedera.Form
2017-05-08 15:54:35 +00:00
,filesData: []
,uploadCount: 0
,errors: false
,uploadQueue: []
,isUploading: false
2015-02-01 03:21:54 +00:00
,activate: function() {
2015-03-06 23:33:54 +00:00
this.$('schema').value = 'catalog';
2015-02-01 03:21:54 +00:00
}
2017-05-08 15:54:35 +00:00
,addFiles: function(files) {
2017-05-08 15:54:35 +00:00
if (!files)
return;
for (var i = 0; i < files.length; i++)
this.addFile(files[i]);
2017-05-08 15:54:35 +00:00
}
,addFile: function(file) {
2017-05-08 15:54:35 +00:00
var doc = document;
var li = doc.createElement('div');
2017-05-08 15:54:35 +00:00
var div = doc.createElement('div');
div.className = 'thumb';
li.appendChild(div);
2015-02-01 03:21:54 +00:00
var thumb = doc.createElement('img');
2017-05-08 15:54:35 +00:00
thumb.file = file;
div.appendChild(thumb);
2017-05-08 15:54:35 +00:00
var reader = new FileReader();
reader.onload = function(e) {
thumb.src = e.target.result;
};
2017-05-08 15:54:35 +00:00
reader.readAsDataURL(file);
var name = doc.createElement('input');
2017-05-08 15:54:35 +00:00
name.type = 'text';
name.value = getFileName(file.name);
li.appendChild(name);
2017-05-08 15:54:35 +00:00
var statusNode = doc.createElement('div');
statusNode.className = 'status';
li.appendChild(statusNode);
2017-05-08 15:54:35 +00:00
var fileData = {
li: li,
2017-05-08 15:54:35 +00:00
file: file,
name: name,
statusNode: statusNode
2017-05-08 15:54:35 +00:00
};
2022-05-26 06:08:31 +00:00
var button = new Htk.Button({
tip: 'Remove',
icon: 'delete'
});
button.node.addEventListener('click',
() => this.onFileRemove(fileData));
li.appendChild(button.node);
this.filesData.push(fileData);
2017-05-08 15:54:35 +00:00
this.$('file-list').appendChild(li);
this.setImageStatus(fileData, Status.NONE, 'add', _('Pending upload'));
2016-08-30 07:43:47 +00:00
}
2017-05-08 15:54:35 +00:00
,onUploadClick: function() {
2017-05-08 15:54:35 +00:00
var filesData = this.filesData;
var count = 0;
for (var i = 0; i < filesData.length; i++) {
2017-05-08 15:54:35 +00:00
var fileData = filesData[i];
if (fileData.status === Status.NONE) {
this.setImageStatus(
fileData, Status.WAITING, 'cloud-upload', _('Waiting for upload'));
fileData.name.disabled = true;
this.uploadQueue.push(fileData);
2017-05-08 15:54:35 +00:00
count++;
}
}
if (count === 0)
Htk.Toast.showWarning(_('There are no files to upload'));
else
this.uploadNextFile();
}
,uploadNextFile: function() {
if (this.isUploading)
return;
this.isUploading = true;
var fileData = this.uploadQueue.shift();
this.setImageStatus(
fileData, Status.UPLOADING, 'upload', _('Uploading file'));
var formData = new FormData();
formData.append('updateMatching', this.$('update-matching').value);
formData.append('image', fileData.file);
formData.append('name', fileData.name.value);
formData.append('schema', this.$('schema').value);
formData.append('srv', 'json:image/upload');
this.conn.sendFormData(formData,
this.onFileUpload.bind(this, fileData));
2017-05-08 15:54:35 +00:00
}
,onFileUpload: function(fileData, data, error) {
this.isUploading = false;
2017-05-08 15:54:35 +00:00
if (data) {
this.setImageStatus(
fileData, Status.UPLOADED, 'ok', _('Image uploaded'));
} else {
this.setImageStatus(
fileData, Status.NONE, 'error', error.message);
fileData.name.disabled = false;
2017-05-08 15:54:35 +00:00
this.errors = true;
}
2015-02-01 03:21:54 +00:00
if (this.uploadQueue.length === 0) {
if (this.errors)
Htk.Toast.showError(_('Some errors happened on upload'));
else
Htk.Toast.showMessage(_('Upload finished successfully'));
2017-05-08 15:54:35 +00:00
this.errors = false;
} else
this.uploadNextFile();
}
,setImageStatus: function(fileData, status, icon, title) {
fileData.status = status;
var statusNode = fileData.statusNode;
Vn.Node.removeChilds(statusNode);
var iconNode = new Htk.Icon({icon: icon});
statusNode.appendChild(iconNode.node);
statusNode.title = title ? title : '';
2017-05-08 15:54:35 +00:00
}
2022-05-26 06:08:31 +00:00
,onFileRemove: function(fileData) {
this.$('file-list').removeChild(fileData.li);
2016-10-11 14:45:10 +00:00
2017-05-08 15:54:35 +00:00
for (var i = 0; i < this.filesData.length; i++)
if (this.filesData[i] === fileData) {
this.filesData.splice(i, 1);
2017-05-08 15:54:35 +00:00
break;
}
}
,onClearClick: function() {
2017-05-08 15:54:35 +00:00
this.filesData = [];
Vn.Node.removeChilds(this.$('file-list'));
2017-05-08 15:54:35 +00:00
}
,onDropzoneClick: function() {
this.$('file').click();
2017-05-08 15:54:35 +00:00
}
,onFileChange: function() {
this.addFiles(this.$('file').files);
2017-05-08 15:54:35 +00:00
}
,onDragEnter: function() {
this.$('dropzone').classList.add('dragover');
2017-05-08 15:54:35 +00:00
}
,onDragLeave: function() {
this.$('dropzone').classList.remove('dragover');
2017-05-08 15:54:35 +00:00
}
,onDragOver: function(event) {
event.preventDefault();
2017-05-08 15:54:35 +00:00
}
,onDragEnd: function(event) {
this.$('dropzone').classList.remove('dragover');
event.dataTransfer.clearData();
2017-05-08 15:54:35 +00:00
}
,onDrop: function(event) {
event.preventDefault();
this.addFiles(event.dataTransfer.files);
2015-02-01 03:21:54 +00:00
}
});
function getFileName(path) {
var barIndex = path.lastIndexOf('/');
2017-05-08 15:54:35 +00:00
if (barIndex === -1)
barIndex = path.lastIndexOf('\\');
2017-05-08 15:54:35 +00:00
if (barIndex === -1)
barIndex = 0;
var dotIndex = path.lastIndexOf('.');
2017-05-08 15:54:35 +00:00
if (dotIndex === -1)
dotIndex = 0;
return path.substr(barIndex, dotIndex);
2017-05-08 15:54:35 +00:00
}
})();