diff --git a/projects/ngx-uploader/README.md b/projects/ngx-uploader/README.md index 9149ea02..1432fa09 100644 --- a/projects/ngx-uploader/README.md +++ b/projects/ngx-uploader/README.md @@ -302,9 +302,7 @@ For whole template code please check [here](https://github.com/bleenco/ngx-uploa or choose file(s) - + ``` ### LICENCE diff --git a/projects/ngx-uploader/ng-package.json b/projects/ngx-uploader/ng-package.json index 60b03088..01d27ea3 100644 --- a/projects/ngx-uploader/ng-package.json +++ b/projects/ngx-uploader/ng-package.json @@ -5,4 +5,4 @@ "lib": { "entryFile": "src/public_api.ts" } -} \ No newline at end of file +} diff --git a/projects/ngx-uploader/ng-package.prod.json b/projects/ngx-uploader/ng-package.prod.json index 221fef8f..7935974f 100644 --- a/projects/ngx-uploader/ng-package.prod.json +++ b/projects/ngx-uploader/ng-package.prod.json @@ -4,4 +4,4 @@ "lib": { "entryFile": "src/public_api.ts" } -} \ No newline at end of file +} diff --git a/projects/ngx-uploader/src/lib/interfaces.ts b/projects/ngx-uploader/src/lib/interfaces.ts index 12663e52..11848cde 100644 --- a/projects/ngx-uploader/src/lib/interfaces.ts +++ b/projects/ngx-uploader/src/lib/interfaces.ts @@ -48,8 +48,19 @@ export interface UploadFile { } export interface UploadOutput { - type: 'addedToQueue' | 'allAddedToQueue' | 'uploading' | 'done' | 'start' | 'cancelled' | 'dragOver' - | 'dragOut' | 'drop' | 'removed' | 'removedAll' | 'rejected'; + type: + | 'addedToQueue' + | 'allAddedToQueue' + | 'uploading' + | 'done' + | 'start' + | 'cancelled' + | 'dragOver' + | 'dragOut' + | 'drop' + | 'removed' + | 'removedAll' + | 'rejected'; file?: UploadFile; nativeFile?: File; } diff --git a/projects/ngx-uploader/src/lib/ng-file-drop.directive.ts b/projects/ngx-uploader/src/lib/ng-file-drop.directive.ts index ee59dc26..628de2a1 100644 --- a/projects/ngx-uploader/src/lib/ng-file-drop.directive.ts +++ b/projects/ngx-uploader/src/lib/ng-file-drop.directive.ts @@ -1,7 +1,7 @@ -import { Directive, ElementRef, EventEmitter, Input, Output, OnInit, OnDestroy, HostListener } from '@angular/core'; -import { UploadOutput, UploadInput, UploaderOptions } from './interfaces'; -import { NgUploaderService } from './ngx-uploader.class'; +import { Directive, ElementRef, EventEmitter, HostListener, Input, OnDestroy, OnInit, Output } from '@angular/core'; import { Subscription } from 'rxjs'; +import { UploadInput, UploadOutput, UploaderOptions } from './interfaces'; +import { NgUploaderService } from './ngx-uploader.class'; @Directive({ selector: '[ngFileDrop]' @@ -22,10 +22,10 @@ export class NgFileDropDirective implements OnInit, OnDestroy { ngOnInit() { this._sub = []; - const concurrency = this.options && this.options.concurrency || Number.POSITIVE_INFINITY; - const allowedContentTypes = this.options && this.options.allowedContentTypes || ['*']; - const maxUploads = this.options && this.options.maxUploads || Number.POSITIVE_INFINITY; - const maxFileSize = this.options && this.options.maxFileSize || Number.POSITIVE_INFINITY; + const concurrency = (this.options && this.options.concurrency) || Number.POSITIVE_INFINITY; + const allowedContentTypes = (this.options && this.options.allowedContentTypes) || ['*']; + const maxUploads = (this.options && this.options.maxUploads) || Number.POSITIVE_INFINITY; + const maxFileSize = (this.options && this.options.maxFileSize) || Number.POSITIVE_INFINITY; this.upload = new NgUploaderService(concurrency, allowedContentTypes, maxUploads, maxFileSize); this.el = this.elementRef.nativeElement; @@ -47,14 +47,14 @@ export class NgFileDropDirective implements OnInit, OnDestroy { ngOnDestroy() { if (this._sub) { - this._sub.forEach(sub => sub.unsubscribe()) + this._sub.forEach(sub => sub.unsubscribe()); } } stopEvent = (e: Event) => { e.stopPropagation(); e.preventDefault(); - } + }; @HostListener('drop', ['$event']) public onDrop(e: any) { diff --git a/projects/ngx-uploader/src/lib/ng-file-select.directive.ts b/projects/ngx-uploader/src/lib/ng-file-select.directive.ts index f0e9ef3e..e668430c 100644 --- a/projects/ngx-uploader/src/lib/ng-file-select.directive.ts +++ b/projects/ngx-uploader/src/lib/ng-file-select.directive.ts @@ -1,7 +1,7 @@ -import { Directive, ElementRef, EventEmitter, Input, Output, OnInit, OnDestroy } from '@angular/core'; +import { Directive, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'; +import { Subscription } from 'rxjs'; import { UploadOutput, UploaderOptions } from './interfaces'; import { NgUploaderService } from './ngx-uploader.class'; -import { Subscription } from 'rxjs'; @Directive({ selector: '[ngFileSelect]' @@ -22,10 +22,10 @@ export class NgFileSelectDirective implements OnInit, OnDestroy { ngOnInit() { this._sub = []; - const concurrency = this.options && this.options.concurrency || Number.POSITIVE_INFINITY; - const allowedContentTypes = this.options && this.options.allowedContentTypes || ['*']; - const maxUploads = this.options && this.options.maxUploads || Number.POSITIVE_INFINITY; - const maxFileSize = this.options && this.options.maxFileSize || Number.POSITIVE_INFINITY; + const concurrency = (this.options && this.options.concurrency) || Number.POSITIVE_INFINITY; + const allowedContentTypes = (this.options && this.options.allowedContentTypes) || ['*']; + const maxUploads = (this.options && this.options.maxUploads) || Number.POSITIVE_INFINITY; + const maxFileSize = (this.options && this.options.maxFileSize) || Number.POSITIVE_INFINITY; this.upload = new NgUploaderService(concurrency, allowedContentTypes, maxUploads, maxFileSize); this.el = this.elementRef.nativeElement; @@ -53,5 +53,5 @@ export class NgFileSelectDirective implements OnInit, OnDestroy { if (this.el.files) { this.upload.handleFiles(this.el.files); } - } + }; } diff --git a/projects/ngx-uploader/src/lib/ngx-uploader.class.spec.ts b/projects/ngx-uploader/src/lib/ngx-uploader.class.spec.ts index deec3c97..c472b9e3 100644 --- a/projects/ngx-uploader/src/lib/ngx-uploader.class.spec.ts +++ b/projects/ngx-uploader/src/lib/ngx-uploader.class.spec.ts @@ -1,13 +1,13 @@ import { NgUploaderService, humanizeBytes } from './ngx-uploader.class'; describe('NgUploaderService constructor', () => { - it('without parameters should return allowedContentTypes = [\'*\']', () => { + it("without parameters should return allowedContentTypes = ['*']", () => { const uploader: NgUploaderService = new NgUploaderService(); expect(uploader.contentTypes.length).toEqual(1); expect(uploader.contentTypes).toEqual(['*']); }); - it('should return [\'image/jpeg\']', () => { + it("should return ['image/jpeg']", () => { const uploader = new NgUploaderService(1, ['image/jpeg']); expect(uploader.contentTypes.length).toEqual(1); expect(uploader.contentTypes).not.toContain('*'); @@ -19,14 +19,14 @@ describe('NgUploaderService constructor', () => { describe('setContentTypes function', () => { const uploader = new NgUploaderService(); - it('should return [\'*\']', () => { + it("should return ['*']", () => { uploader.setContentTypes(['*']); expect(uploader.contentTypes.length).toEqual(1); expect(uploader.contentTypes).toContain('*'); expect(uploader.contentTypes).toEqual(['*']); }); - it('should return [\'image/jpeg\']', () => { + it("should return ['image/jpeg']", () => { uploader.setContentTypes(['image/jpeg']); expect(uploader.contentTypes.length).toEqual(1); expect(uploader.contentTypes).toContain('image/jpeg'); diff --git a/projects/ngx-uploader/src/lib/ngx-uploader.class.ts b/projects/ngx-uploader/src/lib/ngx-uploader.class.ts index ba60dba8..6d2ee86e 100644 --- a/projects/ngx-uploader/src/lib/ngx-uploader.class.ts +++ b/projects/ngx-uploader/src/lib/ngx-uploader.class.ts @@ -1,6 +1,6 @@ import { EventEmitter } from '@angular/core'; -import { Observable, Subject, Subscription, mergeMap, finalize } from 'rxjs'; -import { UploadFile, UploadOutput, UploadInput, UploadStatus, BlobFile } from './interfaces'; +import { Observable, Subject, Subscription, finalize, mergeMap } from 'rxjs'; +import { BlobFile, UploadFile, UploadInput, UploadOutput, UploadStatus } from './interfaces'; export function humanizeBytes(bytes: number): string { if (bytes === 0) { @@ -59,9 +59,9 @@ export class NgUploaderService { } return acc as File[]; - }, [] as File[]) as File[]; - - + }, + [] as File[] + ) as File[]; this.queue.push( ...allowedIncomingFiles.map((file: File, i: number) => { @@ -69,7 +69,7 @@ export class NgUploaderService { this.serviceEvents.emit({ type: 'addedToQueue', file: uploadFile }); return uploadFile; }) - ) + ); this.serviceEvents.emit({ type: 'allAddedToQueue' }); } diff --git a/projects/ngx-uploader/src/lib/ngx-uploader.module.ts b/projects/ngx-uploader/src/lib/ngx-uploader.module.ts index 992fb83a..12c9ed14 100644 --- a/projects/ngx-uploader/src/lib/ngx-uploader.module.ts +++ b/projects/ngx-uploader/src/lib/ngx-uploader.module.ts @@ -6,4 +6,4 @@ import { NgFileSelectDirective } from './ng-file-select.directive'; declarations: [NgFileDropDirective, NgFileSelectDirective], exports: [NgFileDropDirective, NgFileSelectDirective] }) -export class NgxUploaderModule { } +export class NgxUploaderModule {} diff --git a/projects/ngx-uploader/src/test.ts b/projects/ngx-uploader/src/test.ts index d186e4ec..3ffc80c4 100644 --- a/projects/ngx-uploader/src/test.ts +++ b/projects/ngx-uploader/src/test.ts @@ -1,18 +1,12 @@ // This file is required by karma.conf.js and loads recursively all the .spec and framework files +import { getTestBed } from '@angular/core/testing'; +import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; import 'core-js/es7/reflect'; import 'zone.js'; import 'zone.js/testing'; -import { getTestBed } from '@angular/core/testing'; -import { - BrowserDynamicTestingModule, - platformBrowserDynamicTesting -} from '@angular/platform-browser-dynamic/testing'; // First, initialize the Angular testing environment. -getTestBed().initTestEnvironment( - BrowserDynamicTestingModule, - platformBrowserDynamicTesting(), { - teardown: { destroyAfterEach: false } -} -); +getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { + teardown: { destroyAfterEach: false } +}); diff --git a/projects/ngx-uploader/tsconfig.lib.json b/projects/ngx-uploader/tsconfig.lib.json index 543fd474..e8e54452 100644 --- a/projects/ngx-uploader/tsconfig.lib.json +++ b/projects/ngx-uploader/tsconfig.lib.json @@ -8,7 +8,5 @@ "inlineSources": true, "types": [] }, - "exclude": [ - "**/*.spec.ts" - ] + "exclude": ["**/*.spec.ts"] } diff --git a/projects/ngx-uploader/tsconfig.spec.json b/projects/ngx-uploader/tsconfig.spec.json index ce7048bc..4b02ff17 100644 --- a/projects/ngx-uploader/tsconfig.spec.json +++ b/projects/ngx-uploader/tsconfig.spec.json @@ -3,12 +3,7 @@ "extends": "../../tsconfig.json", "compilerOptions": { "outDir": "../../out-tsc/spec", - "types": [ - "jasmine" - ] + "types": ["jasmine"] }, - "include": [ - "**/*.spec.ts", - "**/*.d.ts" - ] + "include": ["**/*.spec.ts", "**/*.d.ts"] } diff --git a/src/api/index.ts b/src/api/index.ts index bb337a80..04a26753 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -1,10 +1,10 @@ -import * as path from 'path'; +import * as bodyParser from 'body-parser'; +import * as cors from 'cors'; import * as express from 'express'; +import { existsSync, mkdirSync } from 'fs'; import * as multer from 'multer'; +import * as path from 'path'; import * as rimraf from 'rimraf'; -import * as cors from 'cors'; -import * as bodyParser from 'body-parser'; -import { mkdirSync, existsSync } from 'fs'; const config = { port: 4900 }; diff --git a/src/app/app.component.html b/src/app/app.component.html index 85ef5790..85046bbd 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -20,16 +20,30 @@

ngx-uploader

-
+

Drag files here or to upload.

-
+
@@ -42,17 +56,24 @@

ngx-uploader

- +
- {{ f.progress.data?.percentage }}% + {{ f.progress.data?.percentage }}% Uploading... Done - - {{ f.progress.data?.speedHuman }} + + {{ f.progress.data?.speedHuman }} ETA {{ f.progress.data?.etaHuman }}
@@ -60,10 +81,13 @@

ngx-uploader

- Upload concurrency is intentionally set to single file. All files are immediately deleted after uploaded. + + Upload concurrency is intentionally set to single file. All files are immediately deleted after + uploaded. + - +
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts index e502bcd2..88b2cd42 100644 --- a/src/app/app.component.spec.ts +++ b/src/app/app.component.spec.ts @@ -4,9 +4,7 @@ import { AppComponent } from './app.component'; describe('AppComponent', () => { beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ - AppComponent - ], + declarations: [AppComponent] }).compileComponents(); })); diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 7b6a89d0..26ebc8e8 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,5 +1,5 @@ import { Component, EventEmitter } from '@angular/core'; -import { UploadOutput, UploadInput, UploadFile, humanizeBytes, UploaderOptions, UploadStatus } from 'ngx-uploader'; +import { UploadFile, UploadInput, UploadOutput, UploadStatus, UploaderOptions, humanizeBytes } from 'ngx-uploader'; @Component({ selector: 'app-root', diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 7ced7a79..ad5602c7 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,18 +1,13 @@ -import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; +import { BrowserModule } from '@angular/platform-browser'; import { NgxUploaderModule } from 'ngx-uploader'; import { AppComponent } from './app.component'; @NgModule({ - declarations: [ - AppComponent - ], - imports: [ - BrowserModule, - NgxUploaderModule - ], + declarations: [AppComponent], + imports: [BrowserModule, NgxUploaderModule], providers: [], bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule {} diff --git a/src/index.html b/src/index.html index 24d97336..addcf6cd 100644 --- a/src/index.html +++ b/src/index.html @@ -1,14 +1,14 @@ - - - ngx-uploader - Angular File Uploader - + + + ngx-uploader - Angular File Uploader + - - - - - - + + + + + + diff --git a/src/karma.conf.js b/src/karma.conf.js index b6e00421..4a9730b9 100644 --- a/src/karma.conf.js +++ b/src/karma.conf.js @@ -28,4 +28,4 @@ module.exports = function (config) { browsers: ['Chrome'], singleRun: false }); -}; \ No newline at end of file +}; diff --git a/src/main.ts b/src/main.ts index 91ec6da5..5aa3bf02 100644 --- a/src/main.ts +++ b/src/main.ts @@ -8,5 +8,6 @@ if (environment.production) { enableProdMode(); } -platformBrowserDynamic().bootstrapModule(AppModule) +platformBrowserDynamic() + .bootstrapModule(AppModule) .catch(err => console.log(err)); diff --git a/src/polyfills.ts b/src/polyfills.ts index b6fb02c8..700f374e 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -37,7 +37,6 @@ /** IE10 and IE11 requires the following for the Reflect API. */ // import 'core-js/es6/reflect'; - /** Evergreen browsers require these. **/ // Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. @@ -46,11 +45,11 @@ * user can disable parts of macroTask/DomEvents patch by setting following flags */ - // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame - // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick - // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames +// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame +// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick +// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames - /* +/* * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js * with the following flag, it will bypass `zone.js` patch for IE/Edge */ @@ -59,9 +58,7 @@ /*************************************************************************************************** * Zone JS is required by default for Angular itself. */ -import 'zone.js'; // Included with Angular CLI. - - +import 'zone.js'; // Included with Angular CLI. /*************************************************************************************************** * APPLICATION IMPORTS diff --git a/src/test.ts b/src/test.ts index ae25f27c..c5cb9319 100644 --- a/src/test.ts +++ b/src/test.ts @@ -1,16 +1,10 @@ // This file is required by karma.conf.js and loads recursively all the .spec and framework files -import 'zone.js/testing'; import { getTestBed } from '@angular/core/testing'; -import { - BrowserDynamicTestingModule, - platformBrowserDynamicTesting -} from '@angular/platform-browser-dynamic/testing'; +import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; +import 'zone.js/testing'; // First, initialize the Angular testing environment. -getTestBed().initTestEnvironment( - BrowserDynamicTestingModule, - platformBrowserDynamicTesting(), { - teardown: { destroyAfterEach: false } -} -); +getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { + teardown: { destroyAfterEach: false } +}); diff --git a/src/tsconfig.app.json b/src/tsconfig.app.json index f3a1b801..72a86dec 100644 --- a/src/tsconfig.app.json +++ b/src/tsconfig.app.json @@ -4,11 +4,6 @@ "outDir": "../out-tsc/app", "types": [] }, - "files": [ - "main.ts", - "polyfills.ts" - ], - "include": [ - "src/**/*.d.ts" - ] + "files": ["main.ts", "polyfills.ts"], + "include": ["src/**/*.d.ts"] } diff --git a/src/tsconfig.spec.json b/src/tsconfig.spec.json index de773363..70add2d5 100644 --- a/src/tsconfig.spec.json +++ b/src/tsconfig.spec.json @@ -2,17 +2,8 @@ "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/spec", - "types": [ - "jasmine", - "node" - ] + "types": ["jasmine", "node"] }, - "files": [ - "test.ts", - "polyfills.ts" - ], - "include": [ - "**/*.spec.ts", - "**/*.d.ts" - ] + "files": ["test.ts", "polyfills.ts"], + "include": ["**/*.spec.ts", "**/*.d.ts"] } diff --git a/src/tslint.json b/src/tslint.json index 52e2c1a5..ca6ba8c9 100644 --- a/src/tslint.json +++ b/src/tslint.json @@ -1,17 +1,7 @@ { - "extends": "../tslint.json", - "rules": { - "directive-selector": [ - true, - "attribute", - "app", - "camelCase" - ], - "component-selector": [ - true, - "element", - "app", - "kebab-case" - ] - } + "extends": "../tslint.json", + "rules": { + "directive-selector": [true, "attribute", "app", "camelCase"], + "component-selector": [true, "element", "app", "kebab-case"] + } } diff --git a/tsconfig.api.json b/tsconfig.api.json index caa2ee1a..c000b7f1 100644 --- a/tsconfig.api.json +++ b/tsconfig.api.json @@ -5,16 +5,9 @@ "target": "es2022", "sourceMap": false, "experimentalDecorators": true, - "lib": [ - "es2022", - "dom" - ], + "lib": ["es2022", "dom"], "outDir": "dist/api", - "typeRoots": [ - "node_modules/@types" - ] + "typeRoots": ["node_modules/@types"] }, - "files": [ - "src/api/index.ts" - ] + "files": ["src/api/index.ts"] } diff --git a/tsconfig.json b/tsconfig.json index 45b67224..2a326f39 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -12,9 +12,7 @@ "noFallthroughCasesInSwitch": true, "sourceMap": true, "paths": { - "ngx-uploader": [ - "projects/ngx-uploader/src/public_api" - ] + "ngx-uploader": ["projects/ngx-uploader/src/public_api"] }, "declaration": false, "downlevelIteration": true, @@ -24,10 +22,7 @@ "target": "ES2022", "module": "ES2022", "useDefineForClassFields": false, - "lib": [ - "ES2022", - "dom" - ] + "lib": ["ES2022", "dom"] }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false,