From 8a0281aac38328b9de09f6a72f7251978178d85d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Wed, 14 Oct 2020 18:51:12 +0300 Subject: [PATCH] File preview close tabs --- .../file-preview-screen.component.html | 2 + .../file-preview-screen.component.scss | 7 +++ .../file-preview-screen.component.ts | 57 ++++++++++--------- 3 files changed, 39 insertions(+), 27 deletions(-) diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html index 7dfc59cd2..4f6b4aabb 100644 --- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html +++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html @@ -82,6 +82,7 @@ #annotationsContainer>
+
@@ -108,6 +109,7 @@
+
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss index 3688a4a0f..2fee29db8 100644 --- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss +++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss @@ -29,7 +29,14 @@ redaction-pdf-viewer { display: flex; border-bottom: 1px solid $separator; align-items: center; + justify-content: space-between; padding: 0 25px; + + mat-icon { + height: 14px; + width: 14px; + cursor: pointer; + } } .tab-content { diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts index 823330d8a..55cdd6607 100644 --- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts +++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts @@ -1,5 +1,5 @@ -import {ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild} from '@angular/core'; -import {ActivatedRoute, Router} from '@angular/router'; +import { ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; import { FileUploadControllerService, ManualRedactionControllerService, @@ -7,20 +7,20 @@ import { ProjectControllerService, StatusControllerService } from '@redaction/red-ui-http'; -import {TranslateService} from '@ngx-translate/core'; -import {NotificationService, NotificationType} from '../../../notification/notification.service'; -import {MatDialog} from '@angular/material/dialog'; -import {AppStateService} from '../../../state/app-state.service'; -import {FileDetailsDialogComponent} from './file-details-dialog/file-details-dialog.component'; -import {ViewerSyncService} from '../service/viewer-sync.service'; -import {Annotations} from '@pdftron/webviewer'; -import {PdfViewerComponent} from '../pdf-viewer/pdf-viewer.component'; -import {AnnotationUtils} from '../../../utils/annotation-utils'; -import {ManualRedactionDialogComponent} from "../manual-redaction-dialog/manual-redaction-dialog.component"; -import {UserService} from "../../../user/user.service"; -import {debounce} from "../../../utils/debounce"; -import scrollIntoView from 'scroll-into-view-if-needed' -import {ConfirmationDialogComponent} from "../../../common/confirmation-dialog/confirmation-dialog.component"; +import { TranslateService } from '@ngx-translate/core'; +import { NotificationService, NotificationType } from '../../../notification/notification.service'; +import { MatDialog } from '@angular/material/dialog'; +import { AppStateService } from '../../../state/app-state.service'; +import { FileDetailsDialogComponent } from './file-details-dialog/file-details-dialog.component'; +import { ViewerSyncService } from '../service/viewer-sync.service'; +import { Annotations } from '@pdftron/webviewer'; +import { PdfViewerComponent } from '../pdf-viewer/pdf-viewer.component'; +import { AnnotationUtils } from '../../../utils/annotation-utils'; +import { ManualRedactionDialogComponent } from '../manual-redaction-dialog/manual-redaction-dialog.component'; +import { UserService } from '../../../user/user.service'; +import { debounce } from '../../../utils/debounce'; +import scrollIntoView from 'scroll-into-view-if-needed'; +import { ConfirmationDialogComponent } from '../../../common/confirmation-dialog/confirmation-dialog.component'; @Component({ selector: 'redaction-file-preview-screen', @@ -68,7 +68,7 @@ export class FilePreviewScreenComponent implements OnInit { this._activatedRoute.params.subscribe(params => { this.projectId = params.projectId; this.fileId = params.fileId; - this.appStateService.activateFile(this.projectId, this.fileId) + this.appStateService.activateFile(this.projectId, this.fileId); }); } @@ -117,7 +117,10 @@ export class FilePreviewScreenComponent implements OnInit { this._viewerSyncService.activateViewer(value); } - public selectTab(value: 'ANNOTATIONS' | 'INFO' | 'NAVIGATION') { + public selectTab(value: 'ANNOTATIONS' | 'INFO' | 'NAVIGATION', $event?: MouseEvent) { + if ($event) { + $event.stopPropagation(); + } if (value !== this._selectedTab) { this._selectedTab = value; setTimeout(() => { @@ -134,7 +137,7 @@ export class FilePreviewScreenComponent implements OnInit { const pageNumber = annotation.getPageNumber(); let el = this.quickNavigation.find((page) => page.pageNumber === pageNumber); if (!el) { - el = {pageNumber, redactions: 0, hints: 0, ignore: 0} + el = { pageNumber, redactions: 0, hints: 0, ignore: 0 }; this.quickNavigation.push(el); } if (annotation.Id.startsWith('hint:')) { @@ -201,7 +204,7 @@ export class FilePreviewScreenComponent implements OnInit { ref.afterClosed().subscribe(() => { this._manualRedactionEntry = null; - }) + }); } viewerPageChanged(pageNumber: number) { @@ -238,8 +241,8 @@ export class FilePreviewScreenComponent implements OnInit { behavior: 'smooth', scrollMode: 'if-needed', block: 'center', - inline: 'center', - }) + inline: 'center' + }); } } @@ -288,11 +291,11 @@ export class FilePreviewScreenComponent implements OnInit { id: annotation.Id, removeFromDictionary: false }] - }, this.appStateService.activeProjectId, this.appStateService.activeFile.fileId).subscribe(ok=>{ - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS); - },(err)=>{ - this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label',err), null, NotificationType.ERROR); - }); + }, this.appStateService.activeProjectId, this.appStateService.activeFile.fileId).subscribe(ok => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS); + }, (err) => { + this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label', err), null, NotificationType.ERROR); + }); } }); }