@hmcts/media-viewer 4.2.4-exui-3994-f → 4.2.4-exui-3994-g

package/projects/media-viewer/src/lib/toolbar/search-bar/search-bar.component.ts

@@ -1,119 +0,0 @@
-import { Component, ElementRef, HostListener, OnInit, ViewChild, OnDestroy, AfterViewInit } from '@angular/core';
-import { ToolbarButtonVisibilityService } from '../toolbar-button-visibility.service';
-import { SearchResultsCount, ToolbarEventService } from '../toolbar-event.service';
-import { Subscription } from 'rxjs';
-
-@Component({
-    selector: 'mv-search-bar',
-    templateUrl: './search-bar.component.html',
-    standalone: false
-})
-export class SearchBarComponent implements OnInit, OnDestroy, AfterViewInit {
-
-  @ViewChild('findInput', { static: true }) findInput: ElementRef<HTMLInputElement>;
-  @ViewChild('findNext', { static: false }) findNext: ElementRef<HTMLAnchorElement>;
-
-  highlightAll = true;
-  matchCase = false;
-  wholeWord = false;
-  resultsText = '';
-  searchText = '';
-  resultCount = 0;
-
-  private subscriptions: Subscription[] = [];
-
-  public advancedSearchVisible = false;
-
-  constructor(
-    public readonly toolbarButtons: ToolbarButtonVisibilityService,
-    public readonly toolbarEvents: ToolbarEventService
-  ) { }
-
-  public ngOnInit(): void {
-    this.subscriptions.push(
-      this.toolbarEvents.searchResultsCountSubject.subscribe(results => this.setSearchResultsCount(results))
-    );
-  }
-
-  ngAfterViewInit(): void {
-    this.findInput.nativeElement.focus();
-  }
-
-  ngOnDestroy(): void {
-    for (const subscription of this.subscriptions) {
-      subscription.unsubscribe();
-    }
-  }
-
-  @HostListener('window:keydown', ['$event'])
-  public onWindowKeyDown(e: KeyboardEvent): void {
-    if (e.code === 'F3' || (e.ctrlKey && e.code === 'KeyF')) {
-      e.preventDefault();
-
-      this.toolbarEvents.searchBarHidden.next(false);
-      setTimeout(() => this.findInput.nativeElement.focus(), 200);
-    }
-  }
-
-  public searchNext(): void {
-    this.toolbarEvents.search({
-      searchTerm: this.searchText,
-      highlightAll: this.highlightAll,
-      matchCase: this.matchCase,
-      wholeWord: this.wholeWord,
-      previous: false,
-      reset: false
-    });
-  }
-
-  public searchPrev(): void {
-    this.toolbarEvents.search({
-      searchTerm: this.searchText,
-      highlightAll: this.highlightAll,
-      matchCase: this.matchCase,
-      wholeWord: this.wholeWord,
-      previous: true,
-      reset: false
-    });
-  }
-
-  public search(): void {
-    this.toolbarEvents.search({
-      searchTerm: this.searchText,
-      highlightAll: this.highlightAll,
-      matchCase: this.matchCase,
-      wholeWord: this.wholeWord,
-      previous: false,
-      reset: true
-    });
-  }
-
-  private setSearchResultsCount(results: SearchResultsCount): void {
-    this.resultCount = results.total;
-    this.resultsText = this.resultCount > 0
-      ? `Found ${results.current} of ${results.total}`
-      : 'No results found';
-    if (this.resultCount && this.resultCount > 0 && !results.isPrevious) {
-      setTimeout(() => {
-        this.findNext.nativeElement.focus();
-      }, 1000);
-    }
-  }
-
-  public onEscapeKeyPress(e: KeyboardEvent): void {
-    this.toolbarEvents.searchBarHidden.next(true);
-  }
-
-  public onEnterKeyPress(e: KeyboardEvent): void {
-    this.search();
-  }
-
-
-  public toggleAdvancedSearch(): void {
-    this.advancedSearchVisible = !this.advancedSearchVisible;
-  }
-
-  public toggleSearchBar() {
-    this.toolbarEvents.searchBarHidden.next(!this.toolbarEvents.searchBarHidden.getValue());
-  }
-}

