Add initial drag'n'drop within the filemanager

This commit is contained in:
Johannes Zellner
2020-11-07 22:43:24 +01:00
parent df20ac9190
commit 8b67b3b884
2 changed files with 24 additions and 9 deletions

View File

@@ -36,7 +36,7 @@ angular.forEach(
function(eventName) {
var directiveName = 'ng' + eventName.charAt(0).toUpperCase() + eventName.slice(1);
ngDragEventDirectives[directiveName] = ['$parse', '$rootScope', function($parse, /* $rootScope */) {
ngDragEventDirectives[directiveName] = ['$parse', '$rootScope', function($parse/*, $rootScope */) {
return {
restrict: 'A',
compile: function($element, attr) {
@@ -183,6 +183,11 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
});
}
$scope.dragStart = function ($event, entry) {
$event.originalEvent.dataTransfer.setData('text/plain', entry.fileName);
$event.originalEvent.dataTransfer.setData('application/cloudron-filemanager', entry.fileName);
};
$scope.dragEnter = function ($event, entry) {
$event.originalEvent.stopPropagation();
$event.originalEvent.preventDefault();
@@ -211,12 +216,23 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
if (!event.originalEvent.dataTransfer.items[0]) return;
var targetFolder = entry && entry.isDirectory ? entry.fileName : '';
var targetFolder = sanitize($scope.cwd + '/' + (entry && entry.isDirectory ? entry.fileName : ''));
var dataTransfer = event.originalEvent.dataTransfer;
if (dataTransfer.getData('application/cloudron-filemanager')) {
var oldFilePath = sanitize($scope.cwd + '/' + dataTransfer.getData('application/cloudron-filemanager'));
var newFilePath = sanitize(targetFolder + '/' + dataTransfer.getData('application/cloudron-filemanager'));
return Client.filesRename($scope.id, $scope.type, oldFilePath, newFilePath, function (error) {
if (error) return Client.error(error);
$scope.refresh();
});
}
// figure if a folder was dropped on a modern browser, in this case the first would have to be a directory
var folderItem;
try {
folderItem = event.originalEvent.dataTransfer.items[0].webkitGetAsEntry();
folderItem = dataTransfer.items[0].webkitGetAsEntry();
if (folderItem.isFile) return uploadFiles(event.originalEvent.dataTransfer.files, targetFolder, false);
} catch (e) {
return uploadFiles(event.originalEvent.dataTransfer.files, targetFolder, false);
@@ -260,7 +276,6 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
$scope.refresh = function () {
$scope.busy = true;
console.log('getting', $scope.id, $scope.type, $scope.cwd);
Client.filesGet($scope.id, $scope.type, $scope.cwd, 'data', function (error, result) {
$scope.busy = false;
if (error) return Client.error(error);
@@ -342,7 +357,7 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
function uploadFiles(files, targetFolder, overwrite) {
if (!files || !files.length) return;
targetFolder = targetFolder || '';
targetFolder = targetFolder || $scope.cwd;
overwrite = !!overwrite;
// prevent it from getting closed
@@ -366,7 +381,7 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
}
async.eachSeries(files, function (file, callback) {
var filePath = sanitize($scope.cwd + '/' + targetFolder + '/' + (file.webkitRelativePath || file.name));
var filePath = sanitize(targetFolder + '/' + (file.webkitRelativePath || file.name));
$scope.uploadStatus.fileName = file.name;
@@ -412,11 +427,11 @@ app.controller('FileManagerController', ['$scope', '$timeout', 'Client', functio
};
// file upload
$('#uploadFileInput').on('change', function (e) { uploadFiles(e.target.files || [], '', false); });
$('#uploadFileInput').on('change', function (e) { uploadFiles(e.target.files || [], $scope.cwd, false); });
$scope.onUploadFile = function () { $('#uploadFileInput').click(); };
// folder upload
$('#uploadFolderInput').on('change', function (e ) { uploadFiles(e.target.files || [], '', false); });
$('#uploadFolderInput').on('change', function (e ) { uploadFiles(e.target.files || [], $scope.cwd, false); });
$scope.onUploadFolder = function () { $('#uploadFolderInput').click(); };
$scope.newDirectory = {