#46 upload jsdoc and clean code

This commit is contained in:
Mario Romano
2016-05-06 12:48:53 +01:00
parent 54b1707b30
commit 1a7248b1e9
40 changed files with 803 additions and 317 deletions

View File

@@ -15,17 +15,30 @@
* limitations under the License.
*/
import { UploadDragAreaComponent } from './src/components/upload-drag-area.component';
import { FileSelectDirective } from './src/directives/file-select.directive';
import { FileDraggableDirective } from './src/directives/file-draggable.directive';
import { UploadButtonComponent } from './src/components/upload-button.component';
/**
* ng2-alfresco-upload, provide components to upload files to alfresco repository.
*
* Components provided:
* - A set of buttons to upload files:
* <alfresco-upload-button [showDialogUpload]="boolean"
* [showUdoNotificationBar]="boolean"
* [uploadFolders]="boolean"
* [multipleFiles]="boolean"
* [acceptedFilesType]="string">
* </alfresco-upload-button>
*
* - Drag and drop area to upload files:
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
*/
export * from './src/components/upload-button.component';
export * from './src/components/upload-drag-area.component';
export * from './src/services/upload.service';
export * from './src/directives/file-select.directive';
export * from './src/directives/file-draggable.directive';
declare var _default: {
component: (typeof UploadDragAreaComponent | typeof UploadButtonComponent)[];
directives: (typeof FileSelectDirective | typeof FileDraggableDirective)[];
directives: typeof FileDraggableDirective[];
};
export default _default;
export declare const ALFRESCO_ULPOAD_COMPONENT: [any];

View File

