Image redaction fix

This commit is contained in:
Timo 2021-05-14 12:03:55 +03:00
parent 387756614f
commit b062053bd3
9 changed files with 137 additions and 142 deletions

View File

@ -45,15 +45,15 @@
tabindex="0"
>
<div
(click)="quickScrollFirstEnabled && scrollQuickNavFirst()"
[class.disabled]="!quickScrollFirstEnabled"
(click)="scrollQuickNavFirst()"
[class.disabled]="activeViewerPage === 1"
[matTooltip]="'file-preview.quick-nav.jump-first' | translate"
class="jump"
matTooltipPosition="above"
>
<mat-icon svgIcon="red:nav-first"></mat-icon>
</div>
<div (scroll)="computeQuickNavButtonsState()" class="pages" id="pages">
<div class="pages" id="pages">
<redaction-page-indicator
(pageSelected)="pageSelectedByClick($event)"
*ngFor="let pageNumber of displayedPages"
@ -66,7 +66,7 @@
</div>
<div
(click)="scrollQuickNavLast()"
[class.disabled]="!quickScrollLastEnabled"
[class.disabled]="activeViewerPage === fileData?.fileStatus?.numberOfPages"
[matTooltip]="'file-preview.quick-nav.jump-last' | translate"
class="jump"
matTooltipPosition="above"

View File