package/projects/media-viewer/src/lib/toolbar/toolbar-button-visibility.service.spec.ts

@@ -1,39 +0,0 @@
-import { ToolbarButtonVisibilityService } from './toolbar-button-visibility.service';
-
-describe('Toolbar Button Visibility Service', () => {
-  let service: ToolbarButtonVisibilityService;
-  beforeEach(() => {
-    service = new ToolbarButtonVisibilityService();
-  });
-
-  it('setup with values', () => {
-    const newValues = {
-      showPrint: true,
-      showDownload: true
-    };
-
-    service.setup(newValues);
-
-    expect(service.showPrint).toBeTruthy();
-    expect(service.showDownload).toBeTruthy();
-  });
-
-  it('unset other options', () => {
-    const oldValues = {
-      showPrint: true,
-      showDownload: true
-    };
-
-    service.setup(oldValues);
-
-    const newValues = {
-      showBookmark: true
-    };
-
-    service.setup(newValues);
-
-    expect(service.showPrint).toBeFalsy();
-    expect(service.showDownload).toBeFalsy();
-  });
-
-});

package/projects/media-viewer/src/lib/toolbar/toolbar-button-visibility.service.ts

@@ -1,94 +0,0 @@
-import { BehaviorSubject } from 'rxjs';
-import { Injectable } from '@angular/core';
-
-@Injectable({providedIn: 'root'})
-export class ToolbarButtonVisibilityService {
-
-  public showPrint = false;
-  public showDownload = false;
-  public showNavigation = false;
-  public showZoom = false;
-  public showRotate = false;
-  public showPresentationMode = false;
-  public showRedact = false;
-  public showOpenFile = false;
-  public showBookmark = false;
-  public showHighlightButton = false;
-  public showDrawButton = false;
-  public showSearchBar = false;
-  public showSidebar = false;
-  public showCommentSummary = false;
-  public showGrabNDragButton = false;
-  public showSaveRotationButton = false;
-
-  /**
-   * Reset the visibility of all buttons to false then set the value from the options
-   */
-  public setup(options: Partial<ToolbarButtonVisibilityService>): void {
-    this.showPrint = false;
-    this.showDownload = false;
-    this.showNavigation = false;
-    this.showZoom = false;
-    this.showRotate = false;
-    this.showPresentationMode = false;
-    this.showRedact = false;
-    this.showOpenFile = false;
-    this.showBookmark = false;
-    this.showHighlightButton = false;
-    this.showDrawButton = false;
-    this.showSearchBar = false;
-    this.showSidebar = false;
-    this.showCommentSummary = false;
-    this.showGrabNDragButton = false;
-    this.showSaveRotationButton = false;
-
-    for (const key in options) {
-      this[key] = options[key];
-    }
-  }
-}
-
-/**
- * Default toolbar state for the PDF viewer
- */
-export const defaultPdfOptions = {
-  showPrint: true,
-  showDownload: true,
-  showNavigation: true,
-  showZoom: true,
-  showRotate: true,
-  showSearchBar: true,
-  showSidebar: true,
-  showGrabNDragButton: true,
-  showCommentSummary: true,
-  showPresentationMode: true,
-  showRedact: true
-};
-
-/**
- * Default toolbar state for the image viewer
- */
-export const defaultImageOptions = {
-  showPrint: true,
-  showDownload: true,
-  showZoom: true,
-  showRotate: true,
-  showGrabNDragButton: true,
-  showCommentSummary: true,
-  showRedact: true
-};
-
-/**
- * Default toolbar state for multimedia
- */
-export const defaultMultimediaOptions = {
-  showDownload: true
-};
-
-/**
- * Default toolbar state for unsupported media
- */
-export const defaultUnsupportedOptions = {
-  showDownload: true,
-  showPrint: true
-};

