UNPKG

@tekdi/sunbird-quml-player

Version:

The QuML player library components are powered by Angular. This player is primarily designed to be used on Sunbird consumption platforms (mobile app, web portal, offline desktop app) to drive reusability and maintainability, hence reducing the redundant d

88 lines 23.4 kB
import { Component, Output, EventEmitter, Input, HostListener } from '@angular/core'; import { fromEvent } from 'rxjs'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; export class AlertComponent { constructor() { this.closeAlert = new EventEmitter(); this.showSolution = new EventEmitter(); this.showHint = new EventEmitter(); this.isFocusSet = false; } onKeydownHandler(event) { this.close('close'); } ngOnInit() { this.isFocusSet = false; this.previousActiveElement = document.activeElement; this.subscription = fromEvent(document, 'keydown').subscribe((e) => { if (e['key'] === 'Tab') { const nextBtn = document.querySelector('.quml-navigation__previous'); /* istanbul ignore else */ if (nextBtn) { this.close('close'); nextBtn.focus({ preventScroll: true }); this.isFocusSet = true; e.stopPropagation(); } } }); } ngAfterViewInit() { setTimeout(() => { const wrongButton = document.querySelector('#wrongButton'); const correctButton = document.querySelector('#correctButton'); if (this.alertType === 'wrong' && wrongButton) { wrongButton.focus({ preventScroll: true }); } else if (this.alertType === 'correct' && this.showSolutionButton && correctButton) { correctButton.focus({ preventScroll: true }); } }, 200); } viewHint() { this.showHint.emit({ hint: true, }); } viewSolution() { this.showSolution.emit({ solution: true, }); } close(type) { this.closeAlert.emit({ type }); } ngOnDestroy() { /* istanbul ignore else */ if (this.previousActiveElement && !this.isFocusSet) { this.previousActiveElement.focus({ preventScroll: true }); } /* istanbul ignore else */ if (this.subscription) { this.subscription.unsubscribe(); } } /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); } /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AlertComponent, selector: "quml-alert", inputs: { alertType: "alertType", isHintAvailable: "isHintAvailable", showSolutionButton: "showSolutionButton" }, outputs: { closeAlert: "closeAlert", showSolution: "showSolution", showHint: "showHint" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"quml-alert\">\n <div class=\"quml-alert__overlay\" (click)=\"close('close')\" (keyup.enter)=\"close('close')\"></div>\n <div class=\"quml-alert__container\">\n <div class=\"quml-alert__body\">\n <div class=\"quml-alert__image quml-alert__image--correct\" *ngIf=\"alertType === 'correct'\">\n <div class=\"quml-alert__icon-container\">\n <img class=\"quml-alert__icon\" src=\"assets/quml-correct.svg\" alt=\"Correct Answer\">\n\n </div>\n <div class=\"quml-alert__icon-empty\"></div>\n <img class=\"quml-alert__banner\" src=\"assets/banner-correct.svg\" alt=\"\" >\n </div>\n <div class=\"quml-alert__image quml-alert__image--wrong\" *ngIf=\"alertType === 'wrong'\">\n <div class=\"quml-alert__icon-container\">\n <img class=\"quml-alert__icon\" src=\"assets/quml-wrong.svg\" alt=\"Wrong Answer\">\n </div>\n <div class=\"quml-alert__icon-empty\"></div>\n <img class=\"quml-alert__banner\" src=\"assets/banner-wrong.svg\" alt=\"\">\n </div>\n \n \n\n <div class=\"quml-alert__solution-container\">\n <div class=\"quml-alert__try-again\" *ngIf=\"alertType === 'wrong'\">\n <span tabindex=\"0\" id=\"wrongButton\" *ngIf=\"alertType === 'wrong'\" (click)=\"close('tryAgain')\" (keyup.enter)=\"close('tryAgain')\" aria-label=\"Try again\">Try again</span>\n <!-- TODO: should add some label for correct response when solution is off <span *ngIf=\"alertType === 'correct' && !showSolutionButton\">Correct</span> --> \n </div>\n <div class=\"quml-alert__view-solution\" *ngIf=\"showSolutionButton\">\n <span tabindex=\"0\" id=\"correctButton\" (click)=\"viewSolution()\" (keyup.enter)=\"viewSolution()\" aria-label=\"View Solution\">View Solution</span>\n </div>\n </div>\n\n <div *ngIf=\"isHintAvailable\" class=\"quml-alert__view-hint quml-alert__view-hint--disabled\">\n <img tabindex=\"0\" id=\"hintButton\" class=\"view-hint-icon\" (click)=\"viewHint()\" (keyup.enter)=\"viewHint()\" src=\"assets/view-hint.svg\" alt=\"View Hint logo\">\n </div>\n </div>\n </div>\n</div>\n", styles: ["::ng-deep :root{--quml-color-primary: #FFD555;--quml-color-primary-rgba: #f6bc42;--quml-color-primary-shade: rgba(0, 0, 0, .1);--quml-color-tertiary: #FA6400;--quml-color-tertiary-rgba: rgba(250, 100, 0, .6);--quml-color-rgba: rgba(0, 0, 0, .6)}.quml-alert__overlay{position:absolute;width:100%;height:100%;top:0;left:0}.quml-alert__container{position:absolute;bottom:.75rem;height:5.625rem;left:0;right:0;border-radius:.5rem;box-shadow:0 .125rem .875rem 0 var(-quml-color-primary-shade);padding:.5rem 1.5rem .5rem .5rem;animation-name:example;animation-timing-function:ease-in-out;animation-duration:.4s;margin:0 auto .5rem;width:23.25rem;background:linear-gradient(145deg,var(--quml-color-primary),var(--quml-color-primary) 60%,var(--quml-color-primary-rgba) 60%);z-index:1}@media only screen and (max-width: 480px){.quml-alert__container{position:absolute;bottom:3.75rem;border-radius:.5rem;background-color:var(--white);box-shadow:0 .125rem .875rem 0 var(-quml-color-primary-shade);width:21.75rem;padding:.5rem}}.quml-alert__body{display:flex;align-items:center;position:relative;height:100%}.quml-alert__image{position:relative;height:100%;width:7.625rem;overflow:hidden}.quml-alert__icon-container{background:var(--white);border-radius:.5rem;position:absolute;width:4.5rem;z-index:1;height:4rem;left:0;right:0;margin:0 auto;bottom:-54px;animation:sign-board-animation .2s ease-out forwards;animation-delay:.3s}.quml-alert__icon-empty{position:absolute;background:var(--quml-color-primary);width:7.625rem;z-index:2;height:1.25rem;margin:0 auto;bottom:0}.quml-alert__icon{position:absolute;top:15%;left:0;width:1.75rem;height:1.75rem;right:0;margin:0 auto;animation:.1s ease-out .7s forwards correct-button-anim}.quml-alert__banner{position:absolute;bottom:0;z-index:3;height:2.1875rem}.quml-alert__solution-container{display:flex;align-items:center;justify-content:center;width:calc(100% - 122px)}.quml-alert__try-again,.quml-alert__view-solution{line-height:normal;cursor:pointer;background:var(--white);padding:.5rem 1rem;border-radius:1rem;font-size:.75rem;color:var(--quml-color-tertiary);box-shadow:0 .125rem .875rem 0 var(--quml-color-tertiary-rgba);margin-left:.5rem}.quml-alert__view-hint{width:2rem;height:2rem;margin-left:auto;background:var(--white);border-radius:50%;box-shadow:0 .375rem 1rem -.4375rem var(--quml-color-rgba);position:relative}.quml-alert__view-hint--disabled{opacity:.6}.quml-alert__view-hint,.quml-alert__try-again{cursor:pointer;text-transform:capitalize}@keyframes sign-board-animation{0%{visibility:hidden;transform:translateY(0)}to{visibility:visible;transform:translateY(-100%)}}@keyframes correct-button-anim{0%{visibility:hidden;transform:scale(.2)}to{visibility:visible;-khtml-transform:scale(1.1);transform:scale(1.1)}}@keyframes example{0%{margin-bottom:-50px}to{margin-bottom:8px}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AlertComponent, decorators: [{ type: Component, args: [{ selector: 'quml-alert', template: "<div class=\"quml-alert\">\n <div class=\"quml-alert__overlay\" (click)=\"close('close')\" (keyup.enter)=\"close('close')\"></div>\n <div class=\"quml-alert__container\">\n <div class=\"quml-alert__body\">\n <div class=\"quml-alert__image quml-alert__image--correct\" *ngIf=\"alertType === 'correct'\">\n <div class=\"quml-alert__icon-container\">\n <img class=\"quml-alert__icon\" src=\"assets/quml-correct.svg\" alt=\"Correct Answer\">\n\n </div>\n <div class=\"quml-alert__icon-empty\"></div>\n <img class=\"quml-alert__banner\" src=\"assets/banner-correct.svg\" alt=\"\" >\n </div>\n <div class=\"quml-alert__image quml-alert__image--wrong\" *ngIf=\"alertType === 'wrong'\">\n <div class=\"quml-alert__icon-container\">\n <img class=\"quml-alert__icon\" src=\"assets/quml-wrong.svg\" alt=\"Wrong Answer\">\n </div>\n <div class=\"quml-alert__icon-empty\"></div>\n <img class=\"quml-alert__banner\" src=\"assets/banner-wrong.svg\" alt=\"\">\n </div>\n \n \n\n <div class=\"quml-alert__solution-container\">\n <div class=\"quml-alert__try-again\" *ngIf=\"alertType === 'wrong'\">\n <span tabindex=\"0\" id=\"wrongButton\" *ngIf=\"alertType === 'wrong'\" (click)=\"close('tryAgain')\" (keyup.enter)=\"close('tryAgain')\" aria-label=\"Try again\">Try again</span>\n <!-- TODO: should add some label for correct response when solution is off <span *ngIf=\"alertType === 'correct' && !showSolutionButton\">Correct</span> --> \n </div>\n <div class=\"quml-alert__view-solution\" *ngIf=\"showSolutionButton\">\n <span tabindex=\"0\" id=\"correctButton\" (click)=\"viewSolution()\" (keyup.enter)=\"viewSolution()\" aria-label=\"View Solution\">View Solution</span>\n </div>\n </div>\n\n <div *ngIf=\"isHintAvailable\" class=\"quml-alert__view-hint quml-alert__view-hint--disabled\">\n <img tabindex=\"0\" id=\"hintButton\" class=\"view-hint-icon\" (click)=\"viewHint()\" (keyup.enter)=\"viewHint()\" src=\"assets/view-hint.svg\" alt=\"View Hint logo\">\n </div>\n </div>\n </div>\n</div>\n", styles: ["::ng-deep :root{--quml-color-primary: #FFD555;--quml-color-primary-rgba: #f6bc42;--quml-color-primary-shade: rgba(0, 0, 0, .1);--quml-color-tertiary: #FA6400;--quml-color-tertiary-rgba: rgba(250, 100, 0, .6);--quml-color-rgba: rgba(0, 0, 0, .6)}.quml-alert__overlay{position:absolute;width:100%;height:100%;top:0;left:0}.quml-alert__container{position:absolute;bottom:.75rem;height:5.625rem;left:0;right:0;border-radius:.5rem;box-shadow:0 .125rem .875rem 0 var(-quml-color-primary-shade);padding:.5rem 1.5rem .5rem .5rem;animation-name:example;animation-timing-function:ease-in-out;animation-duration:.4s;margin:0 auto .5rem;width:23.25rem;background:linear-gradient(145deg,var(--quml-color-primary),var(--quml-color-primary) 60%,var(--quml-color-primary-rgba) 60%);z-index:1}@media only screen and (max-width: 480px){.quml-alert__container{position:absolute;bottom:3.75rem;border-radius:.5rem;background-color:var(--white);box-shadow:0 .125rem .875rem 0 var(-quml-color-primary-shade);width:21.75rem;padding:.5rem}}.quml-alert__body{display:flex;align-items:center;position:relative;height:100%}.quml-alert__image{position:relative;height:100%;width:7.625rem;overflow:hidden}.quml-alert__icon-container{background:var(--white);border-radius:.5rem;position:absolute;width:4.5rem;z-index:1;height:4rem;left:0;right:0;margin:0 auto;bottom:-54px;animation:sign-board-animation .2s ease-out forwards;animation-delay:.3s}.quml-alert__icon-empty{position:absolute;background:var(--quml-color-primary);width:7.625rem;z-index:2;height:1.25rem;margin:0 auto;bottom:0}.quml-alert__icon{position:absolute;top:15%;left:0;width:1.75rem;height:1.75rem;right:0;margin:0 auto;animation:.1s ease-out .7s forwards correct-button-anim}.quml-alert__banner{position:absolute;bottom:0;z-index:3;height:2.1875rem}.quml-alert__solution-container{display:flex;align-items:center;justify-content:center;width:calc(100% - 122px)}.quml-alert__try-again,.quml-alert__view-solution{line-height:normal;cursor:pointer;background:var(--white);padding:.5rem 1rem;border-radius:1rem;font-size:.75rem;color:var(--quml-color-tertiary);box-shadow:0 .125rem .875rem 0 var(--quml-color-tertiary-rgba);margin-left:.5rem}.quml-alert__view-hint{width:2rem;height:2rem;margin-left:auto;background:var(--white);border-radius:50%;box-shadow:0 .375rem 1rem -.4375rem var(--quml-color-rgba);position:relative}.quml-alert__view-hint--disabled{opacity:.6}.quml-alert__view-hint,.quml-alert__try-again{cursor:pointer;text-transform:capitalize}@keyframes sign-board-animation{0%{visibility:hidden;transform:translateY(0)}to{visibility:visible;transform:translateY(-100%)}}@keyframes correct-button-anim{0%{visibility:hidden;transform:scale(.2)}to{visibility:visible;-khtml-transform:scale(1.1);transform:scale(1.1)}}@keyframes example{0%{margin-bottom:-50px}to{margin-bottom:8px}}\n"] }] }], propDecorators: { alertType: [{ type: Input }], isHintAvailable: [{ type: Input }], showSolutionButton: [{ type: Input }], closeAlert: [{ type: Output }], showSolution: [{ type: Output }], showHint: [{ type: Output }], onKeydownHandler: [{ type: HostListener, args: ['document:keydown.escape', ['$event']] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcXVtbC1saWJyYXJ5L3NyYy9saWIvYWxlcnQvYWxlcnQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcXVtbC1saWJyYXJ5L3NyYy9saWIvYWxlcnQvYWxlcnQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFDSixZQUFZLEVBQy9DLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQWdCLE1BQU0sTUFBTSxDQUFDOzs7QUFTL0MsTUFBTSxPQUFPLGNBQWM7SUFMM0I7UUFVWSxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUNoQyxpQkFBWSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFDbEMsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFHeEMsZUFBVSxHQUFHLEtBQUssQ0FBQztLQW1FcEI7SUFoRXNELGdCQUFnQixDQUFDLEtBQW9CO1FBQ3hGLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDdEIsQ0FBQztJQUtELFFBQVE7UUFDTixJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztRQUN4QixJQUFJLENBQUMscUJBQXFCLEdBQUcsUUFBUSxDQUFDLGFBQTRCLENBQUM7UUFDbkUsSUFBSSxDQUFDLFlBQVksR0FBRyxTQUFTLENBQUMsUUFBUSxFQUFFLFNBQVMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQWdCLEVBQUUsRUFBRTtZQUNoRixJQUFJLENBQUMsQ0FBQyxLQUFLLENBQUMsS0FBSyxLQUFLLEVBQUU7Z0JBQ3RCLE1BQU0sT0FBTyxHQUFnQixRQUFRLENBQUMsYUFBYSxDQUFDLDRCQUE0QixDQUFDLENBQUM7Z0JBQ2xGLDBCQUEwQjtnQkFDMUIsSUFBSSxPQUFPLEVBQUU7b0JBQ1gsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsQ0FBQztvQkFDcEIsT0FBTyxDQUFDLEtBQUssQ0FBQyxFQUFFLGFBQWEsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO29CQUN2QyxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQztvQkFDdkIsQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFDO2lCQUNyQjthQUNGO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsZUFBZTtRQUNiLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxNQUFNLFdBQVcsR0FBZ0IsUUFBUSxDQUFDLGFBQWEsQ0FBQyxjQUFjLENBQUMsQ0FBQztZQUN4RSxNQUFNLGFBQWEsR0FBaUIsUUFBUSxDQUFDLGFBQWEsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO1lBRTdFLElBQUksSUFBSSxDQUFDLFNBQVMsS0FBSyxPQUFPLElBQUksV0FBVyxFQUFFO2dCQUM3QyxXQUFXLENBQUMsS0FBSyxDQUFDLEVBQUUsYUFBYSxFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7YUFDNUM7aUJBQU0sSUFBSSxJQUFJLENBQUMsU0FBUyxLQUFLLFNBQVMsSUFBSSxJQUFJLENBQUMsa0JBQWtCLElBQUksYUFBYSxFQUFFO2dCQUNuRixhQUFhLENBQUMsS0FBSyxDQUFDLEVBQUUsYUFBYSxFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7YUFDOUM7UUFDSCxDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7SUFDVixDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO1lBQ2pCLElBQUksRUFBRSxJQUFJO1NBQ1gsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELFlBQVk7UUFDVixJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQztZQUNyQixRQUFRLEVBQUUsSUFBSTtTQUNmLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCxLQUFLLENBQUMsSUFBSTtRQUNSLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEVBQUUsSUFBSSxFQUFFLENBQUMsQ0FBQztJQUNqQyxDQUFDO0lBRUQsV0FBVztRQUNULDBCQUEwQjtRQUMxQixJQUFJLElBQUksQ0FBQyxxQkFBcUIsSUFBSSxDQUFDLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDbEQsSUFBSSxDQUFDLHFCQUFxQixDQUFDLEtBQUssQ0FBQyxFQUFFLGFBQWEsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO1NBQzNEO1FBRUQsMEJBQTBCO1FBQzFCLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtZQUNyQixJQUFJLENBQUMsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ2pDO0lBQ0gsQ0FBQztrSUE1RVUsY0FBYztzSEFBZCxjQUFjLCtVQ2IzQix1b0VBc0NBOzs0RkR6QmEsY0FBYztrQkFMMUIsU0FBUzsrQkFDRSxZQUFZOzhCQUtiLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxrQkFBa0I7c0JBQTFCLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTTtnQkFDRyxZQUFZO3NCQUFyQixNQUFNO2dCQUNHLFFBQVE7c0JBQWpCLE1BQU07Z0JBTThDLGdCQUFnQjtzQkFBcEUsWUFBWTt1QkFBQyx5QkFBeUIsRUFBRSxDQUFDLFFBQVEsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIElucHV0LFxuICBBZnRlclZpZXdJbml0LCBPbkRlc3Ryb3ksIE9uSW5pdCwgSG9zdExpc3RlbmVyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgZnJvbUV2ZW50LCBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcblxudHlwZSBBbGVydFR5cGUgPSBcImNvcnJlY3RcIiB8IFwid3JvbmdcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncXVtbC1hbGVydCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9hbGVydC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2FsZXJ0LmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgQWxlcnRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIEFmdGVyVmlld0luaXQsIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIGFsZXJ0VHlwZTogQWxlcnRUeXBlO1xuICBASW5wdXQoKSBpc0hpbnRBdmFpbGFibGU6IGJvb2xlYW47XG4gIEBJbnB1dCgpIHNob3dTb2x1dGlvbkJ1dHRvbjogYm9vbGVhbjtcblxuICBAT3V0cHV0KCkgY2xvc2VBbGVydCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgQE91dHB1dCgpIHNob3dTb2x1dGlvbiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgQE91dHB1dCgpIHNob3dIaW50ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIHN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuICBpc0ZvY3VzU2V0ID0gZmFsc2U7XG5cblxuICBASG9zdExpc3RlbmVyKCdkb2N1bWVudDprZXlkb3duLmVzY2FwZScsIFsnJGV2ZW50J10pIG9uS2V5ZG93bkhhbmRsZXIoZXZlbnQ6IEtleWJvYXJkRXZlbnQpIHtcbiAgICB0aGlzLmNsb3NlKCdjbG9zZScpO1xuICB9XG5cblxuICBwcmV2aW91c0FjdGl2ZUVsZW1lbnQ6IEhUTUxFbGVtZW50O1xuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMuaXNGb2N1c1NldCA9IGZhbHNlO1xuICAgIHRoaXMucHJldmlvdXNBY3RpdmVFbGVtZW50ID0gZG9jdW1lbnQuYWN0aXZlRWxlbWVudCBhcyBIVE1MRWxlbWVudDtcbiAgICB0aGlzLnN1YnNjcmlwdGlvbiA9IGZyb21FdmVudChkb2N1bWVudCwgJ2tleWRvd24nKS5zdWJzY3JpYmUoKGU6IEtleWJvYXJkRXZlbnQpID0+IHtcbiAgICAgIGlmIChlWydrZXknXSA9PT0gJ1RhYicpIHtcbiAgICAgICAgY29uc3QgbmV4dEJ0bjogSFRNTEVsZW1lbnQgPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCcucXVtbC1uYXZpZ2F0aW9uX19wcmV2aW91cycpO1xuICAgICAgICAvKiBpc3RhbmJ1bCBpZ25vcmUgZWxzZSAqL1xuICAgICAgICBpZiAobmV4dEJ0bikge1xuICAgICAgICAgIHRoaXMuY2xvc2UoJ2Nsb3NlJyk7XG4gICAgICAgICAgbmV4dEJ0bi5mb2N1cyh7IHByZXZlbnRTY3JvbGw6IHRydWUgfSk7XG4gICAgICAgICAgdGhpcy5pc0ZvY3VzU2V0ID0gdHJ1ZTtcbiAgICAgICAgICBlLnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgICB9XG4gICAgICB9XG4gICAgfSk7XG4gIH1cblxuICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBjb25zdCB3cm9uZ0J1dHRvbjogSFRNTEVsZW1lbnQgPSBkb2N1bWVudC5xdWVyeVNlbGVjdG9yKCcjd3JvbmdCdXR0b24nKTtcbiAgICAgIGNvbnN0IGNvcnJlY3RCdXR0b24gOiBIVE1MRWxlbWVudCA9IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3IoJyNjb3JyZWN0QnV0dG9uJyk7XG5cbiAgICAgIGlmICh0aGlzLmFsZXJ0VHlwZSA9PT0gJ3dyb25nJyAmJiB3cm9uZ0J1dHRvbikge1xuICAgICAgICB3cm9uZ0J1dHRvbi5mb2N1cyh7IHByZXZlbnRTY3JvbGw6IHRydWUgfSk7XG4gICAgICB9IGVsc2UgaWYgKHRoaXMuYWxlcnRUeXBlID09PSAnY29ycmVjdCcgJiYgdGhpcy5zaG93U29sdXRpb25CdXR0b24gJiYgY29ycmVjdEJ1dHRvbikge1xuICAgICAgICBjb3JyZWN0QnV0dG9uLmZvY3VzKHsgcHJldmVudFNjcm9sbDogdHJ1ZSB9KTtcbiAgICAgIH1cbiAgICB9LCAyMDApO1xuICB9XG5cbiAgdmlld0hpbnQoKSB7XG4gICAgdGhpcy5zaG93SGludC5lbWl0KHtcbiAgICAgIGhpbnQ6IHRydWUsXG4gICAgfSk7XG4gIH1cblxuICB2aWV3U29sdXRpb24oKSB7XG4gICAgdGhpcy5zaG93U29sdXRpb24uZW1pdCh7XG4gICAgICBzb2x1dGlvbjogdHJ1ZSxcbiAgICB9KTtcbiAgfVxuXG4gIGNsb3NlKHR5cGUpIHtcbiAgICB0aGlzLmNsb3NlQWxlcnQuZW1pdCh7IHR5cGUgfSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICAvKiBpc3RhbmJ1bCBpZ25vcmUgZWxzZSAqL1xuICAgIGlmICh0aGlzLnByZXZpb3VzQWN0aXZlRWxlbWVudCAmJiAhdGhpcy5pc0ZvY3VzU2V0KSB7XG4gICAgICB0aGlzLnByZXZpb3VzQWN0aXZlRWxlbWVudC5mb2N1cyh7IHByZXZlbnRTY3JvbGw6IHRydWUgfSk7XG4gICAgfVxuXG4gICAgLyogaXN0YW5idWwgaWdub3JlIGVsc2UgKi9cbiAgICBpZiAodGhpcy5zdWJzY3JpcHRpb24pIHtcbiAgICAgIHRoaXMuc3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gICAgfVxuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwicXVtbC1hbGVydFwiPlxuICA8ZGl2IGNsYXNzPVwicXVtbC1hbGVydF9fb3ZlcmxheVwiIChjbGljayk9XCJjbG9zZSgnY2xvc2UnKVwiIChrZXl1cC5lbnRlcik9XCJjbG9zZSgnY2xvc2UnKVwiPjwvZGl2PlxuICA8ZGl2IGNsYXNzPVwicXVtbC1hbGVydF9fY29udGFpbmVyXCI+XG4gICAgPGRpdiBjbGFzcz1cInF1bWwtYWxlcnRfX2JvZHlcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJxdW1sLWFsZXJ0X19pbWFnZSBxdW1sLWFsZXJ0X19pbWFnZS0tY29ycmVjdFwiICpuZ0lmPVwiYWxlcnRUeXBlID09PSAnY29ycmVjdCdcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInF1bWwtYWxlcnRfX2ljb24tY29udGFpbmVyXCI+XG4gICAgICAgICAgPGltZyBjbGFzcz1cInF1bWwtYWxlcnRfX2ljb25cIiBzcmM9XCJhc3NldHMvcXVtbC1jb3JyZWN0LnN2Z1wiIGFsdD1cIkNvcnJlY3QgQW5zd2VyXCI+XG5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJxdW1sLWFsZXJ0X19pY29uLWVtcHR5XCI+PC9kaXY+XG4gICAgICAgIDxpbWcgY2xhc3M9XCJxdW1sLWFsZXJ0X19iYW5uZXJcIiBzcmM9XCJhc3NldHMvYmFubmVyLWNvcnJlY3Quc3ZnXCIgYWx0PVwiXCIgPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwicXVtbC1hbGVydF9faW1hZ2UgcXVtbC1hbGVydF9faW1hZ2UtLXdyb25nXCIgKm5nSWY9XCJhbGVydFR5cGUgPT09ICd3cm9uZydcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInF1bWwtYWxlcnRfX2ljb24tY29udGFpbmVyXCI+XG4gICAgICAgICAgPGltZyBjbGFzcz1cInF1bWwtYWxlcnRfX2ljb25cIiBzcmM9XCJhc3NldHMvcXVtbC13cm9uZy5zdmdcIiBhbHQ9XCJXcm9uZyBBbnN3ZXJcIj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJxdW1sLWFsZXJ0X19pY29uLWVtcHR5XCI+PC9kaXY+XG4gICAgICAgIDxpbWcgY2xhc3M9XCJxdW1sLWFsZXJ0X19iYW5uZXJcIiBzcmM9XCJhc3NldHMvYmFubmVyLXdyb25nLnN2Z1wiIGFsdD1cIlwiPlxuICAgICAgPC9kaXY+XG4gICAgIFxuICAgICAgXG5cbiAgICAgIDxkaXYgY2xhc3M9XCJxdW1sLWFsZXJ0X19zb2x1dGlvbi1jb250YWluZXJcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInF1bWwtYWxlcnRfX3RyeS1hZ2FpblwiICpuZ0lmPVwiYWxlcnRUeXBlID09PSAnd3JvbmcnXCI+XG4gICAgICAgICAgPHNwYW4gdGFiaW5kZXg9XCIwXCIgaWQ9XCJ3cm9uZ0J1dHRvblwiICpuZ0lmPVwiYWxlcnRUeXBlID09PSAnd3JvbmcnXCIgKGNsaWNrKT1cImNsb3NlKCd0cnlBZ2FpbicpXCIgKGtleXVwLmVudGVyKT1cImNsb3NlKCd0cnlBZ2FpbicpXCIgIGFyaWEtbGFiZWw9XCJUcnkgYWdhaW5cIj5UcnkgYWdhaW48L3NwYW4+XG4gICAgICAgICAgPCEtLSBUT0RPOiBzaG91bGQgYWRkIHNvbWUgbGFiZWwgZm9yIGNvcnJlY3QgcmVzcG9uc2Ugd2hlbiBzb2x1dGlvbiBpcyBvZmYgPHNwYW4gKm5nSWY9XCJhbGVydFR5cGUgPT09ICdjb3JyZWN0JyAmJiAhc2hvd1NvbHV0aW9uQnV0dG9uXCI+Q29ycmVjdDwvc3Bhbj4gLS0+IFxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInF1bWwtYWxlcnRfX3ZpZXctc29sdXRpb25cIiAqbmdJZj1cInNob3dTb2x1dGlvbkJ1dHRvblwiPlxuICAgICAgICAgIDxzcGFuIHRhYmluZGV4PVwiMFwiIGlkPVwiY29ycmVjdEJ1dHRvblwiIChjbGljayk9XCJ2aWV3U29sdXRpb24oKVwiIChrZXl1cC5lbnRlcik9XCJ2aWV3U29sdXRpb24oKVwiICBhcmlhLWxhYmVsPVwiVmlldyBTb2x1dGlvblwiPlZpZXcgU29sdXRpb248L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG5cbiAgICAgIDxkaXYgKm5nSWY9XCJpc0hpbnRBdmFpbGFibGVcIiBjbGFzcz1cInF1bWwtYWxlcnRfX3ZpZXctaGludCBxdW1sLWFsZXJ0X192aWV3LWhpbnQtLWRpc2FibGVkXCI+XG4gICAgICAgIDxpbWcgdGFiaW5kZXg9XCIwXCIgaWQ9XCJoaW50QnV0dG9uXCIgIGNsYXNzPVwidmlldy1oaW50LWljb25cIiAoY2xpY2spPVwidmlld0hpbnQoKVwiIChrZXl1cC5lbnRlcik9XCJ2aWV3SGludCgpXCIgc3JjPVwiYXNzZXRzL3ZpZXctaGludC5zdmdcIiBhbHQ9XCJWaWV3IEhpbnQgbG9nb1wiPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=