diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts
index 146b0eb3c..82fd4c695 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts
@@ -34,7 +34,6 @@ import { PdfViewerUtils } from '../../../../utils/pdf-viewer.utils';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { ActivatedRoute } from '@angular/router';
import { toPosition } from '../../../../utils/pdf-calculation.utils';
-import { DossiersService } from '@services/entity-services/dossiers.service';
import { ViewModeService } from '../../services/view-mode.service';
import { MultiSelectService } from '../../services/multi-select.service';
import Tools = Core.Tools;
@@ -63,6 +62,7 @@ const dataElements = {
export class PdfViewerComponent implements OnInit, OnChanges {
@Input() fileData: Blob;
@Input() file: File;
+ @Input() dossier: Dossier;
@Input() canPerformActions = false;
@Input() annotations: AnnotationWrapper[];
@Input() shouldDeselectAnnotationsOnPageChange = true;
@@ -94,18 +94,13 @@ export class PdfViewerComponent implements OnInit, OnChanges {
private readonly _annotationActionsService: AnnotationActionsService,
private readonly _configService: ConfigService,
private readonly _loadingService: LoadingService,
- private readonly _dossiersService: DossiersService,
readonly viewModeService: ViewModeService,
readonly multiSelectService: MultiSelectService,
) {}
- private get _dossier(): Dossier {
- return this._dossiersService.find(this.file.dossierId);
- }
-
async ngOnInit() {
this._setReadyAndInitialState = this._setReadyAndInitialState.bind(this);
- await this._loadViewer();
+ await this.loadViewer();
}
ngOnChanges(changes: SimpleChanges): void {
@@ -200,18 +195,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
this.utils.navigateToPage(1);
}
- private _setInitialDisplayMode() {
- this.instance.UI.setFitMode('FitPage');
- const instanceDisplayMode = this.documentViewer.getDisplayModeManager().getDisplayMode();
- instanceDisplayMode.mode = this.viewModeService.isStandard ? 'Single' : 'Facing';
- this.documentViewer.getDisplayModeManager().setDisplayMode(instanceDisplayMode);
- }
-
- private _convertPath(path: string): string {
- return this._baseHref + path;
- }
-
- private async _loadViewer() {
+ async loadViewer() {
this.instance = await WebViewer(
{
licenseKey: environment.licenseKey ? atob(environment.licenseKey) : null,
@@ -232,7 +216,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
this.utils.disableHotkeys();
this._configureTextPopup();
- this.annotationManager.on('annotationSelected', (annotations, action) => {
+ this.annotationManager.addEventListener('annotationSelected', (annotations, action) => {
this.annotationSelected.emit(this.annotationManager.getSelectedAnnotations().map(ann => ann.Id));
if (action === 'deselected') {
this._toggleRectangleAnnotationAction(true);
@@ -242,17 +226,17 @@ export class PdfViewerComponent implements OnInit, OnChanges {
}
});
- this.annotationManager.on('annotationChanged', annotations => {
+ this.annotationManager.addEventListener('annotationChanged', annotations => {
// when a rectangle is drawn,
// it returns one annotation with tool name 'AnnotationCreateRectangle;
// this will auto select rectangle after drawing
if (annotations.length === 1 && annotations[0].ToolName === 'AnnotationCreateRectangle') {
this.annotationManager.selectAnnotations(annotations);
- annotations[0].setRotationControlEnabled(false);
+ annotations[0].enableRotationControl();
}
});
- this.documentViewer.on('pageNumberUpdated', pageNumber => {
+ this.documentViewer.addEventListener('pageNumberUpdated', pageNumber => {
if (this.shouldDeselectAnnotationsOnPageChange) {
this.utils.deselectAllAnnotations();
}
@@ -268,9 +252,9 @@ export class PdfViewerComponent implements OnInit, OnChanges {
this._handleCustomActions();
});
- this.documentViewer.on('documentLoaded', this._setReadyAndInitialState);
+ this.documentViewer.addEventListener('documentLoaded', this._setReadyAndInitialState);
- this.documentViewer.on('keyUp', $event => {
+ this.documentViewer.addEventListener('keyUp', $event => {
// arrows and full-screen
if ($event.target?.tagName?.toLowerCase() !== 'input') {
if ($event.key.startsWith('Arrow') || $event.key === 'f') {
@@ -288,7 +272,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
}
});
- this.documentViewer.on('textSelected', (quads, selectedText) => {
+ this.documentViewer.addEventListener('textSelected', (quads, selectedText) => {
this._selectedText = selectedText;
const textActions = [dataElements.ADD_DICTIONARY, dataElements.ADD_FALSE_POSITIVE];
@@ -314,6 +298,17 @@ export class PdfViewerComponent implements OnInit, OnChanges {
this._loadDocument();
}
+ private _setInitialDisplayMode() {
+ this.instance.UI.setFitMode('FitPage');
+ const instanceDisplayMode = this.documentViewer.getDisplayModeManager().getDisplayMode();
+ instanceDisplayMode.mode = this.viewModeService.isStandard ? 'Single' : 'Facing';
+ this.documentViewer.getDisplayModeManager().setDisplayMode(instanceDisplayMode);
+ }
+
+ private _convertPath(path: string): string {
+ return this._baseHref + path;
+ }
+
private _setSelectionMode(): void {
const textTool = this.instance.Core.Tools.TextTool as unknown as TextTool;
textTool.SELECTION_MODE = this._configService.values.SELECTION_MODE;
@@ -403,14 +398,14 @@ export class PdfViewerComponent implements OnInit, OnChanges {
this.instance.UI.disableElements([dataElements.CLOSE_COMPARE_BUTTON]);
- const dossierTemplateId = this._dossier.dossierTemplateId;
+ const dossierTemplateId = this.dossier.dossierTemplateId;
- this.documentViewer.getTool('AnnotationCreateRectangle').setStyles(() => ({
+ this.documentViewer.getTool('AnnotationCreateRectangle').setStyles({
StrokeThickness: 2,
StrokeColor: this._annotationDrawService.getColor(this.instance, dossierTemplateId, 'manual'),
FillColor: this._annotationDrawService.getColor(this.instance, dossierTemplateId, 'manual'),
Opacity: 0.6,
- }));
+ });
}
private _configureAnnotationSpecificActions(viewerAnnotations: Annotation[]) {
@@ -464,7 +459,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
type: 'actionButton',
dataElement: dataElements.ADD_RECTANGLE,
img: this._convertPath('/assets/icons/general/pdftron-action-add-redaction.svg'),
- title: this._translateService.instant(this._manualAnnotationService.getTitle('REDACTION', this._dossier)),
+ title: this._translateService.instant(this._manualAnnotationService.getTitle('REDACTION', this.dossier)),
onClick: () => this._addRectangleManualRedaction(),
},
]);
@@ -519,7 +514,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
dataElement: 'add-false-positive',
img: this._convertPath('/assets/icons/general/pdftron-action-false-positive.svg'),
title: this._translateService.instant(
- this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.FALSE_POSITIVE, this._dossier),
+ this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.FALSE_POSITIVE, this.dossier),
),
onClick: () => this._addManualRedactionOfType(ManualRedactionEntryTypes.FALSE_POSITIVE),
},
@@ -532,7 +527,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
dataElement: dataElements.ADD_REDACTION,
img: this._convertPath('/assets/icons/general/pdftron-action-add-redaction.svg'),
title: this._translateService.instant(
- this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.REDACTION, this._dossier),
+ this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.REDACTION, this.dossier),
),
onClick: () => this._addManualRedactionOfType(ManualRedactionEntryTypes.REDACTION),
},
@@ -541,7 +536,7 @@ export class PdfViewerComponent implements OnInit, OnChanges {
dataElement: dataElements.ADD_DICTIONARY,
img: this._convertPath('/assets/icons/general/pdftron-action-add-dict.svg'),
title: this._translateService.instant(
- this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.DICTIONARY, this._dossier),
+ this._manualAnnotationService.getTitle(ManualRedactionEntryTypes.DICTIONARY, this.dossier),
),
onClick: () => this._addManualRedactionOfType(ManualRedactionEntryTypes.DICTIONARY),
},
@@ -570,7 +565,11 @@ export class PdfViewerComponent implements OnInit, OnChanges {
];
if (this.canPerformActions && !this.utils.isCurrentPageExcluded) {
- this.instance.UI.enableTools(['AnnotationCreateRectangle']);
+ try {
+ this.instance.UI.enableTools(['AnnotationCreateRectangle']);
+ } catch (e) {
+ console.log(e);
+ }
this.instance.UI.enableElements(elements);
if (this._selectedText.length > 2) {
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
index 1a6725ccb..75909d65f 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
@@ -76,10 +76,10 @@
(manualAnnotationRequested)="openManualAnnotationDialog($event)"
(pageChanged)="viewerPageChanged($event)"
(viewerReady)="viewerReady($event)"
- *ngIf="displayPDFViewer"
[annotations]="annotations"
[canPerformActions]="canPerformAnnotationActions$ | async"
- [fileData]="fileData.fileData"
+ [dossier]="dossier"
+ [fileData]="fileData?.fileData"
[file]="file"
[shouldDeselectAnnotationsOnPageChange]="shouldDeselectAnnotationsOnPageChange"
>
@@ -93,11 +93,7 @@
icon="red:needs-work"
>
-
+
{
@@ -241,8 +240,6 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni
if (file?.analysisRequired) {
await this.fileActions.reanalyseFile();
}
-
- this.displayPDFViewer = true;
}
rebuildFilters(deletePreviousAnnotations = false): void {