joni2back / angular-filemanager

JavaScript File Manager Material Design Folder Explorer Navigator Browser Manager in AngularJS with CSS3 Responsive (with FTP in PHP / Java / Node)
https://joni2back.github.io/angular-filemanager/
MIT License
1.76k stars 577 forks source link

How to detect file name exist on upload? #327

Open morteza-gho opened 6 years ago

morteza-gho commented 6 years ago

Hi, I want to show an error(like: file name exist) to user when upload a file with name exist in a directory.

$scope.uploadFiles = function () {

        /*******  I added these ↓↓↓ ********/
        var item = $scope.singleSelection();
        if (item) {
           var name = item.tempModel.name.trim();
           var nameExists = $scope.fileNavigator.fileNameExists(name);
           if (nameExists && validateSamePath(item)) {
              // this name is exist, so ↓
              $scope.apiMiddleware.apiHandler.error = $translate.instant('error_invalid_filename');
              return false;
           }
        }

/******* these code are exist before(your code) ↓↓↓ ********/

$scope.apiMiddleware.upload($scope.uploadFileList, $scope.fileNavigator.currentPath).then(function () {
           $scope.fileNavigator.refresh();
           $scope.uploadFileList = [];
           $scope.modal('uploadfile', true);
        }, function (data) {
           var errorMsg = data.result && data.result.error || $translate.instant('error_uploading_files');
           $scope.apiMiddleware.apiHandler.error = errorMsg;
        });

}

But in this case, I should to select an item then upload a file, means that, If I don't select a file and upload a new file with same name in, error not appear. I need to detect with fileName

How Can I Achieve This?
Thanks in advance

morteza-gho commented 6 years ago

I Solved the problem after many search and test codes. mabye help someone

I Add time stamp to file name if repetitive.

In main.js file

function checkRepetitive(file) {
    var currentList = $scope.fileNavigator.fileList;
    var repetitive = false;
    angular.forEach(currentList, function (item, index) {
       if (item.model.name === file.name) {
          repetitive = true
       }
    });

    return repetitive;
}

// click on upload file button in upload modal
$scope.uploadFiles = function () {

    angular.forEach($scope.uploadFileList, function (item, index) {

       if (checkRepetitive(item)) {

          // `morteza.jpg` => `morteza` + `new Date().getTime()).toString()` + `.jpg`
          var lastDotIndex = item.name.lastIndexOf('.');
          var fileName = item.name.substring(0, lastDotIndex);
          var extension = item.name.substring(lastDotIndex, item.name.length);

          // name was `read only` so, I can't change that if didn't write this ↓
          Object.defineProperty(item, 'name', {
             writable: true
          });

          angular.extend(item, {'name': fileName + (new Date().getTime()).toString() + extension});

       } // if (checkRepetitive(item)) {

 }); 

stackoverflow link