dc/ng2-file-upload
4
0
Fork 0
Code Issues 395 Pull Requests 27 Packages Projects Releases 4 Wiki Activity

chore(build): ng2 style guide applied,

Browse Source 
- build process updated
- systemjs bundler added

BREAKING CHANGES:
- directives and selectors renamed to ng2FileSelect and ng2FileDrop
This commit is contained in:
Dmitriy Shekhovtsov
2016-05-11 18:40:47 +03:00
parent 13c5c35864
commit aee69d8b80
30 changed files with 743 additions and 740 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
components/file-upload/file-drop.directive.spec.ts Normal file
View File

@@ -0,0 +1,21 @@
import {Component} from '@angular/core';
import {it, inject, beforeEachProviders} from '@angular/core/testing';
import {ComponentFixture} from '@angular/compiler/testing';
import {FileUploader} from './file-uploader.class';
import {FileSelectDirective} from './file-select.directive';
@Component({
selector: 'container',
template: `<input type="file" ng2FileSelect [uploader]="uploader" />`,
directives: [FileSelectDirective]
})
export class ContainerComponent {
public uploader:FileUploader = new FileUploader({url: 'localhost:3000'});
}
describe('Directive: FileSelectDirective', () => {
beforeEachProviders(() => [
ContainerComponent
]);
it('should be fine', inject([ContainerComponent], (fixture:ComponentFixture<ContainerComponent>) => {
expect(fixture).not.toBeNull();
}));
});

51
components/file-upload/file-drop.ts → components/file-upload/file-drop.directive.ts
View File

