From 22d996b129cddb8a4b37e01070b0f2e777dc09c2 Mon Sep 17 00:00:00 2001
From: Facetrollex <alexey.khamitsevich@gmail.com>
Date: Tue, 21 May 2019 01:44:17 +0300
Subject: [PATCH] Added onError/onProgress to directives. Updated Readme/Plunkr

---
 README.md                                  |  4 ++++
 package.json                               | 13 +++++++++----
 src/lib/directives/Base.ts                 | 18 +++++++++++++++---
 src/lib/directives/file-to-array-buffer.ts |  2 ++
 src/lib/directives/file-to-base64.ts       |  2 ++
 src/lib/directives/file-to-text.ts         |  2 ++
 6 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index b86a9fe..bc8cdd4 100644
--- a/README.md
+++ b/README.md
@@ -11,6 +11,10 @@ Angular library that helps convert file (from input[type=file]) to base64/arrayB
 
 # [Documentation](https://github.com/facetrollex/fctrlx-angular-file-reader/wiki)
 # [Example](https://next.plnkr.co/edit/MlwNL3BKXdVtX3Xx)
+# Support
+_If you have any suggestions or if you found an issue, please add it to [here](https://github.com/facetrollex/fctrlx-angular-file-reader/issues)._
+
+**Thanks!!**
 
 # Author
 _Alexey Khamitsevich_
diff --git a/package.json b/package.json
index 5610669..d85ef55 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "fctrlx-angular-file-reader",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "Angular library that helps convert file (from input[type=file]) to base64/arrayBuffer/text using FileReader API.",
   "keywords": [
     "angular",
@@ -21,7 +21,11 @@
     "file-reader-promise",
     "file-reader-promise-like",
     "file-reader-observable",
-    "file-reader-observable-like"
+    "file-reader-observable-like",
+    "file",
+    "FileAPI",
+    "File API",
+    "File Reader"
   ],
   "homepage": "https://github.com/facetrollex/fctrlx-angular-file-reader",
   "author": {
@@ -35,7 +39,8 @@
   },
   "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "^7.2.0",
-    "@angular/core": "^7.2.0"
+    "@angular/common": "^7.2.2",
+    "@angular/core": "^7.2.2",
+    "rxjs": "~6.3.3"
   }
 }
diff --git a/src/lib/directives/Base.ts b/src/lib/directives/Base.ts
index 9e126c0..743f70a 100644
--- a/src/lib/directives/Base.ts
+++ b/src/lib/directives/Base.ts
@@ -10,6 +10,8 @@ export class Base implements OnInit, OnDestroy {
   public type: string;
   public multiple: undefined | null | string | boolean;
   public filesChange: EventEmitter<any>;
+  public onProgress: EventEmitter<any>;
+  public onError: EventEmitter<any>;
 
   private readonly TYPE_FILE: string = 'file';
   private readonly directiveName: string;
@@ -49,9 +51,9 @@ export class Base implements OnInit, OnDestroy {
       const reader = new FileReader();
       const { name, size, type } = files[key];
 
-      reader.onloadend = (file) => {
-        this.store(file, saveKey);
-      };
+      reader.onloadend = (file) => this.store(file, saveKey);
+      reader.onerror = (event) => this.handleError(event);
+      reader.onprogress = (event) => this.handleProgress(event);
 
       this.converted.push({ name, size, type });
 
@@ -61,6 +63,16 @@ export class Base implements OnInit, OnDestroy {
     this.filesChange.next(this.isMultiple ? this.converted : this.converted[0]);
   }
 
+  handleError(event: any): void {
+    this.onError.next(event.target.error.message || 'Something went wrong');
+  }
+
+  handleProgress(event: any): void {
+    if(event.lengthComputable) {
+      this.onProgress.next(Math.round((event.loaded / event.total) * 100));
+    }
+  }
+
   store(file: { target }, key: string): void {
     this.converted[this.currentIndex][key] = file.target.result;
     this.currentIndex = this.currentIndex + 1;
diff --git a/src/lib/directives/file-to-array-buffer.ts b/src/lib/directives/file-to-array-buffer.ts
index dd06a6b..839c315 100644
--- a/src/lib/directives/file-to-array-buffer.ts
+++ b/src/lib/directives/file-to-array-buffer.ts
@@ -17,6 +17,8 @@ export class FileToArrayBuffer extends Base {
   @Input() multiple: undefined | null | string | boolean;
 
   @Output() filesChange: EventEmitter<any> = new EventEmitter();
+  @Output() onProgress: EventEmitter<any> = new EventEmitter();
+  @Output() onError: EventEmitter<any> = new EventEmitter();
 
   static readonly config: DirectiveConfig = {
     name: 'fileToArrBuf',
diff --git a/src/lib/directives/file-to-base64.ts b/src/lib/directives/file-to-base64.ts
index 2bd6027..28b4a6f 100644
--- a/src/lib/directives/file-to-base64.ts
+++ b/src/lib/directives/file-to-base64.ts
@@ -17,6 +17,8 @@ export class FileToBase64 extends Base {
   @Input() multiple: undefined | null | string | boolean;
 
   @Output() filesChange: EventEmitter<any> = new EventEmitter();
+  @Output() onProgress: EventEmitter<any> = new EventEmitter();
+  @Output() onError: EventEmitter<any> = new EventEmitter();
 
   static readonly config: DirectiveConfig = {
     name: 'fileToBase64',
diff --git a/src/lib/directives/file-to-text.ts b/src/lib/directives/file-to-text.ts
index a09b89f..c34873b 100644
--- a/src/lib/directives/file-to-text.ts
+++ b/src/lib/directives/file-to-text.ts
@@ -17,6 +17,8 @@ export class FileToText extends Base {
   @Input() multiple: undefined | null | string | boolean;
 
   @Output() filesChange: EventEmitter<any> = new EventEmitter();
+  @Output() onProgress: EventEmitter<any> = new EventEmitter();
+  @Output() onError: EventEmitter<any> = new EventEmitter();
 
   static readonly config: DirectiveConfig = {
     name: 'fileToText',