From d942e938c74e72bac7b9fe4144bdb420e134ada4 Mon Sep 17 00:00:00 2001 From: Jan Kuri Date: Fri, 1 Dec 2023 12:59:18 +0100 Subject: [PATCH] refactor(upload-events): update upload events --- .../src/lib/ngx-uploader.class.ts | 74 ++++++++++--------- 1 file changed, 39 insertions(+), 35 deletions(-) diff --git a/projects/ngx-uploader/src/lib/ngx-uploader.class.ts b/projects/ngx-uploader/src/lib/ngx-uploader.class.ts index 6d2ee86..5fc1257 100644 --- a/projects/ngx-uploader/src/lib/ngx-uploader.class.ts +++ b/projects/ngx-uploader/src/lib/ngx-uploader.class.ts @@ -149,18 +149,18 @@ export class NgUploaderService { } }) ) - .subscribe( - output => { + .subscribe({ + next: (output: UploadOutput) => { observer.next(output); }, - err => { + error: (err: any) => { observer.error(err); observer.complete(); }, - () => { + complete: () => { observer.complete(); } - ); + }); this.subs.push({ id: upload.file.id, sub: sub }); }); @@ -179,39 +179,44 @@ export class NgUploaderService { let speed = 0; let eta: number | null = null; - xhr.upload.addEventListener( - 'progress', - (e: ProgressEvent) => { - if (e.lengthComputable) { - const percentage = Math.round((e.loaded * 100) / e.total); - const diff = new Date().getTime() - time; - speed = Math.round((e.loaded / diff) * 1000); - progressStartTime = (file.progress.data && file.progress.data.startTime) || new Date().getTime(); - eta = Math.ceil((e.total - e.loaded) / speed); - - file.progress = { - status: UploadStatus.Uploading, - data: { - percentage: percentage, - speed: speed, - speedHuman: `${humanizeBytes(speed)}/s`, - startTime: progressStartTime, - endTime: null, - eta: eta, - etaHuman: this.secondsToHuman(eta) - } - }; + xhr.upload.onprogress = (e: ProgressEvent) => { + if (e.lengthComputable) { + const percentage = Math.round((e.loaded * 100) / e.total); + const diff = new Date().getTime() - time; + speed = Math.round((e.loaded / diff) * 1000); + progressStartTime = (file.progress.data && file.progress.data.startTime) || new Date().getTime(); + eta = Math.ceil((e.total - e.loaded) / speed); - observer.next({ type: 'uploading', file: file }); - } - }, - false - ); + file.progress = { + status: UploadStatus.Uploading, + data: { + percentage: percentage, + speed: speed, + speedHuman: `${humanizeBytes(speed)}/s`, + startTime: progressStartTime, + endTime: null, + eta: eta, + etaHuman: this.secondsToHuman(eta) + } + }; + + observer.next({ type: 'uploading', file: file }); + } + }; + + xhr.upload.ontimeout = (e: ProgressEvent) => { + observer.error(e); + observer.complete(); + }; - xhr.upload.addEventListener('error', (e: Event) => { + xhr.upload.onerror = (e: ProgressEvent) => { observer.error(e); observer.complete(); - }); + }; + + xhr.upload.onabort = () => { + observer.complete(); + }; xhr.onreadystatechange = () => { if (xhr.readyState === XMLHttpRequest.DONE) { @@ -240,7 +245,6 @@ export class NgUploaderService { file.responseHeaders = this.parseResponseHeaders(xhr.getAllResponseHeaders()); observer.next({ type: 'done', file: file }); - observer.complete(); } };