@ -83,6 +83,7 @@
&.disabled {
cursor: default;
pointer-events: none;
mat-icon {
opacity: 0.3;

View File

@ -32,8 +32,6 @@ export class FileWorkloadComponent {
@Output() selectPage = new EventEmitter<number>();
@Output() toggleSkipped = new EventEmitter<any>();
@Output() annotationsChanged = new EventEmitter<AnnotationWrapper>();
quickScrollFirstEnabled = false;
quickScrollLastEnabled = false;
displayedPages: number[] = [];
pagesPanelActive = true;
@ViewChild('annotationsElement') private _annotationsElement: ElementRef;
@ -105,19 +103,9 @@ export class FileWorkloadComponent {
filtersChanged(filters: { primary: FilterModel[]; secondary?: FilterModel[] }) {
this.displayedAnnotations = this._annotationProcessingService.filterAndGroupAnnotations(this._annotations, filters.primary, filters.secondary);
this.displayedPages = Object.keys(this.displayedAnnotations).map((key) => Number(key));
this.computeQuickNavButtonsState();
this._changeDetectorRef.markForCheck();
}
computeQuickNavButtonsState() {
setTimeout(() => {
const element: HTMLElement = this._quickNavigationElement.nativeElement.querySelector(`#pages`);
const { scrollTop, scrollHeight, clientHeight } = element;
this.quickScrollFirstEnabled = scrollTop !== 0;
this.quickScrollLastEnabled = scrollHeight !== scrollTop + clientHeight;
}, 0);
}
annotationClicked(annotation: AnnotationWrapper, $event: MouseEvent) {
this.pagesPanelActive = false;
if (this.annotationIsSelected(annotation)) {
@ -193,15 +181,11 @@ export class FileWorkloadComponent {
}
scrollQuickNavFirst() {
if (this.displayedPages.length > 0) {
this._scrollQuickNavigationToPage(this.displayedPages[0]);
}
this.selectPage.emit(1);
}
scrollQuickNavLast() {
if (this.displayedPages.length > 0) {
this._scrollQuickNavigationToPage(this.displayedPages[this.displayedPages.length - 1]);
}
this.selectPage.emit(this.fileData.fileStatus.numberOfPages);
}
pageSelectedByClick($event: number) {

View File

@ -31,7 +31,7 @@
<ul *ngIf="!data.removeFromDictionary">
<li *ngFor="let annotation of data.annotationsToRemove">
{{ annotation.value }}
{{ printable(annotation) }}
</li>
</ul>
</div>

View File

@ -2,6 +2,7 @@ import { Component, Inject } from '@angular/core';
import { AnnotationWrapper } from '@models/file/annotation.wrapper';
import { TranslateService } from '@ngx-translate/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { humanize } from '../../../../utils/functions';
export interface RemoveAnnotationsDialogInput {
annotationsToRemove: AnnotationWrapper[];
@ -27,4 +28,12 @@ export class RemoveAnnotationsDialogComponent {
confirm() {
this.dialogRef.close(true);
}
printable(annotation: AnnotationWrapper) {
if (annotation.isImage) {
return this._translateService.instant('remove-annotations-dialog.image-type', { typeLabel: humanize(annotation.dictionary) });
} else {
return annotation.value;
}
}
}

View File

@ -349,8 +349,8 @@
"download-original-file": "Download Original File",
"exit-fullscreen": "Exit Full Screen (F)",
"quick-nav": {
"jump-first": "Jump to first annotation",
"jump-last": "Jump to last annotation"
"jump-first": "Jump to first page",
"jump-last": "Jump to last page"
}
},
"annotation-actions": {
@ -621,6 +621,7 @@
"title": "Remove Redaction",
"question": "Following redactions will be removed only here:"
},
"image-type": "Image: {{typeLabel}}",
"dictionary": "Dictionary",
"value": "Value",
"confirm": "Yes, proceed and remove!",

0
package-lock.json generated
View File

View File

@ -1,116 +1,116 @@
{
"name": "redaction",
"version": "2.38.0",
"private": true,
"license": "MIT",
"scripts": {
"affected": "nx affected",
"affected:apps": "nx affected:apps",
"affected:build": "nx affected:build",
"affected:dep-graph": "nx affected:dep-graph",
"affected:e2e": "nx affected:e2e",
"affected:libs": "nx affected:libs",
"affected:lint": "nx affected:lint",
"affected:test": "nx affected:test",
"build": "nx build",
"build-lint-all": "ng lint --project=red-ui-http --fix && ng build --project=red-ui-http && ng lint --project=red-ui --fix && ng build --project=red-ui --prod",
"dep-graph": "nx dep-graph",
"e2e": "nx e2e",
"format": "nx format:write",
"format:check": "nx format:check",
"format:write": "nx format:write",
"help": "nx help",
"postinstall": "ngcc --properties es2015 browser module main",
"lint": "nx workspace-lint && nx lint",
"lint-fix": "nx workspace-lint --fix && nx lint --fix",
"nx": "nx",
"start": "nx serve",
"test": "nx test",
"update": "nx migrate latest",
"workspace-generator": "nx workspace-generator"
},
"husky": {
"hooks": {
"pre-commit": "pretty-quick --staged && ng lint --project=red-ui-http && ng lint --project=red-ui --fix"
"name": "redaction",
"version": "2.38.0",
"private": true,
"license": "MIT",
"scripts": {
"affected": "nx affected",
"affected:apps": "nx affected:apps",
"affected:build": "nx affected:build",
"affected:dep-graph": "nx affected:dep-graph",
"affected:e2e": "nx affected:e2e",
"affected:libs": "nx affected:libs",
"affected:lint": "nx affected:lint",
"affected:test": "nx affected:test",
"build": "nx build",
"build-lint-all": "ng lint --project=red-ui-http --fix && ng build --project=red-ui-http && ng lint --project=red-ui --fix && ng build --project=red-ui --prod",
"dep-graph": "nx dep-graph",
"e2e": "nx e2e",
"format": "nx format:write",
"format:check": "nx format:check",
"format:write": "nx format:write",
"help": "nx help",
"postinstall": "ngcc --properties es2015 browser module main",
"lint": "nx workspace-lint && nx lint",
"lint-fix": "nx workspace-lint --fix && nx lint --fix",
"nx": "nx",
"start": "nx serve",
"test": "nx test",
"update": "nx migrate latest",
"workspace-generator": "nx workspace-generator"
},
"husky": {
"hooks": {
"pre-commit": "pretty-quick --staged && ng lint --project=red-ui-http && ng lint --project=red-ui --fix"
}
},
"dependencies": {
"@angular/animations": "11.2.13",
"@angular/cdk": "~11.2.12",
"@angular/common": "11.2.13",
"@angular/compiler": "11.2.13",
"@angular/core": "11.2.13",
"@angular/forms": "11.2.13",
"@angular/material": "~11.2.12",
"@angular/material-moment-adapter": "^11.2.12",
"@angular/platform-browser": "11.2.13",
"@angular/platform-browser-dynamic": "11.2.13",
"@angular/router": "11.2.13",
"@angular/service-worker": "11.2.13",
"@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^6.0.0",
"@nrwl/angular": "12.1.1",
"@pdftron/webviewer": "7.3.2",
"@swimlane/ngx-charts": "^17.0.1",
"file-saver": "^2.0.5",
"jwt-decode": "^3.1.2",
"keycloak-angular": "^8.1.0",
"keycloak-js": "12.0.4",
"lint-staged": "^11.0.0",
"ng2-ace-editor": "^0.3.9",
"ngx-color-picker": "^11.0.0",
"ngx-toastr": "^13.2.1",
"papaparse": "^5.3.0",
"rxjs": "~6.6.7",
"scroll-into-view-if-needed": "^2.2.28",
"streamsaver": "^2.0.5",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.1102.12",
"@angular-eslint/eslint-plugin": "~4.2.0",
"@angular-eslint/eslint-plugin-template": "~4.2.0",
"@angular-eslint/template-parser": "~4.2.0",
"@angular/cli": "11.2.12",
"@angular/compiler-cli": "11.2.13",
"@angular/language-service": "11.2.13",
"@nrwl/cli": "12.1.1",
"@nrwl/cypress": "12.1.1",
"@nrwl/eslint-plugin-nx": "12.1.1",
"@nrwl/jest": "12.1.1",
"@nrwl/linter": "12.1.1",
"@nrwl/tao": "12.1.1",
"@nrwl/workspace": "12.1.1",
"@types/cypress": "^1.1.3",
"@types/jasmine": "3.7.1",
"@types/jest": "26.0.23",
"@types/node": "15.0.2",
"@typescript-eslint/eslint-plugin": "4.22.1",
"@typescript-eslint/parser": "4.22.1",
"cypress": "^6.9.1",
"cypress-file-upload": "^5.0.7",
"cypress-keycloak": "^1.6.0",
"cypress-keycloak-commands": "^1.2.0",
"cypress-localstorage-commands": "^1.4.4",
"dotenv": "9.0.1",
"eslint": "7.26.0",
"eslint-config-prettier": "8.3.0",
"eslint-plugin-import": "latest",
"google-translate-api-browser": "^1.1.71",
"husky": "4.3.8",
"jest": "26.6.3",
"jest-preset-angular": "8.4.0",
"lodash": "^4.17.21",
"moment": "^2.29.1",
"ng-packagr": "11.2.4",
"prettier": "2.3.0",
"pretty-quick": "^3.1.0",
"superagent": "^6.1.0",
"superagent-promise": "^1.1.0",
"ts-jest": "26.5.6",
"ts-node": "9.1.1",
"webpack": "^4.18.1",
"typescript": "4.1.4"
}
},
"dependencies": {
"@angular/animations": "11.2.13",
"@angular/cdk": "~11.2.12",
"@angular/common": "11.2.13",
"@angular/compiler": "11.2.13",
"@angular/core": "11.2.13",
"@angular/forms": "11.2.13",
"@angular/material": "~11.2.12",
"@angular/material-moment-adapter": "^11.2.12",
"@angular/platform-browser": "11.2.13",
"@angular/platform-browser-dynamic": "11.2.13",
"@angular/router": "11.2.13",
"@angular/service-worker": "11.2.13",
"@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^6.0.0",
"@nrwl/angular": "12.1.1",
"@pdftron/webviewer": "7.3.1",
"@swimlane/ngx-charts": "^17.0.1",
"file-saver": "^2.0.5",
"jwt-decode": "^3.1.2",
"keycloak-angular": "^8.1.0",
"keycloak-js": "12.0.4",
"lint-staged": "^11.0.0",
"ng2-ace-editor": "^0.3.9",
"ngx-color-picker": "^11.0.0",
"ngx-toastr": "^13.2.1",
"papaparse": "^5.3.0",
"rxjs": "~6.6.7",
"scroll-into-view-if-needed": "^2.2.28",
"streamsaver": "^2.0.5",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.1102.12",
"@angular-eslint/eslint-plugin": "~4.2.0",
"@angular-eslint/eslint-plugin-template": "~4.2.0",
"@angular-eslint/template-parser": "~4.2.0",
"@angular/cli": "11.2.12",
"@angular/compiler-cli": "11.2.13",
"@angular/language-service": "11.2.13",
"@nrwl/cli": "12.1.1",
"@nrwl/cypress": "12.1.1",
"@nrwl/eslint-plugin-nx": "12.1.1",
"@nrwl/jest": "12.1.1",
"@nrwl/linter": "12.1.1",
"@nrwl/tao": "12.1.1",
"@nrwl/workspace": "12.1.1",
"@types/cypress": "^1.1.3",
"@types/jasmine": "3.7.1",
"@types/jest": "26.0.23",
"@types/node": "15.0.2",
"@typescript-eslint/eslint-plugin": "4.22.1",
"@typescript-eslint/parser": "4.22.1",
"cypress": "^6.9.1",
"cypress-file-upload": "^5.0.7",
"cypress-keycloak": "^1.6.0",
"cypress-keycloak-commands": "^1.2.0",
"cypress-localstorage-commands": "^1.4.4",
"dotenv": "9.0.1",
"eslint": "7.26.0",
"eslint-config-prettier": "8.3.0",
"eslint-plugin-import": "latest",
"google-translate-api-browser": "^1.1.71",
"husky": "4.3.8",
"jest": "26.6.3",
"jest-preset-angular": "8.4.0",
"lodash": "^4.17.21",
"moment": "^2.29.1",
"ng-packagr": "11.2.4",
"prettier": "2.3.0",
"pretty-quick": "^3.1.0",
"superagent": "^6.1.0",
"superagent-promise": "^1.1.0",
"ts-jest": "26.5.6",
"ts-node": "9.1.1",
"webpack": "^4.18.1",
"typescript": "4.1.4"
}
}

View File

@ -2449,10 +2449,10 @@
yargs "15.4.1"
yargs-parser "20.0.0"
"@pdftron/webviewer@7.3.1":
version "7.3.1"
resolved "https://registry.yarnpkg.com/@pdftron/webviewer/-/webviewer-7.3.1.tgz#0fff099b650a4c8c700bac566fd22c7385b3e1ff"
integrity sha512-uoCwA0Ueqd7DdAGaUPdCB8aVKgZNr5JMJeBkR70EJx04eyGofp7TB+AvIE5oQdzVtnruBR8oSONgnP2kWI+Msg==
"@pdftron/webviewer@7.3.2":
version "7.3.2"
resolved "https://registry.yarnpkg.com/@pdftron/webviewer/-/webviewer-7.3.2.tgz#58c24fa6318268b7962fb51bbf6486bac24c7d64"
integrity sha512-GJJ3ErKn2gZKXcjFBg46d4u0X+60daiVu04i+AoYbA7xyocCpGIhW/cg0dZmTq0c1ITfHXvn5uG42UN3BBFWiA==
"@rollup/plugin-commonjs@^17.0.0":
version "17.1.0"