BUG: Pasting into new-folder modal results in switch to upload-files modal

[EnterpriseDT]

Bug description: Pasting text from the clipboard into the folder-name textbox on new-folder modal results in the upload-files modal being opened.

Environment:

• Chrome for Windows 62.0.3202.75

Steps to reproduce:

1. Open angular-filemanager
2. Click the vertical dots button
3. Select 'New folder'
4. Paste clipboard text into the folder-name textbox using ctrl+v shortcut

Expected result: Clipboard text should appear in textbox. Actual result: Interface immediately opens the upload-files modal.

[hcaandersen]

I think I've got a fix for this. The problem originates in ng-file-upload, which supports pasting of files via the clipboard, i.e. you can copy a file from the OS's file-manager and paste it into ng-file-upload. It's tied in with drag-dropping files, so when I tried to disable the pasting of files, drag-drop was also disabled, which I didn't want.

My fix involves preventing multiple modals showing on top of each other. Hopefully this doesn't break something else.

I implemented this using a new scope variable called isModalShowing in main.js:

$scope.isModalShowing = false;

In then added code to the modal function in main.js such that isModalShowing is true when a modal is showing and also preventing another modal showing when isModalShowing is true:

$scope.modal = function(id, hide, returnElement) {
    if ($scope.isModalShowing)
        return;
    var element = angular.element('#' + id);
    var scope = $scope;
    element.off('hidden.bs.modal').on('hidden.bs.modal', function () {
        scope.isModalShowing = false;
    });
    element.modal(hide ? 'hide' : 'show');
    $scope.isModalShowing = !hide;
    $scope.apiMiddleware.apiHandler.error = '';
    $scope.apiMiddleware.apiHandler.asyncSuccess = false;
    return returnElement ? element : true;
};

finally, to prevent clipboard text from being added to the upload-queue I added code in addForUpload:

$scope.addForUpload = function($files) {
    if ($scope.isModalShowing)
        return;
    $scope.uploadFileList = $scope.uploadFileList.concat($files);
    $scope.modal('uploadfile');
};

[hcaandersen]

I think I've got a better fix for this: simply modify addForUpload so that nothing is done unless File objects are passed to the method.

$scope.addForUpload = function($files) {
    var files = [];
    $files.forEach(function(file) {
        if (file instanceof File)
            files.push(file);
    });
    if (files.length == 0)
        return;
    $scope.uploadFileList = $scope.uploadFileList.concat(files);
    $scope.modal('uploadfile');
};

[joni2back]

Hi, thank for your report.

This problem is related to the ng-file-upload extension. We are working on it. Thanks.

[joni2back]

Just fixed in master. I've added the ngf-model-options to disable the paste event that triggers the upload form.