Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

fix RED-3352: deactivate multiselect on page change

Browse Source
This commit is contained in:
Dan Percic 2022-03-01 17:38:31 +02:00
parent 7b479acb63
commit e92bf44487
5 changed files with 31 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.html
View File

@ -39,7 +39,7 @@
</div>
</div>
<div *ngIf="multiSelectActive$ | async" class="multi-select">
<div *ngIf="multiSelectService.active$ | async" class="multi-select">
<div class="selected-wrapper">
<iqser-round-checkbox
(click)="!!selectedAnnotations?.length && selectAnnotations.emit()"
@ -68,7 +68,7 @@
></iqser-circle-button>
</div>
<div [class.lower-height]="(multiSelectActive$ | async) || (state.isReadonly$ | async)" class="annotations-wrapper">
<div [class.lower-height]="(multiSelectService.active$ | async) || (state.isReadonly$ | async)" class="annotations-wrapper">
<div
#quickNavigation
(keydown)="preventKeyDefault($event)"
@ -135,7 +135,7 @@
</span>
</span>
<div *ngIf="multiSelectActive$ | async">
<div *ngIf="multiSelectService.active$ | async">
<div
(click)="selectAllOnActivePage()"
class="all-caps-label primary pointer"

55
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.ts
View File

@ -53,12 +53,10 @@ export class FileWorkloadComponent {
displayedAnnotations = new Map<number, AnnotationWrapper[]>();
@Input() selectedAnnotations: AnnotationWrapper[];
@Input() activeViewerPage: number;
@Input() shouldDeselectAnnotationsOnPageChange: boolean;
@Input() dialogRef: MatDialogRef<unknown>;
@Input() file!: File;
@Input() annotationActionsTemplate: TemplateRef<unknown>;
@Input() viewer: WebViewerInstance;
@Output() readonly shouldDeselectAnnotationsOnPageChangeChange = new EventEmitter<boolean>();
@Output() readonly selectAnnotations = new EventEmitter<AnnotationWrapper[]>();
@Output() readonly deselectAnnotations = new EventEmitter<AnnotationWrapper[]>();
@Output() readonly selectPage = new EventEmitter<number>();
@ -66,7 +64,6 @@ export class FileWorkloadComponent {
displayedPages: number[] = [];
pagesPanelActive = true;
readonly displayedAnnotations$: Observable<Map<number, AnnotationWrapper[]>>;
readonly multiSelectActive$: Observable<boolean>;
readonly multiSelectInactive$: Observable<boolean>;
readonly showExcludedPages$: Observable<boolean>;
readonly title$: Observable<string>;
@ -88,7 +85,6 @@ export class FileWorkloadComponent {
private readonly _annotationProcessingService: AnnotationProcessingService,
) {
this.displayedAnnotations$ = this._displayedAnnotations$;
this.multiSelectActive$ = this._multiSelectActive$;
this.multiSelectInactive$ = this._multiSelectInactive$;
this.showExcludedPages$ = this._showExcludedPages$;
this.isHighlights$ = this._isHighlights$;
@ -140,16 +136,6 @@ export class FileWorkloadComponent {
);
}
private get _multiSelectActive$() {
const disableDeselectOnPageChange = (value: boolean) => {
if (value) {
this.shouldDeselectAnnotationsOnPageChange = false;
this.shouldDeselectAnnotationsOnPageChangeChange.emit(false);
}
};
return this.multiSelectService.active$.pipe(tap(disableDeselectOnPageChange), shareDistinctLast());
}
private get _firstSelectedAnnotation() {
return this.selectedAnnotations?.length ? this.selectedAnnotations[0] : null;
}
@ -303,15 +289,11 @@ export class FileWorkloadComponent {
// Displayed page doesn't have annotations
if ($event.key === 'ArrowDown') {
const nextPage = this._nextPageWithAnnotations();
this.shouldDeselectAnnotationsOnPageChange = false;
this.shouldDeselectAnnotationsOnPageChangeChange.emit(false);
this.selectAnnotations.emit([this.displayedAnnotations.get(nextPage)[0]]);
return;
}
const prevPage = this._prevPageWithAnnotations();
this.shouldDeselectAnnotationsOnPageChange = false;
this.shouldDeselectAnnotationsOnPageChangeChange.emit(false);
const prevPageAnnotations = this.displayedAnnotations.get(prevPage);
this.selectAnnotations.emit([prevPageAnnotations[prevPageAnnotations.length - 1]]);
return;
@ -319,6 +301,8 @@ export class FileWorkloadComponent {
const page = this._firstSelectedAnnotation.pageNumber;
const pageIdx = this.displayedPages.indexOf(page);
const nextPageIdx = pageIdx + 1;
const previousPageIdx = pageIdx - 1;
const annotationsOnPage = this.displayedAnnotations.get(page);
const idx = annotationsOnPage.findIndex(a => a.id === this._firstSelectedAnnotation.id);
@ -326,22 +310,33 @@ export class FileWorkloadComponent {
if (idx + 1 !== annotationsOnPage.length) {
// If not last item in page
this.selectAnnotations.emit([annotationsOnPage[idx + 1]]);
} else if (pageIdx + 1 < this.displayedPages.length) {
} else if (nextPageIdx < this.displayedPages.length) {
// If not last page
const nextPageAnnotations = this.displayedAnnotations.get(this.displayedPages[pageIdx + 1]);
this.shouldDeselectAnnotationsOnPageChange = false;
this.shouldDeselectAnnotationsOnPageChangeChange.emit(false);
this.selectAnnotations.emit([nextPageAnnotations[0]]);
for (let i = nextPageIdx; i < this.displayedPages.length; i++) {
const nextPageAnnotations = this.displayedAnnotations.get(this.displayedPages[i]);
if (nextPageAnnotations) {
this.selectAnnotations.emit([nextPageAnnotations[0]]);
break;
}
}
}
} else if (idx !== 0) {
return;
}
if (idx !== 0) {
// If not first item in page
this.selectAnnotations.emit([annotationsOnPage[idx - 1]]);
} else if (pageIdx) {
return this.selectAnnotations.emit([annotationsOnPage[idx - 1]]);
}
if (pageIdx) {
// If not first page
const prevPageAnnotations = this.displayedAnnotations.get(this.displayedPages[pageIdx - 1]);
this.shouldDeselectAnnotationsOnPageChange = false;
this.shouldDeselectAnnotationsOnPageChangeChange.emit(false);
this.selectAnnotations.emit([prevPageAnnotations[prevPageAnnotations.length - 1]]);
for (let i = previousPageIdx; i > 0; i--) {
const prevPageAnnotations = this.displayedAnnotations.get(this.displayedPages[i]);
if (prevPageAnnotations) {
this.selectAnnotations.emit([prevPageAnnotations[prevPageAnnotations.length - 1]]);
break;
}
}
}
}

5
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.ts
View File

@ -67,7 +67,6 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
@Input() dossier: Dossier;
@Input() canPerformActions = false;
@Input() annotations: AnnotationWrapper[];
@Input() shouldDeselectAnnotationsOnPageChange = true;
@Output() readonly fileReady = new EventEmitter();
@Output() readonly annotationSelected = new EventEmitter<string[]>();
@Output() readonly manualAnnotationRequested = new EventEmitter<ManualRedactionEntryWrapper>();
@ -266,9 +265,7 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
});
this.documentViewer.addEventListener('pageNumberUpdated', (pageNumber: number) => {
if (this.shouldDeselectAnnotationsOnPageChange) {
this.utils.deselectAllAnnotations();
}
this.utils.deselectAllAnnotations();
this._ngZone.run(() => this.pageChanged.emit(pageNumber));
return this._handleCustomActions();
});

4
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
View File

@ -20,8 +20,8 @@
<redaction-file-actions
[file]="file"
type="file-preview"
fileActionsHelpModeKey="editor_document_features"
type="file-preview"
></redaction-file-actions>
<iqser-circle-button
@ -72,7 +72,6 @@
[canPerformActions]="canPerformAnnotationActions$ | async"
[class.hidden]="!ready"
[dossier]="dossier"
[shouldDeselectAnnotationsOnPageChange]="shouldDeselectAnnotationsOnPageChange"
></redaction-pdf-viewer>
</div>
@ -93,7 +92,6 @@
(selectAnnotations)="selectAnnotations($event)"
(selectPage)="selectPage($event)"
*ngIf="!file.excluded"
[(shouldDeselectAnnotationsOnPageChange)]="shouldDeselectAnnotationsOnPageChange"
[activeViewerPage]="activeViewerPage"
[annotationActionsTemplate]="annotationActionsTemplate"
[annotations]="visibleAnnotations"

5
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.ts
View File

@ -65,7 +65,6 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni
dialogRef: MatDialogRef<unknown>;
fullScreen = false;
shouldDeselectAnnotationsOnPageChange = true;
selectedAnnotations: AnnotationWrapper[] = [];
displayPdfViewer = false;
activeViewerPage: number = null;
@ -394,9 +393,7 @@ export class FilePreviewScreenComponent extends AutoUnsubscribe implements OnIni
}
this._scrollViews();
if (!this.multiSelectService.isActive) {
this.shouldDeselectAnnotationsOnPageChange = true;
}
this.multiSelectService.deactivate();
// Add current page in URL query params
const extras: NavigationExtras = {