@@ -14,10 +14,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
System.register(['./src/components/upload-drag-area.component', './src/directives/file-select.directive', './src/directives/file-draggable.directive', './src/components/upload-button.component', './src/services/upload.service'], function(exports_1, context_1) {
System.register(['./src/components/upload-drag-area.component', './src/directives/file-draggable.directive', './src/components/upload-button.component', './src/services/upload.service'], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var upload_drag_area_component_1, file_select_directive_1, file_draggable_directive_1, upload_button_component_1;
var upload_drag_area_component_1, file_draggable_directive_1, upload_button_component_1;
var ALFRESCO_ULPOAD_COMPONENT;
var exportedNames_1 = {
'ALFRESCO_ULPOAD_COMPONENT': true
@@ -35,10 +35,6 @@ System.register(['./src/components/upload-drag-area.component', './src/directive
upload_drag_area_component_1 = upload_drag_area_component_1_1;
exportStar_1(upload_drag_area_component_1_1);
},
function (file_select_directive_1_1) {
file_select_directive_1 = file_select_directive_1_1;
exportStar_1(file_select_directive_1_1);
},
function (file_draggable_directive_1_1) {
file_draggable_directive_1 = file_draggable_directive_1_1;
exportStar_1(file_draggable_directive_1_1);
@@ -53,12 +49,11 @@ System.register(['./src/components/upload-drag-area.component', './src/directive
execute: function() {
exports_1("default",{
component: [upload_drag_area_component_1.UploadDragAreaComponent, upload_button_component_1.UploadButtonComponent],
directives: [file_select_directive_1.FileSelectDirective, file_draggable_directive_1.FileDraggableDirective]
directives: [file_draggable_directive_1.FileDraggableDirective]
});
exports_1("ALFRESCO_ULPOAD_COMPONENT", ALFRESCO_ULPOAD_COMPONENT = [
upload_drag_area_component_1.UploadDragAreaComponent,
upload_button_component_1.UploadButtonComponent,
file_select_directive_1.FileSelectDirective,
file_draggable_directive_1.FileDraggableDirective
]);
}

View File

@@ -1 +1 @@
{"version":3,"file":"ng2-alfresco-upload.js","sourceRoot":"","sources":["ng2-alfresco-upload.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;QAkBU,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YALtC,oBAAe;gBACX,SAAS,EAAE,CAAC,oDAAuB,EAAE,+CAAqB,CAAC;gBAC3D,UAAU,EAAE,CAAC,2CAAmB,EAAE,iDAAsB,CAAC;aAC5D,EAAA;YAEY,uCAAA,yBAAyB,GAAU;gBAC5C,oDAAuB;gBACvB,+CAAqB;gBACrB,2CAAmB;gBACnB,iDAAsB;aACzB,CAAA,CAAC"}
{"version":3,"file":"ng2-alfresco-upload.js","sourceRoot":"","sources":["ng2-alfresco-upload.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;QAgCU,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YALtC,oBAAe;gBACX,SAAS,EAAE,CAAC,oDAAuB,EAAE,+CAAqB,CAAC;gBAC3D,UAAU,EAAE,CAAC,iDAAsB,CAAC;aACvC,EAAA;YAEY,uCAAA,yBAAyB,GAAU;gBAC5C,oDAAuB;gBACvB,+CAAqB;gBACrB,iDAAsB;aACzB,CAAA,CAAC"}

View File

@@ -16,24 +16,37 @@
*/
import {UploadDragAreaComponent} from './src/components/upload-drag-area.component';
import {FileSelectDirective} from './src/directives/file-select.directive';
import {FileDraggableDirective} from './src/directives/file-draggable.directive';
import {UploadButtonComponent} from './src/components/upload-button.component';
/**
* ng2-alfresco-upload, provide components to upload files to alfresco repository.
*
* Components provided:
* - A set of buttons to upload files:
* <alfresco-upload-button [showDialogUpload]="boolean"
* [showUdoNotificationBar]="boolean"
* [uploadFolders]="boolean"
* [multipleFiles]="boolean"
* [acceptedFilesType]="string">
* </alfresco-upload-button>
*
* - Drag and drop area to upload files:
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
*/
export * from './src/components/upload-button.component';
export * from './src/components/upload-drag-area.component';
export * from './src/services/upload.service';
export * from './src/directives/file-select.directive';
export * from './src/directives/file-draggable.directive';
export default {
component: [UploadDragAreaComponent, UploadButtonComponent],
directives: [FileSelectDirective, FileDraggableDirective]
directives: [FileDraggableDirective]
}
export const ALFRESCO_ULPOAD_COMPONENT: [any] = [
UploadDragAreaComponent,
UploadButtonComponent,
FileSelectDirective,
FileDraggableDirective
];

View File

@@ -16,13 +16,33 @@
*/
import { ElementRef } from 'angular2/core';
import { FileModel } from '../models/file.model';
/**
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
*
* This component is a hideable and minimizable wich contains the list of the uploading
* files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingDialogComponent} .
*/
export declare class FileUploadingDialogComponent {
el: ElementRef;
filesUploadingList: FileModel[];
_isDialogActive: boolean;
_isDialogMinimized: boolean;
private _isDialogActive;
private _isDialogMinimized;
constructor(el: ElementRef);
toggleDialog($event: any): void;
/**
* Display and hide the dialog component.
*/
toggleShowDialog($event: any): void;
/**
* Display the dialog if hidden.
*/
showDialog(): void;
/**
* Minimize and expand the dialog component.
*/
toggleDialogMinimize($event: any): void;
}

View File

@@ -9,7 +9,7 @@
<i class="material-icons up">keyboard_arrow_up</i>
</div>
<div class="close-button" (click)="toggleDialog($event)">
<div class="close-button" (click)="toggleShowDialog($event)">
<i class="material-icons">clear</i>
</div>
</div>

View File

@@ -37,6 +37,17 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
file_uploading_list_component_1 = file_uploading_list_component_1_1;
}],
execute: function() {
/**
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
*
* This component is a hideable and minimizable wich contains the list of the uploading
* files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingDialogComponent} .
*/
FileUploadingDialogComponent = (function () {
function FileUploadingDialogComponent(el) {
this.el = el;
@@ -44,12 +55,21 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
this._isDialogMinimized = false;
console.log('FileUploadingDialogComponent constructor', el);
}
FileUploadingDialogComponent.prototype.toggleDialog = function ($event) {
/**
* Display and hide the dialog component.
*/
FileUploadingDialogComponent.prototype.toggleShowDialog = function ($event) {
this._isDialogActive = !this._isDialogActive;
};
/**
* Display the dialog if hidden.
*/
FileUploadingDialogComponent.prototype.showDialog = function () {
this._isDialogActive = true;
};
/**
* Minimize and expand the dialog component.
*/
FileUploadingDialogComponent.prototype.toggleDialogMinimize = function ($event) {
this._isDialogMinimized = !this._isDialogMinimized;
};
@@ -64,7 +84,7 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
directives: [file_uploading_list_component_1.FileUploadingListComponent],
templateUrl: './file-uploading-dialog.component.html',
styleUrls: ['./file-uploading-dialog.component.css'],
host: { '[class.dialog-show]': 'toggleDialog' }
host: { '[class.dialog-show]': 'toggleShowDialog' }
}),
__metadata('design:paramtypes', [core_1.ElementRef])
], FileUploadingDialogComponent);

View File

@@ -1 +1 @@
{"version":3,"file":"file-uploading-dialog.component.js","sourceRoot":"","sources":["file-uploading-dialog.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;YAiBH;gBASI,sCAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAJhC,oBAAe,GAAW,KAAK,CAAC;oBAEhC,uBAAkB,GAAW,KAAK,CAAC;oBAG/B,OAAO,CAAC,GAAG,CAAC,0CAA0C,EAAE,EAAE,CAAC,CAAC;gBAChE,CAAC;gBAED,mDAAY,GAAZ,UAAa,MAAM;oBACf,IAAI,CAAC,eAAe,GAAG,CAAC,IAAI,CAAC,eAAe,CAAC;gBACjD,CAAC;gBAED,iDAAU,GAAV;oBACI,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;gBAChC,CAAC;gBAED,2DAAoB,GAApB,UAAqB,MAAM;oBACvB,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC;gBACvD,CAAC;gBArBD;oBAAC,YAAK,EAAE;;wFAAA;gBAVZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,uBAAuB;wBACjC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,0DAA0B,CAAC;wBACxC,WAAW,EAAE,wCAAwC;wBACrD,SAAS,EAAE,CAAC,uCAAuC,CAAC;wBACpD,IAAI,EAAE,EAAC,qBAAqB,EAAE,cAAc,EAAC;qBAChD,CAAC;;gDAAA;gBAyBF,mCAAC;YAAD,CAAC,AAxBD,IAwBC;YAxBD,uEAwBC,CAAA"}
{"version":3,"file":"file-uploading-dialog.component.js","sourceRoot":"","sources":["file-uploading-dialog.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;YASH;;;;;;;;;;eAUG;YASH;gBASI,sCAAmB,EAAc;oBAAd,OAAE,GAAF,EAAE,CAAY;oBAJzB,oBAAe,GAAY,KAAK,CAAC;oBAEjC,uBAAkB,GAAY,KAAK,CAAC;oBAGxC,OAAO,CAAC,GAAG,CAAC,0CAA0C,EAAE,EAAE,CAAC,CAAC;gBAChE,CAAC;gBAED;;mBAEG;gBACH,uDAAgB,GAAhB,UAAiB,MAAM;oBACnB,IAAI,CAAC,eAAe,GAAG,CAAC,IAAI,CAAC,eAAe,CAAC;gBACjD,CAAC;gBAED;;mBAEG;gBACH,iDAAU,GAAV;oBACI,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;gBAChC,CAAC;gBAED;;mBAEG;gBACH,2DAAoB,GAApB,UAAqB,MAAM;oBACvB,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC;gBACvD,CAAC;gBA9BD;oBAAC,YAAK,EAAE;;wFAAA;gBAVZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,uBAAuB;wBACjC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,0DAA0B,CAAC;wBACxC,WAAW,EAAE,wCAAwC;wBACrD,SAAS,EAAE,CAAC,uCAAuC,CAAC;wBACpD,IAAI,EAAE,EAAC,qBAAqB,EAAE,kBAAkB,EAAC;qBACpD,CAAC;;gDAAA;gBAkCF,mCAAC;YAAD,CAAC,AAjCD,IAiCC;YAjCD,uEAiCC,CAAA"}

View File

@@ -20,37 +20,57 @@ import {Component, ElementRef, Input} from 'angular2/core';
import {FileModel} from '../models/file.model';
import {FileUploadingListComponent} from './file-uploading-list.component';
declare let __moduleName:string;
declare let __moduleName: string;
/**
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
*
* This component is a hideable and minimizable wich contains the list of the uploading
* files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingDialogComponent} .
*/
@Component({
selector: 'file-uploading-dialog',
moduleId: __moduleName,
directives: [FileUploadingListComponent],
templateUrl: './file-uploading-dialog.component.html',
styleUrls: ['./file-uploading-dialog.component.css'],
host: {'[class.dialog-show]': 'toggleDialog'}
host: {'[class.dialog-show]': 'toggleShowDialog'}
})
export class FileUploadingDialogComponent {
@Input()
filesUploadingList:FileModel [];
filesUploadingList: FileModel [];
_isDialogActive:boolean = false;
private _isDialogActive: boolean = false;
_isDialogMinimized:boolean = false;
private _isDialogMinimized: boolean = false;
constructor(public el:ElementRef) {
constructor(public el: ElementRef) {
console.log('FileUploadingDialogComponent constructor', el);
}
toggleDialog($event) {
/**
* Display and hide the dialog component.
*/
toggleShowDialog($event) {
this._isDialogActive = !this._isDialogActive;
}
/**
* Display the dialog if hidden.
*/
showDialog() {
this._isDialogActive = true;
}
/**
* Minimize and expand the dialog component.
*/
toggleDialogMinimize($event) {
this._isDialogMinimized = !this._isDialogMinimized;
}

View File

@@ -16,9 +16,24 @@
*/
import { ElementRef } from 'angular2/core';
import { FileModel } from '../models/file.model';
/**
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
*
* This component show a list of the uploading files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingListComponent} .
*/
export declare class FileUploadingListComponent {
el: ElementRef;
filesUploadingList: FileModel[];
constructor(el: ElementRef);
/**
* Abort the in progress uploading of a specific file.
*
* @param {string} id - FileModel id of the file to abort.
*/
abort(id: any): void;
}

View File

@@ -34,6 +34,16 @@ System.register(['angular2/core'], function(exports_1, context_1) {
core_1 = core_1_1;
}],
execute: function() {
/**
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
*
* This component show a list of the uploading files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingListComponent} .
*/
FileUploadingListComponent = (function () {
function FileUploadingListComponent(el) {
this.el = el;
@@ -42,6 +52,11 @@ System.register(['angular2/core'], function(exports_1, context_1) {
console.log('Check for async update from drag directive');
}, 1000);
}
/**
* Abort the in progress uploading of a specific file.
*
* @param {string} id - FileModel id of the file to abort.
*/
FileUploadingListComponent.prototype.abort = function (id) {
var file = this.filesUploadingList.filter(function (uploadingFileModel) {
return uploadingFileModel.id == id;

View File

@@ -1 +1 @@
{"version":3,"file":"file-uploading-list.component.js","sourceRoot":"","sources":["file-uploading-list.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;YAcH;gBAKI,oCAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAC5B,OAAO,CAAC,GAAG,CAAC,gCAAgC,EAAE,EAAE,CAAC,CAAC;oBAElD,WAAW,CAAC;wBACR,OAAO,CAAC,GAAG,CAAC,4CAA4C,CAAC,CAAC;oBAC9D,CAAC,EAAE,IAAI,CAAC,CAAC;gBACb,CAAC;gBAED,0CAAK,GAAL,UAAM,EAAE;oBACJ,IAAI,IAAI,GAAG,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,UAAC,kBAAkB;wBACzD,MAAM,CAAC,kBAAkB,CAAC,EAAE,IAAI,EAAE,CAAC;oBACvC,CAAC,CAAC,CAAC;oBACH,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACvB,CAAC;gBAhBD;oBAAC,YAAK,EAAE;;sFAAA;gBARZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,8BAA8B;wBACxC,QAAQ,EAAE,YAAY;wBACtB,WAAW,EAAE,sCAAsC;wBACnD,SAAS,EAAE,CAAC,qCAAqC,CAAC;qBACrD,CAAC;;8CAAA;gBAoBF,iCAAC;YAAD,CAAC,AAnBD,IAmBC;YAnBD,mEAmBC,CAAA"}
{"version":3,"file":"file-uploading-list.component.js","sourceRoot":"","sources":["file-uploading-list.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;YAQH;;;;;;;;;eASG;YAOH;gBAKI,oCAAmB,EAAc;oBAAd,OAAE,GAAF,EAAE,CAAY;oBAC7B,OAAO,CAAC,GAAG,CAAC,gCAAgC,EAAE,EAAE,CAAC,CAAC;oBAElD,WAAW,CAAC;wBACR,OAAO,CAAC,GAAG,CAAC,4CAA4C,CAAC,CAAC;oBAC9D,CAAC,EAAE,IAAI,CAAC,CAAC;gBACb,CAAC;gBAED;;;;mBAIG;gBACH,0CAAK,GAAL,UAAM,EAAE;oBACJ,IAAI,IAAI,GAAG,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,UAAC,kBAAkB;wBACzD,MAAM,CAAC,kBAAkB,CAAC,EAAE,IAAI,EAAE,CAAC;oBACvC,CAAC,CAAC,CAAC;oBACH,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACvB,CAAC;gBArBD;oBAAC,YAAK,EAAE;;sFAAA;gBARZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,8BAA8B;wBACxC,QAAQ,EAAE,YAAY;wBACtB,WAAW,EAAE,sCAAsC;wBACnD,SAAS,EAAE,CAAC,qCAAqC,CAAC;qBACrD,CAAC;;8CAAA;gBAyBF,iCAAC;YAAD,CAAC,AAxBD,IAwBC;YAxBD,mEAwBC,CAAA"}

View File

@@ -19,8 +19,18 @@
import {Component, ElementRef, Input} from 'angular2/core';
import {FileModel} from '../models/file.model';
declare let __moduleName:string;
declare let __moduleName: string;
/**
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
*
* This component show a list of the uploading files contained in the filesUploadingList.
*
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
*
*
* @returns {FileUploadingListComponent} .
*/
@Component({
selector: 'alfresco-file-uploading-list',
moduleId: __moduleName,
@@ -30,9 +40,9 @@ declare let __moduleName:string;
export class FileUploadingListComponent {
@Input()
filesUploadingList:FileModel [];
filesUploadingList: FileModel [];
constructor(public el:ElementRef) {
constructor(public el: ElementRef) {
console.log('filesUploadingList constructor', el);
setInterval(() => {
@@ -40,7 +50,12 @@ export class FileUploadingListComponent {
}, 1000);
}
abort(id):void {
/**
* Abort the in progress uploading of a specific file.
*
* @param {string} id - FileModel id of the file to abort.
*/
abort(id): void {
let file = this.filesUploadingList.filter((uploadingFileModel) => {
return uploadingFileModel.id == id;
});

View File

@@ -17,14 +17,51 @@
import { ElementRef } from 'angular2/core';
import { FileModel } from '../models/file.model';
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
/**
* <alfresco-upload-button [showDialogUpload]="boolean"
* [showUdoNotificationBar]="boolean"
* [uploadFolders]="boolean"
* [multipleFiles]="boolean"
* [acceptedFilesType]="string">
* </alfresco-upload-button>
*
* This component, provide a set of buttons to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
*
*
* @returns {UploadDragAreaComponent} .
*/
export declare class UploadButtonComponent {
el: ElementRef;
private _uploaderService;
undoNotificationBar: any;
fileUploadingDialogComponent: FileUploadingDialogComponent;
showUploadDialog: boolean;
showUdoNotificationBar: boolean;
uploadFolders: boolean;
multipleFiles: boolean;
acceptedFilesType: string;
filesUploadingList: FileModel[];
constructor(el: ElementRef);
onFilesAdded(files: any): void;
showUndoNotificationBar(latestFilesAdded: any): void;
showDialog(): void;
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesAdded($event: any): void;
/**
* Show undo notification bar.
*
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
*/
private _showUndoNotificationBar(latestFilesAdded);
/**
* Show the upload dialog.
*/
private _showDialog();
}

View File

@@ -1,46 +1,45 @@
<br>
<!--upload buttons-->
<form>
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
<i class="material-icons">file_upload</i> Upload<input file-select type="file" name="uploadFiles" id="uploadFiles"
multiple="multiple"
accept=".jpg,.gif,.png,.svg,.mp4"
(onFilesAdded)="onFilesAdded($event)"
#uploadFiles>
<!--Files Upload-->
<div *ngIf="!uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
<i class="material-icons">file_upload</i> Upload File
<!--Multiple Files Upload-->
<span *ngIf="multipleFiles">
<input id="upload-multiple-files" type="file" name="uploadFiles"
(change)="onFilesAdded($event)"
multiple="multiple"
accept="{{acceptedFilesType}}"
#uploadFiles>
</span>
<!--Single Files Upload-->
<span *ngIf="!multipleFiles">
<input id="upload-single-file" type="file" name="uploadFiles"
(change)="onFilesAdded($event)"
accept="{{acceptedFilesType}}"
#uploadFiles>
</span>
</div>
<br><br>
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
<i class="material-icons">file_upload</i> Upload Folder<input file-select type="file" name="uploadFiles" id="uploadFolder"
multiple="multiple"
accept=".jpg,.gif,.png,.svg"
(onFilesAdded)="onFilesAdded($event)"
webkitdirectory directory
multiple #uploadFiles>
<!--Folders Upload-->
<div *ngIf="uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
<i class="material-icons">file_upload</i> Upload Folder
<input id="uploadFolder" type="file" name="uploadFiles"
(change)="onFilesAdded($event)"
multiple="multiple"
accept="{{acceptedFilesType}}"
webkitdirectory directory
multiple #uploadFolders>
</div>
</form>
<!--show dialog-->
<br>
<!--Upload Dialog-->
<file-uploading-dialog [hidden]="showDialogUpload" [filesUploadingList]="filesUploadingList"
#fileUploadingDialog></file-uploading-dialog>
<button type="button" (click)="showDialog($event)" class="mdl-button mdl-js-button mdl-button--raised show-modal">Show
Dialog
</button>
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
<!--show snackbar-->
<div id="demo-snackbar-example" class="mdl-js-snackbar mdl-snackbar" #undoNotificationBar>
<!--Notification bar-->
<div id="undo-notification-bar" [hidden]="showUdoNotificationBar" class="mdl-js-snackbar mdl-snackbar"
#undoNotificationBar>
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
<br>
<br>
</div>

View File

@@ -14,7 +14,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
System.register(['angular2/core', '../services/upload.service', './file-uploading-dialog.component', '../directives/file-select.directive'], function(exports_1, context_1) {
System.register(['angular2/core', '../services/upload.service', './file-uploading-dialog.component'], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
@@ -26,7 +26,7 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1, upload_service_1, file_uploading_dialog_component_1, file_select_directive_1;
var core_1, upload_service_1, file_uploading_dialog_component_1;
var UploadButtonComponent;
return {
setters:[
@@ -38,14 +38,35 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
},
function (file_uploading_dialog_component_1_1) {
file_uploading_dialog_component_1 = file_uploading_dialog_component_1_1;
},
function (file_select_directive_1_1) {
file_select_directive_1 = file_select_directive_1_1;
}],
execute: function() {
/**
* <alfresco-upload-button [showDialogUpload]="boolean"
* [showUdoNotificationBar]="boolean"
* [uploadFolders]="boolean"
* [multipleFiles]="boolean"
* [acceptedFilesType]="string">
* </alfresco-upload-button>
*
* This component, provide a set of buttons to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
*
*
* @returns {UploadDragAreaComponent} .
*/
UploadButtonComponent = (function () {
function UploadButtonComponent(el) {
this.el = el;
this.showUploadDialog = true;
this.showUdoNotificationBar = true;
this.uploadFolders = false;
this.multipleFiles = false;
this.acceptedFilesType = '*';
this.filesUploadingList = [];
console.log('UploadComponent constructor', el);
this._uploaderService = new upload_service_1.UploadService({
@@ -60,15 +81,30 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
}
});
}
UploadButtonComponent.prototype.onFilesAdded = function (files) {
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
UploadButtonComponent.prototype.onFilesAdded = function ($event) {
var files = $event.currentTarget.files;
if (files.length) {
var latestFilesAdded = this._uploaderService.addToQueue(files);
this.filesUploadingList = this._uploaderService.getQueue();
this.showDialog();
this.showUndoNotificationBar(latestFilesAdded);
if (this.showUploadDialog) {
this._showDialog();
}
if (this.showUdoNotificationBar) {
this._showUndoNotificationBar(latestFilesAdded);
}
}
};
UploadButtonComponent.prototype.showUndoNotificationBar = function (latestFilesAdded) {
/**
* Show undo notification bar.
*
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
*/
UploadButtonComponent.prototype._showUndoNotificationBar = function (latestFilesAdded) {
if (componentHandler) {
componentHandler.upgradeAllRegistered();
}
@@ -83,7 +119,10 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
actionText: 'Undo'
});
};
UploadButtonComponent.prototype.showDialog = function () {
/**
* Show the upload dialog.
*/
UploadButtonComponent.prototype._showDialog = function () {
this.fileUploadingDialogComponent.showDialog();
};
__decorate([
@@ -94,13 +133,33 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
core_1.ViewChild('fileUploadingDialog'),
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
], UploadButtonComponent.prototype, "fileUploadingDialogComponent", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Boolean)
], UploadButtonComponent.prototype, "showUploadDialog", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Boolean)
], UploadButtonComponent.prototype, "showUdoNotificationBar", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Boolean)
], UploadButtonComponent.prototype, "uploadFolders", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Boolean)
], UploadButtonComponent.prototype, "multipleFiles", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', String)
], UploadButtonComponent.prototype, "acceptedFilesType", void 0);
UploadButtonComponent = __decorate([
core_1.Component({
selector: 'alfresco-upload-button',
moduleId: __moduleName,
directives: [file_select_directive_1.FileSelectDirective, file_uploading_dialog_component_1.FileUploadingDialogComponent],
directives: [file_uploading_dialog_component_1.FileUploadingDialogComponent],
templateUrl: './upload-button.component.html',
styleUrls: ['./upload-button.component.css']
styleUrls: ['./upload-button.component.css'],
}),
__metadata('design:paramtypes', [core_1.ElementRef])
], UploadButtonComponent);

View File

@@ -1 +1 @@
{"version":3,"file":"upload-button.component.js","sourceRoot":"","sources":["upload-button.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAoBH;gBAYI,+BAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAFhC,uBAAkB,GAAgB,EAAE,CAAC;oBAGjC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAC;oBAE/C,IAAI,CAAC,gBAAgB,GAAG,IAAI,8BAAa,CAAC;wBACtC,GAAG,EAAE,wDAAwD;wBAC7D,eAAe,EAAE,IAAI;wBACrB,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC;wBAC9B,eAAe,EAAE,OAAO;wBACxB,SAAS,EAAE,UAAU;wBACrB,UAAU,EAAE;4BACR,MAAM,EAAE,OAAO;4BACf,WAAW,EAAE,iBAAiB;yBACjC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED,4CAAY,GAAZ,UAAa,KAAK;oBACd,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;wBACf,IAAI,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;wBAC/D,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;wBAC3D,IAAI,CAAC,UAAU,EAAE,CAAC;wBAClB,IAAI,CAAC,uBAAuB,CAAC,gBAAgB,CAAC,CAAC;oBACnD,CAAC;gBACL,CAAC;gBAED,uDAAuB,GAAvB,UAAwB,gBAAgB;oBACpC,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;wBACnB,gBAAgB,CAAC,oBAAoB,EAAE,CAAC;oBAC5C,CAAC;oBAED,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,gBAAgB,CAAC,YAAY,CAAC;wBACjE,OAAO,EAAE,uBAAuB;wBAChC,OAAO,EAAE,IAAI;wBACb,aAAa,EAAE;4BACX,gBAAgB,CAAC,OAAO,CAAC,UAAC,kBAAkB;gCACxC,kBAAkB,CAAC,QAAQ,EAAE,CAAC;4BAClC,CAAC,CAAC,CAAC;wBACP,CAAC;wBACD,UAAU,EAAE,MAAM;qBACrB,CAAC,CAAC;gBACP,CAAC;gBAED,0CAAU,GAAV;oBACI,IAAI,CAAC,4BAA4B,CAAC,UAAU,EAAE,CAAC;gBACnD,CAAC;gBApDD;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;kFAAA;gBAGjC;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;2FAAA;gBAdrC;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,wBAAwB;wBAClC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,2CAAmB,EAAE,8DAA4B,CAAC;wBAC/D,WAAW,EAAE,gCAAgC;wBAC7C,SAAS,EAAE,CAAC,+BAA+B,CAAC;qBAC/C,CAAC;;yCAAA;gBA0DF,4BAAC;YAAD,CAAC,AAzDD,IAyDC;YAzDD,yDAyDC,CAAA"}
{"version":3,"file":"upload-button.component.js","sourceRoot":"","sources":["upload-button.component.ts"],"names":[],"mappings":"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"}

View File

@@ -16,36 +16,68 @@
*/
import {Component, ViewChild, ElementRef} from 'angular2/core';
import {Component, ViewChild, ElementRef, Input} from 'angular2/core';
import {UploadService} from '../services/upload.service';
import {FileModel} from '../models/file.model';
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
import {FileSelectDirective} from '../directives/file-select.directive';
import {FileDraggableDirective} from '../directives/file-draggable.directive';
declare let componentHandler;
declare let __moduleName:string;
declare let __moduleName: string;
/**
* <alfresco-upload-button [showDialogUpload]="boolean"
* [showUdoNotificationBar]="boolean"
* [uploadFolders]="boolean"
* [multipleFiles]="boolean"
* [acceptedFilesType]="string">
* </alfresco-upload-button>
*
* This component, provide a set of buttons to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
*
*
* @returns {UploadDragAreaComponent} .
*/
@Component({
selector: 'alfresco-upload-button',
moduleId: __moduleName,
directives: [FileSelectDirective, FileUploadingDialogComponent],
directives: [FileUploadingDialogComponent],
templateUrl: './upload-button.component.html',
styleUrls: ['./upload-button.component.css']
styleUrls: ['./upload-button.component.css'],
})
export class UploadButtonComponent {
private _uploaderService:UploadService;
private _uploaderService: UploadService;
@ViewChild('undoNotificationBar')
undoNotificationBar;
@ViewChild('fileUploadingDialog')
fileUploadingDialogComponent:FileUploadingDialogComponent;
fileUploadingDialogComponent: FileUploadingDialogComponent;
filesUploadingList:FileModel [] = [];
@Input()
showUploadDialog: boolean = true;
constructor(public el:ElementRef) {
@Input()
showUdoNotificationBar: boolean = true;
@Input()
uploadFolders: boolean = false;
@Input()
multipleFiles: boolean = false;
@Input()
acceptedFilesType: string = '*';
filesUploadingList: FileModel [] = [];
constructor(public el: ElementRef) {
console.log('UploadComponent constructor', el);
this._uploaderService = new UploadService({
@@ -61,16 +93,31 @@ export class UploadButtonComponent {
});
}
onFilesAdded(files):void {
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesAdded($event): void {
let files = $event.currentTarget.files;
if (files.length) {
let latestFilesAdded = this._uploaderService.addToQueue(files);
this.filesUploadingList = this._uploaderService.getQueue();
this.showDialog();
this.showUndoNotificationBar(latestFilesAdded);
if (this.showUploadDialog) {
this._showDialog();
}
if(this.showUdoNotificationBar) {
this._showUndoNotificationBar(latestFilesAdded);
}
}
}
showUndoNotificationBar(latestFilesAdded) {
/**
* Show undo notification bar.
*
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
*/
private _showUndoNotificationBar(latestFilesAdded) {
if (componentHandler) {
componentHandler.upgradeAllRegistered();
}
@@ -87,7 +134,10 @@ export class UploadButtonComponent {
});
}
showDialog():void {
/**
* Show the upload dialog.
*/
private _showDialog(): void {
this.fileUploadingDialogComponent.showDialog();
}
}

View File

@@ -17,12 +17,31 @@
import { ElementRef } from 'angular2/core';
import { FileModel } from '../models/file.model';
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
/**
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
*
* This component, provide a drag and drop are to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
*
*
* @returns {UploadDragAreaComponent} .
*/
export declare class UploadDragAreaComponent {
el: ElementRef;
private _uploaderService;
fileUploadingDialogComponent: FileUploadingDialogComponent;
showUploadDialog: boolean;
filesUploadingList: FileModel[];
constructor(el: ElementRef);
onFilesDragged(files: any): void;
showDialog(): void;
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesDropped(files: any): void;
/**
* Show the upload dialog.
*/
private _showDialog();
}

View File

@@ -1,6 +1,6 @@
<div file-draggable id='UploadBorder' class="upload-border" (onFilesAdded)="onFilesDragged($event)"
<div file-draggable id='UploadBorder' class="upload-border" (onFilesDropped)="onFilesDropped($event)"
dropzone="" webkitdropzone="copy file:image/png file:image/gif file:image/jpeg" #droparea>
<ng-content></ng-content>
</div>
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
<file-uploading-dialog [hidden]="showDialogUpload" [filesUploadingList]="filesUploadingList"
#fileUploadingDialog></file-uploading-dialog>

View File

@@ -43,9 +43,20 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
file_draggable_directive_1 = file_draggable_directive_1_1;
}],
execute: function() {
/**
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
*
* This component, provide a drag and drop are to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
*
*
* @returns {UploadDragAreaComponent} .
*/
UploadDragAreaComponent = (function () {
function UploadDragAreaComponent(el) {
this.el = el;
this.showUploadDialog = true;
this.filesUploadingList = [];
console.log('UploadComponent constructor', el);
this._uploaderService = new upload_service_1.UploadService({
@@ -60,20 +71,34 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
}
});
}
UploadDragAreaComponent.prototype.onFilesDragged = function (files) {
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
UploadDragAreaComponent.prototype.onFilesDropped = function (files) {
if (files.length) {
this._uploaderService.addToQueue(files);
this.filesUploadingList = this._uploaderService.getQueue();
this.showDialog();
if (this.showUploadDialog) {
this._showDialog();
}
}
};
UploadDragAreaComponent.prototype.showDialog = function () {
/**
* Show the upload dialog.
*/
UploadDragAreaComponent.prototype._showDialog = function () {
this.fileUploadingDialogComponent.showDialog();
};
__decorate([
core_1.ViewChild('fileUploadingDialog'),
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
], UploadDragAreaComponent.prototype, "fileUploadingDialogComponent", void 0);
__decorate([
core_1.Input(),
__metadata('design:type', Boolean)
], UploadDragAreaComponent.prototype, "showUploadDialog", void 0);
UploadDragAreaComponent = __decorate([
core_1.Component({
selector: 'alfresco-upload-drag-area',

View File

@@ -1 +1 @@
{"version":3,"file":"upload-drag-area.component.js","sourceRoot":"","sources":["upload-drag-area.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAkBH;gBASI,iCAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAFhC,uBAAkB,GAAgB,EAAE,CAAC;oBAGjC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAC;oBAE/C,IAAI,CAAC,gBAAgB,GAAG,IAAI,8BAAa,CAAC;wBACtC,GAAG,EAAE,wDAAwD;wBAC7D,eAAe,EAAE,IAAI;wBACrB,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC;wBAC9B,eAAe,EAAE,OAAO;wBACxB,SAAS,EAAE,UAAU;wBACrB,UAAU,EAAE;4BACR,MAAM,EAAE,OAAO;4BACf,WAAW,EAAE,iBAAiB;yBACjC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED,gDAAc,GAAd,UAAe,KAAK;oBAChB,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;wBACf,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;wBACxC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;wBAC3D,IAAI,CAAC,UAAU,EAAE,CAAC;oBACtB,CAAC;gBACL,CAAC;gBAED,4CAAU,GAAV;oBACI,IAAI,CAAC,4BAA4B,CAAC,UAAU,EAAE,CAAC;gBACnD,CAAC;gBA/BD;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;6FAAA;gBAXrC;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,2BAA2B;wBACrC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,iDAAsB,EAAE,8DAA4B,CAAC;wBAClE,WAAW,EAAE,mCAAmC;wBAChD,SAAS,EAAE,CAAC,kCAAkC,CAAC;qBAClD,CAAC;;2CAAA;gBAqCF,8BAAC;YAAD,CAAC,AApCD,IAoCC;YApCD,6DAoCC,CAAA"}
{"version":3,"file":"upload-drag-area.component.js","sourceRoot":"","sources":["upload-drag-area.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAWH;;;;;;;;;eASG;YAQH;gBAYI,iCAAmB,EAAc;oBAAd,OAAE,GAAF,EAAE,CAAY;oBAJjC,qBAAgB,GAAY,IAAI,CAAC;oBAEjC,uBAAkB,GAAiB,EAAE,CAAC;oBAGlC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAC;oBAE/C,IAAI,CAAC,gBAAgB,GAAG,IAAI,8BAAa,CAAC;wBACtC,GAAG,EAAE,wDAAwD;wBAC7D,eAAe,EAAE,IAAI;wBACrB,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC;wBAC9B,eAAe,EAAE,OAAO;wBACxB,SAAS,EAAE,UAAU;wBACrB,UAAU,EAAE;4BACR,MAAM,EAAE,OAAO;4BACf,WAAW,EAAE,iBAAiB;yBACjC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED;;;;mBAIG;gBACH,gDAAc,GAAd,UAAe,KAAK;oBAChB,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;wBACf,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;wBACxC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;wBAC3D,EAAE,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC;4BACxB,IAAI,CAAC,WAAW,EAAE,CAAC;wBACvB,CAAC;oBACL,CAAC;gBACL,CAAC;gBAED;;mBAEG;gBACK,6CAAW,GAAnB;oBACI,IAAI,CAAC,4BAA4B,CAAC,UAAU,EAAE,CAAC;gBACnD,CAAC;gBA5CD;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;6FAAA;gBAGjC;oBAAC,YAAK,EAAE;;iFAAA;gBAdZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,2BAA2B;wBACrC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,iDAAsB,EAAE,8DAA4B,CAAC;wBAClE,WAAW,EAAE,mCAAmC;wBAChD,SAAS,EAAE,CAAC,kCAAkC,CAAC;qBAClD,CAAC;;2CAAA;gBAkDF,8BAAC;YAAD,CAAC,AAjDD,IAiDC;YAjDD,6DAiDC,CAAA"}

View File

@@ -16,14 +16,24 @@
*/
import {Component, ViewChild, ElementRef} from 'angular2/core';
import {Component, ViewChild, ElementRef, Input} from 'angular2/core';
import {UploadService} from '../services/upload.service';
import {FileModel} from '../models/file.model';
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
import {FileDraggableDirective} from '../directives/file-draggable.directive';
declare let __moduleName:string;
declare let __moduleName: string;
/**
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
*
* This component, provide a drag and drop are to upload files to alfresco.
*
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
*
*
* @returns {UploadDragAreaComponent} .
*/
@Component({
selector: 'alfresco-upload-drag-area',
moduleId: __moduleName,
@@ -33,14 +43,17 @@ declare let __moduleName:string;
})
export class UploadDragAreaComponent {
private _uploaderService:UploadService;
private _uploaderService: UploadService;
@ViewChild('fileUploadingDialog')
fileUploadingDialogComponent:FileUploadingDialogComponent;
fileUploadingDialogComponent: FileUploadingDialogComponent;
filesUploadingList:FileModel [] = [];
@Input()
showUploadDialog: boolean = true;
constructor(public el:ElementRef) {
filesUploadingList: FileModel [] = [];
constructor(public el: ElementRef) {
console.log('UploadComponent constructor', el);
this._uploaderService = new UploadService({
@@ -56,15 +69,25 @@ export class UploadDragAreaComponent {
});
}
onFilesDragged(files):void {
/**
* Method called when files are dropped in the drag area.
*
* @param {File[]} files - files dropped in the drag area.
*/
onFilesDropped(files): void {
if (files.length) {
this._uploaderService.addToQueue(files);
this.filesUploadingList = this._uploaderService.getQueue();
this.showDialog();
if (this.showUploadDialog) {
this._showDialog();
}
}
}
showDialog():void {
/**
* Show the upload dialog.
*/
private _showDialog(): void {
this.fileUploadingDialogComponent.showDialog();
}
}

View File

@@ -15,15 +15,51 @@
* limitations under the License.
*/
import { ElementRef, EventEmitter } from 'angular2/core';
/**
* [file-draggable]
*
* This directive, provide a drag and drop area for files and folders.
*
* @OutputEvent {EventEmitter} onFilesDropped(File)- event fired fot each file dropped
* in the drag and drop area.
*
*
* @returns {FileDraggableDirective} .
*/
export declare class FileDraggableDirective {
el: ElementRef;
onFilesAdded: EventEmitter<any>;
onFilesDropped: EventEmitter<any>;
files: File[];
private _inputFocusClass;
constructor(el: ElementRef);
/**
* Method called when files is dropped in the drag and drop area.
*
* @param {$event} $event - DOM $event.
*/
private _onDropFiles($event);
private _traverseFileTree(item, x);
/**
* Travers all the files and folders, and emit an event for each file.
*
* @param {Object} item - can contains files or folders.
*/
private _traverseFileTree(item);
/**
* Change the style of the drag area when a file drag in.
*
* @param {$event} $event - DOM $event.
*/
private _onDragEnter($event);
/**
* Change the style of the drag area when a file drag out.
*
* @param {$event} $event - DOM $event.
*/
private _onDragLeave($event);
/**
* Prevent default and stop propagation of the DOM event.
*
* @param {$event} $event - DOM $event.
*/
private _preventDefault($event);
}

View File

@@ -34,35 +34,55 @@ System.register(['angular2/core'], function(exports_1, context_1) {
core_1 = core_1_1;
}],
execute: function() {
/**
* [file-draggable]
*
* This directive, provide a drag and drop area for files and folders.
*
* @OutputEvent {EventEmitter} onFilesDropped(File)- event fired fot each file dropped
* in the drag and drop area.
*
*
* @returns {FileDraggableDirective} .
*/
FileDraggableDirective = (function () {
function FileDraggableDirective(el) {
this.el = el;
this.onFilesAdded = new core_1.EventEmitter();
this.onFilesDropped = new core_1.EventEmitter();
this._inputFocusClass = false;
console.log('FileDraggableComponent constructor', el);
}
/**
* Method called when files is dropped in the drag and drop area.
*
* @param {$event} $event - DOM $event.
*/
FileDraggableDirective.prototype._onDropFiles = function ($event) {
this._preventDefault($event);
var items = $event.dataTransfer.items;
for (var i = 0; i < items.length; i++) {
var item = items[i].webkitGetAsEntry();
if (item) {
this._traverseFileTree(item, -1);
this._traverseFileTree(item);
}
else {
var dt = $event.dataTransfer;
var files = dt.files;
this.onFilesAdded.emit(files);
this.onFilesDropped.emit(files);
}
}
this.onFilesAdded.emit([]);
this._inputFocusClass = false;
};
FileDraggableDirective.prototype._traverseFileTree = function (item, x) {
/**
* Travers all the files and folders, and emit an event for each file.
*
* @param {Object} item - can contains files or folders.
*/
FileDraggableDirective.prototype._traverseFileTree = function (item) {
if (item.isFile) {
var self_1 = this;
item.file(function (file) {
self_1.onFilesAdded.emit([file]);
self_1.onFilesDropped.emit([file]);
});
}
else {
@@ -71,20 +91,35 @@ System.register(['angular2/core'], function(exports_1, context_1) {
var dirReader = item.createReader();
dirReader.readEntries(function (entries) {
for (var i = 0; i < entries.length; i++) {
self_2._traverseFileTree(entries[i], i);
self_2._traverseFileTree(entries[i]);
}
});
}
}
};
/**
* Change the style of the drag area when a file drag in.
*
* @param {$event} $event - DOM $event.
*/
FileDraggableDirective.prototype._onDragEnter = function ($event) {
this._preventDefault($event);
this._inputFocusClass = true;
};
/**
* Change the style of the drag area when a file drag out.
*
* @param {$event} $event - DOM $event.
*/
FileDraggableDirective.prototype._onDragLeave = function ($event) {
this._preventDefault($event);
this._inputFocusClass = false;
};
/**
* Prevent default and stop propagation of the DOM event.
*
* @param {$event} $event - DOM $event.
*/
FileDraggableDirective.prototype._preventDefault = function ($event) {
$event.stopPropagation();
$event.preventDefault();
@@ -92,7 +127,7 @@ System.register(['angular2/core'], function(exports_1, context_1) {
__decorate([
core_1.Output(),
__metadata('design:type', core_1.EventEmitter)
], FileDraggableDirective.prototype, "onFilesAdded", void 0);
], FileDraggableDirective.prototype, "onFilesDropped", void 0);
FileDraggableDirective = __decorate([
core_1.Directive({
selector: '[file-draggable]',

View File

@@ -1 +1 @@
{"version":3,"file":"file-draggable.directive.js","sourceRoot":"","sources":["file-draggable.directive.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"file-draggable.directive.js","sourceRoot":"","sources":["file-draggable.directive.ts"],"names":[],"mappings":"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"}

View File

@@ -17,6 +17,17 @@
import {Directive, ElementRef, EventEmitter, Output} from 'angular2/core';
/**
* [file-draggable]
*
* This directive, provide a drag and drop area for files and folders.
*
* @OutputEvent {EventEmitter} onFilesDropped(File)- event fired fot each file dropped
* in the drag and drop area.
*
*
* @returns {FileDraggableDirective} .
*/
@Directive({
selector: '[file-draggable]',
host: {
@@ -28,39 +39,51 @@ import {Directive, ElementRef, EventEmitter, Output} from 'angular2/core';
}
})
export class FileDraggableDirective {
@Output()
onFilesAdded:EventEmitter<any> = new EventEmitter();
files:File [];
private _inputFocusClass:boolean = false;
constructor(public el:ElementRef) {
@Output()
onFilesDropped: EventEmitter<any> = new EventEmitter();
files: File [];
private _inputFocusClass: boolean = false;
constructor(public el: ElementRef) {
console.log('FileDraggableComponent constructor', el);
}
private _onDropFiles($event):void {
/**
* Method called when files is dropped in the drag and drop area.
*
* @param {$event} $event - DOM $event.
*/
private _onDropFiles($event): void {
this._preventDefault($event);
var items = $event.dataTransfer.items;
for (var i = 0; i < items.length; i++) {
var item = items[i].webkitGetAsEntry();
if (item) {
this._traverseFileTree(item, -1);
this._traverseFileTree(item);
} else {
let dt = $event.dataTransfer;
let files = dt.files;
this.onFilesAdded.emit(files);
this.onFilesDropped.emit(files);
}
}
this.onFilesAdded.emit([]);
this._inputFocusClass = false;
}
private _traverseFileTree(item, x):void {
/**
* Travers all the files and folders, and emit an event for each file.
*
* @param {Object} item - can contains files or folders.
*/
private _traverseFileTree(item): void {
if (item.isFile) {
let self = this;
item.file(function (file) {
self.onFilesAdded.emit([file]);
self.onFilesDropped.emit([file]);
});
} else {
if (item.isDirectory) {
@@ -68,26 +91,41 @@ export class FileDraggableDirective {
let dirReader = item.createReader();
dirReader.readEntries(function (entries) {
for (var i = 0; i < entries.length; i++) {
self._traverseFileTree(entries[i], i);
self._traverseFileTree(entries[i]);
}
});
}
}
}
private _onDragEnter($event):void {
/**
* Change the style of the drag area when a file drag in.
*
* @param {$event} $event - DOM $event.
*/
private _onDragEnter($event): void {
this._preventDefault($event);
this._inputFocusClass = true;
}
private _onDragLeave($event):void {
/**
* Change the style of the drag area when a file drag out.
*
* @param {$event} $event - DOM $event.
*/
private _onDragLeave($event): void {
this._preventDefault($event);
this._inputFocusClass = false;
}
private _preventDefault($event):void {
/**
* Prevent default and stop propagation of the DOM event.
*
* @param {$event} $event - DOM $event.
*/
private _preventDefault($event): void {
$event.stopPropagation();
$event.preventDefault();
}

View File

@@ -1,23 +0,0 @@
/**
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { ElementRef, EventEmitter } from 'angular2/core';
export declare class FileSelectDirective {
el: ElementRef;
onFilesAdded: EventEmitter<any>;
constructor(el: ElementRef);
private _onAdd();
}

View File

@@ -1,64 +0,0 @@
/**
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
System.register(['angular2/core'], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1;
var FileSelectDirective;
return {
setters:[
function (core_1_1) {
core_1 = core_1_1;
}],
execute: function() {
FileSelectDirective = (function () {
function FileSelectDirective(el) {
this.el = el;
this.onFilesAdded = new core_1.EventEmitter();
console.log('FileSelectComponent constructor', el);
}
FileSelectDirective.prototype._onAdd = function () {
var files = this.el.nativeElement.files;
this.onFilesAdded.emit(files);
};
__decorate([
core_1.Output(),
__metadata('design:type', core_1.EventEmitter)
], FileSelectDirective.prototype, "onFilesAdded", void 0);
FileSelectDirective = __decorate([
core_1.Directive({
selector: '[file-select]',
host: { '(change)': '_onAdd()' }
}),
__metadata('design:paramtypes', [core_1.ElementRef])
], FileSelectDirective);
return FileSelectDirective;
}());
exports_1("FileSelectDirective", FileSelectDirective);
}
}
});
//# sourceMappingURL=file-select.directive.js.map

View File

@@ -1 +0,0 @@
{"version":3,"file":"file-select.directive.js","sourceRoot":"","sources":["file-select.directive.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;YAQH;gBAKI,6BAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAFhC,iBAAY,GAAqB,IAAI,mBAAY,EAAE,CAAC;oBAGhD,OAAO,CAAC,GAAG,CAAC,iCAAiC,EAAE,EAAE,CAAC,CAAC;gBACvD,CAAC;gBAEO,oCAAM,GAAd;oBACI,IAAI,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC;oBACxC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAClC,CAAC;gBAVD;oBAAC,aAAM,EAAE;;yEAAA;gBANb;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,eAAe;wBACzB,IAAI,EAAE,EAAC,UAAU,EAAE,UAAU,EAAC;qBACjC,CAAC;;uCAAA;gBAcF,0BAAC;YAAD,CAAC,AAbD,IAaC;YAbD,qDAaC,CAAA"}

View File

@@ -1,37 +0,0 @@
/**
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import {Directive, ElementRef, EventEmitter, Output} from 'angular2/core';
@Directive({
selector: '[file-select]',
host: {'(change)': '_onAdd()'}
})
export class FileSelectDirective {
@Output()
onFilesAdded:EventEmitter<any> = new EventEmitter();
constructor(public el:ElementRef) {
console.log('FileSelectComponent constructor', el);
}
private _onAdd():void {
let files = this.el.nativeElement.files;
this.onFilesAdded.emit(files);
}
}

View File

@@ -14,6 +14,13 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
*
* This object represent the status of an uploading file.
*
*
* @returns {FileModel} .
*/
export declare class FileModel {
id: string;
status: number;
@@ -33,8 +40,24 @@ export declare class FileModel {
setError(): void;
setUploading(): void;
setXMLHttpRequest(xmlHttpRequest: XMLHttpRequest): void;
/**
* Stop the uploading of the file.
*/
setAbort(): void;
/**
* Update status of the file when upload finish or is ended.
*/
onFinished(status: number, statusText: string, response: string): void;
/**
* Calculate the size of the file in kb,mb and gb.
*
* @param {number} sizeinbytes - size in bytes of the file.
*/
private _getFileSize(sizeinbytes);
/**
* Calculate the size of the file in kb,mb and gb.
*
* @return {string} - return a unique file uploading id.
*/
private _generateId();
}

View File

@@ -21,6 +21,13 @@ System.register([], function(exports_1, context_1) {
return {
setters:[],
execute: function() {
/**
*
* This object represent the status of an uploading file.
*
*
* @returns {FileModel} .
*/
FileModel = (function () {
function FileModel(file) {
this.done = false;
@@ -49,6 +56,9 @@ System.register([], function(exports_1, context_1) {
FileModel.prototype.setXMLHttpRequest = function (xmlHttpRequest) {
this._xmlHttpRequest = xmlHttpRequest;
};
/**
* Stop the uploading of the file.
*/
FileModel.prototype.setAbort = function () {
if (!this.done && !this.error) {
this.abort = true;
@@ -56,6 +66,9 @@ System.register([], function(exports_1, context_1) {
this._xmlHttpRequest.abort();
}
};
/**
* Update status of the file when upload finish or is ended.
*/
FileModel.prototype.onFinished = function (status, statusText, response) {
this.status = status;
this.statusText = statusText;
@@ -63,6 +76,11 @@ System.register([], function(exports_1, context_1) {
this.done = true;
this.uploading = false;
};
/**
* Calculate the size of the file in kb,mb and gb.
*
* @param {number} sizeinbytes - size in bytes of the file.
*/
FileModel.prototype._getFileSize = function (sizeinbytes) {
var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
var size = sizeinbytes;
@@ -73,8 +91,13 @@ System.register([], function(exports_1, context_1) {
}
return Math.round((Math.round(size * 100) / 100)) + ' ' + fSExt[i];
};
/**
* Calculate the size of the file in kb,mb and gb.
*
* @return {string} - return a unique file uploading id.
*/
FileModel.prototype._generateId = function () {
return 'uploading-' + 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
return 'uploading-file-' + 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});

View File

@@ -1 +1 @@
{"version":3,"file":"file.model.js","sourceRoot":"","sources":["file.model.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"file.model.js","sourceRoot":"","sources":["file.model.ts"],"names":[],"mappings":"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"}

View File

@@ -15,23 +15,29 @@
* limitations under the License.
*/
/**
*
* This object represent the status of an uploading file.
*
*
* @returns {FileModel} .
*/
export class FileModel {
id:string;
status:number;
statusText:string;
progress:Object;
name:string;
size:string;
response:string;
done:boolean = false;
error:boolean = false;
abort:boolean = false;
uploading:boolean = false;
file:any;
_xmlHttpRequest:XMLHttpRequest;
id: string;
status: number;
statusText: string;
progress: Object;
name: string;
size: string;
response: string;
done: boolean = false;
error: boolean = false;
abort: boolean = false;
uploading: boolean = false;
file: any;
_xmlHttpRequest: XMLHttpRequest;
constructor(file:any) {
constructor(file: any) {
this.file = file;
this.id = this._generateId();
this.name = file.name;
@@ -43,31 +49,37 @@ export class FileModel {
};
}
setProgres(progress:any):void {
setProgres(progress: any): void {
this.progress = progress;
}
setError():void {
setError(): void {
this.error = true;
}
setUploading(){
setUploading() {
this.uploading = true;
}
setXMLHttpRequest(xmlHttpRequest:XMLHttpRequest){
setXMLHttpRequest(xmlHttpRequest: XMLHttpRequest) {
this._xmlHttpRequest = xmlHttpRequest;
}
setAbort():void {
if(!this.done && !this.error){
/**
* Stop the uploading of the file.
*/
setAbort(): void {
if (!this.done && !this.error) {
this.abort = true;
this.uploading = false;
this._xmlHttpRequest.abort();
}
}
onFinished(status:number, statusText:string, response:string):void {
/**
* Update status of the file when upload finish or is ended.
*/
onFinished(status: number, statusText: string, response: string): void {
this.status = status;
this.statusText = statusText;
this.response = response;
@@ -75,7 +87,12 @@ export class FileModel {
this.uploading = false;
}
private _getFileSize(sizeinbytes):string {
/**
* Calculate the size of the file in kb,mb and gb.
*
* @param {number} sizeinbytes - size in bytes of the file.
*/
private _getFileSize(sizeinbytes): string {
let fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
let size = sizeinbytes;
let i = 0;
@@ -86,8 +103,13 @@ export class FileModel {
return Math.round((Math.round(size * 100) / 100)) + ' ' + fSExt[i];
}
private _generateId():string {
return 'uploading-' + 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
/**
* Calculate the size of the file in kb,mb and gb.
*
* @return {string} - return a unique file uploading id.
*/
private _generateId(): string {
return 'uploading-file-' + 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
let r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});

View File

@@ -15,6 +15,12 @@
* limitations under the License.
*/
import { FileModel } from '../models/file.model';
/**
*
* UploadService keep the queue of the file to upload and uploads them.
*
* @returns {UploadService} .
*/
export declare class UploadService {
private options;
private _url;
@@ -24,11 +30,37 @@ export declare class UploadService {
private _fieldName;
private _formFields;
private _withCredentials;
_queue: FileModel[];
private _queue;
constructor(options: any);
/**
* Add files to the uploading queue to be uploaded.
*
* @param {File[]} - files to add to the upload queue.
*
* return {FileModel[]} - return the file added to the queue in this call.
*/
addToQueue(files: any[]): FileModel[];
/**
* Pick all the files in the queue that are not been uploaded yet and upload it.
*/
private _uploadFilesInTheQueue();
/**
* Upload a file, and enrich it with the xhr.
*
* @param {FileModel} - files to be uploaded.
*
*/
uploadFile(uploadingFileModel: any): void;
/**
* Return all the files in the uploading queue.
*
* @return {FileModel[]} - files in the upload queue.
*/
getQueue(): FileModel[];
/**
* Check if an item is a file.
*
* @return {boolean}
*/
private _isFile(file);
}

View File

@@ -25,6 +25,12 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
file_model_1 = file_model_1_1;
}],
execute: function() {
/**
*
* UploadService keep the queue of the file to upload and uploads them.
*
* @returns {UploadService} .
*/
UploadService = (function () {
function UploadService(options) {
this.options = options;
@@ -42,6 +48,13 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
this._fieldName = options.fieldName != null ? options.fieldName : this._fieldName;
this._formFields = options.formFields != null ? options.formFields : this._formFields;
}
/**
* Add files to the uploading queue to be uploaded.
*
* @param {File[]} - files to add to the upload queue.
*
* return {FileModel[]} - return the file added to the queue in this call.
*/
UploadService.prototype.addToQueue = function (files) {
var latestFilesAdded = [];
for (var _i = 0, files_1 = files; _i < files_1.length; _i++) {
@@ -55,6 +68,9 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
this._uploadFilesInTheQueue();
return latestFilesAdded;
};
/**
* Pick all the files in the queue that are not been uploaded yet and upload it.
*/
UploadService.prototype._uploadFilesInTheQueue = function () {
var _this = this;
var filesToUpload = this._queue.filter(function (uploadingFileModel) {
@@ -66,6 +82,12 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
});
};
;
/**
* Upload a file, and enrich it with the xhr.
*
* @param {FileModel} - files to be uploaded.
*
*/
UploadService.prototype.uploadFile = function (uploadingFileModel) {
var _this = this;
var form = new FormData();
@@ -103,9 +125,19 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
}
xmlHttpRequest.send(form);
};
/**
* Return all the files in the uploading queue.
*
* @return {FileModel[]} - files in the upload queue.
*/
UploadService.prototype.getQueue = function () {
return this._queue;
};
/**
* Check if an item is a file.
*
* @return {boolean}
*/
UploadService.prototype._isFile = function (file) {
return file !== null && (file instanceof Blob || (file.name && file.size));
};

View File

@@ -1 +1 @@
{"version":3,"file":"upload.service.js","sourceRoot":"","sources":["upload.service.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"upload.service.js","sourceRoot":"","sources":["upload.service.ts"],"names":[],"mappings":"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"}

View File

@@ -19,18 +19,24 @@
import {FileModel} from '../models/file.model';
/**
*
* UploadService keep the queue of the file to upload and uploads them.
*
* @returns {UploadService} .
*/
export class UploadService {
private _url:string;
private _method:string = 'POST';
private _authTokenPrefix:string = 'Basic';
private _authToken:string = undefined;
private _fieldName:string = 'file';
private _formFields:Object = {};
private _withCredentials:boolean;
private _url: string;
private _method: string = 'POST';
private _authTokenPrefix: string = 'Basic';
private _authToken: string = undefined;
private _fieldName: string = 'file';
private _formFields: Object = {};
private _withCredentials: boolean;
_queue:FileModel[] = [];
private _queue: FileModel[] = [];
constructor(private options:any) {
constructor(private options: any) {
console.log('UploadService constructor');
this._withCredentials = options.withCredentials != null ? options.withCredentials : this._withCredentials;
@@ -41,8 +47,15 @@ export class UploadService {
this._formFields = options.formFields != null ? options.formFields : this._formFields;
}
addToQueue(files:any[]):FileModel[] {
let latestFilesAdded:FileModel[] = [];
/**
* Add files to the uploading queue to be uploaded.
*
* @param {File[]} - files to add to the upload queue.
*
* return {FileModel[]} - return the file added to the queue in this call.
*/
addToQueue(files: any[]): FileModel[] {
let latestFilesAdded: FileModel[] = [];
for (let file of files) {
if (this._isFile(file)) {
@@ -56,7 +69,10 @@ export class UploadService {
return latestFilesAdded;
}
private _uploadFilesInTheQueue():void {
/**
* Pick all the files in the queue that are not been uploaded yet and upload it.
*/
private _uploadFilesInTheQueue(): void {
let filesToUpload = this._queue.filter((uploadingFileModel) => {
return !uploadingFileModel.uploading && !uploadingFileModel.done && !uploadingFileModel.abort && !uploadingFileModel.error;
});
@@ -66,7 +82,13 @@ export class UploadService {
});
};
uploadFile(uploadingFileModel:any):void {
/**
* Upload a file, and enrich it with the xhr.
*
* @param {FileModel} - files to be uploaded.
*
*/
uploadFile(uploadingFileModel: any): void {
let form = new FormData();
form.append(this._fieldName, uploadingFileModel.file, uploadingFileModel.name);
Object.keys(this._formFields).forEach((key) => {
@@ -115,11 +137,21 @@ export class UploadService {
xmlHttpRequest.send(form);
}
getQueue():FileModel[] {
/**
* Return all the files in the uploading queue.
*
* @return {FileModel[]} - files in the upload queue.
*/
getQueue(): FileModel[] {
return this._queue;
}
private _isFile(file:any):boolean {
/**
* Check if an item is a file.
*
* @return {boolean}
*/
private _isFile(file: any): boolean {
return file !== null && (file instanceof Blob || (file.name && file.size));
}
}