package/projects/media-viewer/src/lib/toolbar/toolbar-event.service.spec.ts

@@ -1,203 +0,0 @@
-import { ToolbarEventService } from './toolbar-event.service';
-import { IcpEventService } from './icp-event.service';
-
-
-  describe('Toolbar Event Service', () => {
-    let service: ToolbarEventService;
-    let icpEventService: IcpEventService;
-
-    beforeEach(() => {
-      icpEventService = new IcpEventService();
-      service = new ToolbarEventService(icpEventService);
-      service.drawModeSubject.next(false);
-      service.highlightModeSubject.next(false);
-    });
-
-    afterEach(() => {
-      service = null;
-    });
-
-    it('should create', () => {
-      expect(service).toBeTruthy();
-    });
-
-    it('should turn off drawMode if HighlightMode is toggled on', () => {
-      service.highlightModeSubject.next(false);
-      service.drawModeSubject.next(true);
-      service.toggleHighlightMode();
-      expect(service.drawModeSubject.getValue()).toBeFalsy();
-    });
-
-    it('should turn off drawMode if drawMode is toggled off', () => {
-      service.drawModeSubject.next(true);
-      service.toggleDrawMode();
-      expect(service.drawModeSubject.getValue()).toBeFalsy();
-    });
-
-    it('should turn off HighlightMode if HighlightMode is toggled off', () => {
-      service.highlightModeSubject.next(true);
-      service.toggleHighlightMode();
-      expect(service.highlightModeSubject.getValue()).toBeFalsy();
-    });
-
-    it('should turn off highlightMode if drawMode is toggled on', () => {
-      service.highlightModeSubject.next(true);
-      service.drawModeSubject.next(false);
-      service.toggleDrawMode();
-      expect(service.highlightModeSubject.getValue()).toBeFalsy();
-      expect(service.grabNDrag.getValue()).toBeFalsy();
-    });
-
-    it('should set toggleCommentsSummary to true if comment summary is toggled off', () => {
-      service.showCommentSummary.next(false);
-      service.toggleCommentsSummary(true);
-      expect(service.showCommentSummary.getValue()).toBeTruthy();
-    });
-
-    it('should set toggleCommentsSummary to false if comment summary is toggled on', () => {
-      service.showCommentSummary.next(true);
-      service.toggleCommentsSummary(false);
-      expect(service.showCommentSummary.getValue()).toBeFalsy();
-    });
-
-    it('should reset', () => {
-      service.zoomValueSubject.next(2);
-      service.drawModeSubject.next(true);
-      service.reset();
-      expect(service.zoomValueSubject.getValue()).toBe(1);
-      expect(service.drawModeSubject.getValue()).toBeFalsy();
-      expect(service.grabNDrag.getValue()).toBeFalsy();
-    });
-
-    it('should toggle comments panel', () => {
-      const commentsToggleSpy = spyOn(service.commentsPanelVisible, 'next');
-      service.toggleCommentsPanel(false);
-      expect(commentsToggleSpy).toHaveBeenCalledWith(false);
-    });
-
-    it('should hide comments panel when participants list shows', () => {
-      const commentsToggleSpy = spyOn(service.commentsPanelVisible, 'next');
-      service.toggleParticipantsList(true);
-      expect(commentsToggleSpy).toHaveBeenCalledWith(false);
-    });
-
-    it('should hide participants list when comments panel shows', () => {
-      const commentsToggleSpy = spyOn(icpEventService.participantsListVisible, 'next');
-      service.toggleCommentsPanel(true);
-      expect(commentsToggleSpy).toHaveBeenCalledWith(false);
-    });
-
-    it('should toggle redaction mode off', () => {
-      service.redactionMode.next(false);
-      service.toggleRedactionMode();
-      expect(service.drawModeSubject.getValue()).toBeFalsy();
-      expect(service.grabNDrag.getValue()).toBeFalsy();
-      expect(service.redactionMode.getValue()).toBeTruthy();
-    });
-
-    it('should toggle redaction mode on', () => {
-      service.redactionMode.next(true);
-      service.toggleRedactionMode();
-      expect(service.redactionMode.getValue()).toBeFalsy();
-    });
-
-    it('should toggle grab and drag mode', () => {
-      service.grabNDrag.next(false);
-      service.toggleGrabNDrag();
-      expect(service.grabNDrag.getValue()).toBeTruthy();
-      service.toggleGrabNDrag();
-      expect(service.grabNDrag.getValue()).toBeFalsy();
-    });
-
-    it('should toggle sidebar', () => {
-      service.sidebarOpen.next(false);
-      service.toggleSideBar(true);
-      expect(service.sidebarOpen.getValue()).toBeTruthy();
-      service.toggleSideBar(false);
-      expect(service.sidebarOpen.getValue()).toBeFalsy();
-    });
-
-    it('should toggle sidebar view', () => {
-      service.sidebarOutlineView.next(true);
-      service.toggleSideBarView(false);
-      expect(service.sidebarOutlineView.getValue()).toBeFalsy();
-      service.toggleSideBarView(true);
-      expect(service.sidebarOutlineView.getValue()).toBeTruthy();
-    });
-
-    it('should toggle highlight toolbar', () => {
-      service.highlightToolbarSubject.next(false);
-      service.toggleHighlightToolbar();
-      expect(service.highlightToolbarSubject.getValue()).toBeTruthy();
-      service.toggleHighlightToolbar();
-      expect(service.highlightToolbarSubject.getValue()).toBeFalsy();
-    });
-
-    it('should rotate', () => {
-      const rotateSpy = spyOn(service.rotateSubject, 'next');
-      service.rotate(90);
-      expect(rotateSpy).toHaveBeenCalledWith(90);
-    });
-
-    it('should search', () => {
-      const searchSpy = spyOn(service.searchSubject, 'next');
-      const searchOperation = {
-        searchTerm: 'test',
-        highlightAll: true,
-        matchCase: false,
-        wholeWord: false,
-        previous: false,
-        reset: false,
-      };
-      service.search(searchOperation);
-      expect(searchSpy).toHaveBeenCalledWith(searchOperation);
-    });
-
-    it('should step zoom', () => {
-      const stepZoomSpy = spyOn(service.stepZoomSubject, 'next');
-      service.stepZoom(1);
-      expect(stepZoomSpy).toHaveBeenCalledWith(1);
-    });
-
-    it('should set page', () => {
-      const setPageSpy = spyOn(service.setCurrentPageSubject, 'next');
-      service.setPage(2);
-      expect(setPageSpy).toHaveBeenCalledWith(2);
-    });
-
-    it('should increment page', () => {
-      const incrementPageSpy = spyOn(service.changePageByDeltaSubject, 'next');
-      service.incrementPage(1);
-      expect(incrementPageSpy).toHaveBeenCalledWith(1);
-    });
-
-    it('should save rotation', () => {
-      const saveRotationSpy = spyOn(service.saveRotationSubject, 'next');
-      service.saveRotation();
-      expect(saveRotationSpy).toHaveBeenCalled();
-    });
-
-    it('should apply redaction to document', () => {
-      const applyRedactionSpy = spyOn(service.applyRedactToDocument, 'next');
-      service.applyRedactionToDocument();
-      expect(applyRedactionSpy).toHaveBeenCalled();
-    });
-
-    it('should redact page', () => {
-      const redactPageSpy = spyOn(service.redactWholePage, 'next');
-      service.redactPage();
-      expect(redactPageSpy).toHaveBeenCalled();
-    });
-
-    it('should unmark all redactions', () => {
-      const unmarkAllSpy = spyOn(service.clearAllRedactMarkers, 'next');
-      service.unmarkAll();
-      expect(unmarkAllSpy).toHaveBeenCalled();
-    });
-
-    it('should toggle redaction preview', () => {
-      const redactionPreviewSpy = spyOn(service.redactionPreview, 'next');
-      service.toggleRedactionPreview(true);
-      expect(redactionPreviewSpy).toHaveBeenCalledWith(true);
-    });
-  });

