diff --git a/apps/red-ui/src/app/app.component.html b/apps/red-ui/src/app/app.component.html index 00bfde5e4..6f2b09693 100644 --- a/apps/red-ui/src/app/app.component.html +++ b/apps/red-ui/src/app/app.component.html @@ -1,6 +1,6 @@ - + diff --git a/apps/red-ui/src/app/app.component.ts b/apps/red-ui/src/app/app.component.ts index a7edc063e..39033dde8 100644 --- a/apps/red-ui/src/app/app.component.ts +++ b/apps/red-ui/src/app/app.component.ts @@ -1,7 +1,7 @@ import { Component, ViewContainerRef } from '@angular/core'; import { RouterHistoryService } from '@services/router-history.service'; import { UserService } from '@services/user.service'; -import { PdfViewer } from './modules/pdf-viewer/services/pdf-viewer.service'; +import { REDDocumentViewer } from './modules/pdf-viewer/services/document-viewer.service'; @Component({ selector: 'redaction-root', @@ -15,6 +15,6 @@ export class AppComponent { public viewContainerRef: ViewContainerRef, private readonly _routerHistoryService: RouterHistoryService, private readonly _userService: UserService, - readonly pdf: PdfViewer, + readonly documentViewer: REDDocumentViewer, ) {} } diff --git a/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.ts b/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.ts index 0b2d4e3a6..c2a7a2dde 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.ts @@ -6,6 +6,7 @@ import { EventEmitter, HostListener, Input, + OnDestroy, Output, TemplateRef, ViewChild, @@ -15,6 +16,7 @@ import { AnnotationProcessingService } from '../../services/annotation-processin import { MatDialogRef, MatDialogState } from '@angular/material/dialog'; import scrollIntoView from 'scroll-into-view-if-needed'; import { + AutoUnsubscribe, CircleButtonTypes, Debounce, FilterService, @@ -24,7 +26,7 @@ import { shareDistinctLast, shareLast, } from '@iqser/common-ui'; -import { combineLatest, firstValueFrom, Observable, takeWhile } from 'rxjs'; +import { combineLatest, firstValueFrom, Observable } from 'rxjs'; import { map, tap } from 'rxjs/operators'; import { File } from '@red/domain'; import { ExcludedPagesService } from '../../services/excluded-pages.service'; @@ -38,6 +40,7 @@ import { FileDataService } from '../../services/file-data.service'; import { PdfViewer } from '../../../pdf-viewer/services/pdf-viewer.service'; import { REDAnnotationManager } from '../../../pdf-viewer/services/annotation-manager.service'; import { AnnotationsListingService } from '../../services/annotations-listing.service'; +import { REDDocumentViewer } from '../../../pdf-viewer/services/document-viewer.service'; const COMMAND_KEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Escape']; const ALL_HOTKEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown']; @@ -48,7 +51,7 @@ const ALL_HOTKEY_ARRAY = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown']; styleUrls: ['./file-workload.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, }) -export class FileWorkloadComponent { +export class FileWorkloadComponent extends AutoUnsubscribe implements OnDestroy { readonly iconButtonTypes = IconButtonTypes; readonly circleButtonTypes = CircleButtonTypes; @@ -77,22 +80,31 @@ export class FileWorkloadComponent { readonly viewModeService: ViewModeService, readonly multiSelectService: MultiSelectService, readonly annotationManager: REDAnnotationManager, + private readonly _documentViewer: REDDocumentViewer, readonly documentInfoService: DocumentInfoService, readonly listingService: AnnotationsListingService, readonly excludedPagesService: ExcludedPagesService, private readonly _changeDetectorRef: ChangeDetectorRef, private readonly _annotationProcessingService: AnnotationProcessingService, ) { - this.pdf.currentPage$.pipe(takeWhile(() => !!this)).subscribe(pageNumber => { + super(); + + this.addActiveScreenSubscription = this.pdf.currentPage$.subscribe(pageNumber => { this._scrollViews(); this.scrollAnnotationsToPage(pageNumber, 'always'); }); - this.listingService.selected$.pipe(takeWhile(() => !!this)).subscribe(annotationIds => { + + this.addActiveScreenSubscription = this.listingService.selected$.subscribe(annotationIds => { if (annotationIds.length > 0) { this.pagesPanelActive = false; } this.scrollToSelectedAnnotation(); }); + + this.addActiveScreenSubscription = this._documentViewer.keyUp$.subscribe($event => { + this.handleKeyEvent($event); + }); + this.displayedAnnotations$ = this._displayedAnnotations$; this.multiSelectInactive$ = this._multiSelectInactive$; this.showExcludedPages$ = this._showExcludedPages$; diff --git a/apps/red-ui/src/app/modules/file-preview/components/pdf-paginator/pdf-paginator.component.ts b/apps/red-ui/src/app/modules/file-preview/components/pdf-paginator/pdf-paginator.component.ts index 08d98fc95..bd6990a67 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/pdf-paginator/pdf-paginator.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/pdf-paginator/pdf-paginator.component.ts @@ -32,6 +32,7 @@ import { ROTATION_ACTION_BUTTONS, TEXT_POPUPS_TO_TOGGLE, } from '../../../pdf-viewer/utils/constants'; +import { REDDocumentViewer } from '../../../pdf-viewer/services/document-viewer.service'; import Annotation = Core.Annotations.Annotation; @Component({ @@ -45,7 +46,6 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On @Output() readonly annotationSelected = this.#annotationSelected$; @Output() readonly manualAnnotationRequested = new EventEmitter(); @Output() readonly pageChanged = this.pdf.pageChanged$.pipe(tap(() => this._handleCustomActions())); - @Output() readonly keyUp = this.pdf.keyUp$; instance: WebViewerInstance; private _selectedText = ''; readonly #visibilityOffIcon = this._convertPath('/assets/icons/general/visibility-off.svg'); @@ -67,6 +67,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On private readonly _fileDataService: FileDataService, private readonly _viewerHeaderService: ViewerHeaderService, private readonly _errorService: ErrorService, + private readonly _documentViewer: REDDocumentViewer, private readonly _annotationManager: REDAnnotationManager, readonly pdf: PdfViewer, private readonly _state: FilePreviewStateService, @@ -85,7 +86,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On this.addActiveScreenSubscription = this._state.blob$ .pipe( log('Reload blob'), - switchMap(blob => from(this.pdf.lockDocument()).pipe(map(() => blob))), + switchMap(blob => from(this._documentViewer.lock()).pipe(map(() => blob))), withLatestFrom(this._state.file$), tap(() => this._errorService.clear()), tap(([blob, file]) => this.pdf.loadDocument(blob, file)), @@ -109,24 +110,18 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On if (action === 'deselected') { // Remove deselected annotations from selected list nextAnnotations = this._annotationManager.selected.filter(ann => !annotations.some(a => a.Id === ann.Id)); + this.pdf.disable(TextPopups.ADD_RECTANGLE); + return nextAnnotations.map(ann => ann.Id); } else if (!this._multiSelectService.isEnabled) { // Only choose the last selected annotation, to bypass viewer multi select nextAnnotations = annotations; + const notSelected = this._fileDataService.all.filter(wrapper => !nextAnnotations.some(ann => ann.Id === wrapper.id)); + this._annotationManager.deselect(notSelected); } else { // Get selected annotations from the manager, no intervention needed nextAnnotations = this._annotationManager.selected; } - if (action === 'deselected') { - this.pdf.disable(TextPopups.ADD_RECTANGLE); - return nextAnnotations.map(ann => ann.Id); - } - - if (!this._multiSelectService.isEnabled) { - const notSelected = this._fileDataService.all.filter(wrapper => !nextAnnotations.some(ann => ann.Id === wrapper.id)); - this._annotationManager.deselect(notSelected); - } - this.#configureAnnotationSpecificActions(annotations); this._toggleRectangleAnnotationAction(annotations.length === 1 && annotations[0].ReadOnly); return nextAnnotations.map(ann => ann.Id); @@ -169,7 +164,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On private _configureElements() { const dossierTemplateId = this.dossier.dossierTemplateId; const color = this._annotationDrawService.getAndConvertColor(dossierTemplateId, dossierTemplateId, 'manual'); - this.pdf.setRectangleToolStyles(color); + this._documentViewer.setRectangleToolStyles(color); } #configureAnnotationSpecificActions(viewerAnnotations: Annotation[]) { @@ -293,6 +288,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On title: this.#getTitle(ManualRedactionEntryTypes.DICTIONARY), onClick: () => this._addManualRedactionOfType(ManualRedactionEntryTypes.DICTIONARY), }); + console.log(popups); this.instance.UI.textPopup.add(popups); @@ -315,7 +311,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On if (this.canPerformActions && !isCurrentPageExcluded) { try { - this.instance.UI.enableTools(['AnnotationCreateRectangle']); + this.pdf.instance.UI.enableTools(['AnnotationCreateRectangle']); } catch (e) { // happens } @@ -338,7 +334,7 @@ export class PdfPaginatorComponent extends AutoUnsubscribe implements OnInit, On ); headerElementsToDisable = headerElementsToDisable.filter(element => !ALLOWED_ACTIONS_WHEN_PAGE_EXCLUDED.includes(element)); } else { - this.instance.UI.disableTools(['AnnotationCreateRectangle']); + this.pdf.instance.UI.disableTools(['AnnotationCreateRectangle']); } this.pdf.disable(textPopupElementsToDisable); diff --git a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html index 048fef54a..cd1e04a5a 100644 --- a/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html +++ b/apps/red-ui/src/app/modules/file-preview/file-preview-screen.component.html @@ -65,7 +65,6 @@
this._fileDataService.loadAnnotations(file))); - @ViewChild(FileWorkloadComponent) readonly workloadComponent: FileWorkloadComponent; private _lastPage: string; @ViewChild('annotationFilterTemplate', { read: TemplateRef, @@ -102,6 +101,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni private readonly _skippedService: SkippedService, private readonly _fileDataService: FileDataService, private readonly _viewModeService: ViewModeService, + private readonly _documentViewer: REDDocumentViewer, private readonly _changeDetectorRef: ChangeDetectorRef, private readonly _dialogService: FilePreviewDialogService, private readonly _pageRotationService: PageRotationService, @@ -198,7 +198,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni ngOnDetach(): void { this._pageRotationService.clearRotations(); - this.pdf.closeDocument(); + this._documentViewer.close(); super.ngOnDetach(); this._changeDetectorRef.markForCheck(); } @@ -354,7 +354,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni } loadAnnotations() { - const documentLoaded$ = this.pdf.loaded$.pipe( + const documentLoaded$ = this._documentViewer.loaded$.pipe( filter(s => s), tap(() => this.viewerReady()), ); @@ -525,9 +525,13 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni ) .subscribe(); - this.addActiveScreenSubscription = this.pdf.pageComplete$.subscribe(() => { + this.addActiveScreenSubscription = this._documentViewer.pageComplete$.subscribe(() => { this._setExcludedPageStyles(); }); + + this.addActiveScreenSubscription = this._documentViewer.keyUp$.subscribe($event => { + this.handleKeyEvent($event); + }); } private _handleDeletedDossier(): void { diff --git a/apps/red-ui/src/app/modules/file-preview/services/annotation-actions.service.ts b/apps/red-ui/src/app/modules/file-preview/services/annotation-actions.service.ts index 262e32060..933bd9438 100644 --- a/apps/red-ui/src/app/modules/file-preview/services/annotation-actions.service.ts +++ b/apps/red-ui/src/app/modules/file-preview/services/annotation-actions.service.ts @@ -37,6 +37,7 @@ import { FileDataService } from './file-data.service'; import { PdfViewer } from '../../pdf-viewer/services/pdf-viewer.service'; import { REDAnnotationManager } from '../../pdf-viewer/services/annotation-manager.service'; import { SkippedService } from './skipped.service'; +import { REDDocumentViewer } from '../../pdf-viewer/services/document-viewer.service'; import Quad = Core.Math.Quad; @Injectable() @@ -51,6 +52,7 @@ export class AnnotationActionsService { private readonly _dialogService: FilePreviewDialogService, private readonly _dialog: MatDialog, private readonly _pdf: PdfViewer, + private readonly _documentViewer: REDDocumentViewer, private readonly _annotationManager: REDAnnotationManager, private readonly _annotationDrawService: AnnotationDrawService, private readonly _activeDossiersService: ActiveDossiersService, @@ -538,7 +540,7 @@ export class AnnotationActionsService { private async _extractTextAndPositions(annotationId: string) { const viewerAnnotation = this._annotationManager.get(annotationId); - const document = await this._pdf.PDFDoc; + const document = await this._documentViewer.PDFDoc; const page = await document.getPage(viewerAnnotation.getPageNumber()); if (this._pdf.isTextHighlight(viewerAnnotation)) { const words = []; @@ -546,7 +548,7 @@ export class AnnotationActionsService { for (const quad of viewerAnnotation.Quads) { const rect = toPosition( viewerAnnotation.getPageNumber(), - this._pdf.getPageHeight(viewerAnnotation.getPageNumber()), + this._documentViewer.getHeight(viewerAnnotation.getPageNumber()), this._translateQuads(viewerAnnotation.getPageNumber(), quad), ); rectangles.push(rect); diff --git a/apps/red-ui/src/app/modules/file-preview/services/stamp.service.ts b/apps/red-ui/src/app/modules/file-preview/services/stamp.service.ts index 108e8d299..2b943cb39 100644 --- a/apps/red-ui/src/app/modules/file-preview/services/stamp.service.ts +++ b/apps/red-ui/src/app/modules/file-preview/services/stamp.service.ts @@ -8,12 +8,14 @@ import { Core } from '@pdftron/webviewer'; import { firstValueFrom } from 'rxjs'; import { WatermarkService } from '@services/entity-services/watermark.service'; import { PdfViewer } from '../../pdf-viewer/services/pdf-viewer.service'; +import { REDDocumentViewer } from '../../pdf-viewer/services/document-viewer.service'; import PDFNet = Core.PDFNet; @Injectable() export class StampService { constructor( private readonly _pdf: PdfViewer, + private readonly _documentViewer: REDDocumentViewer, private readonly _state: FilePreviewStateService, private readonly _logger: NGXLogger, private readonly _viewModeService: ViewModeService, @@ -22,7 +24,7 @@ export class StampService { ) {} async stampPDF(): Promise { - const pdfDoc = await this._pdf.PDFDoc; + const pdfDoc = await this._documentViewer.PDFDoc; if (!pdfDoc) { return; } diff --git a/apps/red-ui/src/app/modules/pdf-viewer/components/paginator/paginator.component.html b/apps/red-ui/src/app/modules/pdf-viewer/components/paginator/paginator.component.html index 242a379e1..5180c39bf 100644 --- a/apps/red-ui/src/app/modules/pdf-viewer/components/paginator/paginator.component.html +++ b/apps/red-ui/src/app/modules/pdf-viewer/components/paginator/paginator.component.html @@ -1,4 +1,4 @@ -