mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
#46 upload jsdoc and clean code
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
<alfresco-upload-drag-area>
|
<alfresco-upload-drag-area [showUploadDialog]="true">
|
||||||
<alfresco-document-list>
|
<alfresco-document-list>
|
||||||
<content-columns>
|
<content-columns>
|
||||||
<content-column source="$thumbnail"></content-column>
|
<content-column source="$thumbnail"></content-column>
|
||||||
|
@@ -15,17 +15,30 @@
|
|||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { UploadDragAreaComponent } from './src/components/upload-drag-area.component';
|
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 { FileDraggableDirective } from './src/directives/file-draggable.directive';
|
||||||
import { UploadButtonComponent } from './src/components/upload-button.component';
|
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-button.component';
|
||||||
export * from './src/components/upload-drag-area.component';
|
export * from './src/components/upload-drag-area.component';
|
||||||
export * from './src/services/upload.service';
|
export * from './src/services/upload.service';
|
||||||
export * from './src/directives/file-select.directive';
|
|
||||||
export * from './src/directives/file-draggable.directive';
|
export * from './src/directives/file-draggable.directive';
|
||||||
declare var _default: {
|
declare var _default: {
|
||||||
component: (typeof UploadDragAreaComponent | typeof UploadButtonComponent)[];
|
component: (typeof UploadDragAreaComponent | typeof UploadButtonComponent)[];
|
||||||
directives: (typeof FileSelectDirective | typeof FileDraggableDirective)[];
|
directives: typeof FileDraggableDirective[];
|
||||||
};
|
};
|
||||||
export default _default;
|
export default _default;
|
||||||
export declare const ALFRESCO_ULPOAD_COMPONENT: [any];
|
export declare const ALFRESCO_ULPOAD_COMPONENT: [any];
|
||||||
|
@@ -14,10 +14,10 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* 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";
|
"use strict";
|
||||||
var __moduleName = context_1 && context_1.id;
|
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 ALFRESCO_ULPOAD_COMPONENT;
|
||||||
var exportedNames_1 = {
|
var exportedNames_1 = {
|
||||||
'ALFRESCO_ULPOAD_COMPONENT': true
|
'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;
|
upload_drag_area_component_1 = upload_drag_area_component_1_1;
|
||||||
exportStar_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) {
|
function (file_draggable_directive_1_1) {
|
||||||
file_draggable_directive_1 = file_draggable_directive_1_1;
|
file_draggable_directive_1 = file_draggable_directive_1_1;
|
||||||
exportStar_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() {
|
execute: function() {
|
||||||
exports_1("default",{
|
exports_1("default",{
|
||||||
component: [upload_drag_area_component_1.UploadDragAreaComponent, upload_button_component_1.UploadButtonComponent],
|
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 = [
|
exports_1("ALFRESCO_ULPOAD_COMPONENT", ALFRESCO_ULPOAD_COMPONENT = [
|
||||||
upload_drag_area_component_1.UploadDragAreaComponent,
|
upload_drag_area_component_1.UploadDragAreaComponent,
|
||||||
upload_button_component_1.UploadButtonComponent,
|
upload_button_component_1.UploadButtonComponent,
|
||||||
file_select_directive_1.FileSelectDirective,
|
|
||||||
file_draggable_directive_1.FileDraggableDirective
|
file_draggable_directive_1.FileDraggableDirective
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
@@ -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"}
|
@@ -16,24 +16,37 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import {UploadDragAreaComponent} from './src/components/upload-drag-area.component';
|
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 {FileDraggableDirective} from './src/directives/file-draggable.directive';
|
||||||
import {UploadButtonComponent} from './src/components/upload-button.component';
|
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-button.component';
|
||||||
export * from './src/components/upload-drag-area.component';
|
export * from './src/components/upload-drag-area.component';
|
||||||
export * from './src/services/upload.service';
|
export * from './src/services/upload.service';
|
||||||
export * from './src/directives/file-select.directive';
|
|
||||||
export * from './src/directives/file-draggable.directive';
|
export * from './src/directives/file-draggable.directive';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
component: [UploadDragAreaComponent, UploadButtonComponent],
|
component: [UploadDragAreaComponent, UploadButtonComponent],
|
||||||
directives: [FileSelectDirective, FileDraggableDirective]
|
directives: [FileDraggableDirective]
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ALFRESCO_ULPOAD_COMPONENT: [any] = [
|
export const ALFRESCO_ULPOAD_COMPONENT: [any] = [
|
||||||
UploadDragAreaComponent,
|
UploadDragAreaComponent,
|
||||||
UploadButtonComponent,
|
UploadButtonComponent,
|
||||||
FileSelectDirective,
|
|
||||||
FileDraggableDirective
|
FileDraggableDirective
|
||||||
];
|
];
|
||||||
|
@@ -16,13 +16,33 @@
|
|||||||
*/
|
*/
|
||||||
import { ElementRef } from 'angular2/core';
|
import { ElementRef } from 'angular2/core';
|
||||||
import { FileModel } from '../models/file.model';
|
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 {
|
export declare class FileUploadingDialogComponent {
|
||||||
el: ElementRef;
|
el: ElementRef;
|
||||||
filesUploadingList: FileModel[];
|
filesUploadingList: FileModel[];
|
||||||
_isDialogActive: boolean;
|
private _isDialogActive;
|
||||||
_isDialogMinimized: boolean;
|
private _isDialogMinimized;
|
||||||
constructor(el: ElementRef);
|
constructor(el: ElementRef);
|
||||||
toggleDialog($event: any): void;
|
/**
|
||||||
|
* Display and hide the dialog component.
|
||||||
|
*/
|
||||||
|
toggleShowDialog($event: any): void;
|
||||||
|
/**
|
||||||
|
* Display the dialog if hidden.
|
||||||
|
*/
|
||||||
showDialog(): void;
|
showDialog(): void;
|
||||||
|
/**
|
||||||
|
* Minimize and expand the dialog component.
|
||||||
|
*/
|
||||||
toggleDialogMinimize($event: any): void;
|
toggleDialogMinimize($event: any): void;
|
||||||
}
|
}
|
||||||
|
@@ -9,7 +9,7 @@
|
|||||||
<i class="material-icons up">keyboard_arrow_up</i>
|
<i class="material-icons up">keyboard_arrow_up</i>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="close-button" (click)="toggleDialog($event)">
|
<div class="close-button" (click)="toggleShowDialog($event)">
|
||||||
<i class="material-icons">clear</i>
|
<i class="material-icons">clear</i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@@ -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;
|
file_uploading_list_component_1 = file_uploading_list_component_1_1;
|
||||||
}],
|
}],
|
||||||
execute: function() {
|
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 () {
|
FileUploadingDialogComponent = (function () {
|
||||||
function FileUploadingDialogComponent(el) {
|
function FileUploadingDialogComponent(el) {
|
||||||
this.el = el;
|
this.el = el;
|
||||||
@@ -44,12 +55,21 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
|
|||||||
this._isDialogMinimized = false;
|
this._isDialogMinimized = false;
|
||||||
console.log('FileUploadingDialogComponent constructor', el);
|
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;
|
this._isDialogActive = !this._isDialogActive;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Display the dialog if hidden.
|
||||||
|
*/
|
||||||
FileUploadingDialogComponent.prototype.showDialog = function () {
|
FileUploadingDialogComponent.prototype.showDialog = function () {
|
||||||
this._isDialogActive = true;
|
this._isDialogActive = true;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Minimize and expand the dialog component.
|
||||||
|
*/
|
||||||
FileUploadingDialogComponent.prototype.toggleDialogMinimize = function ($event) {
|
FileUploadingDialogComponent.prototype.toggleDialogMinimize = function ($event) {
|
||||||
this._isDialogMinimized = !this._isDialogMinimized;
|
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],
|
directives: [file_uploading_list_component_1.FileUploadingListComponent],
|
||||||
templateUrl: './file-uploading-dialog.component.html',
|
templateUrl: './file-uploading-dialog.component.html',
|
||||||
styleUrls: ['./file-uploading-dialog.component.css'],
|
styleUrls: ['./file-uploading-dialog.component.css'],
|
||||||
host: { '[class.dialog-show]': 'toggleDialog' }
|
host: { '[class.dialog-show]': 'toggleShowDialog' }
|
||||||
}),
|
}),
|
||||||
__metadata('design:paramtypes', [core_1.ElementRef])
|
__metadata('design:paramtypes', [core_1.ElementRef])
|
||||||
], FileUploadingDialogComponent);
|
], FileUploadingDialogComponent);
|
||||||
|
@@ -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"}
|
@@ -20,37 +20,57 @@ import {Component, ElementRef, Input} from 'angular2/core';
|
|||||||
import {FileModel} from '../models/file.model';
|
import {FileModel} from '../models/file.model';
|
||||||
import {FileUploadingListComponent} from './file-uploading-list.component';
|
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({
|
@Component({
|
||||||
selector: 'file-uploading-dialog',
|
selector: 'file-uploading-dialog',
|
||||||
moduleId: __moduleName,
|
moduleId: __moduleName,
|
||||||
directives: [FileUploadingListComponent],
|
directives: [FileUploadingListComponent],
|
||||||
templateUrl: './file-uploading-dialog.component.html',
|
templateUrl: './file-uploading-dialog.component.html',
|
||||||
styleUrls: ['./file-uploading-dialog.component.css'],
|
styleUrls: ['./file-uploading-dialog.component.css'],
|
||||||
host: {'[class.dialog-show]': 'toggleDialog'}
|
host: {'[class.dialog-show]': 'toggleShowDialog'}
|
||||||
})
|
})
|
||||||
export class FileUploadingDialogComponent {
|
export class FileUploadingDialogComponent {
|
||||||
|
|
||||||
@Input()
|
@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);
|
console.log('FileUploadingDialogComponent constructor', el);
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleDialog($event) {
|
/**
|
||||||
|
* Display and hide the dialog component.
|
||||||
|
*/
|
||||||
|
toggleShowDialog($event) {
|
||||||
this._isDialogActive = !this._isDialogActive;
|
this._isDialogActive = !this._isDialogActive;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Display the dialog if hidden.
|
||||||
|
*/
|
||||||
showDialog() {
|
showDialog() {
|
||||||
this._isDialogActive = true;
|
this._isDialogActive = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Minimize and expand the dialog component.
|
||||||
|
*/
|
||||||
toggleDialogMinimize($event) {
|
toggleDialogMinimize($event) {
|
||||||
this._isDialogMinimized = !this._isDialogMinimized;
|
this._isDialogMinimized = !this._isDialogMinimized;
|
||||||
}
|
}
|
||||||
|
@@ -16,9 +16,24 @@
|
|||||||
*/
|
*/
|
||||||
import { ElementRef } from 'angular2/core';
|
import { ElementRef } from 'angular2/core';
|
||||||
import { FileModel } from '../models/file.model';
|
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 {
|
export declare class FileUploadingListComponent {
|
||||||
el: ElementRef;
|
el: ElementRef;
|
||||||
filesUploadingList: FileModel[];
|
filesUploadingList: FileModel[];
|
||||||
constructor(el: ElementRef);
|
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;
|
abort(id: any): void;
|
||||||
}
|
}
|
||||||
|
@@ -34,6 +34,16 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
|||||||
core_1 = core_1_1;
|
core_1 = core_1_1;
|
||||||
}],
|
}],
|
||||||
execute: function() {
|
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 () {
|
FileUploadingListComponent = (function () {
|
||||||
function FileUploadingListComponent(el) {
|
function FileUploadingListComponent(el) {
|
||||||
this.el = 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');
|
console.log('Check for async update from drag directive');
|
||||||
}, 1000);
|
}, 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) {
|
FileUploadingListComponent.prototype.abort = function (id) {
|
||||||
var file = this.filesUploadingList.filter(function (uploadingFileModel) {
|
var file = this.filesUploadingList.filter(function (uploadingFileModel) {
|
||||||
return uploadingFileModel.id == id;
|
return uploadingFileModel.id == id;
|
||||||
|
@@ -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"}
|
@@ -19,8 +19,18 @@
|
|||||||
import {Component, ElementRef, Input} from 'angular2/core';
|
import {Component, ElementRef, Input} from 'angular2/core';
|
||||||
import {FileModel} from '../models/file.model';
|
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({
|
@Component({
|
||||||
selector: 'alfresco-file-uploading-list',
|
selector: 'alfresco-file-uploading-list',
|
||||||
moduleId: __moduleName,
|
moduleId: __moduleName,
|
||||||
@@ -30,9 +40,9 @@ declare let __moduleName:string;
|
|||||||
export class FileUploadingListComponent {
|
export class FileUploadingListComponent {
|
||||||
|
|
||||||
@Input()
|
@Input()
|
||||||
filesUploadingList:FileModel [];
|
filesUploadingList: FileModel [];
|
||||||
|
|
||||||
constructor(public el:ElementRef) {
|
constructor(public el: ElementRef) {
|
||||||
console.log('filesUploadingList constructor', el);
|
console.log('filesUploadingList constructor', el);
|
||||||
|
|
||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
@@ -40,7 +50,12 @@ export class FileUploadingListComponent {
|
|||||||
}, 1000);
|
}, 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) => {
|
let file = this.filesUploadingList.filter((uploadingFileModel) => {
|
||||||
return uploadingFileModel.id == id;
|
return uploadingFileModel.id == id;
|
||||||
});
|
});
|
||||||
|
@@ -17,14 +17,51 @@
|
|||||||
import { ElementRef } from 'angular2/core';
|
import { ElementRef } from 'angular2/core';
|
||||||
import { FileModel } from '../models/file.model';
|
import { FileModel } from '../models/file.model';
|
||||||
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
|
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 {
|
export declare class UploadButtonComponent {
|
||||||
el: ElementRef;
|
el: ElementRef;
|
||||||
private _uploaderService;
|
private _uploaderService;
|
||||||
undoNotificationBar: any;
|
undoNotificationBar: any;
|
||||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||||
|
showUploadDialog: boolean;
|
||||||
|
showUdoNotificationBar: boolean;
|
||||||
|
uploadFolders: boolean;
|
||||||
|
multipleFiles: boolean;
|
||||||
|
acceptedFilesType: string;
|
||||||
filesUploadingList: FileModel[];
|
filesUploadingList: FileModel[];
|
||||||
constructor(el: ElementRef);
|
constructor(el: ElementRef);
|
||||||
onFilesAdded(files: any): void;
|
/**
|
||||||
showUndoNotificationBar(latestFilesAdded: any): void;
|
* Method called when files are dropped in the drag area.
|
||||||
showDialog(): void;
|
*
|
||||||
|
* @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();
|
||||||
}
|
}
|
||||||
|
@@ -1,46 +1,45 @@
|
|||||||
<br>
|
|
||||||
|
|
||||||
<!--upload buttons-->
|
|
||||||
|
|
||||||
<form>
|
<form>
|
||||||
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
<!--Files Upload-->
|
||||||
<i class="material-icons">file_upload</i> Upload<input file-select type="file" name="uploadFiles" id="uploadFiles"
|
<div *ngIf="!uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||||
multiple="multiple"
|
<i class="material-icons">file_upload</i> Upload File
|
||||||
accept=".jpg,.gif,.png,.svg,.mp4"
|
|
||||||
(onFilesAdded)="onFilesAdded($event)"
|
<!--Multiple Files Upload-->
|
||||||
#uploadFiles>
|
<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>
|
</div>
|
||||||
|
|
||||||
<br><br>
|
<!--Folders Upload-->
|
||||||
|
<div *ngIf="uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||||
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
<i class="material-icons">file_upload</i> Upload Folder
|
||||||
<i class="material-icons">file_upload</i> Upload Folder<input file-select type="file" name="uploadFiles" id="uploadFolder"
|
<input id="uploadFolder" type="file" name="uploadFiles"
|
||||||
multiple="multiple"
|
(change)="onFilesAdded($event)"
|
||||||
accept=".jpg,.gif,.png,.svg"
|
multiple="multiple"
|
||||||
(onFilesAdded)="onFilesAdded($event)"
|
accept="{{acceptedFilesType}}"
|
||||||
webkitdirectory directory
|
webkitdirectory directory
|
||||||
multiple #uploadFiles>
|
multiple #uploadFolders>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<!--show dialog-->
|
<!--Upload Dialog-->
|
||||||
<br>
|
<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
|
<!--Notification bar-->
|
||||||
Dialog
|
<div id="undo-notification-bar" [hidden]="showUdoNotificationBar" class="mdl-js-snackbar mdl-snackbar"
|
||||||
</button>
|
#undoNotificationBar>
|
||||||
|
|
||||||
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
|
|
||||||
|
|
||||||
<!--show snackbar-->
|
|
||||||
|
|
||||||
|
|
||||||
<div id="demo-snackbar-example" class="mdl-js-snackbar mdl-snackbar" #undoNotificationBar>
|
|
||||||
<div class="mdl-snackbar__text"></div>
|
<div class="mdl-snackbar__text"></div>
|
||||||
<button class="mdl-snackbar__action" type="button"></button>
|
<button class="mdl-snackbar__action" type="button"></button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br>
|
|
||||||
<br>
|
|
@@ -14,7 +14,7 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* 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";
|
"use strict";
|
||||||
var __moduleName = context_1 && context_1.id;
|
var __moduleName = context_1 && context_1.id;
|
||||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
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) {
|
var __metadata = (this && this.__metadata) || function (k, v) {
|
||||||
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(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;
|
var UploadButtonComponent;
|
||||||
return {
|
return {
|
||||||
setters:[
|
setters:[
|
||||||
@@ -38,14 +38,35 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
|||||||
},
|
},
|
||||||
function (file_uploading_dialog_component_1_1) {
|
function (file_uploading_dialog_component_1_1) {
|
||||||
file_uploading_dialog_component_1 = 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() {
|
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 () {
|
UploadButtonComponent = (function () {
|
||||||
function UploadButtonComponent(el) {
|
function UploadButtonComponent(el) {
|
||||||
this.el = el;
|
this.el = el;
|
||||||
|
this.showUploadDialog = true;
|
||||||
|
this.showUdoNotificationBar = true;
|
||||||
|
this.uploadFolders = false;
|
||||||
|
this.multipleFiles = false;
|
||||||
|
this.acceptedFilesType = '*';
|
||||||
this.filesUploadingList = [];
|
this.filesUploadingList = [];
|
||||||
console.log('UploadComponent constructor', el);
|
console.log('UploadComponent constructor', el);
|
||||||
this._uploaderService = new upload_service_1.UploadService({
|
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) {
|
if (files.length) {
|
||||||
var latestFilesAdded = this._uploaderService.addToQueue(files);
|
var latestFilesAdded = this._uploaderService.addToQueue(files);
|
||||||
this.filesUploadingList = this._uploaderService.getQueue();
|
this.filesUploadingList = this._uploaderService.getQueue();
|
||||||
this.showDialog();
|
if (this.showUploadDialog) {
|
||||||
this.showUndoNotificationBar(latestFilesAdded);
|
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) {
|
if (componentHandler) {
|
||||||
componentHandler.upgradeAllRegistered();
|
componentHandler.upgradeAllRegistered();
|
||||||
}
|
}
|
||||||
@@ -83,7 +119,10 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
|||||||
actionText: 'Undo'
|
actionText: 'Undo'
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
UploadButtonComponent.prototype.showDialog = function () {
|
/**
|
||||||
|
* Show the upload dialog.
|
||||||
|
*/
|
||||||
|
UploadButtonComponent.prototype._showDialog = function () {
|
||||||
this.fileUploadingDialogComponent.showDialog();
|
this.fileUploadingDialogComponent.showDialog();
|
||||||
};
|
};
|
||||||
__decorate([
|
__decorate([
|
||||||
@@ -94,13 +133,33 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
|||||||
core_1.ViewChild('fileUploadingDialog'),
|
core_1.ViewChild('fileUploadingDialog'),
|
||||||
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
||||||
], UploadButtonComponent.prototype, "fileUploadingDialogComponent", void 0);
|
], 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([
|
UploadButtonComponent = __decorate([
|
||||||
core_1.Component({
|
core_1.Component({
|
||||||
selector: 'alfresco-upload-button',
|
selector: 'alfresco-upload-button',
|
||||||
moduleId: __moduleName,
|
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',
|
templateUrl: './upload-button.component.html',
|
||||||
styleUrls: ['./upload-button.component.css']
|
styleUrls: ['./upload-button.component.css'],
|
||||||
}),
|
}),
|
||||||
__metadata('design:paramtypes', [core_1.ElementRef])
|
__metadata('design:paramtypes', [core_1.ElementRef])
|
||||||
], UploadButtonComponent);
|
], UploadButtonComponent);
|
||||||
|
@@ -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":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;YAWH;;;;;;;;;;;;;;;;;;eAkBG;YAQH;gBA2BI,+BAAmB,EAAc;oBAAd,OAAE,GAAF,EAAE,CAAY;oBAhBjC,qBAAgB,GAAY,IAAI,CAAC;oBAGjC,2BAAsB,GAAY,IAAI,CAAC;oBAGvC,kBAAa,GAAY,KAAK,CAAC;oBAG/B,kBAAa,GAAY,KAAK,CAAC;oBAG/B,sBAAiB,GAAW,GAAG,CAAC;oBAEhC,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,4CAAY,GAAZ,UAAa,MAAM;oBACf,IAAI,KAAK,GAAG,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC;oBACvC,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,EAAE,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC;4BACxB,IAAI,CAAC,WAAW,EAAE,CAAC;wBACvB,CAAC;wBACD,EAAE,CAAA,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC;4BAC7B,IAAI,CAAC,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;wBACpD,CAAC;oBACL,CAAC;gBACL,CAAC;gBAED;;;;mBAIG;gBACK,wDAAwB,GAAhC,UAAiC,gBAAgB;oBAC7C,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;;mBAEG;gBACK,2CAAW,GAAnB;oBACI,IAAI,CAAC,4BAA4B,CAAC,UAAU,EAAE,CAAC;gBACnD,CAAC;gBArFD;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;kFAAA;gBAGjC;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;2FAAA;gBAGjC;oBAAC,YAAK,EAAE;;+EAAA;gBAGR;oBAAC,YAAK,EAAE;;qFAAA;gBAGR;oBAAC,YAAK,EAAE;;4EAAA;gBAGR;oBAAC,YAAK,EAAE;;4EAAA;gBAGR;oBAAC,YAAK,EAAE;;gFAAA;gBA7BZ;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,wBAAwB;wBAClC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,8DAA4B,CAAC;wBAC1C,WAAW,EAAE,gCAAgC;wBAC7C,SAAS,EAAE,CAAC,+BAA+B,CAAC;qBAC/C,CAAC;;yCAAA;gBA2FF,4BAAC;YAAD,CAAC,AA1FD,IA0FC;YA1FD,yDA0FC,CAAA"}
|
@@ -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 {UploadService} from '../services/upload.service';
|
||||||
import {FileModel} from '../models/file.model';
|
import {FileModel} from '../models/file.model';
|
||||||
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
|
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 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({
|
@Component({
|
||||||
selector: 'alfresco-upload-button',
|
selector: 'alfresco-upload-button',
|
||||||
moduleId: __moduleName,
|
moduleId: __moduleName,
|
||||||
directives: [FileSelectDirective, FileUploadingDialogComponent],
|
directives: [FileUploadingDialogComponent],
|
||||||
templateUrl: './upload-button.component.html',
|
templateUrl: './upload-button.component.html',
|
||||||
styleUrls: ['./upload-button.component.css']
|
styleUrls: ['./upload-button.component.css'],
|
||||||
})
|
})
|
||||||
export class UploadButtonComponent {
|
export class UploadButtonComponent {
|
||||||
|
|
||||||
private _uploaderService:UploadService;
|
private _uploaderService: UploadService;
|
||||||
|
|
||||||
@ViewChild('undoNotificationBar')
|
@ViewChild('undoNotificationBar')
|
||||||
undoNotificationBar;
|
undoNotificationBar;
|
||||||
|
|
||||||
@ViewChild('fileUploadingDialog')
|
@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);
|
console.log('UploadComponent constructor', el);
|
||||||
|
|
||||||
this._uploaderService = new UploadService({
|
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) {
|
if (files.length) {
|
||||||
let latestFilesAdded = this._uploaderService.addToQueue(files);
|
let latestFilesAdded = this._uploaderService.addToQueue(files);
|
||||||
this.filesUploadingList = this._uploaderService.getQueue();
|
this.filesUploadingList = this._uploaderService.getQueue();
|
||||||
this.showDialog();
|
if (this.showUploadDialog) {
|
||||||
this.showUndoNotificationBar(latestFilesAdded);
|
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) {
|
if (componentHandler) {
|
||||||
componentHandler.upgradeAllRegistered();
|
componentHandler.upgradeAllRegistered();
|
||||||
}
|
}
|
||||||
@@ -87,7 +134,10 @@ export class UploadButtonComponent {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
showDialog():void {
|
/**
|
||||||
|
* Show the upload dialog.
|
||||||
|
*/
|
||||||
|
private _showDialog(): void {
|
||||||
this.fileUploadingDialogComponent.showDialog();
|
this.fileUploadingDialogComponent.showDialog();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@@ -17,12 +17,31 @@
|
|||||||
import { ElementRef } from 'angular2/core';
|
import { ElementRef } from 'angular2/core';
|
||||||
import { FileModel } from '../models/file.model';
|
import { FileModel } from '../models/file.model';
|
||||||
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
|
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 {
|
export declare class UploadDragAreaComponent {
|
||||||
el: ElementRef;
|
el: ElementRef;
|
||||||
private _uploaderService;
|
private _uploaderService;
|
||||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||||
|
showUploadDialog: boolean;
|
||||||
filesUploadingList: FileModel[];
|
filesUploadingList: FileModel[];
|
||||||
constructor(el: ElementRef);
|
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();
|
||||||
}
|
}
|
||||||
|
@@ -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>
|
dropzone="" webkitdropzone="copy file:image/png file:image/gif file:image/jpeg" #droparea>
|
||||||
<ng-content></ng-content>
|
<ng-content></ng-content>
|
||||||
</div>
|
</div>
|
||||||
|
<file-uploading-dialog [hidden]="showDialogUpload" [filesUploadingList]="filesUploadingList"
|
||||||
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
|
#fileUploadingDialog></file-uploading-dialog>
|
||||||
|
@@ -43,9 +43,20 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
|||||||
file_draggable_directive_1 = file_draggable_directive_1_1;
|
file_draggable_directive_1 = file_draggable_directive_1_1;
|
||||||
}],
|
}],
|
||||||
execute: function() {
|
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 () {
|
UploadDragAreaComponent = (function () {
|
||||||
function UploadDragAreaComponent(el) {
|
function UploadDragAreaComponent(el) {
|
||||||
this.el = el;
|
this.el = el;
|
||||||
|
this.showUploadDialog = true;
|
||||||
this.filesUploadingList = [];
|
this.filesUploadingList = [];
|
||||||
console.log('UploadComponent constructor', el);
|
console.log('UploadComponent constructor', el);
|
||||||
this._uploaderService = new upload_service_1.UploadService({
|
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) {
|
if (files.length) {
|
||||||
this._uploaderService.addToQueue(files);
|
this._uploaderService.addToQueue(files);
|
||||||
this.filesUploadingList = this._uploaderService.getQueue();
|
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();
|
this.fileUploadingDialogComponent.showDialog();
|
||||||
};
|
};
|
||||||
__decorate([
|
__decorate([
|
||||||
core_1.ViewChild('fileUploadingDialog'),
|
core_1.ViewChild('fileUploadingDialog'),
|
||||||
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
||||||
], UploadDragAreaComponent.prototype, "fileUploadingDialogComponent", void 0);
|
], UploadDragAreaComponent.prototype, "fileUploadingDialogComponent", void 0);
|
||||||
|
__decorate([
|
||||||
|
core_1.Input(),
|
||||||
|
__metadata('design:type', Boolean)
|
||||||
|
], UploadDragAreaComponent.prototype, "showUploadDialog", void 0);
|
||||||
UploadDragAreaComponent = __decorate([
|
UploadDragAreaComponent = __decorate([
|
||||||
core_1.Component({
|
core_1.Component({
|
||||||
selector: 'alfresco-upload-drag-area',
|
selector: 'alfresco-upload-drag-area',
|
||||||
|
@@ -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"}
|
@@ -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 {UploadService} from '../services/upload.service';
|
||||||
import {FileModel} from '../models/file.model';
|
import {FileModel} from '../models/file.model';
|
||||||
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
|
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
|
||||||
import {FileDraggableDirective} from '../directives/file-draggable.directive';
|
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({
|
@Component({
|
||||||
selector: 'alfresco-upload-drag-area',
|
selector: 'alfresco-upload-drag-area',
|
||||||
moduleId: __moduleName,
|
moduleId: __moduleName,
|
||||||
@@ -33,14 +43,17 @@ declare let __moduleName:string;
|
|||||||
})
|
})
|
||||||
export class UploadDragAreaComponent {
|
export class UploadDragAreaComponent {
|
||||||
|
|
||||||
private _uploaderService:UploadService;
|
private _uploaderService: UploadService;
|
||||||
|
|
||||||
@ViewChild('fileUploadingDialog')
|
@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);
|
console.log('UploadComponent constructor', el);
|
||||||
|
|
||||||
this._uploaderService = new UploadService({
|
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) {
|
if (files.length) {
|
||||||
this._uploaderService.addToQueue(files);
|
this._uploaderService.addToQueue(files);
|
||||||
this.filesUploadingList = this._uploaderService.getQueue();
|
this.filesUploadingList = this._uploaderService.getQueue();
|
||||||
this.showDialog();
|
if (this.showUploadDialog) {
|
||||||
|
this._showDialog();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
showDialog():void {
|
/**
|
||||||
|
* Show the upload dialog.
|
||||||
|
*/
|
||||||
|
private _showDialog(): void {
|
||||||
this.fileUploadingDialogComponent.showDialog();
|
this.fileUploadingDialogComponent.showDialog();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@@ -15,15 +15,51 @@
|
|||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { ElementRef, EventEmitter } from 'angular2/core';
|
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 {
|
export declare class FileDraggableDirective {
|
||||||
el: ElementRef;
|
el: ElementRef;
|
||||||
onFilesAdded: EventEmitter<any>;
|
onFilesDropped: EventEmitter<any>;
|
||||||
files: File[];
|
files: File[];
|
||||||
private _inputFocusClass;
|
private _inputFocusClass;
|
||||||
constructor(el: ElementRef);
|
constructor(el: ElementRef);
|
||||||
|
/**
|
||||||
|
* Method called when files is dropped in the drag and drop area.
|
||||||
|
*
|
||||||
|
* @param {$event} $event - DOM $event.
|
||||||
|
*/
|
||||||
private _onDropFiles($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);
|
private _onDragEnter($event);
|
||||||
|
/**
|
||||||
|
* Change the style of the drag area when a file drag out.
|
||||||
|
*
|
||||||
|
* @param {$event} $event - DOM $event.
|
||||||
|
*/
|
||||||
private _onDragLeave($event);
|
private _onDragLeave($event);
|
||||||
|
/**
|
||||||
|
* Prevent default and stop propagation of the DOM event.
|
||||||
|
*
|
||||||
|
* @param {$event} $event - DOM $event.
|
||||||
|
*/
|
||||||
private _preventDefault($event);
|
private _preventDefault($event);
|
||||||
}
|
}
|
||||||
|
@@ -34,35 +34,55 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
|||||||
core_1 = core_1_1;
|
core_1 = core_1_1;
|
||||||
}],
|
}],
|
||||||
execute: function() {
|
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 () {
|
FileDraggableDirective = (function () {
|
||||||
function FileDraggableDirective(el) {
|
function FileDraggableDirective(el) {
|
||||||
this.el = el;
|
this.el = el;
|
||||||
this.onFilesAdded = new core_1.EventEmitter();
|
this.onFilesDropped = new core_1.EventEmitter();
|
||||||
this._inputFocusClass = false;
|
this._inputFocusClass = false;
|
||||||
console.log('FileDraggableComponent constructor', el);
|
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) {
|
FileDraggableDirective.prototype._onDropFiles = function ($event) {
|
||||||
this._preventDefault($event);
|
this._preventDefault($event);
|
||||||
var items = $event.dataTransfer.items;
|
var items = $event.dataTransfer.items;
|
||||||
for (var i = 0; i < items.length; i++) {
|
for (var i = 0; i < items.length; i++) {
|
||||||
var item = items[i].webkitGetAsEntry();
|
var item = items[i].webkitGetAsEntry();
|
||||||
if (item) {
|
if (item) {
|
||||||
this._traverseFileTree(item, -1);
|
this._traverseFileTree(item);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
var dt = $event.dataTransfer;
|
var dt = $event.dataTransfer;
|
||||||
var files = dt.files;
|
var files = dt.files;
|
||||||
this.onFilesAdded.emit(files);
|
this.onFilesDropped.emit(files);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.onFilesAdded.emit([]);
|
|
||||||
this._inputFocusClass = false;
|
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) {
|
if (item.isFile) {
|
||||||
var self_1 = this;
|
var self_1 = this;
|
||||||
item.file(function (file) {
|
item.file(function (file) {
|
||||||
self_1.onFilesAdded.emit([file]);
|
self_1.onFilesDropped.emit([file]);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
@@ -71,20 +91,35 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
|||||||
var dirReader = item.createReader();
|
var dirReader = item.createReader();
|
||||||
dirReader.readEntries(function (entries) {
|
dirReader.readEntries(function (entries) {
|
||||||
for (var i = 0; i < entries.length; i++) {
|
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) {
|
FileDraggableDirective.prototype._onDragEnter = function ($event) {
|
||||||
this._preventDefault($event);
|
this._preventDefault($event);
|
||||||
this._inputFocusClass = true;
|
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) {
|
FileDraggableDirective.prototype._onDragLeave = function ($event) {
|
||||||
this._preventDefault($event);
|
this._preventDefault($event);
|
||||||
this._inputFocusClass = false;
|
this._inputFocusClass = false;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Prevent default and stop propagation of the DOM event.
|
||||||
|
*
|
||||||
|
* @param {$event} $event - DOM $event.
|
||||||
|
*/
|
||||||
FileDraggableDirective.prototype._preventDefault = function ($event) {
|
FileDraggableDirective.prototype._preventDefault = function ($event) {
|
||||||
$event.stopPropagation();
|
$event.stopPropagation();
|
||||||
$event.preventDefault();
|
$event.preventDefault();
|
||||||
@@ -92,7 +127,7 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
|||||||
__decorate([
|
__decorate([
|
||||||
core_1.Output(),
|
core_1.Output(),
|
||||||
__metadata('design:type', core_1.EventEmitter)
|
__metadata('design:type', core_1.EventEmitter)
|
||||||
], FileDraggableDirective.prototype, "onFilesAdded", void 0);
|
], FileDraggableDirective.prototype, "onFilesDropped", void 0);
|
||||||
FileDraggableDirective = __decorate([
|
FileDraggableDirective = __decorate([
|
||||||
core_1.Directive({
|
core_1.Directive({
|
||||||
selector: '[file-draggable]',
|
selector: '[file-draggable]',
|
||||||
|
@@ -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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"}
|
@@ -17,6 +17,17 @@
|
|||||||
|
|
||||||
import {Directive, ElementRef, EventEmitter, Output} from 'angular2/core';
|
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({
|
@Directive({
|
||||||
selector: '[file-draggable]',
|
selector: '[file-draggable]',
|
||||||
host: {
|
host: {
|
||||||
@@ -28,39 +39,51 @@ import {Directive, ElementRef, EventEmitter, Output} from 'angular2/core';
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
export class FileDraggableDirective {
|
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);
|
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);
|
this._preventDefault($event);
|
||||||
|
|
||||||
var items = $event.dataTransfer.items;
|
var items = $event.dataTransfer.items;
|
||||||
for (var i = 0; i < items.length; i++) {
|
for (var i = 0; i < items.length; i++) {
|
||||||
var item = items[i].webkitGetAsEntry();
|
var item = items[i].webkitGetAsEntry();
|
||||||
if (item) {
|
if (item) {
|
||||||
this._traverseFileTree(item, -1);
|
this._traverseFileTree(item);
|
||||||
} else {
|
} else {
|
||||||
let dt = $event.dataTransfer;
|
let dt = $event.dataTransfer;
|
||||||
let files = dt.files;
|
let files = dt.files;
|
||||||
this.onFilesAdded.emit(files);
|
this.onFilesDropped.emit(files);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.onFilesAdded.emit([]);
|
|
||||||
|
|
||||||
this._inputFocusClass = false;
|
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) {
|
if (item.isFile) {
|
||||||
let self = this;
|
let self = this;
|
||||||
item.file(function (file) {
|
item.file(function (file) {
|
||||||
self.onFilesAdded.emit([file]);
|
self.onFilesDropped.emit([file]);
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
if (item.isDirectory) {
|
if (item.isDirectory) {
|
||||||
@@ -68,26 +91,41 @@ export class FileDraggableDirective {
|
|||||||
let dirReader = item.createReader();
|
let dirReader = item.createReader();
|
||||||
dirReader.readEntries(function (entries) {
|
dirReader.readEntries(function (entries) {
|
||||||
for (var i = 0; i < entries.length; i++) {
|
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._preventDefault($event);
|
||||||
|
|
||||||
this._inputFocusClass = true;
|
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._preventDefault($event);
|
||||||
|
|
||||||
this._inputFocusClass = false;
|
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.stopPropagation();
|
||||||
$event.preventDefault();
|
$event.preventDefault();
|
||||||
}
|
}
|
||||||
|
@@ -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();
|
|
||||||
}
|
|
@@ -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
|
|
@@ -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"}
|
|
@@ -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);
|
|
||||||
}
|
|
||||||
}
|
|
@@ -14,6 +14,13 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* This object represent the status of an uploading file.
|
||||||
|
*
|
||||||
|
*
|
||||||
|
* @returns {FileModel} .
|
||||||
|
*/
|
||||||
export declare class FileModel {
|
export declare class FileModel {
|
||||||
id: string;
|
id: string;
|
||||||
status: number;
|
status: number;
|
||||||
@@ -33,8 +40,24 @@ export declare class FileModel {
|
|||||||
setError(): void;
|
setError(): void;
|
||||||
setUploading(): void;
|
setUploading(): void;
|
||||||
setXMLHttpRequest(xmlHttpRequest: XMLHttpRequest): void;
|
setXMLHttpRequest(xmlHttpRequest: XMLHttpRequest): void;
|
||||||
|
/**
|
||||||
|
* Stop the uploading of the file.
|
||||||
|
*/
|
||||||
setAbort(): void;
|
setAbort(): void;
|
||||||
|
/**
|
||||||
|
* Update status of the file when upload finish or is ended.
|
||||||
|
*/
|
||||||
onFinished(status: number, statusText: string, response: string): void;
|
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);
|
private _getFileSize(sizeinbytes);
|
||||||
|
/**
|
||||||
|
* Calculate the size of the file in kb,mb and gb.
|
||||||
|
*
|
||||||
|
* @return {string} - return a unique file uploading id.
|
||||||
|
*/
|
||||||
private _generateId();
|
private _generateId();
|
||||||
}
|
}
|
||||||
|
@@ -21,6 +21,13 @@ System.register([], function(exports_1, context_1) {
|
|||||||
return {
|
return {
|
||||||
setters:[],
|
setters:[],
|
||||||
execute: function() {
|
execute: function() {
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* This object represent the status of an uploading file.
|
||||||
|
*
|
||||||
|
*
|
||||||
|
* @returns {FileModel} .
|
||||||
|
*/
|
||||||
FileModel = (function () {
|
FileModel = (function () {
|
||||||
function FileModel(file) {
|
function FileModel(file) {
|
||||||
this.done = false;
|
this.done = false;
|
||||||
@@ -49,6 +56,9 @@ System.register([], function(exports_1, context_1) {
|
|||||||
FileModel.prototype.setXMLHttpRequest = function (xmlHttpRequest) {
|
FileModel.prototype.setXMLHttpRequest = function (xmlHttpRequest) {
|
||||||
this._xmlHttpRequest = xmlHttpRequest;
|
this._xmlHttpRequest = xmlHttpRequest;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Stop the uploading of the file.
|
||||||
|
*/
|
||||||
FileModel.prototype.setAbort = function () {
|
FileModel.prototype.setAbort = function () {
|
||||||
if (!this.done && !this.error) {
|
if (!this.done && !this.error) {
|
||||||
this.abort = true;
|
this.abort = true;
|
||||||
@@ -56,6 +66,9 @@ System.register([], function(exports_1, context_1) {
|
|||||||
this._xmlHttpRequest.abort();
|
this._xmlHttpRequest.abort();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Update status of the file when upload finish or is ended.
|
||||||
|
*/
|
||||||
FileModel.prototype.onFinished = function (status, statusText, response) {
|
FileModel.prototype.onFinished = function (status, statusText, response) {
|
||||||
this.status = status;
|
this.status = status;
|
||||||
this.statusText = statusText;
|
this.statusText = statusText;
|
||||||
@@ -63,6 +76,11 @@ System.register([], function(exports_1, context_1) {
|
|||||||
this.done = true;
|
this.done = true;
|
||||||
this.uploading = false;
|
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) {
|
FileModel.prototype._getFileSize = function (sizeinbytes) {
|
||||||
var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
|
var fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
|
||||||
var size = sizeinbytes;
|
var size = sizeinbytes;
|
||||||
@@ -73,8 +91,13 @@ System.register([], function(exports_1, context_1) {
|
|||||||
}
|
}
|
||||||
return Math.round((Math.round(size * 100) / 100)) + ' ' + fSExt[i];
|
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 () {
|
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);
|
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||||||
return v.toString(16);
|
return v.toString(16);
|
||||||
});
|
});
|
||||||
|
@@ -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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"}
|
@@ -15,23 +15,29 @@
|
|||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* This object represent the status of an uploading file.
|
||||||
|
*
|
||||||
|
*
|
||||||
|
* @returns {FileModel} .
|
||||||
|
*/
|
||||||
export class FileModel {
|
export class FileModel {
|
||||||
id:string;
|
id: string;
|
||||||
status:number;
|
status: number;
|
||||||
statusText:string;
|
statusText: string;
|
||||||
progress:Object;
|
progress: Object;
|
||||||
name:string;
|
name: string;
|
||||||
size:string;
|
size: string;
|
||||||
response:string;
|
response: string;
|
||||||
done:boolean = false;
|
done: boolean = false;
|
||||||
error:boolean = false;
|
error: boolean = false;
|
||||||
abort:boolean = false;
|
abort: boolean = false;
|
||||||
uploading:boolean = false;
|
uploading: boolean = false;
|
||||||
file:any;
|
file: any;
|
||||||
_xmlHttpRequest:XMLHttpRequest;
|
_xmlHttpRequest: XMLHttpRequest;
|
||||||
|
|
||||||
constructor(file:any) {
|
constructor(file: any) {
|
||||||
this.file = file;
|
this.file = file;
|
||||||
this.id = this._generateId();
|
this.id = this._generateId();
|
||||||
this.name = file.name;
|
this.name = file.name;
|
||||||
@@ -43,31 +49,37 @@ export class FileModel {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
setProgres(progress:any):void {
|
setProgres(progress: any): void {
|
||||||
this.progress = progress;
|
this.progress = progress;
|
||||||
}
|
}
|
||||||
|
|
||||||
setError():void {
|
setError(): void {
|
||||||
this.error = true;
|
this.error = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
setUploading(){
|
setUploading() {
|
||||||
this.uploading = true;
|
this.uploading = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
setXMLHttpRequest(xmlHttpRequest:XMLHttpRequest){
|
setXMLHttpRequest(xmlHttpRequest: XMLHttpRequest) {
|
||||||
this._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.abort = true;
|
||||||
this.uploading = false;
|
this.uploading = false;
|
||||||
this._xmlHttpRequest.abort();
|
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.status = status;
|
||||||
this.statusText = statusText;
|
this.statusText = statusText;
|
||||||
this.response = response;
|
this.response = response;
|
||||||
@@ -75,7 +87,12 @@ export class FileModel {
|
|||||||
this.uploading = false;
|
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 fSExt = new Array('Bytes', 'KB', 'MB', 'GB');
|
||||||
let size = sizeinbytes;
|
let size = sizeinbytes;
|
||||||
let i = 0;
|
let i = 0;
|
||||||
@@ -86,8 +103,13 @@ export class FileModel {
|
|||||||
return Math.round((Math.round(size * 100) / 100)) + ' ' + fSExt[i];
|
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);
|
let r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||||||
return v.toString(16);
|
return v.toString(16);
|
||||||
});
|
});
|
||||||
|
@@ -15,6 +15,12 @@
|
|||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { FileModel } from '../models/file.model';
|
import { FileModel } from '../models/file.model';
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* UploadService keep the queue of the file to upload and uploads them.
|
||||||
|
*
|
||||||
|
* @returns {UploadService} .
|
||||||
|
*/
|
||||||
export declare class UploadService {
|
export declare class UploadService {
|
||||||
private options;
|
private options;
|
||||||
private _url;
|
private _url;
|
||||||
@@ -24,11 +30,37 @@ export declare class UploadService {
|
|||||||
private _fieldName;
|
private _fieldName;
|
||||||
private _formFields;
|
private _formFields;
|
||||||
private _withCredentials;
|
private _withCredentials;
|
||||||
_queue: FileModel[];
|
private _queue;
|
||||||
constructor(options: any);
|
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[];
|
addToQueue(files: any[]): FileModel[];
|
||||||
|
/**
|
||||||
|
* Pick all the files in the queue that are not been uploaded yet and upload it.
|
||||||
|
*/
|
||||||
private _uploadFilesInTheQueue();
|
private _uploadFilesInTheQueue();
|
||||||
|
/**
|
||||||
|
* Upload a file, and enrich it with the xhr.
|
||||||
|
*
|
||||||
|
* @param {FileModel} - files to be uploaded.
|
||||||
|
*
|
||||||
|
*/
|
||||||
uploadFile(uploadingFileModel: any): void;
|
uploadFile(uploadingFileModel: any): void;
|
||||||
|
/**
|
||||||
|
* Return all the files in the uploading queue.
|
||||||
|
*
|
||||||
|
* @return {FileModel[]} - files in the upload queue.
|
||||||
|
*/
|
||||||
getQueue(): FileModel[];
|
getQueue(): FileModel[];
|
||||||
|
/**
|
||||||
|
* Check if an item is a file.
|
||||||
|
*
|
||||||
|
* @return {boolean}
|
||||||
|
*/
|
||||||
private _isFile(file);
|
private _isFile(file);
|
||||||
}
|
}
|
||||||
|
@@ -25,6 +25,12 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
|
|||||||
file_model_1 = file_model_1_1;
|
file_model_1 = file_model_1_1;
|
||||||
}],
|
}],
|
||||||
execute: function() {
|
execute: function() {
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* UploadService keep the queue of the file to upload and uploads them.
|
||||||
|
*
|
||||||
|
* @returns {UploadService} .
|
||||||
|
*/
|
||||||
UploadService = (function () {
|
UploadService = (function () {
|
||||||
function UploadService(options) {
|
function UploadService(options) {
|
||||||
this.options = 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._fieldName = options.fieldName != null ? options.fieldName : this._fieldName;
|
||||||
this._formFields = options.formFields != null ? options.formFields : this._formFields;
|
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) {
|
UploadService.prototype.addToQueue = function (files) {
|
||||||
var latestFilesAdded = [];
|
var latestFilesAdded = [];
|
||||||
for (var _i = 0, files_1 = files; _i < files_1.length; _i++) {
|
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();
|
this._uploadFilesInTheQueue();
|
||||||
return latestFilesAdded;
|
return latestFilesAdded;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Pick all the files in the queue that are not been uploaded yet and upload it.
|
||||||
|
*/
|
||||||
UploadService.prototype._uploadFilesInTheQueue = function () {
|
UploadService.prototype._uploadFilesInTheQueue = function () {
|
||||||
var _this = this;
|
var _this = this;
|
||||||
var filesToUpload = this._queue.filter(function (uploadingFileModel) {
|
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) {
|
UploadService.prototype.uploadFile = function (uploadingFileModel) {
|
||||||
var _this = this;
|
var _this = this;
|
||||||
var form = new FormData();
|
var form = new FormData();
|
||||||
@@ -103,9 +125,19 @@ System.register(['../models/file.model'], function(exports_1, context_1) {
|
|||||||
}
|
}
|
||||||
xmlHttpRequest.send(form);
|
xmlHttpRequest.send(form);
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Return all the files in the uploading queue.
|
||||||
|
*
|
||||||
|
* @return {FileModel[]} - files in the upload queue.
|
||||||
|
*/
|
||||||
UploadService.prototype.getQueue = function () {
|
UploadService.prototype.getQueue = function () {
|
||||||
return this._queue;
|
return this._queue;
|
||||||
};
|
};
|
||||||
|
/**
|
||||||
|
* Check if an item is a file.
|
||||||
|
*
|
||||||
|
* @return {boolean}
|
||||||
|
*/
|
||||||
UploadService.prototype._isFile = function (file) {
|
UploadService.prototype._isFile = function (file) {
|
||||||
return file !== null && (file instanceof Blob || (file.name && file.size));
|
return file !== null && (file instanceof Blob || (file.name && file.size));
|
||||||
};
|
};
|
||||||
|
@@ -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":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;YAMH;;;;;eAKG;YACH;gBAWI,uBAAoB,OAAY;oBAAZ,YAAO,GAAP,OAAO,CAAK;oBATxB,YAAO,GAAW,MAAM,CAAC;oBACzB,qBAAgB,GAAW,OAAO,CAAC;oBACnC,eAAU,GAAW,SAAS,CAAC;oBAC/B,eAAU,GAAW,MAAM,CAAC;oBAC5B,gBAAW,GAAW,EAAE,CAAC;oBAGzB,WAAM,GAAgB,EAAE,CAAC;oBAG7B,OAAO,CAAC,GAAG,CAAC,2BAA2B,CAAC,CAAC;oBAEzC,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,eAAe,IAAI,IAAI,GAAG,OAAO,CAAC,eAAe,GAAG,IAAI,CAAC,gBAAgB,CAAC;oBAC1G,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,IAAI,IAAI,GAAG,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC;oBAC1D,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,eAAe,IAAI,IAAI,GAAG,OAAO,CAAC,eAAe,GAAG,IAAI,CAAC,gBAAgB,CAAC;oBAC1G,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,SAAS,IAAI,IAAI,GAAG,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC;oBAClF,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,SAAS,IAAI,IAAI,GAAG,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC;oBAClF,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,UAAU,IAAI,IAAI,GAAG,OAAO,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;gBAC1F,CAAC;gBAED;;;;;;mBAMG;gBACH,kCAAU,GAAV,UAAW,KAAY;oBACnB,IAAI,gBAAgB,GAAgB,EAAE,CAAC;oBAEvC,GAAG,CAAC,CAAa,UAAK,EAAL,eAAK,EAAL,mBAAK,EAAL,IAAK,CAAC;wBAAlB,IAAI,IAAI,cAAA;wBACT,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;4BACrB,IAAI,kBAAkB,GAAG,IAAI,sBAAS,CAAC,IAAI,CAAC,CAAA;4BAC5C,gBAAgB,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA;4BACzC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;wBACzC,CAAC;qBACJ;oBACD,IAAI,CAAC,sBAAsB,EAAE,CAAC;oBAE9B,MAAM,CAAC,gBAAgB,CAAC;gBAC5B,CAAC;gBAED;;mBAEG;gBACK,8CAAsB,GAA9B;oBAAA,iBAQC;oBAPG,IAAI,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,UAAC,kBAAkB;wBACtD,MAAM,CAAC,CAAC,kBAAkB,CAAC,SAAS,IAAI,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;oBAC/H,CAAC,CAAC,CAAC;oBACH,aAAa,CAAC,OAAO,CAAC,UAAC,kBAAkB;wBACrC,kBAAkB,CAAC,YAAY,EAAE,CAAC;wBAClC,KAAI,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAC;oBACxC,CAAC,CAAC,CAAC;gBACP,CAAC;;gBAED;;;;;mBAKG;gBACH,kCAAU,GAAV,UAAW,kBAAuB;oBAAlC,iBA+CC;oBA9CG,IAAI,IAAI,GAAG,IAAI,QAAQ,EAAE,CAAC;oBAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,kBAAkB,CAAC,IAAI,EAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC;oBAC/E,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,UAAC,GAAG;wBACtC,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE,KAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC;oBAC5C,CAAC,CAAC,CAAC;oBAEH,IAAI,cAAc,GAAG,IAAI,cAAc,EAAE,CAAC;oBAC1C,kBAAkB,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;oBAErD,cAAc,CAAC,MAAM,CAAC,UAAU,GAAG,UAAC,CAAC;wBACjC,EAAE,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;4BACrB,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC;4BACnD,kBAAkB,CAAC,UAAU,CAAC;gCAC1B,KAAK,EAAE,CAAC,CAAC,KAAK;gCACd,MAAM,EAAE,CAAC,CAAC,MAAM;gCAChB,OAAO,EAAE,OAAO;6BACnB,CAAC,CAAC;wBACP,CAAC;oBACL,CAAC,CAAC;oBAEF,cAAc,CAAC,MAAM,CAAC,OAAO,GAAG,UAAC,CAAC;wBAC9B,kBAAkB,CAAC,QAAQ,EAAE,CAAC;oBAClC,CAAC,CAAC;oBAEF,cAAc,CAAC,MAAM,CAAC,OAAO,GAAG,UAAC,CAAC;wBAC9B,kBAAkB,CAAC,QAAQ,EAAE,CAAC;oBAClC,CAAC,CAAC;oBAEF,cAAc,CAAC,kBAAkB,GAAG;wBAChC,EAAE,CAAC,CAAC,cAAc,CAAC,UAAU,KAAK,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;4BACpD,kBAAkB,CAAC,UAAU,CACzB,cAAc,CAAC,MAAM,EACrB,cAAc,CAAC,UAAU,EACzB,cAAc,CAAC,QAAQ,CAC1B,CAAC;wBACN,CAAC;oBACL,CAAC,CAAC;oBAEF,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;oBACnD,cAAc,CAAC,eAAe,GAAG,IAAI,CAAC,gBAAgB,CAAC;oBAEvD,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;wBAClB,cAAc,CAAC,gBAAgB,CAAC,eAAe,EAAK,IAAI,CAAC,gBAAgB,SAAI,IAAI,CAAC,UAAY,CAAC,CAAC;oBACpG,CAAC;oBAED,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAC9B,CAAC;gBAED;;;;mBAIG;gBACH,gCAAQ,GAAR;oBACI,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;gBACvB,CAAC;gBAED;;;;mBAIG;gBACK,+BAAO,GAAf,UAAgB,IAAS;oBACrB,MAAM,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,IAAI,YAAY,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;gBAC/E,CAAC;gBACL,oBAAC;YAAD,CAAC,AAjID,IAiIC;YAjID,yCAiIC,CAAA"}
|
@@ -19,18 +19,24 @@
|
|||||||
import {FileModel} from '../models/file.model';
|
import {FileModel} from '../models/file.model';
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* UploadService keep the queue of the file to upload and uploads them.
|
||||||
|
*
|
||||||
|
* @returns {UploadService} .
|
||||||
|
*/
|
||||||
export class UploadService {
|
export class UploadService {
|
||||||
private _url:string;
|
private _url: string;
|
||||||
private _method:string = 'POST';
|
private _method: string = 'POST';
|
||||||
private _authTokenPrefix:string = 'Basic';
|
private _authTokenPrefix: string = 'Basic';
|
||||||
private _authToken:string = undefined;
|
private _authToken: string = undefined;
|
||||||
private _fieldName:string = 'file';
|
private _fieldName: string = 'file';
|
||||||
private _formFields:Object = {};
|
private _formFields: Object = {};
|
||||||
private _withCredentials:boolean;
|
private _withCredentials: boolean;
|
||||||
|
|
||||||
_queue:FileModel[] = [];
|
private _queue: FileModel[] = [];
|
||||||
|
|
||||||
constructor(private options:any) {
|
constructor(private options: any) {
|
||||||
console.log('UploadService constructor');
|
console.log('UploadService constructor');
|
||||||
|
|
||||||
this._withCredentials = options.withCredentials != null ? options.withCredentials : this._withCredentials;
|
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;
|
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) {
|
for (let file of files) {
|
||||||
if (this._isFile(file)) {
|
if (this._isFile(file)) {
|
||||||
@@ -56,7 +69,10 @@ export class UploadService {
|
|||||||
return latestFilesAdded;
|
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) => {
|
let filesToUpload = this._queue.filter((uploadingFileModel) => {
|
||||||
return !uploadingFileModel.uploading && !uploadingFileModel.done && !uploadingFileModel.abort && !uploadingFileModel.error;
|
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();
|
let form = new FormData();
|
||||||
form.append(this._fieldName, uploadingFileModel.file, uploadingFileModel.name);
|
form.append(this._fieldName, uploadingFileModel.file, uploadingFileModel.name);
|
||||||
Object.keys(this._formFields).forEach((key) => {
|
Object.keys(this._formFields).forEach((key) => {
|
||||||
@@ -115,11 +137,21 @@ export class UploadService {
|
|||||||
xmlHttpRequest.send(form);
|
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;
|
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));
|
return file !== null && (file instanceof Blob || (file.name && file.size));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user