improved uploading of files (#1730)

* improved uploading of files

- new core/UploadDirective to allow dropping files to any html element
- enhanced file dropping for DataTable rows (disabled by default)
- enhanced file dropping for DocumentList rows (disabled by default)
- upload drop area now handles file uploads for child elements (i.e.
rows in the document list)

* fix unit tests

* unit tests and code cleanup

* #1732, fix upload of folders

ng2-components/ng2-alfresco-upload/src/components/upload-button.component.ts

@@ -128,7 +128,7 @@ export class UploadButtonComponent {
             let directoryName = this.getDirectoryName(directoryPath);
             let absolutePath = this.currentFolderPath + this.getDirectoryPath(directoryPath);
 
-            this.uploadService.createFolder(absolutePath, directoryName)
+            this.uploadService.createFolder(absolutePath, directoryName, this.rootFolderId)
                 .subscribe(
                     res => {
                         let relativeDir = this.currentFolderPath + '/' + directoryPath;

ng2-components/ng2-alfresco-upload/src/components/upload-drag-area.component.css

@@ -4,8 +4,7 @@
     text-align: center;
 }
 
-.input-focus {
+.file-draggable__input-focus {
     color: #2196F3;
-    margin-left: 3px;
-    border: 3px dashed #2196F3;
+    border: 1px dashed #2196F3;
 }

ng2-components/ng2-alfresco-upload/src/components/upload-drag-area.component.html

@@ -2,6 +2,7 @@
      (onFilesDropped)="onFilesDropped($event)"
      (onFilesEntityDropped)="onFilesEntityDropped($event)"
      (onFolderEntityDropped)="onFolderEntityDropped($event)"
+     (upload-files)="onUploadFiles($event)"
      dropzone="" webkitdropzone="*" #droparea>
     <ng-content></ng-content>
 </div>

ng2-components/ng2-alfresco-upload/src/components/upload-drag-area.component.ts

@@ -72,16 +72,35 @@ export class UploadDragAreaComponent {
         this.uploadService.setOptions(formFields, this.versioning);
     }
 
+    /**
+     * Handles 'upload-files' events raised by child components.
+     * @param e DOM event
+     */
+    onUploadFiles(e: CustomEvent) {
+        e.stopPropagation();
+        e.preventDefault();
+
+        let files = e.detail.files;
+        if (files && files.length > 0) {
+            if (e.detail.data.obj.entry.isFolder) {
+                let id = e.detail.data.obj.entry.id;
+                this.onFilesDropped(files, id, '/');
+            } else {
+                this.onFilesDropped(files);
+            }
+        }
+    }
+
     /**
      * Method called when files are dropped in the drag area.
      *
      * @param {File[]} files - files dropped in the drag area.
      */
-    onFilesDropped(files: File[]): void {
+    onFilesDropped(files: File[], rootId?: string, directory?: string): void {
         if (files.length) {
             if (this.checkValidity(files)) {
                 this.uploadService.addToQueue(files);
-                this.uploadService.uploadFilesInTheQueue(this.rootFolderId, this.currentFolderPath, this.onSuccess);
+                this.uploadService.uploadFilesInTheQueue(rootId || this.rootFolderId, directory || this.currentFolderPath, this.onSuccess);
                 let latestFilesAdded = this.uploadService.getQueue();
                 if (this.showNotificationBar) {
                     this.showUndoNotificationBar(latestFilesAdded);
@@ -132,7 +151,7 @@ export class UploadDragAreaComponent {
             let relativePath = folder.fullPath.replace(folder.name, '');
             relativePath = this.currentFolderPath + relativePath;
 
-            this.uploadService.createFolder(relativePath, folder.name)
+            this.uploadService.createFolder(relativePath, folder.name, this.rootFolderId)
                 .subscribe(
                     message => {
                         this.onSuccess.emit({