diff --git a/static/js/addItemDialog.js b/static/js/addItemDialog.js index 465a8da77..71361fda7 100644 --- a/static/js/addItemDialog.js +++ b/static/js/addItemDialog.js @@ -69,6 +69,15 @@ pandora.ui.addItemDialog = function(options) { title: Ox._('Add {0}', [pandora.site.itemName.singular]), 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() { $button = Ox[selected == 'upload' ? 'FileButton' : 'Button']({ diff --git a/static/js/importScreen.js b/static/js/importScreen.js new file mode 100644 index 000000000..8749647c6 --- /dev/null +++ b/static/js/importScreen.js @@ -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; + +}; diff --git a/static/js/pandora.js b/static/js/pandora.js index 0962c235a..0c0f76ba8 100644 --- a/static/js/pandora.js +++ b/static/js/pandora.js @@ -281,6 +281,37 @@ appPanel resize: pandora.resizeWindow, 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, { $ui: {}, site: data.site, diff --git a/static/js/utils.js b/static/js/utils.js index 5825e724f..8bb3a9dc3 100644 --- a/static/js/utils.js +++ b/static/js/utils.js @@ -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() { pandora.doHistory = function(action, items, targets, index, callback) {