@hmcts/media-viewer/esm2022/lib/toolbar/icp-toolbar/icp-toolbar.component.mjs

Media Viewer

import { Component } from '@angular/core';
import { select } from '@ngrx/store';
import * as fromIcpSelectors from '../../store/selectors/icp.selectors';
import * as i0 from "@angular/core";
import * as i1 from "../toolbar-event.service";
import * as i2 from "@ngrx/store";
import * as i3 from "../icp-event.service";
import * as i4 from "@angular/common";
export class IcpToolbarComponent {
    constructor(toolbarEventService, store, icpEventService) {
        this.toolbarEventService = toolbarEventService;
        this.store = store;
        this.icpEventService = icpEventService;
    }
    ngOnInit() {
        this.$subscription = this.store.pipe(select(fromIcpSelectors.isPresenter))
            .subscribe(isPresenter => this.isPresenter = isPresenter);
        this.$subscription.add(this.store.pipe(select(fromIcpSelectors.getPresenterName))
            .subscribe(name => this.presenterName = name));
    }
    ngOnDestroy() {
        this.$subscription.unsubscribe();
    }
    present() {
        this.icpEventService.becomePresenter();
    }
    stopPresenting() {
        this.icpEventService.stopPresenting();
    }
    leaveIcpSession() {
        this.icpEventService.leaveSession();
    }
    showParticipantsList() {
        this.toolbarEventService.toggleParticipantsList(!this.icpEventService.participantsListVisible.getValue());
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IcpToolbarComponent, deps: [{ token: i1.ToolbarEventService }, { token: i2.Store }, { token: i3.IcpEventService }], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: IcpToolbarComponent, selector: "mv-icp-toolbar", ngImport: i0, template: "<div id=\"icp-toolbar\" class=\"icpMode\">\n  <div id=\"toolbar-title\">\n    <label class=\"govuk-label\" data-l10n-id=\"digitalEvidence_label\">Digital evidence presentation</label>\n  </div>\n\n  <div id=\"presentation-mode\">\n    <div class=\"item-label\">\n      <label class=\"govuk-label\" data-l10n-id=\"icpInfo_label\">You are in presentation mode</label>\n    </div>\n    <div class=\"item-button\">\n      <button class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" tabindex=\"0\"\n        title=\"Leave presentation\" (click)=\"leaveIcpSession()\">\n        <span data-l10n-id=\"icp-leave-presentation_label\">Leave presentation</span>\n      </button>\n    </div>\n  </div>\n\n  <div id=\"presenter-info\">\n    <div class=\"item-label\">\n      <label class=\"govuk-label\" *ngIf=\"!presenterName\" data-l10n-id=\"noPresenter_label\">Waiting for presenter</label>\n      <label class=\"govuk-label\" *ngIf=\"presenterName && isPresenter\" data-l10n-id=\"isPresenter_label\">You are\n        presenting</label>\n      <label class=\"govuk-label\" *ngIf=\"presenterName && !isPresenter\"\n        data-l10n-id=\"otherPresenter_label\">{{ presenterName | titlecase }}\n        is presenting</label>\n    </div>\n    <div class=\"item-button\">\n      <button *ngIf=\"!presenterName\" class=\"govuk-button\" id=\"icp-present\" tabindex=\"0\" title=\"Present\"\n        (click)=\"present()\">\n        <span data-l10n-id=\"icp-present_label\">Start presenting</span>\n      </button>\n      <button *ngIf=\"isPresenter\" class=\"govuk-button  govuk-button--warning\" id=\"icp-stop-presenting\" tabindex=\"0\"\n        title=\"Stop presenting\" (click)=\"stopPresenting()\">\n        <span data-l10n-id=\"icp-stop-presenting_label\">Stop Presenting</span>\n      </button>\n    </div>\n  </div>\n\n  <div id=\"participant-list\">\n    <button class=\"govuk-button govuk-button--secondary\" id=\"icp-participants-list\" tabindex=\"0\"\n      title=\"Participants list\" (click)=\"showParticipantsList()\">\n      <span\n        data-l10n-id=\"icp-stop-presenting_label\">{{(icpEventService.participantsListVisible | async) ? 'Hide': 'Show'}}\n        participants</span>\n    </button>\n  </div>\n</div>", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TitleCasePipe, name: "titlecase" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IcpToolbarComponent, decorators: [{
            type: Component,
            args: [{ selector: 'mv-icp-toolbar', template: "<div id=\"icp-toolbar\" class=\"icpMode\">\n  <div id=\"toolbar-title\">\n    <label class=\"govuk-label\" data-l10n-id=\"digitalEvidence_label\">Digital evidence presentation</label>\n  </div>\n\n  <div id=\"presentation-mode\">\n    <div class=\"item-label\">\n      <label class=\"govuk-label\" data-l10n-id=\"icpInfo_label\">You are in presentation mode</label>\n    </div>\n    <div class=\"item-button\">\n      <button class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" tabindex=\"0\"\n        title=\"Leave presentation\" (click)=\"leaveIcpSession()\">\n        <span data-l10n-id=\"icp-leave-presentation_label\">Leave presentation</span>\n      </button>\n    </div>\n  </div>\n\n  <div id=\"presenter-info\">\n    <div class=\"item-label\">\n      <label class=\"govuk-label\" *ngIf=\"!presenterName\" data-l10n-id=\"noPresenter_label\">Waiting for presenter</label>\n      <label class=\"govuk-label\" *ngIf=\"presenterName && isPresenter\" data-l10n-id=\"isPresenter_label\">You are\n        presenting</label>\n      <label class=\"govuk-label\" *ngIf=\"presenterName && !isPresenter\"\n        data-l10n-id=\"otherPresenter_label\">{{ presenterName | titlecase }}\n        is presenting</label>\n    </div>\n    <div class=\"item-button\">\n      <button *ngIf=\"!presenterName\" class=\"govuk-button\" id=\"icp-present\" tabindex=\"0\" title=\"Present\"\n        (click)=\"present()\">\n        <span data-l10n-id=\"icp-present_label\">Start presenting</span>\n      </button>\n      <button *ngIf=\"isPresenter\" class=\"govuk-button  govuk-button--warning\" id=\"icp-stop-presenting\" tabindex=\"0\"\n        title=\"Stop presenting\" (click)=\"stopPresenting()\">\n        <span data-l10n-id=\"icp-stop-presenting_label\">Stop Presenting</span>\n      </button>\n    </div>\n  </div>\n\n  <div id=\"participant-list\">\n    <button class=\"govuk-button govuk-button--secondary\" id=\"icp-participants-list\" tabindex=\"0\"\n      title=\"Participants list\" (click)=\"showParticipantsList()\">\n      <span\n        data-l10n-id=\"icp-stop-presenting_label\">{{(icpEventService.participantsListVisible | async) ? 'Hide': 'Show'}}\n        participants</span>\n    </button>\n  </div>\n</div>" }]
        }], ctorParameters: () => [{ type: i1.ToolbarEventService }, { type: i2.Store }, { type: i3.IcpEventService }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNwLXRvb2xiYXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWVkaWEtdmlld2VyL3NyYy9saWIvdG9vbGJhci9pY3AtdG9vbGJhci9pY3AtdG9vbGJhci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tZWRpYS12aWV3ZXIvc3JjL2xpYi90b29sYmFyL2ljcC10b29sYmFyL2ljcC10b29sYmFyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQXFCLE1BQU0sZUFBZSxDQUFDO0FBRTdELE9BQU8sRUFBRSxNQUFNLEVBQVMsTUFBTSxhQUFhLENBQUM7QUFDNUMsT0FBTyxLQUFLLGdCQUFnQixNQUFNLHFDQUFxQyxDQUFDOzs7Ozs7QUFTeEUsTUFBTSxPQUFPLG1CQUFtQjtJQU85QixZQUE0QixtQkFBd0MsRUFDaEQsS0FBc0IsRUFDZCxlQUErQjtRQUYvQix3QkFBbUIsR0FBbkIsbUJBQW1CLENBQXFCO1FBQ2hELFVBQUssR0FBTCxLQUFLLENBQWlCO1FBQ2Qsb0JBQWUsR0FBZixlQUFlLENBQWdCO0lBQUcsQ0FBQztJQUUvRCxRQUFRO1FBQ04sSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsV0FBVyxDQUFDLENBQUM7YUFDdkUsU0FBUyxDQUFDLFdBQVcsQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLFdBQVcsR0FBRyxXQUFXLENBQUMsQ0FBQztRQUM1RCxJQUFJLENBQUMsYUFBYSxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsZ0JBQWdCLENBQUMsQ0FBQzthQUM5RSxTQUFTLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsYUFBYSxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUM7SUFDbkQsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsYUFBYSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ25DLENBQUM7SUFFRCxPQUFPO1FBQ0wsSUFBSSxDQUFDLGVBQWUsQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QyxDQUFDO0lBRUQsY0FBYztRQUNaLElBQUksQ0FBQyxlQUFlLENBQUMsY0FBYyxFQUFFLENBQUM7SUFDeEMsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLENBQUMsZUFBZSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3RDLENBQUM7SUFFRCxvQkFBb0I7UUFDbEIsSUFBSSxDQUFDLG1CQUFtQixDQUFDLHNCQUFzQixDQUFDLENBQUMsSUFBSSxDQUFDLGVBQWUsQ0FBQyx1QkFBdUIsQ0FBQyxRQUFRLEVBQUUsQ0FBQyxDQUFDO0lBQzVHLENBQUM7a0lBcENVLG1CQUFtQjtzSEFBbkIsbUJBQW1CLHNEQ1poQyw2ckVBOENNOzs0RkRsQ08sbUJBQW1CO2tCQUovQixTQUFTOytCQUNFLGdCQUFnQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25EZXN0cm95LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRvb2xiYXJFdmVudFNlcnZpY2UgfSBmcm9tICcuLi90b29sYmFyLWV2ZW50LnNlcnZpY2UnO1xuaW1wb3J0IHsgc2VsZWN0LCBTdG9yZSB9IGZyb20gJ0BuZ3J4L3N0b3JlJztcbmltcG9ydCAqIGFzIGZyb21JY3BTZWxlY3RvcnMgZnJvbSAnLi4vLi4vc3RvcmUvc2VsZWN0b3JzL2ljcC5zZWxlY3RvcnMnO1xuaW1wb3J0IHsgU3Vic2NyaXB0aW9uIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBJY3BTdGF0ZSB9IGZyb20gJy4uLy4uL2ljcC9pY3AuaW50ZXJmYWNlcyc7XG5pbXBvcnQgeyBJY3BFdmVudFNlcnZpY2UgfSBmcm9tICcuLi9pY3AtZXZlbnQuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ212LWljcC10b29sYmFyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2ljcC10b29sYmFyLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBJY3BUb29sYmFyQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuXG4gIHByZXNlbnRlck5hbWU6IHN0cmluZztcbiAgaXNQcmVzZW50ZXI6IGJvb2xlYW47XG5cbiAgcHJpdmF0ZSAkc3Vic2NyaXB0aW9uOiBTdWJzY3JpcHRpb247XG5cbiAgY29uc3RydWN0b3IocHVibGljIHJlYWRvbmx5IHRvb2xiYXJFdmVudFNlcnZpY2U6IFRvb2xiYXJFdmVudFNlcnZpY2UsXG4gICAgICAgICAgICAgIHByaXZhdGUgc3RvcmU6IFN0b3JlPEljcFN0YXRlPiwgXG4gICAgICAgICAgICAgIHB1YmxpYyByZWFkb25seSBpY3BFdmVudFNlcnZpY2U6SWNwRXZlbnRTZXJ2aWNlKSB7fVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMuJHN1YnNjcmlwdGlvbiA9IHRoaXMuc3RvcmUucGlwZShzZWxlY3QoZnJvbUljcFNlbGVjdG9ycy5pc1ByZXNlbnRlcikpXG4gICAgICAuc3Vic2NyaWJlKGlzUHJlc2VudGVyID0+IHRoaXMuaXNQcmVzZW50ZXIgPSBpc1ByZXNlbnRlcik7XG4gICAgdGhpcy4kc3Vic2NyaXB0aW9uLmFkZCh0aGlzLnN0b3JlLnBpcGUoc2VsZWN0KGZyb21JY3BTZWxlY3RvcnMuZ2V0UHJlc2VudGVyTmFtZSkpXG4gICAgICAuc3Vic2NyaWJlKG5hbWUgPT4gdGhpcy5wcmVzZW50ZXJOYW1lID0gbmFtZSkpO1xuICB9XG5cbiAgbmdPbkRlc3Ryb3koKSB7XG4gICAgdGhpcy4kc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gIH1cblxuICBwcmVzZW50KCkge1xuICAgIHRoaXMuaWNwRXZlbnRTZXJ2aWNlLmJlY29tZVByZXNlbnRlcigpO1xuICB9XG5cbiAgc3RvcFByZXNlbnRpbmcoKSB7XG4gICAgdGhpcy5pY3BFdmVudFNlcnZpY2Uuc3RvcFByZXNlbnRpbmcoKTtcbiAgfVxuXG4gIGxlYXZlSWNwU2Vzc2lvbigpIHtcbiAgICB0aGlzLmljcEV2ZW50U2VydmljZS5sZWF2ZVNlc3Npb24oKTtcbiAgfVxuXG4gIHNob3dQYXJ0aWNpcGFudHNMaXN0KCkge1xuICAgIHRoaXMudG9vbGJhckV2ZW50U2VydmljZS50b2dnbGVQYXJ0aWNpcGFudHNMaXN0KCF0aGlzLmljcEV2ZW50U2VydmljZS5wYXJ0aWNpcGFudHNMaXN0VmlzaWJsZS5nZXRWYWx1ZSgpKTtcbiAgfVxufVxuIiwiPGRpdiBpZD1cImljcC10b29sYmFyXCIgY2xhc3M9XCJpY3BNb2RlXCI+XG4gIDxkaXYgaWQ9XCJ0b29sYmFyLXRpdGxlXCI+XG4gICAgPGxhYmVsIGNsYXNzPVwiZ292dWstbGFiZWxcIiBkYXRhLWwxMG4taWQ9XCJkaWdpdGFsRXZpZGVuY2VfbGFiZWxcIj5EaWdpdGFsIGV2aWRlbmNlIHByZXNlbnRhdGlvbjwvbGFiZWw+XG4gIDwvZGl2PlxuXG4gIDxkaXYgaWQ9XCJwcmVzZW50YXRpb24tbW9kZVwiPlxuICAgIDxkaXYgY2xhc3M9XCJpdGVtLWxhYmVsXCI+XG4gICAgICA8bGFiZWwgY2xhc3M9XCJnb3Z1ay1sYWJlbFwiIGRhdGEtbDEwbi1pZD1cImljcEluZm9fbGFiZWxcIj5Zb3UgYXJlIGluIHByZXNlbnRhdGlvbiBtb2RlPC9sYWJlbD5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwiaXRlbS1idXR0b25cIj5cbiAgICAgIDxidXR0b24gY2xhc3M9XCJnb3Z1ay1idXR0b24gZ292dWstYnV0dG9uLS1zZWNvbmRhcnlcIiBkYXRhLW1vZHVsZT1cImdvdnVrLWJ1dHRvblwiIHRhYmluZGV4PVwiMFwiXG4gICAgICAgIHRpdGxlPVwiTGVhdmUgcHJlc2VudGF0aW9uXCIgKGNsaWNrKT1cImxlYXZlSWNwU2Vzc2lvbigpXCI+XG4gICAgICAgIDxzcGFuIGRhdGEtbDEwbi1pZD1cImljcC1sZWF2ZS1wcmVzZW50YXRpb25fbGFiZWxcIj5MZWF2ZSBwcmVzZW50YXRpb248L3NwYW4+XG4gICAgICA8L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG5cbiAgPGRpdiBpZD1cInByZXNlbnRlci1pbmZvXCI+XG4gICAgPGRpdiBjbGFzcz1cIml0ZW0tbGFiZWxcIj5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImdvdnVrLWxhYmVsXCIgKm5nSWY9XCIhcHJlc2VudGVyTmFtZVwiIGRhdGEtbDEwbi1pZD1cIm5vUHJlc2VudGVyX2xhYmVsXCI+V2FpdGluZyBmb3IgcHJlc2VudGVyPC9sYWJlbD5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImdvdnVrLWxhYmVsXCIgKm5nSWY9XCJwcmVzZW50ZXJOYW1lICYmIGlzUHJlc2VudGVyXCIgZGF0YS1sMTBuLWlkPVwiaXNQcmVzZW50ZXJfbGFiZWxcIj5Zb3UgYXJlXG4gICAgICAgIHByZXNlbnRpbmc8L2xhYmVsPlxuICAgICAgPGxhYmVsIGNsYXNzPVwiZ292dWstbGFiZWxcIiAqbmdJZj1cInByZXNlbnRlck5hbWUgJiYgIWlzUHJlc2VudGVyXCJcbiAgICAgICAgZGF0YS1sMTBuLWlkPVwib3RoZXJQcmVzZW50ZXJfbGFiZWxcIj57eyBwcmVzZW50ZXJOYW1lIHwgdGl0bGVjYXNlIH19XG4gICAgICAgIGlzIHByZXNlbnRpbmc8L2xhYmVsPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJpdGVtLWJ1dHRvblwiPlxuICAgICAgPGJ1dHRvbiAqbmdJZj1cIiFwcmVzZW50ZXJOYW1lXCIgY2xhc3M9XCJnb3Z1ay1idXR0b25cIiBpZD1cImljcC1wcmVzZW50XCIgdGFiaW5kZXg9XCIwXCIgdGl0bGU9XCJQcmVzZW50XCJcbiAgICAgICAgKGNsaWNrKT1cInByZXNlbnQoKVwiPlxuICAgICAgICA8c3BhbiBkYXRhLWwxMG4taWQ9XCJpY3AtcHJlc2VudF9sYWJlbFwiPlN0YXJ0IHByZXNlbnRpbmc8L3NwYW4+XG4gICAgICA8L2J1dHRvbj5cbiAgICAgIDxidXR0b24gKm5nSWY9XCJpc1ByZXNlbnRlclwiIGNsYXNzPVwiZ292dWstYnV0dG9uICBnb3Z1ay1idXR0b24tLXdhcm5pbmdcIiBpZD1cImljcC1zdG9wLXByZXNlbnRpbmdcIiB0YWJpbmRleD1cIjBcIlxuICAgICAgICB0aXRsZT1cIlN0b3AgcHJlc2VudGluZ1wiIChjbGljayk9XCJzdG9wUHJlc2VudGluZygpXCI+XG4gICAgICAgIDxzcGFuIGRhdGEtbDEwbi1pZD1cImljcC1zdG9wLXByZXNlbnRpbmdfbGFiZWxcIj5TdG9wIFByZXNlbnRpbmc8L3NwYW4+XG4gICAgICA8L2J1dHRvbj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG5cbiAgPGRpdiBpZD1cInBhcnRpY2lwYW50LWxpc3RcIj5cbiAgICA8YnV0dG9uIGNsYXNzPVwiZ292dWstYnV0dG9uIGdvdnVrLWJ1dHRvbi0tc2Vjb25kYXJ5XCIgaWQ9XCJpY3AtcGFydGljaXBhbnRzLWxpc3RcIiB0YWJpbmRleD1cIjBcIlxuICAgICAgdGl0bGU9XCJQYXJ0aWNpcGFudHMgbGlzdFwiIChjbGljayk9XCJzaG93UGFydGljaXBhbnRzTGlzdCgpXCI+XG4gICAgICA8c3BhblxuICAgICAgICBkYXRhLWwxMG4taWQ9XCJpY3Atc3RvcC1wcmVzZW50aW5nX2xhYmVsXCI+e3soaWNwRXZlbnRTZXJ2aWNlLnBhcnRpY2lwYW50c0xpc3RWaXNpYmxlIHwgYXN5bmMpID8gJ0hpZGUnOiAnU2hvdyd9fVxuICAgICAgICBwYXJ0aWNpcGFudHM8L3NwYW4+XG4gICAgPC9idXR0b24+XG4gIDwvZGl2PlxuPC9kaXY+Il19