@@ -1,32 +1,27 @@
import { Directive, EventEmitter, ElementRef } from '@angular/core';
import { Directive, EventEmitter, ElementRef, HostListener, Input, Output } from '@angular/core';
import { FileUploader } from './file-uploader';
import { FileUploader } from './file-uploader.class';
@Directive({
selector: '[ng2-file-drop]',
properties: ['uploader'],
events: ['fileOver'],
host: {
'(drop)': 'onDrop($event)',
'(dragover)': 'onDragOver($event)',
'(dragleave)': 'onDragLeave($event)'
}
})
export class FileDrop {
public uploader:FileUploader;
private fileOver:EventEmitter<any> = new EventEmitter();
@Directive({selector: '[ng2FileDrop]'})
export class FileDropDirective {
@Input() public uploader:FileUploader;
@Output() public fileOver:EventEmitter<any> = new EventEmitter();
constructor(private element:ElementRef) {
private element:ElementRef;
public constructor(element:ElementRef) {
this.element = element;
}
getOptions() {
public getOptions():any {
return this.uploader.options;
}
getFilters() {
public getFilters():any {
return {};
}
onDrop(event:any) {
@HostListener('drop', ['$event'])
public onDrop(event:any):void {
let transfer = this._getTransfer(event);
if (!transfer) {
return;
@@ -36,10 +31,11 @@ export class FileDrop {
let filters = this.getFilters();
this._preventAndStop(event);
this.uploader.addToQueue(transfer.files, options, filters);
this.fileOver.next(false);
this.fileOver.emit(false);
}
onDragOver(event:any) {
@HostListener('dragover', ['$event'])
public onDragOver(event:any):void {
let transfer = this._getTransfer(event);
if (!this._haveFiles(transfer.types)) {
return;
@@ -47,16 +43,17 @@ export class FileDrop {
transfer.dropEffect = 'copy';
this._preventAndStop(event);
this.fileOver.next(true);
this.fileOver.emit(true);
}
onDragLeave(event:any):any {
if (event.currentTarget === (<any>this).element[0]) {
@HostListener('dragleave', ['$event'])
public onDragLeave(event:any):any {
if (event.currentTarget === (this as any).element[0]) {
return;
}
this._preventAndStop(event);
this.fileOver.next(false);
this.fileOver.emit(false);
}
private _getTransfer(event:any):any {
@@ -81,12 +78,12 @@ export class FileDrop {
return false;
}
}
/*
_addOverClass(item:any):any {
item.addOverClass();
}
_removeOverClass(item:any):any {
item.removeOverClass();
}
}*/
}

59
components/file-upload/file-item.ts → components/file-upload/file-item.class.ts
View File

@@ -1,5 +1,5 @@
import {FileLikeObject} from './file-like-object';
import {FileUploader} from './file-uploader';
import {FileLikeObject} from './file-like-object.class';
import {FileUploader} from './file-uploader.class';
export class FileItem {
public file:FileLikeObject;
@@ -17,15 +17,22 @@ export class FileItem {
public isCancel:boolean = false;
public isError:boolean = false;
public progress:number = 0;
public index:number = null;
public index:number = void 0;
constructor(private uploader:FileUploader, private some:any, private options:any) {
private uploader:FileUploader;
private some:any;
private options:any;
public constructor(uploader:FileUploader, some:any, options:any) {
this.uploader = uploader;
this.some = some;
this.options = options;
this.file = new FileLikeObject(some);
this._file = some;
this.url = uploader.url;
}
public upload() {
public upload():void {
try {
this.uploader.uploadItem(this);
} catch (e) {
@@ -34,33 +41,39 @@ export class FileItem {
}
}
public cancel() {
public cancel():void {
this.uploader.cancelItem(this);
}
public remove() {
public remove():void {
this.uploader.removeFromQueue(this);
}
public onBeforeUpload() {
public onBeforeUpload():void {
return void 0;
}
public onProgress(progress:number) {
public onProgress(progress:number):any {
return {progress};
}
public onSuccess(response:any, status:any, headers:any) {
public onSuccess(response:any, status:any, headers:any):any {
return {response,status,headers};
}
public onError(response:any, status:any, headers:any) {
public onError(response:any, status:any, headers:any):any {
return {response,status,headers};
}
public onCancel(response:any, status:any, headers:any) {
public onCancel(response:any, status:any, headers:any):any {
return {response,status,headers};
}
public onComplete(response:any, status:any, headers:any) {
public onComplete(response:any, status:any, headers:any):any {
return {response,status,headers};
}
private _onBeforeUpload() {
public _onBeforeUpload():void {
this.isReady = true;
this.isUploading = true;
this.isUploaded = false;
@@ -71,12 +84,12 @@ export class FileItem {
this.onBeforeUpload();
}
private _onProgress(progress:number) {
public _onProgress(progress:number):void {
this.progress = progress;
this.onProgress(progress);
}
private _onSuccess(response:any, status:any, headers:any) {
public _onSuccess(response:any, status:any, headers:any):void {
this.isReady = false;
this.isUploading = false;
this.isUploaded = true;
@@ -84,11 +97,11 @@ export class FileItem {
this.isCancel = false;
this.isError = false;
this.progress = 100;
this.index = null;
this.index = void 0;
this.onSuccess(response, status, headers);
}
private _onError(response:any, status:any, headers:any) {
public _onError(response:any, status:any, headers:any):void {
this.isReady = false;
this.isUploading = false;
this.isUploaded = true;
@@ -96,11 +109,11 @@ export class FileItem {
this.isCancel = false;
this.isError = true;
this.progress = 0;
this.index = null;
this.index = void 0;
this.onError(response, status, headers);
}
private _onCancel(response:any, status:any, headers:any) {
public _onCancel(response:any, status:any, headers:any):void {
this.isReady = false;
this.isUploading = false;
this.isUploaded = false;
@@ -108,11 +121,11 @@ export class FileItem {
this.isCancel = true;
this.isError = false;
this.progress = 0;
this.index = null;
this.index = void 0;
this.onCancel(response, status, headers);
}
private _onComplete(response:any, status:any, headers:any) {
public _onComplete(response:any, status:any, headers:any):void {
this.onComplete(response, status, headers);
if (this.uploader.removeAfterUpload) {
@@ -120,7 +133,7 @@ export class FileItem {
}
}
private _prepareToUploading() {
public _prepareToUploading():void {
this.index = this.index || ++this.uploader._nextIndex;
this.isReady = true;
}

14
components/file-upload/file-like-object.ts → components/file-upload/file-like-object.class.ts
View File

@@ -1,4 +1,4 @@
function isElement(node:any) {
function isElement(node:any):boolean {
return !!(node && (node.nodeName || node.prop && node.attr && node.find));
}
@@ -8,22 +8,22 @@ export class FileLikeObject {
public type:string;
public name:string;
constructor(fileOrInput:any) {
public constructor(fileOrInput:any) {
let isInput = isElement(fileOrInput);
let fakePathOrObject = isInput ? fileOrInput.value : fileOrInput;
let postfix = typeof fakePathOrObject === 'string' ? 'FakePath' : 'Object';
let method = '_createFrom' + postfix;
(<any>this)[method](fakePathOrObject);
(this as any)[method](fakePathOrObject);
}
public _createFromFakePath(path:string) {
this.lastModifiedDate = null;
this.size = null;
public _createFromFakePath(path:string):void {
this.lastModifiedDate = void 0;
this.size = void 0;
this.type = 'like/' + path.slice(path.lastIndexOf('.') + 1).toLowerCase();
this.name = path.slice(path.lastIndexOf('/') + path.lastIndexOf('\\') + 2);
}
public _createFromObject(object:{size: number, type: string, name: string}) {
public _createFromObject(object:{size: number, type: string, name: string}):void {
// this.lastModifiedDate = copy(object.lastModifiedDate);
this.size = object.size;
this.type = object.type;

30
components/file-upload/file-select.ts → components/file-upload/file-select.directive.ts
View File

@@ -1,34 +1,32 @@
import { Directive, ElementRef } from '@angular/core';
import { Directive, ElementRef, Input, HostListener } from '@angular/core';
import {FileUploader} from './file-uploader';
import {FileUploader} from './file-uploader.class';
// todo: filters
@Directive({
selector: '[ng2-file-select]',
properties: ['uploader'],
host: {
'(change)': 'onChange()'
}
})
export class FileSelect {
public uploader:FileUploader;
@Directive({selector: '[ng2FileSelect]'})
export class FileSelectDirective {
@Input() public uploader:FileUploader;
constructor(private element:ElementRef) {
private element:ElementRef;
public constructor(element:ElementRef) {
this.element = element;
}
public getOptions() {
public getOptions():any {
return this.uploader.options;
}
public getFilters() {
public getFilters():any {
return void 0;
}
public isEmptyAfterSelection():boolean {
return !!this.element.nativeElement.attributes.multiple;
}
onChange() {
@HostListener('change')
public onChange():any {
// let files = this.uploader.isHTML5 ? this.element.nativeElement[0].files : this.element.nativeElement[0];
let files = this.element.nativeElement.files;
let options = this.getOptions();
@@ -45,5 +43,3 @@ export class FileSelect {
}
}
}
export const fileUpload:Array<any> = [FileSelect];

339
components/file-upload/file-uploader.ts → components/file-upload/file-uploader.class.ts
View File

@@ -1,14 +1,11 @@
import {FileLikeObject} from './file-like-object';
import {FileItem} from './file-item';
function isFile(value:any) {
import {FileLikeObject} from './file-like-object.class';
import {FileItem} from './file-item.class';
function isFile(value:any):boolean {
return (File && value instanceof File);
}
function isFileLikeObject(value:any) {
return value instanceof FileLikeObject;
}
// function isFileLikeObject(value:any) {
// return value instanceof FileLikeObject;
// }
export class FileUploader {
public url:string;
public authToken:string;
@@ -19,11 +16,12 @@ export class FileUploader {
public isHTML5:boolean = true;
public removeAfterUpload:boolean = false;
public queueLimit:number;
public _nextIndex = 0;
public _nextIndex:number = 0;
public filters:Array<any> = [];
public options:any;
private _failFilterIndex:number;
constructor(public options:any) {
public constructor(options:any) {
// Object.assign(this, options);
this.url = options.url;
this.authToken = options.authToken;
@@ -31,19 +29,16 @@ export class FileUploader {
this.filters.unshift({name: 'folder', fn: this._folderFilter});
}
public addToQueue(files:any[], options:any, filters:any) {
public addToQueue(files:any[], options:any, filters:any):void {
let list:any[] = [];
for (let file of files) {
list.push(file);
}
let arrayOfFilters = this._getFilters(filters);
let count = this.queue.length;
let addedFileItems:any[] = [];
list.map(some => {
list.map((some:any) => {
let temp = new FileLikeObject(some);
if (this._isValidFile(temp, arrayOfFilters, options)) {
let fileItem = new FileItem(this, some, options);
addedFileItems.push(fileItem);
@@ -54,101 +49,92 @@ export class FileUploader {
this._onWhenAddingFileFailed(temp, filter, options);
}
});
if (this.queue.length !== count) {
this._onAfterAddingAll(addedFileItems);
this.progress = this._getTotalProgress();
}
this._render();
if (this.autoUpload) {
this.uploadAll();
}
}
public removeFromQueue(value:any) {
public removeFromQueue(value:any):void {
let index = this.getIndexOfItem(value);
let item = this.queue[index];
if (item.isUploading) {
item.cancel();
}
this.queue.splice(index, 1);
this.progress = this._getTotalProgress();
}
public clearQueue() {
public clearQueue():void {
while (this.queue.length) {
this.queue[0].remove();
}
this.progress = 0;
}
public uploadItem(value:FileItem) {
public uploadItem(value:FileItem):void {
let index = this.getIndexOfItem(value);
let item = this.queue[index];
let transport = this.isHTML5 ? '_xhrTransport' : '_iframeTransport';
item._prepareToUploading();
if (this.isUploading) {
return;
}
this.isUploading = true;
(<any>this)[transport](item);
(this as any)[transport](item);
}
public cancelItem(value:any) {
public cancelItem(value:any):void {
let index = this.getIndexOfItem(value);
let item = this.queue[index];
let prop = this.isHTML5 ? '_xhr' : '_form';
if (item && item.isUploading) {
item[prop].abort();
}
}
public uploadAll() {
let items = this.getNotUploadedItems().filter(item => !item.isUploading);
public uploadAll():void {
let items = this.getNotUploadedItems().filter((item:any) => !item.isUploading);
if (!items.length) {
return;
}
items.map(item => item._prepareToUploading());
items.map((item:any) => item._prepareToUploading());
items[0].upload();
}
public cancelAll() {
public cancelAll():void {
let items = this.getNotUploadedItems();
items.map(item => item.cancel());
items.map((item:any) => item.cancel());
}
public isFile(value:any) {
public isFile(value:any):boolean {
return isFile(value);
}
public isFileLikeObject(value:any) {
public isFileLikeObject(value:any):boolean {
return value instanceof FileLikeObject;
}
public getIndexOfItem(value:any) {
public getIndexOfItem(value:any):number {
return typeof value === 'number' ? value : this.queue.indexOf(value);
}
public getNotUploadedItems() {
return this.queue.filter(item => !item.isUploaded);
public getNotUploadedItems():Array<any> {
return this.queue.filter((item:any) => !item.isUploaded);
}
public getReadyItems() {
public getReadyItems():Array<any> {
return this.queue
.filter(item => (item.isReady && !item.isUploading))
.sort((item1, item2) => item1.index - item2.index);
.filter((item:any) => (item.isReady && !item.isUploading))
.sort((item1:any, item2:any) => item1.index - item2.index);
}
public destroy() {
public destroy():void {
return void 0;
/*forEach(this._directives, (key) => {
forEach(this._directives[key], (object) => {
object.destroy();
@@ -156,79 +142,166 @@ export class FileUploader {
});*/
}
public onAfterAddingAll(fileItems:any) {
public onAfterAddingAll(fileItems:any):any {
return {fileItems};
}
public onAfterAddingFile(fileItem:any) {
public onAfterAddingFile(fileItem:any):any {
return {fileItem};
}
public onWhenAddingFileFailed(item:any, filter:any, options:any) {
public onWhenAddingFileFailed(item:any, filter:any, options:any):any {
return {item, filter, options};
}
public onBeforeUploadItem(fileItem:any) {
public onBeforeUploadItem(fileItem:any):any {
return {fileItem};
}
public onProgressItem(fileItem:any, progress:any) {
public onProgressItem(fileItem:any, progress:any):any {
return {fileItem, progress};
}
public onProgressAll(progress:any) {
public onProgressAll(progress:any):any {
return {progress};
}
public onSuccessItem(item:any, response:any, status:any, headers:any) {
public onSuccessItem(item:any, response:any, status:any, headers:any):any {
return {item, response, status, headers};
}
public onErrorItem(item:any, response:any, status:any, headers:any) {
public onErrorItem(item:any, response:any, status:any, headers:any):any {
return {item, response, status, headers};
}
public onCancelItem(item:any, response:any, status:any, headers:any) {
public onCancelItem(item:any, response:any, status:any, headers:any):any {
return {item, response, status, headers};
}
public onCompleteItem(item:any, response:any, status:any, headers:any) {
public onCompleteItem(item:any, response:any, status:any, headers:any):any {
return {item, response, status, headers};
}
public onCompleteAll() {
public onCompleteAll():any {
return void 0;
}
private _getTotalProgress(value = 0) {
public _onErrorItem(item:any, response:any, status:any, headers:any):void {
item._onError(response, status, headers);
this.onErrorItem(item, response, status, headers);
}
public _onCompleteItem(item:any, response:any, status:any, headers:any):void {
item._onComplete(response, status, headers);
this.onCompleteItem(item, response, status, headers);
let nextItem = this.getReadyItems()[0];
this.isUploading = false;
if (nextItem) {
nextItem.upload();
return;
}
this.onCompleteAll();
this.progress = this._getTotalProgress();
this._render();
}
protected _headersGetter(parsedHeaders:any):any {
return (name:any) => {
if (name) {
return parsedHeaders[name.toLowerCase()] || void 0;
}
return parsedHeaders;
};
}
protected _xhrTransport(item:any):any {
let xhr = item._xhr = new XMLHttpRequest();
let form = new FormData();
this._onBeforeUploadItem(item);
// todo
/*item.formData.map(obj => {
obj.map((value, key) => {
form.append(key, value);
});
});*/
if (typeof item._file.size !== 'number') {
throw new TypeError('The file specified is no longer valid');
}
form.append(item.alias, item._file, item.file.name);
xhr.upload.onprogress = (event:any) => {
let progress = Math.round(event.lengthComputable ? event.loaded * 100 / event.total : 0);
this._onProgressItem(item, progress);
};
xhr.onload = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
let gist = this._isSuccessCode(xhr.status) ? 'Success' : 'Error';
let method = '_on' + gist + 'Item';
(this as any)[method](item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.onerror = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
this._onErrorItem(item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.onabort = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
this._onCancelItem(item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.open(item.method, item.url, true);
xhr.withCredentials = item.withCredentials;
// todo
/*item.headers.map((value, name) => {
xhr.setRequestHeader(name, value);
});*/
if (this.authToken) {
xhr.setRequestHeader('Authorization', this.authToken);
}
xhr.send(form);
this._render();
}
private _getTotalProgress(value:number = 0):number {
if (this.removeAfterUpload) {
return value;
}
let notUploaded = this.getNotUploadedItems().length;
let uploaded = notUploaded ? this.queue.length - notUploaded : this.queue.length;
let ratio = 100 / this.queue.length;
let current = value * ratio / 100;
return Math.round(uploaded * ratio + current);
}
private _getFilters(filters:any) {
private _getFilters(filters:any):any {
if (!filters) {
return this.filters;
}
if (Array.isArray(filters)) {
return filters;
}
let names = filters.match(/[^\s,]+/g);
return this.filters
.filter(filter => names.indexOf(filter.name) !== -1);
.filter((filter:any) => names.indexOf(filter.name) !== -1);
}
private _render() {
private _render():any {
return void 0;
// todo: ?
}
private _folderFilter(item:any) {
private _folderFilter(item:any):boolean {
return !!(item.size || item.type);
}
private _queueLimitFilter() {
private _queueLimitFilter():boolean {
return this.queue.length < this.queueLimit;
}
private _isValidFile(file:any, filters:any, options:any) {
private _isValidFile(file:any, filters:any, options:any):boolean {
this._failFilterIndex = -1;
return !filters.length ? true : filters.every((filter:any) => {
this._failFilterIndex++;
@@ -236,10 +309,11 @@ export class FileUploader {
});
}
private _isSuccessCode(status:any) {
private _isSuccessCode(status:any):boolean {
return (status >= 200 && status < 300) || status === 304;
}
/* tslint:disable */
private _transformResponse(response:any, headers:any):any {
// todo: ?
/*var headersGetter = this._headersGetter(headers);
@@ -248,121 +322,48 @@ export class FileUploader {
});*/
return response;
}
private _parseHeaders(headers:any) {
let parsed:any = {}, key:any, val:any, i:any;
/* tslint:enable */
private _parseHeaders(headers:any):any {
let parsed:any = {};
let key:any;
let val:any;
let i:any;
if (!headers) {
return parsed;
}
headers.split('\n').map((line:any) => {
i = line.indexOf(':');
key = line.slice(0, i).trim().toLowerCase();
val = line.slice(i + 1).trim();
if (key) {
parsed[key] = parsed[key] ? parsed[key] + ', ' + val : val;
}
});
return parsed;
}
private _headersGetter(parsedHeaders:any) {
return (name:any) => {
if (name) {
return parsedHeaders[name.toLowerCase()] || null;
}
return parsedHeaders;
};
}
_xhrTransport(item:any) {
let xhr = item._xhr = new XMLHttpRequest();
let form = new FormData();
this._onBeforeUploadItem(item);
// todo
/*item.formData.map(obj => {
obj.map((value, key) => {
form.append(key, value);
});
});*/
if (typeof item._file.size !== 'number') {
throw new TypeError('The file specified is no longer valid');
}
form.append(item.alias, item._file, item.file.name);
xhr.upload.onprogress = (event) => {
let progress = Math.round(event.lengthComputable ? event.loaded * 100 / event.total : 0);
this._onProgressItem(item, progress);
};
xhr.onload = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
let gist = this._isSuccessCode(xhr.status) ? 'Success' : 'Error';
let method = '_on' + gist + 'Item';
(<any>this)[method](item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.onerror = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
this._onErrorItem(item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.onabort = () => {
let headers = this._parseHeaders(xhr.getAllResponseHeaders());
let response = this._transformResponse(xhr.response, headers);
this._onCancelItem(item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers);
};
xhr.open(item.method, item.url, true);
xhr.withCredentials = item.withCredentials;
// todo
/*item.headers.map((value, name) => {
xhr.setRequestHeader(name, value);
});*/
if (this.authToken) {
xhr.setRequestHeader('Authorization', this.authToken);
}
xhr.send(form);
this._render();
}
private _iframeTransport(item:any) {
/*private _iframeTransport(item:any) {
// todo: implement it later
}
}*/
private _onWhenAddingFileFailed(item:any, filter:any, options:any) {
private _onWhenAddingFileFailed(item:any, filter:any, options:any):void {
this.onWhenAddingFileFailed(item, filter, options);
}
private _onAfterAddingFile(item:any) {
private _onAfterAddingFile(item:any):void {
this.onAfterAddingFile(item);
}
private _onAfterAddingAll(items:any) {
private _onAfterAddingAll(items:any):void {
this.onAfterAddingAll(items);
}
private _onBeforeUploadItem(item:any) {
private _onBeforeUploadItem(item:any):void {
item._onBeforeUpload();
this.onBeforeUploadItem(item);
}
private _onProgressItem(item:any, progress:any) {
private _onProgressItem(item:any, progress:any):void {
let total = this._getTotalProgress(progress);
this.progress = total;
item._onProgress(progress);
@@ -370,36 +371,14 @@ export class FileUploader {
this.onProgressAll(total);
this._render();
}
private _onSuccessItem(item:any, response:any, status:any, headers:any) {
/* tslint:disable */
private _onSuccessItem(item:any, response:any, status:any, headers:any):void {
item._onSuccess(response, status, headers);
this.onSuccessItem(item, response, status, headers);
}
public _onErrorItem(item:any, response:any, status:any, headers:any) {
item._onError(response, status, headers);
this.onErrorItem(item, response, status, headers);
}
private _onCancelItem(item:any, response:any, status:any, headers:any) {
/* tslint:enable */
private _onCancelItem(item:any, response:any, status:any, headers:any):void {
item._onCancel(response, status, headers);
this.onCancelItem(item, response, status, headers);
}
public _onCompleteItem(item:any, response:any, status:any, headers:any) {
item._onComplete(response, status, headers);
this.onCompleteItem(item, response, status, headers);
let nextItem = this.getReadyItems()[0];
this.isUploading = false;
if (nextItem) {
nextItem.upload();
return;
}
this.onCompleteAll();
this.progress = this._getTotalProgress();
this._render();
}
}

27
components/file-upload/readme.md
View File

@@ -1,32 +1,17 @@
### Usage
```typescript
import {FileSelect, FileDrop, FileUploader} from 'ng2-file-upload';
import {FileSelectDirective, FileDropDirective, FileUploader} from 'ng2-file-upload/ng2-file-upload';
```
### Annotations
```typescript
// class FileSelect
@Directive({
selector: '[ng2-file-select]',
properties: ['uploader'],
host: {
'(change)': 'onChange()'
}
})
// class FileSelectDirective
@Directive({ selector: '[ng2FileSelect]' })
```
```typescript
// class FileDrop
@Directive({
selector: '[ng2-file-drop]',
properties: ['uploader'],
events: ['fileOver'],
host: {
'(drop)': 'onDrop($event)',
'(dragover)': 'onDragOver($event)',
'(dragleave)': 'onDragLeave($event)'
}
})
// class FileDropDirective
@Directive({ selector: '[ng2FileDrop]' })
```
## FileSelect API
@@ -48,6 +33,6 @@ import {FileSelect, FileDrop, FileUploader} from 'ng2-file-upload';
### Events
- `file-over` - it fires during 'over' and 'out' events for Drop Area; returns `boolean`: `true` if file is over Drop Area, `false` in case of out.
- `fileOver` - it fires during 'over' and 'out' events for Drop Area; returns `boolean`: `true` if file is over Drop Area, `false` in case of out.
See using in [ts demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts) and
[html demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.html)