inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-31 17:38:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-643] upload enhancements (#1949)

Browse Source 
* rework folder uploading

- flatterns hierarchy on folder upload
- performs a single traversal for the entire folder heirarchy and ends with a comple file list
- allows now dropping folders on existing folders
- overall code improvements

* fix unit tests

* readme updates

* clean old and unused code

* code cleanup

* limit concurrent uploads

* update code as per review

* fix upload button for Safari

* fixes for Safari

- Safari compatibility
- code updates based on review

* fix code

* fix unit tests
This commit is contained in:
Denys Vuika
2017-06-11 12:02:05 +01:00
committed by Eugenio Romano
parent e7a1f46ac8
commit a02ba4ad71
16 changed files with 393 additions and 631 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
ng2-components/ng2-alfresco-upload/src/components/file-uploading-dialog.component.ts
View File

@@ -67,7 +67,6 @@ export class FileUploadingDialogComponent implements OnInit, OnDestroy {
});
this.uploadService.fileUpload.subscribe(e => {
console.log(e);
this.cd.detectChanges();
});
}

19
ng2-components/ng2-alfresco-upload/src/components/upload-button.component.spec.ts
View File

@@ -186,7 +186,7 @@ describe('UploadButtonComponent', () => {
fixture.detectChanges();
component.onFilesAdded(fakeEvent);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith('-root-', '/root-fake-/sites-fake/folder-fake', null);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith(null);
});
it('should call uploadFile with a custom root folder', () => {
@@ -202,7 +202,7 @@ describe('UploadButtonComponent', () => {
fixture.detectChanges();
component.onFilesAdded(fakeEvent);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith('-my-', '/root-fake-/sites-fake/folder-fake', null);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith(null);
});
it('should create a folder and emit an File uploaded event', (done) => {
@@ -228,21 +228,6 @@ describe('UploadButtonComponent', () => {
component.onDirectoryAdded(fakeEvent);
});
it('should emit an onError event when the folder already exist', (done) => {
component.rootFolderId = '-my-';
spyOn(contentService, 'createFolder').and.returnValue(Observable.throw(new Error('')));
spyOn(component, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId, true) });
component.onError.subscribe(e => {
expect(e.value).toEqual('Error');
done();
});
component.onDirectoryAdded(fakeEvent);
});
it('should by default the title of the button get from the JSON file', () => {
let compiled = fixture.debugElement.nativeElement;
fixture.detectChanges();

177
ng2-components/ng2-alfresco-upload/src/components/upload-button.component.ts
View File

@@ -17,14 +17,12 @@
import { Component, ElementRef, Input, Output, EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core';
import { Observable, Subject } from 'rxjs/Rx';
import { AlfrescoApiService, AlfrescoContentService, AlfrescoTranslationService, LogService, NotificationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
import { AlfrescoApiService, AlfrescoContentService, AlfrescoTranslationService, LogService, NotificationService, AlfrescoSettingsService, FileUtils } from 'ng2-alfresco-core';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { UploadService } from '../services/upload.service';
import { FileModel } from '../models/file.model';
import { PermissionModel } from '../models/permissions.model';
const ERROR_FOLDER_ALREADY_EXIST = 409;
@Component({
selector: 'alfresco-upload-button',
templateUrl: './upload-button.component.html',
@@ -32,11 +30,15 @@ const ERROR_FOLDER_ALREADY_EXIST = 409;
})
export class UploadButtonComponent implements OnInit, OnChanges {
private static DEFAULT_ROOT_ID: string = '-root-';
@Input()
disabled: boolean = false;
/**
* @deprecated Deprecated in 1.6.0, you can use UploadService events and NotificationService api instead.
*
* @type {boolean}
* @memberof UploadButtonComponent
*/
@Input()
showNotificationBar: boolean = true;
@@ -55,11 +57,17 @@ export class UploadButtonComponent implements OnInit, OnChanges {
@Input()
staticTitle: string;
/**
* @deprecated Deprecated in 1.6.0, this property is not used for couple of releases already.
*
* @type {string}
* @memberof UploadDragAreaComponent
*/
@Input()
currentFolderPath: string = '/';
@Input()
rootFolderId: string = UploadButtonComponent.DEFAULT_ROOT_ID;
rootFolderId: string = '-root-';
@Input()
disableWithNoPermission: boolean = false;
@@ -122,16 +130,11 @@ export class UploadButtonComponent implements OnInit, OnChanges {
return !this.hasPermission && this.disableWithNoPermission ? true : undefined;
}
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesAdded($event: any): void {
let files: File[] = this.getFiles($event.currentTarget.files);
let files: File[] = FileUtils.toFileArray($event.currentTarget.files);
if (this.hasPermission) {
this.uploadFiles(this.currentFolderPath, files);
this.uploadFiles(files);
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
@@ -139,38 +142,10 @@ export class UploadButtonComponent implements OnInit, OnChanges {
$event.target.value = '';
}
/**
* Method called when a folder is dropped in the drag area.
*
* @param {File[]} files - files of a folder dropped in the drag area.
*/
onDirectoryAdded($event: any): void {
let files: File[] = this.getFiles($event.currentTarget.files);
if (this.hasPermission) {
let hashMapDir = this.convertIntoHashMap(files);
hashMapDir.forEach((filesDir, directoryPath) => {
let directoryName = this.getDirectoryName(directoryPath);
let absolutePath = this.currentFolderPath + this.getDirectoryPath(directoryPath);
this.contentService.createFolder(absolutePath, directoryName, this.rootFolderId)
.subscribe(
_ => {
let relativeDir = this.currentFolderPath + '/' + directoryPath;
this.uploadFiles(relativeDir, filesDir);
},
error => {
let errorMessagePlaceholder = this.getErrorMessage(error.response);
if (errorMessagePlaceholder) {
this.onError.emit({value: errorMessagePlaceholder});
let errorMessage = this.formatString(errorMessagePlaceholder, [directoryName]);
if (errorMessage) {
this.showErrorNotificationBar(errorMessage);
}
}
}
);
});
let files: File[] = FileUtils.toFileArray($event.currentTarget.files);
this.uploadFiles(files);
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
@@ -180,78 +155,24 @@ export class UploadButtonComponent implements OnInit, OnChanges {
/**
* Upload a list of file in the specified path
* @param path
* @param files
* @param path
*/
uploadFiles(path: string, files: File[]): void {
if (files.length) {
const latestFilesAdded = files.map(f => new FileModel(f, { newVersion: this.versioning }));
uploadFiles(files: File[]): void {
if (files.length > 0) {
const latestFilesAdded = files.map(file => new FileModel(file, {
newVersion: this.versioning,
parentId: this.rootFolderId,
path: (file.webkitRelativePath || '').replace(/\/[^\/]*$/, '')
}));
this.uploadService.addToQueue(...latestFilesAdded);
this.uploadService.uploadFilesInTheQueue(this.rootFolderId, path, this.onSuccess);
this.uploadService.uploadFilesInTheQueue(this.onSuccess);
if (this.showNotificationBar) {
this.showUndoNotificationBar(latestFilesAdded);
}
}
}
/**
* It converts the array given as input into a map. The map is a key values pairs, where the key is the directory name and the value are
* all the files that the directory contains.
* @param files - array of files
* @returns {Map}
*/
private convertIntoHashMap(files: File[]): Map<string, File[]> {
let directoryMap = new Map<string, File[]>();
for (let file of files) {
let directory = this.getDirectoryPath(file.webkitRelativePath);
let filesSomeDir = directoryMap.get(directory) || [];
filesSomeDir.push(file);
directoryMap.set(directory, filesSomeDir);
}
return directoryMap;
}
private getFiles(fileList: FileList): File[] {
const result: File[] = [];
if (fileList && fileList.length > 0) {
for (let i = 0; i < fileList.length; i++) {
result.push(fileList[i]);
}
}
return result;
}
/**
* Split the directory path given as input and cut the last directory name
* @param directory
* @returns {string}
*/
private getDirectoryPath(directory: string): string {
let relativeDirPath = '';
let dirPath = directory.split('/');
if (dirPath.length > 1) {
dirPath.pop();
relativeDirPath = '/' + dirPath.join('/');
}
return relativeDirPath;
}
/**
* Split a directory path passed in input and return the first directory name
* @param directory
* @returns {string}
*/
private getDirectoryName(directory: string): string {
let dirPath = directory.split('/');
if (dirPath.length > 1) {
return dirPath.pop();
} else {
return dirPath[0];
}
}
/**
* Show undo notification bar.
*
@@ -267,43 +188,6 @@ export class UploadButtonComponent implements OnInit, OnChanges {
});
}
/**
* Retrive the error message using the error status code
* @param response - object that contain the HTTP response
* @returns {string}
*/
private getErrorMessage(response: any): string {
if (response && response.body && response.body.error.statusCode === ERROR_FOLDER_ALREADY_EXIST) {
let errorMessage: any;
errorMessage = this.translateService.get('FILE_UPLOAD.MESSAGES.FOLDER_ALREADY_EXIST');
return errorMessage.value;
}
return 'Error';
}
/**
* Show the error inside Notification bar
* @param Error message
* @private
*/
private showErrorNotificationBar(errorMessage: string): void {
this.notificationService.openSnackMessage(errorMessage, 3000);
}
/**
* Replace a placeholder {0} in a message with the input keys
* @param message - the message that conains the placeholder
* @param keys - array of value
* @returns {string} - The message without placeholder
*/
private formatString(message: string, keys: any []): string {
let i = keys.length;
while (i--) {
message = message.replace(new RegExp('\\{' + i + '\\}', 'gm'), keys[i]);
}
return message;
}
checkPermission() {
if (this.rootFolderId) {
this.getFolderNode(this.rootFolderId).subscribe(
@@ -313,6 +197,7 @@ export class UploadButtonComponent implements OnInit, OnChanges {
}
}
// TODO: move to AlfrescoContentService
getFolderNode(nodeId: string): Observable<MinimalNodeEntryEntity> {
let opts: any = {
includeSource: true,
@@ -331,13 +216,9 @@ export class UploadButtonComponent implements OnInit, OnChanges {
}
private hasCreatePermission(node: any): boolean {
if (this.hasPermissions(node)) {
if (node && node.allowableOperations) {
return node.allowableOperations.find(permision => permision === 'create') ? true : false;
}
return false;
}
private hasPermissions(node: any): boolean {
return node && node.allowableOperations ? true : false;
}
}

23
ng2-components/ng2-alfresco-upload/src/components/upload-drag-area.component.spec.ts
View File

@@ -67,21 +67,22 @@ describe('UploadDragAreaComponent', () => {
TestBed.resetTestingModule();
});
it('should upload the list of files dropped', () => {
it('should upload the list of files dropped', (done) => {
component.currentFolderPath = '/root-fake-/sites-fake/folder-fake';
component.onSuccess = null;
component.showNotificationBar = false;
uploadService.addToQueue = jasmine.createSpy('addToQueue');
uploadService.uploadFilesInTheQueue = jasmine.createSpy('uploadFilesInTheQueue');
fixture.detectChanges();
const file = <File> {name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json'};
let fileFake = new FileModel(file);
let filesList = [fileFake];
let filesList = [file];
spyOn(uploadService, 'addToQueue').and.callFake((f: FileModel) => {
expect(f.file).toBe(file);
done();
});
component.onFilesDropped(filesList);
expect(uploadService.addToQueue).toHaveBeenCalledWith(fileFake);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith('-root-', '/root-fake-/sites-fake/folder-fake', null);
});
it('should show the loading messages in the notification bar when the files are dropped', () => {
@@ -92,11 +93,11 @@ describe('UploadDragAreaComponent', () => {
component.showUndoNotificationBar = jasmine.createSpy('_showUndoNotificationBar');
fixture.detectChanges();
let fileFake = new FileModel(<File> {name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json'});
let fileFake = <File> {name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json'};
let filesList = [fileFake];
component.onFilesDropped(filesList);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith('-root-', '/root-fake-/sites-fake/folder-fake', null);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith(null);
expect(component.showUndoNotificationBar).toHaveBeenCalled();
});
@@ -119,8 +120,7 @@ describe('UploadDragAreaComponent', () => {
};
component.onFilesEntityDropped(itemEntity);
expect(uploadService.uploadFilesInTheQueue)
.toHaveBeenCalledWith('-root-', '/root-fake-/sites-fake/document-library-fake/folder-fake/', null);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith(null);
});
it('should upload a file with a custom root folder ID when dropped', () => {
@@ -143,7 +143,6 @@ describe('UploadDragAreaComponent', () => {
};
component.onFilesEntityDropped(itemEntity);
expect(uploadService.uploadFilesInTheQueue)
.toHaveBeenCalledWith('-my-', '/root-fake-/sites-fake/document-library-fake/folder-fake/', null);
expect(uploadService.uploadFilesInTheQueue).toHaveBeenCalledWith(null);
});
});

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

@@ -16,12 +16,10 @@
*/
import { Component, Input, Output, EventEmitter } from '@angular/core';
import { AlfrescoTranslationService, AlfrescoContentService, LogService, NotificationService } from 'ng2-alfresco-core';
import { AlfrescoTranslationService, NotificationService, FileUtils, FileInfo } from 'ng2-alfresco-core';
import { UploadService } from '../services/upload.service';
import { FileModel } from '../models/file.model';
const ERROR_FOLDER_ALREADY_EXIST = 409;
@Component({
selector: 'alfresco-upload-drag-area',
templateUrl: './upload-drag-area.component.html',
@@ -29,31 +27,39 @@ const ERROR_FOLDER_ALREADY_EXIST = 409;
})
export class UploadDragAreaComponent {
private static DEFAULT_ROOT_ID: string = '-root-';
@Input()
enabled: boolean = true;
/**
* @deprecated Deprecated in 1.6.0, you can use UploadService events and NotificationService api instead.
*
* @type {boolean}
* @memberof UploadButtonComponent
*/
@Input()
showNotificationBar: boolean = true;
@Input()
versioning: boolean = false;
/**
* @deprecated Deprecated in 1.6.0, this property is not used for couple of releases already. Use rootFolderId instead.
*
* @type {string}
* @memberof UploadDragAreaComponent
*/
@Input()
currentFolderPath: string = '/';
@Input()
rootFolderId: string = UploadDragAreaComponent.DEFAULT_ROOT_ID;
rootFolderId: string = '-root-';
@Output()
onSuccess = new EventEmitter();
constructor(private uploadService: UploadService,
private translateService: AlfrescoTranslationService,
private logService: LogService,
private notificationService: NotificationService,
private contentService: AlfrescoContentService) {
private notificationService: NotificationService) {
if (translateService) {
translateService.addTranslationFolder('ng2-alfresco-upload', 'assets/ng2-alfresco-upload');
}
@@ -67,15 +73,18 @@ export class UploadDragAreaComponent {
e.stopPropagation();
e.preventDefault();
if (this.enabled) {
let files: File[] = e.detail.files;
let files: FileInfo[] = e.detail.files;
if (files && files.length > 0) {
const fileModels = files.map(f => new FileModel(f, { newVersion: this.versioning }));
if (e.detail.data.obj.entry.isFolder) {
let id = e.detail.data.obj.entry.id;
this.onFilesDropped(fileModels, id, '/');
} else {
this.onFilesDropped(fileModels);
let parentId = this.rootFolderId;
if (e.detail.data && e.detail.data.obj.entry.isFolder) {
parentId = e.detail.data.obj.entry.id || this.rootFolderId;
}
const fileModels = files.map(fileInfo => new FileModel(fileInfo.file, {
newVersion: this.versioning,
path: fileInfo.relativeFolder,
parentId: parentId
}));
this.uploadFiles(fileModels);
}
}
}
@@ -85,10 +94,15 @@ export class UploadDragAreaComponent {
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesDropped(files: FileModel[], rootId?: string, directory?: string): void {
onFilesDropped(files: File[]): void {
if (this.enabled && files.length) {
this.uploadService.addToQueue(...files);
this.uploadService.uploadFilesInTheQueue(rootId || this.rootFolderId, directory || this.currentFolderPath, this.onSuccess);
const fileModels = files.map(file => new FileModel(file, {
newVersion: this.versioning,
path: '/',
parentId: this.rootFolderId
}));
this.uploadService.addToQueue(...fileModels);
this.uploadService.uploadFilesInTheQueue(this.onSuccess);
let latestFilesAdded = this.uploadService.getQueue();
if (this.showNotificationBar) {
this.showUndoNotificationBar(latestFilesAdded);
@@ -103,11 +117,13 @@ export class UploadDragAreaComponent {
onFilesEntityDropped(item: any): void {
if (this.enabled) {
item.file((file: File) => {
const fileModel = new FileModel(file, { newVersion: this.versioning });
const fileModel = new FileModel(file, {
newVersion: this.versioning,
parentId: this.rootFolderId,
path: item.fullPath.replace(item.name, '')
});
this.uploadService.addToQueue(fileModel);
let path = item.fullPath.replace(item.name, '');
let filePath = this.currentFolderPath + path;
this.uploadService.uploadFilesInTheQueue(this.rootFolderId, filePath, this.onSuccess);
this.uploadService.uploadFilesInTheQueue(this.onSuccess);
});
}
}
@@ -118,52 +134,22 @@ export class UploadDragAreaComponent {
*/
onFolderEntityDropped(folder: any): void {
if (this.enabled && folder.isDirectory) {
let relativePath = folder.fullPath.replace(folder.name, '');
relativePath = this.currentFolderPath + relativePath;
this.contentService.createFolder(relativePath, folder.name, this.rootFolderId)
.subscribe(
message => {
this.onSuccess.emit({
value: 'Created folder'
});
let dirReader = folder.createReader();
dirReader.readEntries((entries: any) => {
for (let i = 0; i < entries.length; i++) {
this._traverseFileTree(entries[i]);
}
if (this.showNotificationBar) {
let latestFilesAdded = this.uploadService.getQueue();
this.showUndoNotificationBar(latestFilesAdded);
}
});
},
error => {
let errorMessagePlaceholder = this.getErrorMessage(error.response);
let errorMessage = this.formatString(errorMessagePlaceholder, [folder.name]);
if (this.showNotificationBar) {
this.showErrorNotificationBar(errorMessage);
} else {
this.logService.error(errorMessage);
}
}
);
}
}
/**
* Travers all the files and folders, and create it on the alfresco.
*
* @param {Object} item - can contains files or folders.
*/
private _traverseFileTree(item: any): void {
if (item.isFile) {
this.onFilesEntityDropped(item);
} else {
if (item.isDirectory) {
this.onFolderEntityDropped(item);
}
FileUtils.flattern(folder).then(entries => {
let files = entries.map(entry => {
return new FileModel(entry.file, {
newVersion: this.versioning,
parentId: this.rootFolderId,
path: entry.relativeFolder
});
});
this.uploadService.addToQueue(...files);
/* @deprecated in 1.6.0 */
if (this.showNotificationBar) {
let latestFilesAdded = this.uploadService.getQueue();
this.showUndoNotificationBar(latestFilesAdded);
}
this.uploadService.uploadFilesInTheQueue(this.onSuccess);
});
}
}
@@ -182,41 +168,14 @@ export class UploadDragAreaComponent {
});
}
/**
* Show the error inside Notification bar
* @param Error message
* @private
*/
showErrorNotificationBar(errorMessage: string) {
this.notificationService.openSnackMessage(errorMessage, 3000);
}
/**
* Retrive the error message using the error status code
* @param response - object that contain the HTTP response
* @returns {string}
*/
private getErrorMessage(response: any): string {
if (response.body.error.statusCode === ERROR_FOLDER_ALREADY_EXIST) {
let errorMessage: any;
errorMessage = this.translateService.get('FILE_UPLOAD.MESSAGES.FOLDER_ALREADY_EXIST');
return errorMessage.value;
}
}
/**
* Replace a placeholder {0} in a message with the input keys
* @param message - the message that conains the placeholder
* @param keys - array of value
* @returns {string} - The message without placeholder
*/
private formatString(message: string, keys: any []) {
if (message) {
let i = keys.length;
while (i--) {
message = message.replace(new RegExp('\\{' + i + '\\}', 'gm'), keys[i]);
private uploadFiles(files: FileModel[]): void {
if (this.enabled && files.length) {
this.uploadService.addToQueue(...files);
this.uploadService.uploadFilesInTheQueue(this.onSuccess);
let latestFilesAdded = this.uploadService.getQueue();
if (this.showNotificationBar) {
this.showUndoNotificationBar(latestFilesAdded);
}
}
return message;
}
}

29
ng2-components/ng2-alfresco-upload/src/directives/file-draggable.directive.ts
View File

@@ -16,6 +16,7 @@
*/
import { Directive, EventEmitter, Input, Output, OnInit, OnDestroy, ElementRef, NgZone } from '@angular/core';
import { FileUtils } from 'ng2-alfresco-core';
@Directive({
selector: '[file-draggable]'
@@ -28,7 +29,7 @@ export class FileDraggableDirective implements OnInit, OnDestroy {
enabled: boolean = true;
@Output()
onFilesDropped: EventEmitter<any> = new EventEmitter();
onFilesDropped: EventEmitter<File[]> = new EventEmitter<File[]>();
@Output()
onFilesEntityDropped: EventEmitter<any> = new EventEmitter();
@@ -73,16 +74,20 @@ export class FileDraggableDirective implements OnInit, OnDestroy {
if (typeof items[i].webkitGetAsEntry !== 'undefined') {
let item = items[i].webkitGetAsEntry();
if (item) {
this.traverseFileTree(item);
if (item.isFile) {
this.onFilesEntityDropped.emit(item);
} else if (item.isDirectory) {
this.onFolderEntityDropped.emit(item);
}
}
} else {
let files = event.dataTransfer.files;
let files = FileUtils.toFileArray(event.dataTransfer.files);
this.onFilesDropped.emit(files);
}
}
} else {
// safari or FF
let files = event.dataTransfer.files;
let files = FileUtils.toFileArray(event.dataTransfer.files);
this.onFilesDropped.emit(files);
}
@@ -90,22 +95,6 @@ export class FileDraggableDirective implements OnInit, OnDestroy {
}
}
/**
* Travers all the files and folders, and emit an event for each file or directory.
*
* @param {Object} item - can contains files or folders.
*/
private traverseFileTree(item: any): void {
if (item.isFile) {
let self = this;
self.onFilesEntityDropped.emit(item);
} else {
if (item.isDirectory) {
this.onFolderEntityDropped.emit(item);
}
}
}
/**
* Change the style of the drag area when a file drag in.
*

2
ng2-components/ng2-alfresco-upload/src/models/file.model.ts
View File

@@ -23,6 +23,8 @@ export interface FileUploadProgress {
export interface FileUploadOptions {
newVersion?: boolean;
parentId?: string;
path?: string;
}
export enum FileUploadStatus {

27
ng2-components/ng2-alfresco-upload/src/services/upload.service.spec.ts
View File

@@ -19,7 +19,7 @@ import { EventEmitter } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { CoreModule } from 'ng2-alfresco-core';
import { UploadService } from './upload.service';
import { FileModel } from '../models/file.model';
import { FileModel, FileUploadOptions } from '../models/file.model';
declare let jasmine: any;
@@ -77,9 +77,12 @@ describe('UploadService', () => {
expect(e.value).toBe('File uploaded');
done();
});
let fileFake = new FileModel(<File>{name: 'fake-name', size: 10});
let fileFake = new FileModel(
<File>{name: 'fake-name', size: 10},
<FileUploadOptions> { parentId: '-root-', path: 'fake-dir' }
);
service.addToQueue(fileFake);
service.uploadFilesInTheQueue('-root-', 'fake-dir', emitter);
service.uploadFilesInTheQueue(emitter);
let request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe('http://localhost:8080/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true');
@@ -99,9 +102,12 @@ describe('UploadService', () => {
expect(e.value).toBe('Error file uploaded');
done();
});
let fileFake = new FileModel(<File>{name: 'fake-name', size: 10});
let fileFake = new FileModel(
<File>{name: 'fake-name', size: 10},
<FileUploadOptions> { parentId: '-root-' }
);
service.addToQueue(fileFake);
service.uploadFilesInTheQueue('-root-', '', emitter);
service.uploadFilesInTheQueue(emitter);
expect(jasmine.Ajax.requests.mostRecent().url)
.toBe('http://localhost:8080/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true');
@@ -121,7 +127,7 @@ describe('UploadService', () => {
});
let fileFake = new FileModel(<File>{name: 'fake-name', size: 10});
service.addToQueue(fileFake);
service.uploadFilesInTheQueue('-root-', '', emitter);
service.uploadFilesInTheQueue(emitter);
let file = service.getQueue();
service.cancelUpload(...file);
@@ -132,7 +138,7 @@ describe('UploadService', () => {
const filesFake = new FileModel(<File>{name: 'fake-name', size: 10}, { newVersion: true });
service.addToQueue(filesFake);
service.uploadFilesInTheQueue('-root-', '', emitter);
service.uploadFilesInTheQueue(emitter);
expect(jasmine.Ajax.requests.mostRecent().url.endsWith('autoRename=true')).toBe(false);
expect(jasmine.Ajax.requests.mostRecent().params.has('majorVersion')).toBe(true);
@@ -145,9 +151,12 @@ describe('UploadService', () => {
expect(e.value).toBe('File uploaded');
done();
});
let filesFake = new FileModel(<File>{name: 'fake-name', size: 10});
let filesFake = new FileModel(
<File>{name: 'fake-name', size: 10},
<FileUploadOptions> { parentId: '123', path: 'fake-dir' }
);
service.addToQueue(filesFake);
service.uploadFilesInTheQueue('123', 'fake-dir', emitter);
service.uploadFilesInTheQueue(emitter);
let request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe('http://localhost:8080/alfresco/api/-default-/public/alfresco/versions/1/nodes/123/children?autoRename=true');

126
ng2-components/ng2-alfresco-upload/src/services/upload.service.ts
View File

@@ -17,7 +17,7 @@
import { EventEmitter, Injectable } from '@angular/core';
import { Subject } from 'rxjs/Rx';
import { AlfrescoApiService, LogService } from 'ng2-alfresco-core';
import { AlfrescoApiService } from 'ng2-alfresco-core';
import { FileUploadEvent, FileUploadCompleteEvent } from '../events/file.event';
import { FileModel, FileUploadProgress, FileUploadStatus } from '../models/file.model';
@@ -27,6 +27,7 @@ export class UploadService {
private queue: FileModel[] = [];
private cache: { [key: string]: any } = {};
private totalComplete: number = 0;
private activeTask: Promise<any> = null;
queueChanged: Subject<FileModel[]> = new Subject<FileModel[]>();
fileUpload: Subject<FileUploadEvent> = new Subject<FileUploadEvent>();
@@ -37,8 +38,18 @@ export class UploadService {
fileUploadError: Subject<FileUploadEvent> = new Subject<FileUploadEvent>();
fileUploadComplete: Subject<FileUploadCompleteEvent> = new Subject<FileUploadCompleteEvent>();
constructor(private apiService: AlfrescoApiService,
private logService: LogService) {
constructor(private apiService: AlfrescoApiService) {
}
/**
* Checks whether the service is uploading a file.
*
* @returns {boolean}
*
* @memberof UploadService
*/
isUploading(): boolean {
return this.activeTask ? true : false;
}
/**
@@ -67,52 +78,32 @@ export class UploadService {
/**
* Pick all the files in the queue that are not been uploaded yet and upload it into the directory folder.
*
* @param {EventEmitter<any>} emitter @deprecated emitter to invoke on file status change
*
* @memberof UploadService
*/
uploadFilesInTheQueue(rootId: string, directory: string, elementEmit: EventEmitter<any>): void {
const files = this.getFilesToUpload();
uploadFilesInTheQueue(emitter: EventEmitter<any>): void {
if (!this.activeTask) {
let file = this.queue.find(f => f.status === FileUploadStatus.Pending);
if (file) {
this.onUploadStarting(file);
files.forEach((file: FileModel) => {
this.onUploadStarting(file);
const promise = this.beginUpload(file, emitter);
this.activeTask = promise;
this.cache[file.id] = promise;
const opts: any = {
renditions: 'doclib'
};
let next = () => {
this.activeTask = null;
setTimeout(() => this.uploadFilesInTheQueue(emitter), 100);
};
if (file.options.newVersion === true) {
opts.overwrite = true;
opts.majorVersion = true;
} else {
opts.autoRename = true;
promise.then(
() => next(),
() => next()
);
}
const promise = this.apiService.getInstance().upload.uploadFile(file.file, directory, rootId, null, opts);
promise.on('progress', (progress: FileUploadProgress) => {
this.onUploadProgress(file, progress);
})
.on('abort', () => {
this.onUploadAborted(file);
elementEmit.emit({
value: 'File aborted'
});
})
.on('error', err => {
this.onUploadError(file, err);
elementEmit.emit({
value: 'Error file uploaded'
});
})
.on('success', data => {
this.onUploadComplete(file);
elementEmit.emit({
value: data
});
})
.catch((err) => {
this.onUploadError(file, err);
});
this.cache[file.id] = promise;
});
}
}
cancelUpload(...files: FileModel[]) {
@@ -131,6 +122,46 @@ export class UploadService {
});
}
private beginUpload(file: FileModel, /* @deprecated */emitter: EventEmitter<any>): any {
let opts: any = {
renditions: 'doclib'
};
if (file.options.newVersion === true) {
opts.overwrite = true;
opts.majorVersion = true;
} else {
opts.autoRename = true;
}
let promise = this.apiService.getInstance().upload.uploadFile(
file.file,
file.options.path,
file.options.parentId,
null,
opts
);
promise.on('progress', (progress: FileUploadProgress) => {
this.onUploadProgress(file, progress);
})
.on('abort', () => {
this.onUploadAborted(file);
emitter.emit({ value: 'File aborted' });
})
.on('error', err => {
this.onUploadError(file, err);
emitter.emit({ value: 'Error file uploaded' });
})
.on('success', data => {
this.onUploadComplete(file);
emitter.emit({ value: data });
})
.catch(err => {
this.onUploadError(file, err);
});
return promise;
}
private onUploadStarting(file: FileModel): void {
if (file) {
file.status = FileUploadStatus.Starting;
@@ -200,11 +231,4 @@ export class UploadService {
this.fileUploadAborted.next(event);
}
}
private getFilesToUpload(): FileModel[] {
let filesToUpload = this.queue.filter(file => {
return file.status === FileUploadStatus.Pending;
});
return filesToUpload;
}
}