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

chore(bump): updated versions #1177

Merged
SvetlanaMuravlova merged 29 commits from update-angular into development 2021-09-03 10:44:45 +00:00
Conversation 4 Commits 29 Files Changed 80 +226 -394
14 changed files with 226 additions and 394 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit c4566873f4 - Show all commits

12
apps/demo/src/app/components/file-upload-section.ts
View File

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
// eslint-disable-next-line @typescript-eslint/no-var-requires // eslint-disable-next-line @typescript-eslint/no-var-requires
const doc = require('html-loader!markdown-loader!../../doc.md'); const doc = require('html-loader!markdown-loader!../../doc.md');
const tabDesc:Array<any> = [ const tabDesc: Array<any> = [
{ {
heading: 'Simple', heading: 'Simple',
// eslint-disable-next-line @typescript-eslint/no-var-requires // eslint-disable-next-line @typescript-eslint/no-var-requires
@@ -19,12 +19,12 @@ const tabDesc:Array<any> = [
templateUrl: './file-upload-section.html' templateUrl: './file-upload-section.html'
}) })
export class FileUploadSectionComponent { export class FileUploadSectionComponent {
public name = 'File Upload'; name = 'File Upload';
public currentHeading = 'Simple'; currentHeading = 'Simple';
public doc = doc; doc = doc;
public tabs:any = tabDesc; tabs: any = tabDesc;
public select(e:any):void { select(e: any): void {
if (e.heading) { if (e.heading) {
this.currentHeading = e.heading; this.currentHeading = e.heading;
} }

20
apps/demo/src/app/components/file-upload/simple-demo.ts
View File

@@ -10,18 +10,18 @@ const URL = 'https://evening-anchorage-3159.herokuapp.com/api/';
}) })
export class SimpleDemoComponent { export class SimpleDemoComponent {
uploader:FileUploader; uploader: FileUploader;
hasBaseDropZoneOver:boolean; hasBaseDropZoneOver: boolean;
hasAnotherDropZoneOver:boolean; hasAnotherDropZoneOver: boolean;
response:string; response: string;
constructor (){ constructor() {
this.uploader = new FileUploader({ this.uploader = new FileUploader({
url: URL, url: URL,
disableMultipart: true, // 'DisableMultipart' must be 'true' for formatDataFunction to be called. disableMultipart: true, // 'DisableMultipart' must be 'true' for formatDataFunction to be called.
formatDataFunctionIsAsync: true, formatDataFunctionIsAsync: true,
formatDataFunction: async (item) => { formatDataFunction: async item => {
return new Promise( (resolve, reject) => { return new Promise((resolve, reject) => {
resolve({ resolve({
name: item._file.name, name: item._file.name,
length: item._file.size, length: item._file.size,
@@ -37,14 +37,14 @@ export class SimpleDemoComponent {
this.response = ''; this.response = '';
this.uploader.response.subscribe( res => this.response = res ); this.uploader.response.subscribe(res => this.response = res );
} }
public fileOverBase(e:any):void { fileOverBase(e: any): void {
this.hasBaseDropZoneOver = e; this.hasBaseDropZoneOver = e;
} }
public fileOverAnother(e:any):void { fileOverAnother(e: any): void {
this.hasAnotherDropZoneOver = e; this.hasAnotherDropZoneOver = e;
} }
} }

24
libs/ng2-file-upload/file-upload/file-drop.directive.ts
View File

@@ -4,27 +4,27 @@ import { FileUploader, FileUploaderOptions } from './file-uploader.class';
@Directive({ selector: '[ng2FileDrop]' }) @Directive({ selector: '[ng2FileDrop]' })
export class FileDropDirective { export class FileDropDirective {
@Input() public uploader?: FileUploader; @Input() uploader?: FileUploader;
@Output() public fileOver: EventEmitter<any> = new EventEmitter(); @Output() fileOver: EventEmitter<any> = new EventEmitter();
// eslint-disable-next-line @angular-eslint/no-output-on-prefix // eslint-disable-next-line @angular-eslint/no-output-on-prefix
@Output() public onFileDrop: EventEmitter<File[]> = new EventEmitter<File[]>(); @Output() onFileDrop: EventEmitter<File[]> = new EventEmitter<File[]>();
protected element: ElementRef; protected element: ElementRef;
public constructor(element: ElementRef) { constructor(element: ElementRef) {
this.element = element; this.element = element;
} }
public getOptions(): FileUploaderOptions | void { getOptions(): FileUploaderOptions | void {
return this.uploader?.options; return this.uploader?.options;
} }
public getFilters(): any { getFilters(): string {
return {}; return '';
} }
@HostListener('drop', [ '$event' ]) @HostListener('drop', [ '$event' ])
public onDrop(event: any): void { onDrop(event: MouseEvent): void {
const transfer = this._getTransfer(event); const transfer = this._getTransfer(event);
if (!transfer) { if (!transfer) {
return; return;
@@ -41,7 +41,7 @@ export class FileDropDirective {
} }
@HostListener('dragover', [ '$event' ]) @HostListener('dragover', [ '$event' ])
public onDragOver(event: any): void { onDragOver(event: MouseEvent): void {
const transfer = this._getTransfer(event); const transfer = this._getTransfer(event);
if (!this._haveFiles(transfer.types)) { if (!this._haveFiles(transfer.types)) {
return; return;
@@ -53,7 +53,7 @@ export class FileDropDirective {
} }
@HostListener('dragleave', [ '$event' ]) @HostListener('dragleave', [ '$event' ])
public onDragLeave(event: any): any { onDragLeave(event: MouseEvent): void {
if ((this as any).element) { if ((this as any).element) {
if (event.currentTarget === (this as any).element[ 0 ]) { if (event.currentTarget === (this as any).element[ 0 ]) {
return; return;
@@ -68,12 +68,12 @@ export class FileDropDirective {
return event.dataTransfer ? event.dataTransfer : event.originalEvent.dataTransfer; // jQuery fix; return event.dataTransfer ? event.dataTransfer : event.originalEvent.dataTransfer; // jQuery fix;
} }
protected _preventAndStop(event: any): any { protected _preventAndStop(event: MouseEvent): void {
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
} }
protected _haveFiles(types: any): any { protected _haveFiles(types: any): boolean {
if (!types) { if (!types) {
return false; return false;
} }

74
libs/ng2-file-upload/file-upload/file-item.class.ts
View File

@@ -2,30 +2,30 @@ import { FileLikeObject } from './file-like-object.class';
import { FileUploader, ParsedResponseHeaders, FileUploaderOptions } from './file-uploader.class'; import { FileUploader, ParsedResponseHeaders, FileUploaderOptions } from './file-uploader.class';
export class FileItem { export class FileItem {
public file: FileLikeObject; file: FileLikeObject;
public _file: File; _file: File;
public alias?: string; alias?: string;
public url? = '/'; url = '/';
public method?: string; method?: string;
public headers: any = []; headers: any = [];
public withCredentials = true; withCredentials = true;
public formData: any = []; formData: any = [];
public isReady = false; isReady = false;
public isUploading = false; isUploading = false;
public isUploaded = false; isUploaded = false;
public isSuccess = false; isSuccess = false;
public isCancel = false; isCancel = false;
public isError = false; isError = false;
public progress = 0; progress = 0;
public index?: number; index?: number;
public _xhr?: XMLHttpRequest; _xhr?: XMLHttpRequest;
public _form: any; _form: any;
protected uploader: FileUploader; protected uploader: FileUploader;
protected some: File; protected some: File;
protected options: FileUploaderOptions; protected options: FileUploaderOptions;
public constructor(uploader: FileUploader, some: File, options: FileUploaderOptions) { constructor(uploader: FileUploader, some: File, options: FileUploaderOptions) {
this.uploader = uploader; this.uploader = uploader;
this.some = some; this.some = some;
this.options = options; this.options = options;
@@ -38,7 +38,7 @@ export class FileItem {
this.url = uploader.options.url; this.url = uploader.options.url;
} }
public upload(): void { upload(): void {
try { try {
this.uploader.uploadItem(this); this.uploader.uploadItem(this);
} catch (e) { } catch (e) {
@@ -47,43 +47,43 @@ export class FileItem {
} }
} }
public cancel(): void { cancel(): void {
this.uploader.cancelItem(this); this.uploader.cancelItem(this);
} }
public remove(): void { remove(): void {
this.uploader.removeFromQueue(this); this.uploader.removeFromQueue(this);
} }
public onBeforeUpload(): void { onBeforeUpload(): void {
return void 0; return void 0;
} }
public onBuildForm(form: any): any { onBuildForm(form: any): any {
return { form }; return { form };
} }
public onProgress(progress: number): any { onProgress(progress: number): any {
return { progress }; return { progress };
} }
public onSuccess(response: string, status: number, headers: ParsedResponseHeaders): any { onSuccess(response: string, status: number, headers: ParsedResponseHeaders): any {
return { response, status, headers }; return { response, status, headers };
} }
public onError(response: string, status: number, headers: ParsedResponseHeaders): any { onError(response: string, status: number, headers: ParsedResponseHeaders): any {
return { response, status, headers }; return { response, status, headers };
} }
public onCancel(response: string, status: number, headers: ParsedResponseHeaders): any { onCancel(response: string, status: number, headers: ParsedResponseHeaders): any {
return { response, status, headers }; return { response, status, headers };
} }
public onComplete(response: string, status: number, headers: ParsedResponseHeaders): any { onComplete(response: string, status: number, headers: ParsedResponseHeaders): any {
return { response, status, headers }; return { response, status, headers };
} }
public _onBeforeUpload(): void { _onBeforeUpload(): void {
this.isReady = true; this.isReady = true;
this.isUploading = true; this.isUploading = true;
this.isUploaded = false; this.isUploaded = false;
@@ -94,16 +94,16 @@ export class FileItem {
this.onBeforeUpload(); this.onBeforeUpload();
} }
public _onBuildForm(form: any): void { _onBuildForm(form: any): void {
this.onBuildForm(form); this.onBuildForm(form);
} }
public _onProgress(progress: number): void { _onProgress(progress: number): void {
this.progress = progress; this.progress = progress;
this.onProgress(progress); this.onProgress(progress);
} }
public _onSuccess(response: string, status: number, headers: ParsedResponseHeaders): void { _onSuccess(response: string, status: number, headers: ParsedResponseHeaders): void {
this.isReady = false; this.isReady = false;
this.isUploading = false; this.isUploading = false;
this.isUploaded = true; this.isUploaded = true;
@@ -115,7 +115,7 @@ export class FileItem {
this.onSuccess(response, status, headers); this.onSuccess(response, status, headers);
} }
public _onError(response: string, status: number, headers: ParsedResponseHeaders): void { _onError(response: string, status: number, headers: ParsedResponseHeaders): void {
this.isReady = false; this.isReady = false;
this.isUploading = false; this.isUploading = false;
this.isUploaded = true; this.isUploaded = true;
@@ -127,7 +127,7 @@ export class FileItem {
this.onError(response, status, headers); this.onError(response, status, headers);
} }
public _onCancel(response: string, status: number, headers: ParsedResponseHeaders): void { _onCancel(response: string, status: number, headers: ParsedResponseHeaders): void {
this.isReady = false; this.isReady = false;
this.isUploading = false; this.isUploading = false;
this.isUploaded = false; this.isUploaded = false;
@@ -139,7 +139,7 @@ export class FileItem {
this.onCancel(response, status, headers); this.onCancel(response, status, headers);
} }
public _onComplete(response: string, status: number, headers: ParsedResponseHeaders): void { _onComplete(response: string, status: number, headers: ParsedResponseHeaders): void {
this.onComplete(response, status, headers); this.onComplete(response, status, headers);
if (this.uploader.options.removeAfterUpload) { if (this.uploader.options.removeAfterUpload) {
@@ -147,7 +147,7 @@ export class FileItem {
} }
} }
public _prepareToUploading(): void { _prepareToUploading(): void {
this.index = this.index || ++this.uploader._nextIndex; this.index = this.index || ++this.uploader._nextIndex;
this.isReady = true; this.isReady = true;
} }

27
libs/ng2-file-upload/file-upload/file-like-object.class.ts
View File

@@ -1,31 +1,26 @@
function isElement(node: any): boolean {
return !!(node && (node.nodeName || node.prop && node.attr && node.find));
}
export class FileLikeObject { export class FileLikeObject {
public lastModifiedDate: any; lastModifiedDate: any;
public size: any; size: any;
public type?: string; type?: string;
public name?: string; name?: string;
public rawFile: string; rawFile: HTMLInputElement | File;
public constructor(fileOrInput: any) { constructor(fileOrInput: HTMLInputElement | File) {
this.rawFile = fileOrInput; this.rawFile = fileOrInput;
const isInput = isElement(fileOrInput); const fakePathOrObject = fileOrInput instanceof HTMLInputElement ? fileOrInput.value : fileOrInput;
const fakePathOrObject = isInput ? fileOrInput.value : fileOrInput;
const postfix = typeof fakePathOrObject === 'string' ? 'FakePath' : 'Object'; const postfix = typeof fakePathOrObject === 'string' ? 'FakePath' : 'Object';
const method = '_createFrom' + postfix; const method = `_createFrom${postfix}`;
(this as any)[ method ](fakePathOrObject); (this as any)[ method ](fakePathOrObject);
} }
public _createFromFakePath(path: string): void { _createFromFakePath(path: string): void {
this.lastModifiedDate = void 0; this.lastModifiedDate = void 0;
this.size = void 0; this.size = void 0;
this.type = 'like/' + path.slice(path.lastIndexOf('.') + 1).toLowerCase(); this.type = `like/${path.slice(path.lastIndexOf('.') + 1).toLowerCase()}`;
this.name = path.slice(path.lastIndexOf('/') + path.lastIndexOf('\\') + 2); this.name = path.slice(path.lastIndexOf('/') + path.lastIndexOf('\\') + 2);
} }
public _createFromObject(object: { size: number, type: string, name: string }): void { _createFromObject(object: { size: number, type: string, name: string }): void {
this.size = object.size; this.size = object.size;
this.type = object.type; this.type = object.type;
this.name = object.name; this.name = object.name;

22
libs/ng2-file-upload/file-upload/file-select.directive.ts
View File

@@ -1,39 +1,37 @@
import { Directive, EventEmitter, ElementRef, Input, HostListener, Output } from '@angular/core'; import { Directive, EventEmitter, ElementRef, Input, HostListener, Output } from '@angular/core';
import {FileUploader, FileUploaderOptions} from './file-uploader.class'; import { FileUploader, FileUploaderOptions } from './file-uploader.class';
@Directive({ selector: '[ng2FileSelect]' }) @Directive({ selector: '[ng2FileSelect]' })
export class FileSelectDirective { export class FileSelectDirective {
@Input() public uploader?: FileUploader; @Input() uploader?: FileUploader;
// eslint-disable-next-line @angular-eslint/no-output-on-prefix // eslint-disable-next-line @angular-eslint/no-output-on-prefix
@Output() public onFileSelected: EventEmitter<File[]> = new EventEmitter<File[]>(); @Output() onFileSelected: EventEmitter<File[]> = new EventEmitter<File[]>();
protected element: ElementRef; protected element: ElementRef;
public constructor(element: ElementRef) { constructor(element: ElementRef) {
this.element = element; this.element = element;
} }
public getOptions(): FileUploaderOptions | void { getOptions(): FileUploaderOptions | undefined {
return this.uploader?.options; return this.uploader?.options;
} }
public getFilters(): any { getFilters(): string {
return {}; return '';
} }
public isEmptyAfterSelection(): boolean { isEmptyAfterSelection(): boolean {
return !!this.element.nativeElement.attributes.multiple; return !!this.element.nativeElement.attributes.multiple;
} }
@HostListener('change') @HostListener('change')
public onChange(): any { onChange(): void {
const files = this.element.nativeElement.files; const files = this.element.nativeElement.files;
const options = this.getOptions(); const options = this.getOptions();
const filters = this.getFilters(); const filters = this.getFilters();
if (options) { this.uploader?.addToQueue(files, options, filters);
this.uploader?.addToQueue(files, options, filters);
}
this.onFileSelected.emit(files); this.onFileSelected.emit(files);
if (this.isEmptyAfterSelection()) { if (this.isEmptyAfterSelection()) {

131
libs/ng2-file-upload/file-upload/file-type.class.ts
View File

@@ -1,8 +1,9 @@
import { FileLikeObject } from "../index"; import { FileLikeObject } from '../index';
export class FileType { export class FileType {
/* MS office */ /* MS office */
public static mime_doc: string[] = [ // tslint:disable-next-line:variable-name
static mime_doc: string[] = [
'application/msword', 'application/msword',
'application/msword', 'application/msword',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
@@ -10,7 +11,8 @@ export class FileType {
'application/vnd.ms-word.document.macroEnabled.12', 'application/vnd.ms-word.document.macroEnabled.12',
'application/vnd.ms-word.template.macroEnabled.12' 'application/vnd.ms-word.template.macroEnabled.12'
]; ];
public static mime_xsl: string[] = [ // tslint:disable-next-line:variable-name
static mime_xsl: string[] = [
'application/vnd.ms-excel', 'application/vnd.ms-excel',
'application/vnd.ms-excel', 'application/vnd.ms-excel',
'application/vnd.ms-excel', 'application/vnd.ms-excel',
@@ -21,7 +23,8 @@ export class FileType {
'application/vnd.ms-excel.addin.macroEnabled.12', 'application/vnd.ms-excel.addin.macroEnabled.12',
'application/vnd.ms-excel.sheet.binary.macroEnabled.12' 'application/vnd.ms-excel.sheet.binary.macroEnabled.12'
]; ];
public static mime_ppt: string[] = [ // tslint:disable-next-line:variable-name
static mime_ppt: string[] = [
'application/vnd.ms-powerpoint', 'application/vnd.ms-powerpoint',
'application/vnd.ms-powerpoint', 'application/vnd.ms-powerpoint',
'application/vnd.ms-powerpoint', 'application/vnd.ms-powerpoint',
@@ -36,7 +39,8 @@ export class FileType {
]; ];
/* PSD */ /* PSD */
public static mime_psd: string[] = [ // tslint:disable-next-line:variable-name
static mime_psd: string[] = [
'image/photoshop', 'image/photoshop',
'image/x-photoshop', 'image/x-photoshop',
'image/psd', 'image/psd',
@@ -46,7 +50,8 @@ export class FileType {
]; ];
/* Compressed files */ /* Compressed files */
public static mime_compress: string[] = [ // tslint:disable-next-line:variable-name
static mime_compress: string[] = [
'application/x-gtar', 'application/x-gtar',
'application/x-gcompress', 'application/x-gcompress',
'application/compress', 'application/compress',
@@ -60,7 +65,7 @@ export class FileType {
'application/x-bzip2' 'application/x-bzip2'
]; ];
public static getMimeClass(file: FileLikeObject): string { static getMimeClass(file: FileLikeObject): string {
let mimeClass = 'application'; let mimeClass = 'application';
if (file?.type && this.mime_psd.indexOf(file.type) !== -1) { if (file?.type && this.mime_psd.indexOf(file.type) !== -1) {
mimeClass = 'image'; mimeClass = 'image';
@@ -88,66 +93,66 @@ export class FileType {
return mimeClass; return mimeClass;
} }
public static fileTypeDetection(inputFilename: string): string { static fileTypeDetection(inputFilename: string): string {
const types: { [ key: string ]: string } = { const types: { [ key: string ]: string } = {
'jpg': 'image', jpg: 'image',
'jpeg': 'image', jpeg: 'image',
'tif': 'image', tif: 'image',
'psd': 'image', psd: 'image',
'bmp': 'image', bmp: 'image',
'png': 'image', png: 'image',
'nef': 'image', nef: 'image',
'tiff': 'image', tiff: 'image',
'cr2': 'image', cr2: 'image',
'dwg': 'image', dwg: 'image',
'cdr': 'image', cdr: 'image',
'ai': 'image', ai: 'image',
'indd': 'image', indd: 'image',
'pin': 'image', pin: 'image',
'cdp': 'image', cdp: 'image',
'skp': 'image', skp: 'image',
'stp': 'image', stp: 'image',
'3dm': 'image', '3dm': 'image',
'mp3': 'audio', mp3: 'audio',
'wav': 'audio', wav: 'audio',
'wma': 'audio', wma: 'audio',
'mod': 'audio', mod: 'audio',
'm4a': 'audio', m4a: 'audio',
'compress': 'compress', compress: 'compress',
'zip': 'compress', zip: 'compress',
'rar': 'compress', rar: 'compress',
'7z': 'compress', '7z': 'compress',
'lz': 'compress', lz: 'compress',
'z01': 'compress', z01: 'compress',
'bz2': 'compress', bz2: 'compress',
'gz': 'compress', gz: 'compress',
'pdf': 'pdf', pdf: 'pdf',
'xls': 'xls', xls: 'xls',
'xlsx': 'xls', xlsx: 'xls',
'ods': 'xls', ods: 'xls',
'mp4': 'video', mp4: 'video',
'avi': 'video', avi: 'video',
'wmv': 'video', wmv: 'video',
'mpg': 'video', mpg: 'video',
'mts': 'video', mts: 'video',
'flv': 'video', flv: 'video',
'3gp': 'video', '3gp': 'video',
'vob': 'video', vob: 'video',
'm4v': 'video', m4v: 'video',
'mpeg': 'video', mpeg: 'video',
'm2ts': 'video', m2ts: 'video',
'mov': 'video', mov: 'video',
'doc': 'doc', doc: 'doc',
'docx': 'doc', docx: 'doc',
'eps': 'doc', eps: 'doc',
'txt': 'doc', txt: 'doc',
'odt': 'doc', odt: 'doc',
'rtf': 'doc', rtf: 'doc',
'ppt': 'ppt', ppt: 'ppt',
'pptx': 'ppt', pptx: 'ppt',
'pps': 'ppt', pps: 'ppt',
'ppsx': 'ppt', ppsx: 'ppt',
'odp': 'ppt' odp: 'ppt'
}; };
const chunks = inputFilename.split('.'); const chunks = inputFilename.split('.');

126
libs/ng2-file-upload/file-upload/file-uploader.class.ts
View File

@@ -12,12 +12,12 @@ export interface Headers {
value: string; value: string;
} }
export type ParsedResponseHeaders = { [ headerFieldName: string ]: string }; export interface ParsedResponseHeaders { [ headerFieldName: string ]: string }
export type FilterFunction = { export interface FilterFunction {
name: string, name: string;
fn: (item: FileLikeObject, options?: FileUploaderOptions) => boolean fn(item: FileLikeObject, options?: FileUploaderOptions): boolean;
}; }
export interface FileUploaderOptions { export interface FileUploaderOptions {
allowedMimeType?: string[]; allowedMimeType?: string[];
@@ -31,7 +31,7 @@ export interface FileUploaderOptions {
maxFileSize?: number; maxFileSize?: number;
queueLimit?: number; queueLimit?: number;
removeAfterUpload?: boolean; removeAfterUpload?: boolean;
url?: string; url: string;
disableMultipart?: boolean; disableMultipart?: boolean;
itemAlias?: string; itemAlias?: string;
authTokenHeader?: string; authTokenHeader?: string;
@@ -44,33 +44,34 @@ export interface FileUploaderOptions {
export class FileUploader { export class FileUploader {
public authToken?: string; authToken?: string;
public isUploading = false; isUploading = false;
public queue: FileItem[] = []; queue: FileItem[] = [];
public progress = 0; progress = 0;
public _nextIndex = 0; _nextIndex = 0;
public autoUpload: any; autoUpload: any;
public authTokenHeader?: string; authTokenHeader?: string;
public response: EventEmitter<any>; response: EventEmitter<any>;
public options: FileUploaderOptions = { options: FileUploaderOptions = {
autoUpload: false, autoUpload: false,
isHTML5: true, isHTML5: true,
filters: [], filters: [],
removeAfterUpload: false, removeAfterUpload: false,
disableMultipart: false, disableMultipart: false,
formatDataFunction: (item: FileItem) => item._file, formatDataFunction: (item: FileItem) => item._file,
formatDataFunctionIsAsync: false formatDataFunctionIsAsync: false,
url: ''
}; };
protected _failFilterIndex?: number; protected _failFilterIndex?: number;
public constructor(options: FileUploaderOptions) { constructor(options: FileUploaderOptions) {
this.setOptions(options); this.setOptions(options);
this.response = new EventEmitter<any>(); this.response = new EventEmitter<string>();
} }
public setOptions(options: FileUploaderOptions): void { setOptions(options: FileUploaderOptions): void {
this.options = Object.assign(this.options, options); this.options = Object.assign(this.options, options);
this.authToken = this.options.authToken; this.authToken = this.options.authToken;
@@ -78,8 +79,8 @@ export class FileUploader {
this.autoUpload = this.options.autoUpload; this.autoUpload = this.options.autoUpload;
this.options.filters?.unshift({ name: 'queueLimit', fn: this._queueLimitFilter }); this.options.filters?.unshift({ name: 'queueLimit', fn: this._queueLimitFilter });
if (this.options.maxFileSize && this.options.filters) { if (this.options.maxFileSize) {
this.options.filters.unshift({ name: 'fileSize', fn: this._fileSizeFilter }); this.options.filters?.unshift({ name: 'fileSize', fn: this._fileSizeFilter });
} }
if (this.options.allowedFileType) { if (this.options.allowedFileType) {
@@ -95,7 +96,8 @@ export class FileUploader {
} }
} }
public addToQueue(files: File[], options?: FileUploaderOptions, filters?: FilterFunction[] | string): void { addToQueue(files: File[], _options?: FileUploaderOptions, filters?: [] | string): void {
let options = _options;
const list: File[] = []; const list: File[] = [];
for (const file of files) { for (const file of files) {
list.push(file); list.push(file);
@@ -131,7 +133,7 @@ export class FileUploader {
} }
} }
public removeFromQueue(value: FileItem): void { removeFromQueue(value: FileItem): void {
const index = this.getIndexOfItem(value); const index = this.getIndexOfItem(value);
const item = this.queue[ index ]; const item = this.queue[ index ];
if (item.isUploading) { if (item.isUploading) {
@@ -141,14 +143,14 @@ export class FileUploader {
this.progress = this._getTotalProgress(); this.progress = this._getTotalProgress();
} }
public clearQueue(): void { clearQueue(): void {
while (this.queue.length) { while (this.queue.length) {
this.queue[ 0 ].remove(); this.queue[ 0 ].remove();
} }
this.progress = 0; this.progress = 0;
} }
public uploadItem(value: FileItem): void { uploadItem(value: FileItem): void {
const index = this.getIndexOfItem(value); const index = this.getIndexOfItem(value);
const item = this.queue[ index ]; const item = this.queue[ index ];
const transport = this.options.isHTML5 ? '_xhrTransport' : '_iframeTransport'; const transport = this.options.isHTML5 ? '_xhrTransport' : '_iframeTransport';
@@ -160,7 +162,7 @@ export class FileUploader {
(this as any)[ transport ](item); (this as any)[ transport ](item);
} }
public cancelItem(value: FileItem): void { cancelItem(value: FileItem): void {
const index = this.getIndexOfItem(value); const index = this.getIndexOfItem(value);
const item = this.queue[ index ]; const item = this.queue[ index ];
const prop = this.options.isHTML5 ? item._xhr : item._form; const prop = this.options.isHTML5 ? item._xhr : item._form;
@@ -169,7 +171,7 @@ export class FileUploader {
} }
} }
public uploadAll(): void { uploadAll(): void {
const items = this.getNotUploadedItems().filter((item: FileItem) => !item.isUploading); const items = this.getNotUploadedItems().filter((item: FileItem) => !item.isUploading);
if (!items.length) { if (!items.length) {
return; return;
@@ -178,110 +180,111 @@ export class FileUploader {
items[ 0 ].upload(); items[ 0 ].upload();
} }
public cancelAll(): void { cancelAll(): void {
const items = this.getNotUploadedItems(); const items = this.getNotUploadedItems();
items.map((item: FileItem) => item.cancel()); items.map((item: FileItem) => item.cancel());
} }
public isFile(value: any): boolean { isFile(value: any): boolean {
return isFile(value); return isFile(value);
} }
public isFileLikeObject(value: any): boolean { isFileLikeObject(value: any): boolean {
return value instanceof FileLikeObject; return value instanceof FileLikeObject;
} }
public getIndexOfItem(value: any): number { getIndexOfItem(value: any): number {
return typeof value === 'number' ? value : this.queue.indexOf(value); return typeof value === 'number' ? value : this.queue.indexOf(value);
} }
public getNotUploadedItems(): any[] { getNotUploadedItems(): any[] {
return this.queue.filter((item: FileItem) => !item.isUploaded); return this.queue.filter((item: FileItem) => !item.isUploaded);
} }
public getReadyItems(): any[] { getReadyItems(): any[] {
return this.queue return this.queue
.filter((item: FileItem) => (item.isReady && !item.isUploading)) .filter((item: FileItem) => (item.isReady && !item.isUploading))
.sort((item1: any, item2: any) => item1.index - item2.index); .sort((item1: any, item2: any) => item1.index - item2.index);
} }
public destroy(): void { destroy(): void {
return void 0; return undefined;
} }
public onAfterAddingAll(fileItems: any): any { onAfterAddingAll(fileItems: any): any {
return { fileItems }; return { fileItems };
} }
public onBuildItemForm(fileItem: FileItem, form: any): any { onBuildItemForm(fileItem: FileItem, form: any): any {
return { fileItem, form }; return { fileItem, form };
} }
public onAfterAddingFile(fileItem: FileItem): any { onAfterAddingFile(fileItem: FileItem): any {
return { fileItem }; return { fileItem };
} }
public onWhenAddingFileFailed(item: FileLikeObject, filter: any, options: any): any { onWhenAddingFileFailed(item: FileLikeObject, filter: any, options: any): any {
return { item, filter, options }; return { item, filter, options };
} }
public onBeforeUploadItem(fileItem: FileItem): any { onBeforeUploadItem(fileItem: FileItem): any {
return { fileItem }; return { fileItem };
} }
public onProgressItem(fileItem: FileItem, progress: any): any { onProgressItem(fileItem: FileItem, progress: any): any {
return { fileItem, progress }; return { fileItem, progress };
} }
public onProgressAll(progress: any): any { onProgressAll(progress: any): any {
return { progress }; return { progress };
} }
public onSuccessItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any { onSuccessItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
return { item, response, status, headers }; return { item, response, status, headers };
} }
public onErrorItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any { onErrorItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
return { item, response, status, headers }; return { item, response, status, headers };
} }
public onCancelItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any { onCancelItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
return { item, response, status, headers }; return { item, response, status, headers };
} }
public onCompleteItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any { onCompleteItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
return { item, response, status, headers }; return { item, response, status, headers };
} }
public onCompleteAll(): any { onCompleteAll(): any {
return void 0; return void 0;
} }
public _mimeTypeFilter(item: FileLikeObject): boolean { _mimeTypeFilter(item: FileLikeObject): boolean {
return !(item?.type && this.options.allowedMimeType && this.options.allowedMimeType?.indexOf(item.type) === -1); return !(item?.type && this.options.allowedMimeType && this.options.allowedMimeType?.indexOf(item.type) === -1);
} }
public _fileSizeFilter(item: FileLikeObject): boolean { _fileSizeFilter(item: FileLikeObject): boolean {
return !(this.options.maxFileSize && item.size > this.options.maxFileSize); return !(this.options.maxFileSize && item.size > this.options.maxFileSize);
} }
public _fileTypeFilter(item: FileLikeObject): boolean { _fileTypeFilter(item: FileLikeObject): boolean {
return !(this.options.allowedFileType && return !(this.options.allowedFileType &&
this.options.allowedFileType.indexOf(FileType.getMimeClass(item)) === -1); this.options.allowedFileType.indexOf(FileType.getMimeClass(item)) === -1);
} }
public _onErrorItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): void { _onErrorItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): void {
item._onError(response, status, headers); item._onError(response, status, headers);
this.onErrorItem(item, response, status, headers); this.onErrorItem(item, response, status, headers);
} }
public _onCompleteItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): void { _onCompleteItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): void {
item._onComplete(response, status, headers); item._onComplete(response, status, headers);
this.onCompleteItem(item, response, status, headers); this.onCompleteItem(item, response, status, headers);
const nextItem = this.getReadyItems()[ 0 ]; const nextItem = this.getReadyItems()[ 0 ];
this.isUploading = false; this.isUploading = false;
if (nextItem) { if (nextItem) {
nextItem.upload(); nextItem.upload();
return; return;
} }
this.onCompleteAll(); this.onCompleteAll();
@@ -294,12 +297,14 @@ export class FileUploader {
if (name) { if (name) {
return parsedHeaders[ name.toLowerCase() ] || void 0; return parsedHeaders[ name.toLowerCase() ] || void 0;
} }
return parsedHeaders; return parsedHeaders;
}; };
} }
protected _xhrTransport(item: FileItem): any { protected _xhrTransport(item: FileItem): any {
// eslint-disable-next-line @typescript-eslint/no-this-alias // eslint-disable-next-line @typescript-eslint/no-this-alias
// tslint:disable-next-line:no-this-assignment
const that = this; const that = this;
const xhr = item._xhr = new XMLHttpRequest(); const xhr = item._xhr = new XMLHttpRequest();
let sendable: any; let sendable: any;
@@ -312,11 +317,9 @@ export class FileUploader {
sendable = new FormData(); sendable = new FormData();
this._onBuildItemForm(item, sendable); this._onBuildItemForm(item, sendable);
let appendFile; let appendFile;
if (item.alias && item._file && item.file.name) { appendFile = () => sendable.append(item.alias, item._file, item.file.name);
appendFile = () => sendable.append(item.alias, item._file, item.file.name); if (!this.options.parametersBeforeFiles) {
if (!this.options.parametersBeforeFiles) { appendFile();
appendFile();
}
} }
// For AWS, Additional Parameters must come BEFORE Files // For AWS, Additional Parameters must come BEFORE Files
@@ -348,7 +351,7 @@ export class FileUploader {
const headers = this._parseHeaders(xhr.getAllResponseHeaders()); const headers = this._parseHeaders(xhr.getAllResponseHeaders());
const response = this._transformResponse(xhr.response, headers); const response = this._transformResponse(xhr.response, headers);
const gist = this._isSuccessCode(xhr.status) ? 'Success' : 'Error'; const gist = this._isSuccessCode(xhr.status) ? 'Success' : 'Error';
const method = '_on' + gist + 'Item'; const method = `_on${gist}Item`;
(this as any)[ method ](item, response, xhr.status, headers); (this as any)[ method ](item, response, xhr.status, headers);
this._onCompleteItem(item, response, xhr.status, headers); this._onCompleteItem(item, response, xhr.status, headers);
}; };
@@ -416,9 +419,11 @@ export class FileUploader {
} }
if (typeof filters === 'string') { if (typeof filters === 'string') {
const names = filters.match(/[^\s,]+/g); const names = filters.match(/[^\s,]+/g);
return this.options?.filters || [] return this.options?.filters || []
.filter((filter: any) => names?.indexOf(filter.name) !== -1); .filter((filter: any) => names?.indexOf(filter.name) !== -1);
} }
return this.options?.filters || []; return this.options?.filters || [];
} }
@@ -432,10 +437,12 @@ export class FileUploader {
protected _isValidFile(file: FileLikeObject, filters: FilterFunction[], options: FileUploaderOptions): boolean { protected _isValidFile(file: FileLikeObject, filters: FilterFunction[], options: FileUploaderOptions): boolean {
this._failFilterIndex = -1; this._failFilterIndex = -1;
return !filters.length ? true : filters.every((filter: FilterFunction) => { return !filters.length ? true : filters.every((filter: FilterFunction) => {
if (typeof this._failFilterIndex === 'number') { if (this._failFilterIndex) {
this._failFilterIndex++; this._failFilterIndex++;
} }
return filter.fn.call(this, file, options); return filter.fn.call(this, file, options);
}); });
} }
@@ -464,6 +471,7 @@ export class FileUploader {
parsed[ key ] = parsed[ key ] ? parsed[ key ] + ', ' + val : val; parsed[ key ] = parsed[ key ] ? parsed[ key ] + ', ' + val : val;
} }
}); });
return parsed; return parsed;
} }

6
libs/ng2-file-upload/package.json
View File

@@ -1,4 +1,8 @@
{ {
"name": "ng2-file-upload", "name": "ng2-file-upload",
"version": "1.3.0" "version": "1.3.0",
"peerDependencies": {
"@angular/common": "*",
"@angular/core": "*"
}
} }

80
test/karma.conf.js
View File

@@ -1,80 +0,0 @@
// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html
const customLaunchers = require('./sauce-browsers').customLaunchers;
module.exports = function (config) {
const configuration = {
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
coverageIstanbulReporter: {
dir: require('path').join(__dirname, '../coverage'), reports: [ 'html', 'lcovonly' ],
fixWebpackSourcePaths: false
},
reporters: ['dots', 'coverage-istanbul'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
browserNoActivityTimeout: 20000,
browserDisconnectTolerance: 2,
browserDisconnectTimeout: 5000,
singleRun: true,
customLaunchers: {
Chrome_travis_ci: {
base: 'ChromeHeadless',
flags: [
'--headless',
'--disable-gpu',
'--no-sandbox',
'--remote-debugging-port=9222'
]
}
},
mime: { 'text/x-typescript': ['ts','tsx'] },
client: { captureConsole: true }
};
if (process.env.TRAVIS) {
configuration.browsers = ['Chrome_travis_ci'];
}
if (process.env.SAUCE) {
if (!process.env.SAUCE_USERNAME || !process.env.SAUCE_ACCESS_KEY) {
console.log('Make sure the SAUCE_USERNAME and SAUCE_ACCESS_KEY environment variables are set.');
process.exit(1);
}
configuration.plugins.push(require('karma-sauce-launcher'));
configuration.reporters.push('saucelabs');
configuration.sauceLabs = {
verbose: true,
testName: 'ng2-bootstrap unit tests',
recordScreenshots: false,
username: process.env.SAUCE_USERNAME,
accessKey: process.env.SAUCE_ACCESS_KEY,
connectOptions: {
port: 5757,
logfile: 'sauce_connect.log'
},
public: 'public'
};
configuration.captureTimeout = 60000;
configuration.customLaunchers = customLaunchers();
configuration.browsers = Object.keys(configuration.customLaunchers);
configuration.concurrency = 4;
configuration.browserDisconnectTolerance = 2;
configuration.browserNoActivityTimeout = 20000;
configuration.browserDisconnectTimeout = 5000;
}
config.set(configuration);
};

21
test/matchers.ts
View File

@@ -1,21 +0,0 @@
// tslint:disable
/**
* @copyright Angular ng-bootstrap team
*/
beforeEach(() => {
jasmine.addMatchers({
toHaveCssClass(/*util, customEqualityTests*/) {
return {compare: buildError(false), negativeCompare: buildError(true)};
function buildError(isNot) {
return function (actual, className) {
const orNot = isNot ? 'not ' : '';
return {
pass: actual.classList.contains(className) === !isNot,
message: `Expected ${actual.outerHTML} ${orNot} to contain the CSS class "${className}"`
};
};
}
}
});
});

18
test/sauce-browsers.js
View File

@@ -1,18 +0,0 @@
module.exports.customLaunchers = function customLaunchers() {
return {
sl_chrome: {base: 'SauceLabs', browserName: 'chrome'},
sl_chrome_1: {base: 'SauceLabs', browserName: 'chrome', version: 'latest-1'},
sl_firefox: {base: 'SauceLabs', browserName: 'firefox'},
sl_firefox_1: {base: 'SauceLabs', browserName: 'firefox', version: 'latest-1'},
sl_ie9: {base: 'SauceLabs', browserName: 'internet explorer', platform: 'Windows 2008', version: '9'},
'SL_IE10': {base: 'SauceLabs', browserName: 'internet explorer', platform: 'Windows 2012', version: '10'},
'SL_IE11': {base: 'SauceLabs', browserName: 'internet explorer', platform: 'Windows 8.1', version: '11'},
'SL_EDGE': {base: 'SauceLabs', browserName: 'MicrosoftEdge', platform: 'Windows 10', version: '13.10586'},
'SL_IOS9': {base: 'SauceLabs', browserName: 'iphone', platform: 'OS X 10.10', version: '9.3'},
'SL_IOS10': {base: 'SauceLabs', browserName: 'iphone', platform: 'OS X 10.10', version: '10.0'},
'SL_ANDROID4.4': {base: 'SauceLabs', browserName: 'android', platform: 'Linux', version: '4.4'},
'SL_ANDROID5': {base: 'SauceLabs', browserName: 'android', platform: 'Linux', version: '5.1'},
'SL_SAFARI9': {base: 'SauceLabs', browserName: 'safari', platform: 'OS X 10.11', version: '9.0'}
};
};

37
test/test.ts
View File

@@ -1,37 +0,0 @@
import '../scripts/polyfills.ts';
import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy.js';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
import './matchers';
// Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
declare let __karma__: any;
declare let require: any;
// Prevent Karma from running prematurely.
__karma__.loaded = Function.prototype;
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('../demo/src', true, /\.spec\.ts/);
// And load the modules.
context.keys().map(context);
const context2 = require.context('../src/spec', true, /\.spec\.ts/);
context2.keys().map(context2);
// Finally, start Karma to run the tests.
__karma__.start();

22
test/tsconfig.json
View File

@@ -1,22 +0,0 @@
{
"compilerOptions": {
"experimentalDecorators": true,
"module": "esnext",
"moduleResolution": "node",
"target": "es2015",
"outDir": "./out-tsc/spec",
"types": [
"jasmine",
"node"
]
},
"files": [
"../scripts/typings.d.ts",
"test.ts",
"../scripts/polyfills.ts",
],
"include": [
"../src/**/*.spec.ts",
"../demo/src/**/*.spec.ts"
]
}