diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html index 53a51feca..e8481b793 100644 --- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html +++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html @@ -12,15 +12,15 @@
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts index 6aeb277a1..674b9b56f 100644 --- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts +++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts @@ -1,5 +1,5 @@ -import { ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core'; -import { ActivatedRoute, Router } from '@angular/router'; +import {ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild} from '@angular/core'; +import {ActivatedRoute, Router} from '@angular/router'; import { FileUploadControllerService, ManualRedactionControllerService, @@ -7,22 +7,25 @@ import { ProjectControllerService, StatusControllerService } from '@redaction/red-ui-http'; -import { TranslateService } from '@ngx-translate/core'; -import { NotificationService, NotificationType } from '../../../notification/notification.service'; -import { MatDialog } from '@angular/material/dialog'; -import { AppStateService } from '../../../state/app-state.service'; -import { FileDetailsDialogComponent } from './file-details-dialog/file-details-dialog.component'; -import { ViewerSyncService } from '../service/viewer-sync.service'; -import { Annotations } from '@pdftron/webviewer'; -import { PdfViewerComponent } from '../pdf-viewer/pdf-viewer.component'; -import { AnnotationUtils } from '../../../utils/annotation-utils'; -import { ManualRedactionDialogComponent } from '../manual-redaction-dialog/manual-redaction-dialog.component'; -import { UserService } from '../../../user/user.service'; -import { debounce } from '../../../utils/debounce'; +import {TranslateService} from '@ngx-translate/core'; +import {NotificationService, NotificationType} from '../../../notification/notification.service'; +import {MatDialog} from '@angular/material/dialog'; +import {AppStateService} from '../../../state/app-state.service'; +import {FileDetailsDialogComponent} from './file-details-dialog/file-details-dialog.component'; +import {ViewerSyncService} from '../service/viewer-sync.service'; +import {Annotations} from '@pdftron/webviewer'; +import {PdfViewerComponent} from '../pdf-viewer/pdf-viewer.component'; +import {AnnotationUtils} from '../../../utils/annotation-utils'; +import {ManualRedactionDialogComponent} from '../manual-redaction-dialog/manual-redaction-dialog.component'; +import {UserService} from '../../../user/user.service'; +import {debounce} from '../../../utils/debounce'; import scrollIntoView from 'scroll-into-view-if-needed'; -import { ConfirmationDialogComponent } from '../../../common/confirmation-dialog/confirmation-dialog.component'; -import { AnnotationFilters } from '../../../utils/types'; -import { FiltersService } from '../service/filters.service'; +import {ConfirmationDialogComponent} from '../../../common/confirmation-dialog/confirmation-dialog.component'; +import {AnnotationFilters} from '../../../utils/types'; +import {FiltersService} from '../service/filters.service'; +import {FileDownloadService} from "../service/file-download.service"; +import {saveAs} from 'file-saver'; +import {FileType} from "../model/file-type"; class QuickNavigationItem { pageNumber: number; @@ -80,6 +83,7 @@ export class FilePreviewScreenComponent implements OnInit { private readonly _router: Router, private readonly _manualRedactionControllerService: ManualRedactionControllerService, private readonly _userService: UserService, + private readonly _fileDownloadService: FileDownloadService, private readonly _fileUploadControllerService: FileUploadControllerService, private readonly _projectControllerService: ProjectControllerService, private readonly _filtersService: FiltersService) { @@ -156,7 +160,7 @@ export class FilePreviewScreenComponent implements OnInit { const pageNumber = annotation.getPageNumber(); let el = this.quickNavigation.find((page) => page.pageNumber === pageNumber); if (!el) { - el = { pageNumber, redactions: 0, hints: 0, ignored: 0, comments: 0, suggestions: 0 }; + el = {pageNumber, redactions: 0, hints: 0, ignored: 0, comments: 0, suggestions: 0}; this.quickNavigation.push(el); } if (annotation.Id.startsWith('hint:')) { @@ -329,8 +333,10 @@ export class FilePreviewScreenComponent implements OnInit { }); } - public downloadFile(type: 'original' | 'annotated' | 'redacted') { - console.log(`Downloading ${type}...`); + public downloadFile(type: FileType | string) { + this._fileDownloadService.loadFile(type, this.fileId).subscribe(data => { + saveAs(data, this.appStateService.activeFile.filename); + }) } public setAllFilters(value: boolean) { diff --git a/apps/red-ui/src/app/screens/file/model/file-type.ts b/apps/red-ui/src/app/screens/file/model/file-type.ts new file mode 100644 index 000000000..bcebca58b --- /dev/null +++ b/apps/red-ui/src/app/screens/file/model/file-type.ts @@ -0,0 +1,5 @@ +export enum FileType { + ORIGINAL = 'ORIGINAL', + ANNOTATED = 'ANNOTATED', + REDACTED = 'REDACTED' +} diff --git a/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts b/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts index d0a769648..860cf371f 100644 --- a/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts +++ b/apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts @@ -10,19 +10,14 @@ import { ViewChild } from '@angular/core'; import {AppConfigKey, AppConfigService} from '../../../app-config/app-config.service'; -import {FileStatus, FileUploadControllerService, ManualRedactionEntry, Rectangle} from '@redaction/red-ui-http'; -import {Observable, of} from 'rxjs'; -import {tap} from 'rxjs/operators'; +import {FileStatus, ManualRedactionEntry, Rectangle} from '@redaction/red-ui-http'; import WebViewer, {Annotations, WebViewerInstance} from '@pdftron/webviewer'; import {TranslateService} from '@ngx-translate/core'; import {ViewerSyncService} from '../service/viewer-sync.service'; import {MatDialog} from "@angular/material/dialog"; +import {FileDownloadService} from "../service/file-download.service"; +import {FileType} from "../model/file-type"; -export enum FileType { - ORIGINAL = 'ORIGINAL', - ANNOTATED = 'ANNOTATED', - REDACTED = 'REDACTED' -} @Component({ selector: 'redaction-pdf-viewer', @@ -48,7 +43,7 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnDestroy { constructor( private readonly _viewerSyncService: ViewerSyncService, private readonly _translateService: TranslateService, - private readonly _fileUploadControllerService: FileUploadControllerService, + private readonly _fileDownloadService: FileDownloadService, private readonly _dialog: MatDialog, private readonly _appConfigService: AppConfigService) { } @@ -63,9 +58,11 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnDestroy { } ngAfterViewInit(): void { - this._loadFile().subscribe(data => { - this._loadViewer(data); - }); + this._fileDownloadService.loadFile(this.fileType, this.fileId, (data) => { + this._fileData = data + }, () => this._fileData).subscribe(() => { + this._loadViewer(this._fileData); + }) } @@ -96,7 +93,7 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnDestroy { })); instance.docViewer.on('pageComplete', (p) => { - this.pageChanged.emit(p); + this.pageChanged.emit(p); }); instance.docViewer.on('documentLoaded', this.wvDocumentLoadedHandler); @@ -104,29 +101,6 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnDestroy { }); } - private _loadFile(): Observable { - let fileObs$: Observable; - switch (this.fileType) { - case FileType.ANNOTATED: - fileObs$ = this._fileData ? of(this._fileData) : this._fileUploadControllerService.downloadAnnotatedFile(this.fileId, true, 'body').pipe(tap(data => { - this._fileData = data; - })); - break; - case FileType.REDACTED: - fileObs$ = this._fileData ? of(this._fileData) : this._fileUploadControllerService.downloadRedactedFile(this.fileId, true, 'body').pipe(tap(data => { - this._fileData = data; - })); - break; - case FileType.ORIGINAL: - default: - fileObs$ = this._fileData ? of(this._fileData) : this._fileUploadControllerService.downloadOriginalFile(this.fileId, true, 'body') - .pipe(tap(data => { - this._fileData = data; - })); - break; - } - return fileObs$; - } private _disableElements() { this.wvInstance.disableElements([ diff --git a/apps/red-ui/src/app/screens/file/service/file-download.service.ts b/apps/red-ui/src/app/screens/file/service/file-download.service.ts new file mode 100644 index 000000000..daa443674 --- /dev/null +++ b/apps/red-ui/src/app/screens/file/service/file-download.service.ts @@ -0,0 +1,38 @@ +import {Injectable} from '@angular/core'; +import {Observable, of} from "rxjs"; +import {tap} from "rxjs/operators"; +import {FileUploadControllerService} from '@redaction/red-ui-http'; +import {FileType} from "../model/file-type"; + +@Injectable({ + providedIn: 'root' +}) +export class FileDownloadService { + constructor(private readonly _fileUploadControllerService: FileUploadControllerService) { + } + + + loadFile(fileType: FileType | string, fileId: string, saveTo: (fileData) => void = () => null, fetch: () => any = () => null): Observable { + let fileObs$: Observable; + switch (fileType) { + case FileType.ANNOTATED: + fileObs$ = fetch() ? of(fetch()) : this._fileUploadControllerService.downloadAnnotatedFile(fileId, true, 'body').pipe(tap(data => { + saveTo(data); + })); + break; + case FileType.REDACTED: + fileObs$ = fetch() ? of(fetch()) : this._fileUploadControllerService.downloadRedactedFile(fileId, true, 'body').pipe(tap(data => { + saveTo(data); + })); + break; + case FileType.ORIGINAL: + default: + fileObs$ = fetch() ? of(fetch()) : this._fileUploadControllerService.downloadOriginalFile(fileId, true, 'body') + .pipe(tap(data => { + saveTo(data); + })); + break; + } + return fileObs$; + } +}