package/projects/media-viewer/src/lib/toolbar/toolbar-event.service.ts

@@ -1,227 +0,0 @@
-import { Injectable } from '@angular/core';
-import { BehaviorSubject, Observable, Subject } from 'rxjs';
-// import * as icpEvents from './icp-event.service';
-// import { participantsListVisible } from './icp-event.service';
-import { RedactionSearch } from './redaction-search-bar/redaction-search.model';
-import { IcpEventService } from './icp-event.service';
-
-// Toolbar Custom-Event Types
-export type HighlightMode = boolean;
-export type DrawMode = boolean;
-export interface SearchOperation {
-  searchTerm: string;
-  highlightAll: boolean;
-  matchCase: boolean;
-  wholeWord: boolean;
-  previous: boolean;
-  reset: boolean;
-}
-export interface SearchResultsCount {
-  current: number;
-  total: number;
-  isPrevious: boolean;
-}
-
-export enum SearchType {
-  Redact = 'Redact',
-  Highlight = 'Highlight',
-}
-
-export interface SearchMode {
-  modeType: SearchType;
-  isOpen: boolean;
-}
-
-@Injectable({ providedIn: 'root' })
-export class ToolbarEventService {
-
-  constructor(private icpEventService: IcpEventService) {}
-
-  public readonly highlightModeSubject = new BehaviorSubject<HighlightMode>(false);
-  public readonly highlightToolbarSubject = new BehaviorSubject<HighlightMode>(false);
-  public readonly drawModeSubject = new BehaviorSubject<DrawMode>(false);
-  public readonly rotateSubject = new Subject<number>();
-  public readonly searchSubject = new Subject<SearchOperation>();
-  public readonly searchResultsCountSubject = new Subject<SearchResultsCount>();
-  public readonly zoomSubject = new Subject<number>();
-  public readonly stepZoomSubject = new Subject<number>();
-  public readonly zoomValueSubject = new BehaviorSubject<number>(1);
-  public readonly pageCountSubject = new Subject<number>();
-  public readonly printSubject = new Subject<void>();
-  public readonly downloadSubject = new Subject<void>();
-  public readonly setCurrentPageSubject = new Subject<number>();
-  public readonly setCurrentPageInputValueSubject = new Subject<number>();
-  public readonly changePageByDeltaSubject = new Subject<number>();
-  public readonly showCommentSummary = new BehaviorSubject<boolean>(false);
-  public readonly grabNDrag = new BehaviorSubject<boolean>(false);
-  public readonly saveRotationSubject = new Subject<void>();
-
-  public readonly redactionMode = new BehaviorSubject(false);
-  public readonly redactionPreview = new Subject<boolean>();
-  public readonly applyRedactToDocument = new Subject<void>();
-
-  public readonly clearAllRedactMarkers = new Subject<void>();
-  public readonly redactWholePage = new Subject<void>();
-  public readonly redactionSerachSubject = new Subject<RedactionSearch>();
-  public readonly redactAllInProgressSubject = new BehaviorSubject(false);
-  public readonly openRedactionSearch = new BehaviorSubject<SearchMode | null>(null);
-
-  public readonly sidebarOpen = new BehaviorSubject(false);
-  public readonly sidebarOutlineView = new BehaviorSubject(true);
-
-  public readonly searchBarHidden = new BehaviorSubject(true);
-  public readonly commentsPanelVisible = new BehaviorSubject(false);
-
-  /**
-   * Reset the stateful behaviour subjects
-   */
-  public reset(): void {
-    this.setCurrentPageSubject.next(1);
-    this.zoomValueSubject.next(1);
-    this.highlightModeSubject.next(false);
-    this.highlightToolbarSubject.next(false);
-    this.drawModeSubject.next(false);
-    this.showCommentSummary.next(false);
-    this.grabNDrag.next(false);
-  }
-
-  // Function to inform Observers that highlightMode has been enabled
-  public toggleHighlightMode(): void {
-    // Highlight and Draw states are mutually exclusive
-    if (this.highlightModeSubject.getValue() === false) {
-      this.drawModeSubject.next(false);
-      this.grabNDrag.next(false);
-      this.highlightModeSubject.next(true);
-    } else {
-      this.highlightModeSubject.next(false);
-    }
-  }
-
-  // Function to inform Observers that ToggleMode has been enabled
-  public toggleDrawMode(): void {
-    if (this.drawModeSubject.getValue() === false) {
-      this.highlightModeSubject.next(false);
-      this.grabNDrag.next(false);
-      this.drawModeSubject.next(true);
-    } else {
-      this.drawModeSubject.next(false);
-    }
-  }
-
-  public toggleHighlightToolbar(): void {
-    this.highlightToolbarSubject.next(!this.highlightToolbarSubject.getValue());
-  }
-
-  public rotate(angle: number): void {
-    this.rotateSubject.next(angle);
-  }
-
-  public search(phrase: SearchOperation): void {
-    this.searchSubject.next(phrase);
-  }
-
-  public getSearchResultsCount(): Observable<SearchResultsCount> {
-    return this.searchResultsCountSubject.asObservable();
-  }
-
-  public zoom(value: number): void {
-    this.zoomSubject.next(value);
-  }
-
-  public stepZoom(value: number): void {
-    this.stepZoomSubject.next(value);
-  }
-
-  public getZoomValue(): Observable<number> {
-    return this.zoomValueSubject.asObservable();
-  }
-
-  public getPageCount(): Observable<number> {
-    return this.pageCountSubject.asObservable();
-  }
-
-  public print(): void {
-    this.printSubject.next();
-  }
-
-  public download(): void {
-    this.downloadSubject.next();
-  }
-
-  public setPage(value: number): void {
-    this.setCurrentPageSubject.next(value);
-  }
-
-  public incrementPage(value: number): void {
-    this.changePageByDeltaSubject.next(value);
-  }
-
-  public getCurrentPageNumber(): Observable<number> {
-    return this.setCurrentPageInputValueSubject.asObservable();
-  }
-
-  public getShowCommentSummary(): Observable<boolean> {
-    return this.showCommentSummary.asObservable();
-  }
-
-  public toggleCommentsSummary(value: boolean): void {
-    this.showCommentSummary.next(value);
-  }
-
-  public saveRotation(): void {
-    this.saveRotationSubject.next();
-  }
-
-  public toggleGrabNDrag(): void {
-    this.grabNDrag.next(!this.grabNDrag.getValue());
-  }
-
-  toggleSideBar(toggle: boolean) {
-    this.sidebarOpen.next(toggle);
-  }
-
-  toggleSideBarView(toggle: boolean) {
-    this.sidebarOutlineView.next(toggle);
-  }
-
-  public toggleRedactionMode(): void {
-    if (this.redactionMode.getValue() === false) {
-      this.drawModeSubject.next(false);
-      this.grabNDrag.next(false);
-      this.redactionMode.next(true);
-    } else {
-      this.redactionMode.next(false);
-    }
-    this.openRedactionSearch.next({ modeType: SearchType.Redact, isOpen: false });
-  }
-
-  public toggleRedactionPreview(viewMode: boolean): void {
-    this.redactionPreview.next(viewMode);
-  }
-
-  public unmarkAll(): void {
-    this.clearAllRedactMarkers.next();
-  }
-
-  public applyRedactionToDocument(): void {
-    this.applyRedactToDocument.next();
-  }
-
-  public redactPage(): void {
-    this.redactWholePage.next();
-  }
-
-  public toggleCommentsPanel(isVisible: boolean) {
-    if (isVisible) {
-      this.toggleParticipantsList(!isVisible);
-    }
-    this.commentsPanelVisible.next(isVisible);
-  }
-
-  public toggleParticipantsList(isVisible: boolean) {
-    if (isVisible) {
-      this.toggleCommentsPanel(!isVisible);
-    }
-    this.icpEventService.participantsListVisible.next(isVisible);
-  }
-}