import drag and drop files

This commit is contained in:
j 2019-07-19 19:04:12 +02:00
parent 2650e5b50b
commit 0076aae896
4 changed files with 119 additions and 0 deletions

View file

@ -69,6 +69,15 @@ pandora.ui.addItemDialog = function(options) {
title: Ox._('Add {0}', [pandora.site.itemName.singular]), title: Ox._('Add {0}', [pandora.site.itemName.singular]),
width: 544 width: 544
}); });
if (options.files) {
that.options({content: $screen.start()});
$button.options({disabled: true});
Ox.serialMap(options.files, function(file, index, files, callback) {
getFileInfo(file, function(info) {
callback(Ox.extend(info, {file: file}));
});
}, onInfo);
}
function createButton() { function createButton() {
$button = Ox[selected == 'upload' ? 'FileButton' : 'Button']({ $button = Ox[selected == 'upload' ? 'FileButton' : 'Button']({

54
static/js/importScreen.js Normal file
View file

@ -0,0 +1,54 @@
'use strict';
pandora.ui.importScreen = function() {
var that = Ox.Element()
.attr({id: 'importScreen'})
.css({
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
backgroundColor: 'rgba(0, 0, 0, 0.5)',
zIndex: 1000
})
.on({
click: function() {
that.remove();
},
dragleave: function() {
that.remove();
}
});
Ox.Element()
.css({
position: 'absolute',
left: 0,
top: 0,
right: 0,
bottom: 0,
width: pandora.hasCapability('canAddItems') ? 192 : 256,
height: 16,
padding: '8px 0',
borderRadius: 8,
margin: 'auto',
background: 'rgba(255, 255, 255, 0.9)',
fontSize: 13,
color: 'rgb(0, 0, 0)',
textAlign: 'center'
})
.text(
Ox._(pandora.hasCapability('canAddItems') ? (
'Import {0}'
) : (
'You are not allowed to import {0}'
),
[pandora.user.ui.section == 'documents' ? 'Documents' : pandora.site.itemName.plural])
)
.appendTo(that);
return that;
};

View file

@ -281,6 +281,37 @@ appPanel
resize: pandora.resizeWindow, resize: pandora.resizeWindow,
unload: pandora.unloadWindow unload: pandora.unloadWindow
}) })
Ox.$document.on({
dragenter: function(event) {
if (Ox.contains(event.originalEvent.dataTransfer.types, 'Files')) {
event.originalEvent.preventDefault();
event.originalEvent.stopPropagation();
if (!$('#importScreen').length) {
pandora.ui.importScreen().appendTo(Ox.$body);
}
} else {
console.log(event.originalEvent.dataTransfer);
}
},
dragover: function(event) {
event.originalEvent.preventDefault();
event.originalEvent.stopPropagation();
},
dragstart: function(event) {
event.originalEvent.preventDefault();
event.originalEvent.stopPropagation();
},
drop: function(event) {
$('#importScreen').remove();
if (pandora.hasCapability('canAddItems')) {
if (event.originalEvent.dataTransfer.files.length) {
event.originalEvent.preventDefault();
event.originalEvent.stopPropagation();
pandora.uploadDroppedFiles(event.originalEvent.dataTransfer.files)
}
}
}
});
Ox.extend(pandora, { Ox.extend(pandora, {
$ui: {}, $ui: {},
site: data.site, site: data.site,

View file

@ -404,6 +404,31 @@ pandora.createLinks = function($element) {
}); });
}; };
pandora.uploadDroppedFiles = function(files) {
var documentExtensions = ['pdf', /* 'epub', 'txt', */ 'png', 'gif', 'jpg'];
files = Ox.map(files, function(file) { return file});
if (files.every(function(file) {
var extension = file.name.split('.').pop().toLowerCase()
return Ox.contains(documentExtensions, extension)
})) {
pandora.ui.uploadDocumentDialog({
files: files
}, function(files) {
if (files) {
Ox.Request.clearCache('findDocuments');
if (pandora.user.ui.document || pandora.user.ui.section != 'documents') {
pandora.UI.set({section: 'documents', document: ''});
} else {
pandora.$ui.list && pandora.$ui.list.reloadList();
}
}
}).open();
} else {
pandora.ui.addItemDialog({files: files}).open()
}
};
(function() { (function() {
pandora.doHistory = function(action, items, targets, index, callback) { pandora.doHistory = function(action, items, targets, index, callback) {