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

Annotations wrapper more work

Browse Source
This commit is contained in:
Timo Bejan 2020-10-29 14:34:10 +02:00
parent 01a7dc8abe
commit cabe7f834d
2 changed files with 32 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -163,13 +163,13 @@ export class FilePreviewScreenComponent implements OnInit {
return Object.keys(this.displayedAnnotations).map((key) => Number(key));
}
public handleAnnotationSelected(annotation: Annotations.Annotation) {
this.selectedAnnotation = new AnnotationWrapper(annotation);
public handleAnnotationSelected(annotation: AnnotationWrapper) {
this.selectedAnnotation = annotation;
this.scrollToSelectedAnnotation();
this._changeDetectorRef.detectChanges();
}
public selectAnnotation(annotation: Annotations.Annotation) {
public selectAnnotation(annotation: AnnotationWrapper) {
this._viewerComponent.selectAnnotation(annotation);
}
@ -354,21 +354,17 @@ export class FilePreviewScreenComponent implements OnInit {
if (pageIdx !== -1) {
// Displayed page has annotations
this.selectAnnotation(
this.displayedAnnotations[this.activeViewerPage].annotations[0].annotation
this.displayedAnnotations[this.activeViewerPage].annotations[0]
);
} else {
// Displayed page doesn't have annotations
if ($event.key === 'ArrowDown') {
const nextPage = this._nextPageWithAnnotations();
this.selectAnnotation(
this.displayedAnnotations[nextPage].annotations[0].annotation
);
this.selectAnnotation(this.displayedAnnotations[nextPage].annotations[0]);
} else {
const prevPage = this._prevPageWithAnnotations();
const prevPageAnnotations = this.displayedAnnotations[prevPage].annotations;
this.selectAnnotation(
prevPageAnnotations[prevPageAnnotations.length - 1].annotation
);
this.selectAnnotation(prevPageAnnotations[prevPageAnnotations.length - 1]);
}
}
} else {
@ -380,26 +376,24 @@ export class FilePreviewScreenComponent implements OnInit {
if ($event.key === 'ArrowDown') {
if (idx + 1 !== annotationsOnPage.length) {
// If not last item in page
this.selectAnnotation(annotationsOnPage[idx + 1].annotation);
this.selectAnnotation(annotationsOnPage[idx + 1]);
} else if (pageIdx + 1 < this.displayedPages.length) {
// If not last page
const nextPageAnnotations = this.displayedAnnotations[
this.displayedPages[pageIdx + 1]
].annotations;
this.selectAnnotation(nextPageAnnotations[0].annotation);
this.selectAnnotation(nextPageAnnotations[0]);
}
} else {
if (idx !== 0) {
// If not first item in page
this.selectAnnotation(annotationsOnPage[idx - 1].annotation);
this.selectAnnotation(annotationsOnPage[idx - 1]);
} else if (pageIdx) {
// If not first page
const prevPageAnnotations = this.displayedAnnotations[
this.displayedPages[pageIdx - 1]
].annotations;
this.selectAnnotation(
prevPageAnnotations[prevPageAnnotations.length - 1].annotation
);
this.selectAnnotation(prevPageAnnotations[prevPageAnnotations.length - 1]);
}
}
}
@ -471,10 +465,10 @@ export class FilePreviewScreenComponent implements OnInit {
this.viewReady = true;
}
handleAnnotationsAdded(annotations: Annotations.Annotation[]) {
handleAnnotationsAdded(annotations: AnnotationWrapper[]) {
// replacing array causes UI flicker
this.annotations.splice(0, this.annotations.length);
this.annotations.push(...AnnotationUtils.filterAndConvertAnnotations(annotations));
this.annotations.push(...annotations);
this.filters = this._filtersService.getFilters(
this.appStateService.dictionaryData,
this.annotations
@ -489,7 +483,7 @@ export class FilePreviewScreenComponent implements OnInit {
}
private _getColor(manualRedactionEntry: ManualRedactionEntry) {
let color = this.appStateService.isActiveProjectOwner
const color = this.appStateService.isActiveProjectOwner
? this.appStateService.getDictionaryColor('request')
: this.appStateService.getDictionaryColor(manualRedactionEntry.type);
const rgbColor = hexToRgb(color);

27
apps/red-ui/src/app/screens/file/pdf-viewer/pdf-viewer.component.ts
View File

@ -20,6 +20,8 @@ import { Subject } from 'rxjs';
import { throttleTime } from 'rxjs/operators';
import { ManualRedactionEntryWrapper } from '../model/manual-redaction-entry.wrapper';
import { AppStateService } from '../../../state/app-state.service';
import { AnnotationWrapper } from '../model/annotation.wrapper';
import { AnnotationUtils } from '../../../utils/annotation-utils';
export interface ViewerState {
displayMode?: any;
@ -44,8 +46,8 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
@Input() fileStatus: FileStatus;
@Output() fileReady = new EventEmitter();
@Output() annotationsAdded = new EventEmitter<Annotations.Annotation[]>();
@Output() annotationSelected = new EventEmitter<Annotations.Annotation>();
@Output() annotationsAdded = new EventEmitter<AnnotationWrapper[]>();
@Output() annotationSelected = new EventEmitter<AnnotationWrapper>();
@Output() manualAnnotationRequested = new EventEmitter<ManualRedactionEntryWrapper>();
@Output() pageChanged = new EventEmitter<number>();
@Output() keyUp = new EventEmitter<KeyboardEvent>();
@ -69,10 +71,19 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
this._restoreViewerState = this._restoreViewerState.bind(this);
// always publish all existing annotations this way everything gets drawn always
this._annotationEventDebouncer.pipe(throttleTime(300)).subscribe((value) => {
this.annotationsAdded.emit(this.instance.annotManager.getAnnotationsList());
this.annotationsAdded.emit(
AnnotationUtils.filterAndConvertAnnotations(
this.instance.annotManager.getAnnotationsList()
)
);
// nasty double-emit fix, the annotationList is not updated when the event is fired
setTimeout(
() => this.annotationsAdded.emit(this.instance.annotManager.getAnnotationsList()),
() =>
this.annotationsAdded.emit(
AnnotationUtils.filterAndConvertAnnotations(
this.instance.annotManager.getAnnotationsList()
)
),
200
);
});
@ -112,7 +123,7 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
if (action === 'deselected') {
this.annotationSelected.emit(null);
} else {
this.annotationSelected.emit(annotationList[0]);
this.annotationSelected.emit(new AnnotationWrapper(annotationList[0]));
}
});
@ -243,10 +254,10 @@ export class PdfViewerComponent implements OnInit, AfterViewInit, OnChanges {
this.instance.setToolbarGroup('toolbarGroup-View');
}
public selectAnnotation(annotation: Annotations.Annotation) {
public selectAnnotation(annotation: AnnotationWrapper) {
this.instance.annotManager.deselectAllAnnotations();
this.instance.annotManager.selectAnnotation(annotation);
this.navigateToPage(annotation.getPageNumber());
this.instance.annotManager.selectAnnotation(annotation.annotation);
this.navigateToPage(annotation.pageNumber);
}
public navigateToPage(pageNumber: number) {