#46 upload jsdoc and clean code

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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