mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-10-08 14:51:32 +00:00
#46 upload jsdoc and clean code
This commit is contained in:
@@ -16,13 +16,33 @@
|
||||
*/
|
||||
import { ElementRef } from 'angular2/core';
|
||||
import { FileModel } from '../models/file.model';
|
||||
/**
|
||||
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
|
||||
*
|
||||
* This component is a hideable and minimizable wich contains the list of the uploading
|
||||
* files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingDialogComponent} .
|
||||
*/
|
||||
export declare class FileUploadingDialogComponent {
|
||||
el: ElementRef;
|
||||
filesUploadingList: FileModel[];
|
||||
_isDialogActive: boolean;
|
||||
_isDialogMinimized: boolean;
|
||||
private _isDialogActive;
|
||||
private _isDialogMinimized;
|
||||
constructor(el: ElementRef);
|
||||
toggleDialog($event: any): void;
|
||||
/**
|
||||
* Display and hide the dialog component.
|
||||
*/
|
||||
toggleShowDialog($event: any): void;
|
||||
/**
|
||||
* Display the dialog if hidden.
|
||||
*/
|
||||
showDialog(): void;
|
||||
/**
|
||||
* Minimize and expand the dialog component.
|
||||
*/
|
||||
toggleDialogMinimize($event: any): void;
|
||||
}
|
||||
|
@@ -9,7 +9,7 @@
|
||||
<i class="material-icons up">keyboard_arrow_up</i>
|
||||
</div>
|
||||
|
||||
<div class="close-button" (click)="toggleDialog($event)">
|
||||
<div class="close-button" (click)="toggleShowDialog($event)">
|
||||
<i class="material-icons">clear</i>
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -37,6 +37,17 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
|
||||
file_uploading_list_component_1 = file_uploading_list_component_1_1;
|
||||
}],
|
||||
execute: function() {
|
||||
/**
|
||||
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
|
||||
*
|
||||
* This component is a hideable and minimizable wich contains the list of the uploading
|
||||
* files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingDialogComponent} .
|
||||
*/
|
||||
FileUploadingDialogComponent = (function () {
|
||||
function FileUploadingDialogComponent(el) {
|
||||
this.el = el;
|
||||
@@ -44,12 +55,21 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
|
||||
this._isDialogMinimized = false;
|
||||
console.log('FileUploadingDialogComponent constructor', el);
|
||||
}
|
||||
FileUploadingDialogComponent.prototype.toggleDialog = function ($event) {
|
||||
/**
|
||||
* Display and hide the dialog component.
|
||||
*/
|
||||
FileUploadingDialogComponent.prototype.toggleShowDialog = function ($event) {
|
||||
this._isDialogActive = !this._isDialogActive;
|
||||
};
|
||||
/**
|
||||
* Display the dialog if hidden.
|
||||
*/
|
||||
FileUploadingDialogComponent.prototype.showDialog = function () {
|
||||
this._isDialogActive = true;
|
||||
};
|
||||
/**
|
||||
* Minimize and expand the dialog component.
|
||||
*/
|
||||
FileUploadingDialogComponent.prototype.toggleDialogMinimize = function ($event) {
|
||||
this._isDialogMinimized = !this._isDialogMinimized;
|
||||
};
|
||||
@@ -64,7 +84,7 @@ System.register(['angular2/core', './file-uploading-list.component'], function(e
|
||||
directives: [file_uploading_list_component_1.FileUploadingListComponent],
|
||||
templateUrl: './file-uploading-dialog.component.html',
|
||||
styleUrls: ['./file-uploading-dialog.component.css'],
|
||||
host: { '[class.dialog-show]': 'toggleDialog' }
|
||||
host: { '[class.dialog-show]': 'toggleShowDialog' }
|
||||
}),
|
||||
__metadata('design:paramtypes', [core_1.ElementRef])
|
||||
], FileUploadingDialogComponent);
|
||||
|
@@ -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 {FileUploadingListComponent} from './file-uploading-list.component';
|
||||
|
||||
declare let __moduleName:string;
|
||||
declare let __moduleName: string;
|
||||
|
||||
/**
|
||||
* <file-uploading-dialog [filesUploadingList]="FileModel[]" ></file-uploading-dialog>
|
||||
*
|
||||
* This component is a hideable and minimizable wich contains the list of the uploading
|
||||
* files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingDialogComponent} .
|
||||
*/
|
||||
@Component({
|
||||
selector: 'file-uploading-dialog',
|
||||
moduleId: __moduleName,
|
||||
directives: [FileUploadingListComponent],
|
||||
templateUrl: './file-uploading-dialog.component.html',
|
||||
styleUrls: ['./file-uploading-dialog.component.css'],
|
||||
host: {'[class.dialog-show]': 'toggleDialog'}
|
||||
host: {'[class.dialog-show]': 'toggleShowDialog'}
|
||||
})
|
||||
export class FileUploadingDialogComponent {
|
||||
|
||||
@Input()
|
||||
filesUploadingList:FileModel [];
|
||||
filesUploadingList: FileModel [];
|
||||
|
||||
_isDialogActive:boolean = false;
|
||||
private _isDialogActive: boolean = false;
|
||||
|
||||
_isDialogMinimized:boolean = false;
|
||||
private _isDialogMinimized: boolean = false;
|
||||
|
||||
constructor(public el:ElementRef) {
|
||||
constructor(public el: ElementRef) {
|
||||
console.log('FileUploadingDialogComponent constructor', el);
|
||||
}
|
||||
|
||||
toggleDialog($event) {
|
||||
/**
|
||||
* Display and hide the dialog component.
|
||||
*/
|
||||
toggleShowDialog($event) {
|
||||
this._isDialogActive = !this._isDialogActive;
|
||||
}
|
||||
|
||||
/**
|
||||
* Display the dialog if hidden.
|
||||
*/
|
||||
showDialog() {
|
||||
this._isDialogActive = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Minimize and expand the dialog component.
|
||||
*/
|
||||
toggleDialogMinimize($event) {
|
||||
this._isDialogMinimized = !this._isDialogMinimized;
|
||||
}
|
||||
|
@@ -16,9 +16,24 @@
|
||||
*/
|
||||
import { ElementRef } from 'angular2/core';
|
||||
import { FileModel } from '../models/file.model';
|
||||
/**
|
||||
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
|
||||
*
|
||||
* This component show a list of the uploading files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingListComponent} .
|
||||
*/
|
||||
export declare class FileUploadingListComponent {
|
||||
el: ElementRef;
|
||||
filesUploadingList: FileModel[];
|
||||
constructor(el: ElementRef);
|
||||
/**
|
||||
* Abort the in progress uploading of a specific file.
|
||||
*
|
||||
* @param {string} id - FileModel id of the file to abort.
|
||||
*/
|
||||
abort(id: any): void;
|
||||
}
|
||||
|
@@ -34,6 +34,16 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
||||
core_1 = core_1_1;
|
||||
}],
|
||||
execute: function() {
|
||||
/**
|
||||
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
|
||||
*
|
||||
* This component show a list of the uploading files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingListComponent} .
|
||||
*/
|
||||
FileUploadingListComponent = (function () {
|
||||
function FileUploadingListComponent(el) {
|
||||
this.el = el;
|
||||
@@ -42,6 +52,11 @@ System.register(['angular2/core'], function(exports_1, context_1) {
|
||||
console.log('Check for async update from drag directive');
|
||||
}, 1000);
|
||||
}
|
||||
/**
|
||||
* Abort the in progress uploading of a specific file.
|
||||
*
|
||||
* @param {string} id - FileModel id of the file to abort.
|
||||
*/
|
||||
FileUploadingListComponent.prototype.abort = function (id) {
|
||||
var file = this.filesUploadingList.filter(function (uploadingFileModel) {
|
||||
return uploadingFileModel.id == id;
|
||||
|
@@ -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 {FileModel} from '../models/file.model';
|
||||
|
||||
declare let __moduleName:string;
|
||||
declare let __moduleName: string;
|
||||
|
||||
/**
|
||||
* <alfresco-file-uploading-list [filesUploadingList]="FileModel[]" ></alfresco-file-uploading-list>
|
||||
*
|
||||
* This component show a list of the uploading files contained in the filesUploadingList.
|
||||
*
|
||||
* @InputParam {FileModel[]} filesUploadingList - list of the uploading files .
|
||||
*
|
||||
*
|
||||
* @returns {FileUploadingListComponent} .
|
||||
*/
|
||||
@Component({
|
||||
selector: 'alfresco-file-uploading-list',
|
||||
moduleId: __moduleName,
|
||||
@@ -30,9 +40,9 @@ declare let __moduleName:string;
|
||||
export class FileUploadingListComponent {
|
||||
|
||||
@Input()
|
||||
filesUploadingList:FileModel [];
|
||||
filesUploadingList: FileModel [];
|
||||
|
||||
constructor(public el:ElementRef) {
|
||||
constructor(public el: ElementRef) {
|
||||
console.log('filesUploadingList constructor', el);
|
||||
|
||||
setInterval(() => {
|
||||
@@ -40,7 +50,12 @@ export class FileUploadingListComponent {
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
abort(id):void {
|
||||
/**
|
||||
* Abort the in progress uploading of a specific file.
|
||||
*
|
||||
* @param {string} id - FileModel id of the file to abort.
|
||||
*/
|
||||
abort(id): void {
|
||||
let file = this.filesUploadingList.filter((uploadingFileModel) => {
|
||||
return uploadingFileModel.id == id;
|
||||
});
|
||||
|
@@ -17,14 +17,51 @@
|
||||
import { ElementRef } from 'angular2/core';
|
||||
import { FileModel } from '../models/file.model';
|
||||
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
|
||||
/**
|
||||
* <alfresco-upload-button [showDialogUpload]="boolean"
|
||||
* [showUdoNotificationBar]="boolean"
|
||||
* [uploadFolders]="boolean"
|
||||
* [multipleFiles]="boolean"
|
||||
* [acceptedFilesType]="string">
|
||||
* </alfresco-upload-button>
|
||||
*
|
||||
* This component, provide a set of buttons to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
|
||||
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
|
||||
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
|
||||
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
|
||||
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
export declare class UploadButtonComponent {
|
||||
el: ElementRef;
|
||||
private _uploaderService;
|
||||
undoNotificationBar: any;
|
||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||
showUploadDialog: boolean;
|
||||
showUdoNotificationBar: boolean;
|
||||
uploadFolders: boolean;
|
||||
multipleFiles: boolean;
|
||||
acceptedFilesType: string;
|
||||
filesUploadingList: FileModel[];
|
||||
constructor(el: ElementRef);
|
||||
onFilesAdded(files: any): void;
|
||||
showUndoNotificationBar(latestFilesAdded: any): void;
|
||||
showDialog(): void;
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
onFilesAdded($event: any): void;
|
||||
/**
|
||||
* Show undo notification bar.
|
||||
*
|
||||
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
|
||||
*/
|
||||
private _showUndoNotificationBar(latestFilesAdded);
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
private _showDialog();
|
||||
}
|
||||
|
@@ -1,46 +1,45 @@
|
||||
<br>
|
||||
|
||||
<!--upload buttons-->
|
||||
|
||||
<form>
|
||||
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||
<i class="material-icons">file_upload</i> Upload<input file-select type="file" name="uploadFiles" id="uploadFiles"
|
||||
multiple="multiple"
|
||||
accept=".jpg,.gif,.png,.svg,.mp4"
|
||||
(onFilesAdded)="onFilesAdded($event)"
|
||||
#uploadFiles>
|
||||
<!--Files Upload-->
|
||||
<div *ngIf="!uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||
<i class="material-icons">file_upload</i> Upload File
|
||||
|
||||
<!--Multiple Files Upload-->
|
||||
<span *ngIf="multipleFiles">
|
||||
<input id="upload-multiple-files" type="file" name="uploadFiles"
|
||||
(change)="onFilesAdded($event)"
|
||||
multiple="multiple"
|
||||
accept="{{acceptedFilesType}}"
|
||||
#uploadFiles>
|
||||
</span>
|
||||
|
||||
<!--Single Files Upload-->
|
||||
<span *ngIf="!multipleFiles">
|
||||
<input id="upload-single-file" type="file" name="uploadFiles"
|
||||
(change)="onFilesAdded($event)"
|
||||
accept="{{acceptedFilesType}}"
|
||||
#uploadFiles>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
|
||||
<div class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||
<i class="material-icons">file_upload</i> Upload Folder<input file-select type="file" name="uploadFiles" id="uploadFolder"
|
||||
multiple="multiple"
|
||||
accept=".jpg,.gif,.png,.svg"
|
||||
(onFilesAdded)="onFilesAdded($event)"
|
||||
webkitdirectory directory
|
||||
multiple #uploadFiles>
|
||||
<!--Folders Upload-->
|
||||
<div *ngIf="uploadFolders" class="mdl-button mdl-js-button mdl-button--raised mdl-button--file">
|
||||
<i class="material-icons">file_upload</i> Upload Folder
|
||||
<input id="uploadFolder" type="file" name="uploadFiles"
|
||||
(change)="onFilesAdded($event)"
|
||||
multiple="multiple"
|
||||
accept="{{acceptedFilesType}}"
|
||||
webkitdirectory directory
|
||||
multiple #uploadFolders>
|
||||
</div>
|
||||
|
||||
|
||||
</form>
|
||||
|
||||
<!--show dialog-->
|
||||
<br>
|
||||
<!--Upload Dialog-->
|
||||
<file-uploading-dialog [hidden]="showDialogUpload" [filesUploadingList]="filesUploadingList"
|
||||
#fileUploadingDialog></file-uploading-dialog>
|
||||
|
||||
<button type="button" (click)="showDialog($event)" class="mdl-button mdl-js-button mdl-button--raised show-modal">Show
|
||||
Dialog
|
||||
</button>
|
||||
|
||||
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
|
||||
|
||||
<!--show snackbar-->
|
||||
|
||||
|
||||
<div id="demo-snackbar-example" class="mdl-js-snackbar mdl-snackbar" #undoNotificationBar>
|
||||
<!--Notification bar-->
|
||||
<div id="undo-notification-bar" [hidden]="showUdoNotificationBar" class="mdl-js-snackbar mdl-snackbar"
|
||||
#undoNotificationBar>
|
||||
<div class="mdl-snackbar__text"></div>
|
||||
<button class="mdl-snackbar__action" type="button"></button>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
@@ -14,7 +14,7 @@
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
System.register(['angular2/core', '../services/upload.service', './file-uploading-dialog.component', '../directives/file-select.directive'], function(exports_1, context_1) {
|
||||
System.register(['angular2/core', '../services/upload.service', './file-uploading-dialog.component'], function(exports_1, context_1) {
|
||||
"use strict";
|
||||
var __moduleName = context_1 && context_1.id;
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
@@ -26,7 +26,7 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
var __metadata = (this && this.__metadata) || function (k, v) {
|
||||
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
||||
};
|
||||
var core_1, upload_service_1, file_uploading_dialog_component_1, file_select_directive_1;
|
||||
var core_1, upload_service_1, file_uploading_dialog_component_1;
|
||||
var UploadButtonComponent;
|
||||
return {
|
||||
setters:[
|
||||
@@ -38,14 +38,35 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
},
|
||||
function (file_uploading_dialog_component_1_1) {
|
||||
file_uploading_dialog_component_1 = file_uploading_dialog_component_1_1;
|
||||
},
|
||||
function (file_select_directive_1_1) {
|
||||
file_select_directive_1 = file_select_directive_1_1;
|
||||
}],
|
||||
execute: function() {
|
||||
/**
|
||||
* <alfresco-upload-button [showDialogUpload]="boolean"
|
||||
* [showUdoNotificationBar]="boolean"
|
||||
* [uploadFolders]="boolean"
|
||||
* [multipleFiles]="boolean"
|
||||
* [acceptedFilesType]="string">
|
||||
* </alfresco-upload-button>
|
||||
*
|
||||
* This component, provide a set of buttons to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
|
||||
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
|
||||
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
|
||||
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
|
||||
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
UploadButtonComponent = (function () {
|
||||
function UploadButtonComponent(el) {
|
||||
this.el = el;
|
||||
this.showUploadDialog = true;
|
||||
this.showUdoNotificationBar = true;
|
||||
this.uploadFolders = false;
|
||||
this.multipleFiles = false;
|
||||
this.acceptedFilesType = '*';
|
||||
this.filesUploadingList = [];
|
||||
console.log('UploadComponent constructor', el);
|
||||
this._uploaderService = new upload_service_1.UploadService({
|
||||
@@ -60,15 +81,30 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
}
|
||||
});
|
||||
}
|
||||
UploadButtonComponent.prototype.onFilesAdded = function (files) {
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
UploadButtonComponent.prototype.onFilesAdded = function ($event) {
|
||||
var files = $event.currentTarget.files;
|
||||
if (files.length) {
|
||||
var latestFilesAdded = this._uploaderService.addToQueue(files);
|
||||
this.filesUploadingList = this._uploaderService.getQueue();
|
||||
this.showDialog();
|
||||
this.showUndoNotificationBar(latestFilesAdded);
|
||||
if (this.showUploadDialog) {
|
||||
this._showDialog();
|
||||
}
|
||||
if (this.showUdoNotificationBar) {
|
||||
this._showUndoNotificationBar(latestFilesAdded);
|
||||
}
|
||||
}
|
||||
};
|
||||
UploadButtonComponent.prototype.showUndoNotificationBar = function (latestFilesAdded) {
|
||||
/**
|
||||
* Show undo notification bar.
|
||||
*
|
||||
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
|
||||
*/
|
||||
UploadButtonComponent.prototype._showUndoNotificationBar = function (latestFilesAdded) {
|
||||
if (componentHandler) {
|
||||
componentHandler.upgradeAllRegistered();
|
||||
}
|
||||
@@ -83,7 +119,10 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
actionText: 'Undo'
|
||||
});
|
||||
};
|
||||
UploadButtonComponent.prototype.showDialog = function () {
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
UploadButtonComponent.prototype._showDialog = function () {
|
||||
this.fileUploadingDialogComponent.showDialog();
|
||||
};
|
||||
__decorate([
|
||||
@@ -94,13 +133,33 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
core_1.ViewChild('fileUploadingDialog'),
|
||||
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
||||
], UploadButtonComponent.prototype, "fileUploadingDialogComponent", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', Boolean)
|
||||
], UploadButtonComponent.prototype, "showUploadDialog", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', Boolean)
|
||||
], UploadButtonComponent.prototype, "showUdoNotificationBar", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', Boolean)
|
||||
], UploadButtonComponent.prototype, "uploadFolders", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', Boolean)
|
||||
], UploadButtonComponent.prototype, "multipleFiles", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', String)
|
||||
], UploadButtonComponent.prototype, "acceptedFilesType", void 0);
|
||||
UploadButtonComponent = __decorate([
|
||||
core_1.Component({
|
||||
selector: 'alfresco-upload-button',
|
||||
moduleId: __moduleName,
|
||||
directives: [file_select_directive_1.FileSelectDirective, file_uploading_dialog_component_1.FileUploadingDialogComponent],
|
||||
directives: [file_uploading_dialog_component_1.FileUploadingDialogComponent],
|
||||
templateUrl: './upload-button.component.html',
|
||||
styleUrls: ['./upload-button.component.css']
|
||||
styleUrls: ['./upload-button.component.css'],
|
||||
}),
|
||||
__metadata('design:paramtypes', [core_1.ElementRef])
|
||||
], UploadButtonComponent);
|
||||
|
@@ -1 +1 @@
|
||||
{"version":3,"file":"upload-button.component.js","sourceRoot":"","sources":["upload-button.component.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAoBH;gBAYI,+BAAmB,EAAa;oBAAb,OAAE,GAAF,EAAE,CAAW;oBAFhC,uBAAkB,GAAgB,EAAE,CAAC;oBAGjC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAC;oBAE/C,IAAI,CAAC,gBAAgB,GAAG,IAAI,8BAAa,CAAC;wBACtC,GAAG,EAAE,wDAAwD;wBAC7D,eAAe,EAAE,IAAI;wBACrB,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC;wBAC9B,eAAe,EAAE,OAAO;wBACxB,SAAS,EAAE,UAAU;wBACrB,UAAU,EAAE;4BACR,MAAM,EAAE,OAAO;4BACf,WAAW,EAAE,iBAAiB;yBACjC;qBACJ,CAAC,CAAC;gBACP,CAAC;gBAED,4CAAY,GAAZ,UAAa,KAAK;oBACd,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;wBACf,IAAI,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;wBAC/D,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;wBAC3D,IAAI,CAAC,UAAU,EAAE,CAAC;wBAClB,IAAI,CAAC,uBAAuB,CAAC,gBAAgB,CAAC,CAAC;oBACnD,CAAC;gBACL,CAAC;gBAED,uDAAuB,GAAvB,UAAwB,gBAAgB;oBACpC,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;wBACnB,gBAAgB,CAAC,oBAAoB,EAAE,CAAC;oBAC5C,CAAC;oBAED,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,gBAAgB,CAAC,YAAY,CAAC;wBACjE,OAAO,EAAE,uBAAuB;wBAChC,OAAO,EAAE,IAAI;wBACb,aAAa,EAAE;4BACX,gBAAgB,CAAC,OAAO,CAAC,UAAC,kBAAkB;gCACxC,kBAAkB,CAAC,QAAQ,EAAE,CAAC;4BAClC,CAAC,CAAC,CAAC;wBACP,CAAC;wBACD,UAAU,EAAE,MAAM;qBACrB,CAAC,CAAC;gBACP,CAAC;gBAED,0CAAU,GAAV;oBACI,IAAI,CAAC,4BAA4B,CAAC,UAAU,EAAE,CAAC;gBACnD,CAAC;gBApDD;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;kFAAA;gBAGjC;oBAAC,gBAAS,CAAC,qBAAqB,CAAC;;2FAAA;gBAdrC;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,wBAAwB;wBAClC,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,2CAAmB,EAAE,8DAA4B,CAAC;wBAC/D,WAAW,EAAE,gCAAgC;wBAC7C,SAAS,EAAE,CAAC,+BAA+B,CAAC;qBAC/C,CAAC;;yCAAA;gBA0DF,4BAAC;YAAD,CAAC,AAzDD,IAyDC;YAzDD,yDAyDC,CAAA"}
|
||||
{"version":3,"file":"upload-button.component.js","sourceRoot":"","sources":["upload-button.component.ts"],"names":[],"mappings":"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"}
|
@@ -16,36 +16,68 @@
|
||||
*/
|
||||
|
||||
|
||||
import {Component, ViewChild, ElementRef} from 'angular2/core';
|
||||
import {Component, ViewChild, ElementRef, Input} from 'angular2/core';
|
||||
import {UploadService} from '../services/upload.service';
|
||||
import {FileModel} from '../models/file.model';
|
||||
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
|
||||
import {FileSelectDirective} from '../directives/file-select.directive';
|
||||
import {FileDraggableDirective} from '../directives/file-draggable.directive';
|
||||
|
||||
declare let componentHandler;
|
||||
declare let __moduleName:string;
|
||||
declare let __moduleName: string;
|
||||
|
||||
/**
|
||||
* <alfresco-upload-button [showDialogUpload]="boolean"
|
||||
* [showUdoNotificationBar]="boolean"
|
||||
* [uploadFolders]="boolean"
|
||||
* [multipleFiles]="boolean"
|
||||
* [acceptedFilesType]="string">
|
||||
* </alfresco-upload-button>
|
||||
*
|
||||
* This component, provide a set of buttons to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog.
|
||||
* @InputParam {boolean} [true] showUdoNotificationBar - hide/show notification bar.
|
||||
* @InputParam {boolean} [false] uploadFolders - allow/disallow upload folders (only for chrome).
|
||||
* @InputParam {boolean} [false] multipleFiles - allow/disallow multiple files.
|
||||
* @InputParam {string} [*] acceptedFilesType - array of allowed file extensions.
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
@Component({
|
||||
selector: 'alfresco-upload-button',
|
||||
moduleId: __moduleName,
|
||||
directives: [FileSelectDirective, FileUploadingDialogComponent],
|
||||
directives: [FileUploadingDialogComponent],
|
||||
templateUrl: './upload-button.component.html',
|
||||
styleUrls: ['./upload-button.component.css']
|
||||
styleUrls: ['./upload-button.component.css'],
|
||||
})
|
||||
export class UploadButtonComponent {
|
||||
|
||||
private _uploaderService:UploadService;
|
||||
private _uploaderService: UploadService;
|
||||
|
||||
@ViewChild('undoNotificationBar')
|
||||
undoNotificationBar;
|
||||
|
||||
@ViewChild('fileUploadingDialog')
|
||||
fileUploadingDialogComponent:FileUploadingDialogComponent;
|
||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||
|
||||
filesUploadingList:FileModel [] = [];
|
||||
@Input()
|
||||
showUploadDialog: boolean = true;
|
||||
|
||||
constructor(public el:ElementRef) {
|
||||
@Input()
|
||||
showUdoNotificationBar: boolean = true;
|
||||
|
||||
@Input()
|
||||
uploadFolders: boolean = false;
|
||||
|
||||
@Input()
|
||||
multipleFiles: boolean = false;
|
||||
|
||||
@Input()
|
||||
acceptedFilesType: string = '*';
|
||||
|
||||
filesUploadingList: FileModel [] = [];
|
||||
|
||||
constructor(public el: ElementRef) {
|
||||
console.log('UploadComponent constructor', el);
|
||||
|
||||
this._uploaderService = new UploadService({
|
||||
@@ -61,16 +93,31 @@ export class UploadButtonComponent {
|
||||
});
|
||||
}
|
||||
|
||||
onFilesAdded(files):void {
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
onFilesAdded($event): void {
|
||||
let files = $event.currentTarget.files;
|
||||
if (files.length) {
|
||||
let latestFilesAdded = this._uploaderService.addToQueue(files);
|
||||
this.filesUploadingList = this._uploaderService.getQueue();
|
||||
this.showDialog();
|
||||
this.showUndoNotificationBar(latestFilesAdded);
|
||||
if (this.showUploadDialog) {
|
||||
this._showDialog();
|
||||
}
|
||||
if(this.showUdoNotificationBar) {
|
||||
this._showUndoNotificationBar(latestFilesAdded);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
showUndoNotificationBar(latestFilesAdded) {
|
||||
/**
|
||||
* Show undo notification bar.
|
||||
*
|
||||
* @param {FileModel[]} latestFilesAdded - files in the upload queue enriched with status flag and xhr object.
|
||||
*/
|
||||
private _showUndoNotificationBar(latestFilesAdded) {
|
||||
if (componentHandler) {
|
||||
componentHandler.upgradeAllRegistered();
|
||||
}
|
||||
@@ -87,7 +134,10 @@ export class UploadButtonComponent {
|
||||
});
|
||||
}
|
||||
|
||||
showDialog():void {
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
private _showDialog(): void {
|
||||
this.fileUploadingDialogComponent.showDialog();
|
||||
}
|
||||
}
|
||||
|
@@ -17,12 +17,31 @@
|
||||
import { ElementRef } from 'angular2/core';
|
||||
import { FileModel } from '../models/file.model';
|
||||
import { FileUploadingDialogComponent } from './file-uploading-dialog.component';
|
||||
/**
|
||||
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
|
||||
*
|
||||
* This component, provide a drag and drop are to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
export declare class UploadDragAreaComponent {
|
||||
el: ElementRef;
|
||||
private _uploaderService;
|
||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||
showUploadDialog: boolean;
|
||||
filesUploadingList: FileModel[];
|
||||
constructor(el: ElementRef);
|
||||
onFilesDragged(files: any): void;
|
||||
showDialog(): void;
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
onFilesDropped(files: any): void;
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
private _showDialog();
|
||||
}
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<div file-draggable id='UploadBorder' class="upload-border" (onFilesAdded)="onFilesDragged($event)"
|
||||
<div file-draggable id='UploadBorder' class="upload-border" (onFilesDropped)="onFilesDropped($event)"
|
||||
dropzone="" webkitdropzone="copy file:image/png file:image/gif file:image/jpeg" #droparea>
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
|
||||
<file-uploading-dialog [filesUploadingList]="filesUploadingList" #fileUploadingDialog></file-uploading-dialog>
|
||||
<file-uploading-dialog [hidden]="showDialogUpload" [filesUploadingList]="filesUploadingList"
|
||||
#fileUploadingDialog></file-uploading-dialog>
|
||||
|
@@ -43,9 +43,20 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
file_draggable_directive_1 = file_draggable_directive_1_1;
|
||||
}],
|
||||
execute: function() {
|
||||
/**
|
||||
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
|
||||
*
|
||||
* This component, provide a drag and drop are to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
UploadDragAreaComponent = (function () {
|
||||
function UploadDragAreaComponent(el) {
|
||||
this.el = el;
|
||||
this.showUploadDialog = true;
|
||||
this.filesUploadingList = [];
|
||||
console.log('UploadComponent constructor', el);
|
||||
this._uploaderService = new upload_service_1.UploadService({
|
||||
@@ -60,20 +71,34 @@ System.register(['angular2/core', '../services/upload.service', './file-uploadin
|
||||
}
|
||||
});
|
||||
}
|
||||
UploadDragAreaComponent.prototype.onFilesDragged = function (files) {
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
UploadDragAreaComponent.prototype.onFilesDropped = function (files) {
|
||||
if (files.length) {
|
||||
this._uploaderService.addToQueue(files);
|
||||
this.filesUploadingList = this._uploaderService.getQueue();
|
||||
this.showDialog();
|
||||
if (this.showUploadDialog) {
|
||||
this._showDialog();
|
||||
}
|
||||
}
|
||||
};
|
||||
UploadDragAreaComponent.prototype.showDialog = function () {
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
UploadDragAreaComponent.prototype._showDialog = function () {
|
||||
this.fileUploadingDialogComponent.showDialog();
|
||||
};
|
||||
__decorate([
|
||||
core_1.ViewChild('fileUploadingDialog'),
|
||||
__metadata('design:type', file_uploading_dialog_component_1.FileUploadingDialogComponent)
|
||||
], UploadDragAreaComponent.prototype, "fileUploadingDialogComponent", void 0);
|
||||
__decorate([
|
||||
core_1.Input(),
|
||||
__metadata('design:type', Boolean)
|
||||
], UploadDragAreaComponent.prototype, "showUploadDialog", void 0);
|
||||
UploadDragAreaComponent = __decorate([
|
||||
core_1.Component({
|
||||
selector: 'alfresco-upload-drag-area',
|
||||
|
@@ -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 {FileModel} from '../models/file.model';
|
||||
import {FileUploadingDialogComponent} from './file-uploading-dialog.component';
|
||||
import {FileDraggableDirective} from '../directives/file-draggable.directive';
|
||||
|
||||
declare let __moduleName:string;
|
||||
declare let __moduleName: string;
|
||||
|
||||
/**
|
||||
* <alfresco-upload-drag-area [showDialogUpload]="boolean" ></alfresco-upload-drag-area>
|
||||
*
|
||||
* This component, provide a drag and drop are to upload files to alfresco.
|
||||
*
|
||||
* @InputParam {boolean} [true] showDialogUpload - hide/show upload dialog .
|
||||
*
|
||||
*
|
||||
* @returns {UploadDragAreaComponent} .
|
||||
*/
|
||||
@Component({
|
||||
selector: 'alfresco-upload-drag-area',
|
||||
moduleId: __moduleName,
|
||||
@@ -33,14 +43,17 @@ declare let __moduleName:string;
|
||||
})
|
||||
export class UploadDragAreaComponent {
|
||||
|
||||
private _uploaderService:UploadService;
|
||||
private _uploaderService: UploadService;
|
||||
|
||||
@ViewChild('fileUploadingDialog')
|
||||
fileUploadingDialogComponent:FileUploadingDialogComponent;
|
||||
fileUploadingDialogComponent: FileUploadingDialogComponent;
|
||||
|
||||
filesUploadingList:FileModel [] = [];
|
||||
@Input()
|
||||
showUploadDialog: boolean = true;
|
||||
|
||||
constructor(public el:ElementRef) {
|
||||
filesUploadingList: FileModel [] = [];
|
||||
|
||||
constructor(public el: ElementRef) {
|
||||
console.log('UploadComponent constructor', el);
|
||||
|
||||
this._uploaderService = new UploadService({
|
||||
@@ -56,15 +69,25 @@ export class UploadDragAreaComponent {
|
||||
});
|
||||
}
|
||||
|
||||
onFilesDragged(files):void {
|
||||
/**
|
||||
* Method called when files are dropped in the drag area.
|
||||
*
|
||||
* @param {File[]} files - files dropped in the drag area.
|
||||
*/
|
||||
onFilesDropped(files): void {
|
||||
if (files.length) {
|
||||
this._uploaderService.addToQueue(files);
|
||||
this.filesUploadingList = this._uploaderService.getQueue();
|
||||
this.showDialog();
|
||||
if (this.showUploadDialog) {
|
||||
this._showDialog();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
showDialog():void {
|
||||
/**
|
||||
* Show the upload dialog.
|
||||
*/
|
||||
private _showDialog(): void {
|
||||
this.fileUploadingDialogComponent.showDialog();
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user