import drag and drop files
This commit is contained in:
parent
2650e5b50b
commit
0076aae896
4 changed files with 119 additions and 0 deletions
|
@ -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
54
static/js/importScreen.js
Normal 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;
|
||||||
|
|
||||||
|
};
|
|
@ -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,
|
||||||
|
|
|
@ -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) {
|
||||||
|
|
Loading…
Reference in a new issue