@betokyo/ui-components
Version:
As part of a school project, the BeTokyo UI components library allows us to reuse components in each of our web apps.
59 lines • 16.3 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class TurnScheduleComponent {
constructor() {
this.clickHandler = new EventEmitter();
}
ngOnInit() {
const temp = [];
this.resources = this.schedule.turns.map(turn => {
const length = turn.resources.length;
return turn.resources.map(resource => new ResourceSummary(resource.id, resource.name, length));
}).reduce(x => temp.concat(x));
}
onClickHandler(resource, time) {
this.clickHandler.emit(new TurnSelectedEvent(resource.id, new Date(`${this.schedule.date}T${time}:00`)));
}
isDisabled(resource) {
return resource.status !== 'available';
}
getStyle(resources) {
if (resources === undefined) {
return `width:100%;`;
}
return `width: ${(100 / (resources.length)) - 2}%;`;
}
date() {
return new Date(this.schedule.date).toLocaleDateString();
}
}
TurnScheduleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: TurnScheduleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
TurnScheduleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.8", type: TurnScheduleComponent, selector: "ui-turn-schedule", inputs: { title: "title", schedule: "schedule" }, outputs: { clickHandler: "clickHandler" }, ngImport: i0, template: "<div class=\"turn-schedule\">\n <header class=\"turn-schedule-header\">\n <h3>{{title}}</h3>\n <h3>{{date()}}</h3>\n </header>\n <div class=\"turn-schedule-body\">\n <div class=\"turn-schedule-resources\">\n <span class=\"turn-schedule-title\"\n *ngFor=\"let resource of resources;\"\n [style]=\"resource.getStyle()\">\n {{resource.name}}\n </span>\n </div>\n <div class=\"turn-schedule-hours\" *ngFor=\"let turn of schedule.turns\">\n <button class=\"turn-schedule-button\"\n type=\"button\"\n *ngFor=\"let resource of turn.resources\"\n [disabled]=\"isDisabled(resource)\"\n [style]=\"getStyle(resources)\"\n (click)=\"onClickHandler(resource, turn.time)\">\n {{turn.time}}\n </button>\n </div>\n </div>\n</div>\n", styles: [".turn-schedule-header{display:flex;flex-flow:row wrap;justify-content:space-between;padding-top:var(--padding);padding-bottom:var(--padding);padding-left:0;padding-right:0;color:var(--color-primary)}.turn-schedule-resources{width:100%;display:flex;flex-flow:row wrap;justify-content:space-between;margin-bottom:var(--margin-v)}.turn-schedule-title{padding:10px 5px;background-color:var(--color-primary);color:var(--color-text);text-align:center;cursor:pointer}.turn-schedule-hours{display:flex;flex-flow:row wrap;justify-content:space-between;margin-bottom:var(--margin-v)}.turn-schedule-button{background-color:var(--color-primary-50);border:0;padding:15px 0;width:-moz-fit-content;width:fit-content;text-align:center;cursor:pointer}.turn-schedule-button:disabled{background-color:var(--color-secondary-50)}.turn-schedule-button:hover:not(:disabled){background-color:var(--color-primary-20)}.turn-schedule-button:active:not(:disabled){background-color:var(--color-primary-80);color:var(--color-text)}@media screen and (min-width: 480px){.turn-schedule{max-width:var(--max-width);margin-left:auto;margin-right:auto}}\n", ":host{--color-pending: #FCD64F;--color-accepted: #82C784;--color-cancelled: #A22A44;--color-proposed: #F79F4D;--color-declined: #E6E6E6;--color-ended: #B2CCD6;--color-text: #FFFFFF;--color-base: #000000;--color-available: #2ECC71;--color-disabled: #D2D2D2;--color-primary: #1D2C54;--color-primary-80: rgba(29, 44, 84, .8);--color-primary-50: rgba(29, 44, 84, .5);--color-primary-20: rgba(29, 44, 84, .2);--color-secondary: #D9D9D9;--color-secondary-80: rgba(217, 217, 217, .8);--color-secondary-50: rgba(217, 217, 217, .5);--color-secondary-20: rgba(217, 217, 217, .2);--color-danger: #A22A44;--color-danger-80: rgba(162, 42, 68, .8);--color-danger-50: rgba(162, 42, 68, .5);--color-danger-20: rgba(162, 42, 68, .2);--color-light: #D9D9D9;--color-light-80: rgba(217, 217, 217, .8);--color-light-50: rgba(217, 217, 217, .5);--color-light-20: rgba(217, 217, 217, .2);--color-dark: #000000;--color-dark-80: rgba(0, 0, 0, .8);--color-dark-50: rgba(0, 0, 0, .5);--color-dark-20: rgba(0, 0, 0, .2);--max-width: 315px;--margin-v: 10px;--padding-h: 20px;--padding-v: 15px;--padding: 10px;--small-padding: 5px;--border-radius: 5px;--border-width: 1px;--border-style: solid;--large-mobile: 414px;--mobile-w: 480px;--tablet-w: 768px;--laptop-w: 1024px}h1{font-family:DM Sans,sans-serif;font-size:2em;margin:5px 0}h2{font-family:Dhyana,sans-serif;font-size:1.4em;margin:5px 0}h3{font-family:Dhyana,sans-serif;font-size:1.2em;margin:5px 0}.element-title{font-family:Doppio One,sans-serif;font-size:16px;font-weight:700;line-height:140%}.description-text{font-family:Dhyana,sans-serif;font-size:24px;line-height:140%}.card-text{font-family:Dhyana,sans-serif;font-size:16px;line-height:140%}html,body,div,p,span,button,link{color:var(--color-dark-80);font-family:Dhyana,sans-serif}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.8", ngImport: i0, type: TurnScheduleComponent, decorators: [{
type: Component,
args: [{ selector: 'ui-turn-schedule', template: "<div class=\"turn-schedule\">\n <header class=\"turn-schedule-header\">\n <h3>{{title}}</h3>\n <h3>{{date()}}</h3>\n </header>\n <div class=\"turn-schedule-body\">\n <div class=\"turn-schedule-resources\">\n <span class=\"turn-schedule-title\"\n *ngFor=\"let resource of resources;\"\n [style]=\"resource.getStyle()\">\n {{resource.name}}\n </span>\n </div>\n <div class=\"turn-schedule-hours\" *ngFor=\"let turn of schedule.turns\">\n <button class=\"turn-schedule-button\"\n type=\"button\"\n *ngFor=\"let resource of turn.resources\"\n [disabled]=\"isDisabled(resource)\"\n [style]=\"getStyle(resources)\"\n (click)=\"onClickHandler(resource, turn.time)\">\n {{turn.time}}\n </button>\n </div>\n </div>\n</div>\n", styles: [".turn-schedule-header{display:flex;flex-flow:row wrap;justify-content:space-between;padding-top:var(--padding);padding-bottom:var(--padding);padding-left:0;padding-right:0;color:var(--color-primary)}.turn-schedule-resources{width:100%;display:flex;flex-flow:row wrap;justify-content:space-between;margin-bottom:var(--margin-v)}.turn-schedule-title{padding:10px 5px;background-color:var(--color-primary);color:var(--color-text);text-align:center;cursor:pointer}.turn-schedule-hours{display:flex;flex-flow:row wrap;justify-content:space-between;margin-bottom:var(--margin-v)}.turn-schedule-button{background-color:var(--color-primary-50);border:0;padding:15px 0;width:-moz-fit-content;width:fit-content;text-align:center;cursor:pointer}.turn-schedule-button:disabled{background-color:var(--color-secondary-50)}.turn-schedule-button:hover:not(:disabled){background-color:var(--color-primary-20)}.turn-schedule-button:active:not(:disabled){background-color:var(--color-primary-80);color:var(--color-text)}@media screen and (min-width: 480px){.turn-schedule{max-width:var(--max-width);margin-left:auto;margin-right:auto}}\n", ":host{--color-pending: #FCD64F;--color-accepted: #82C784;--color-cancelled: #A22A44;--color-proposed: #F79F4D;--color-declined: #E6E6E6;--color-ended: #B2CCD6;--color-text: #FFFFFF;--color-base: #000000;--color-available: #2ECC71;--color-disabled: #D2D2D2;--color-primary: #1D2C54;--color-primary-80: rgba(29, 44, 84, .8);--color-primary-50: rgba(29, 44, 84, .5);--color-primary-20: rgba(29, 44, 84, .2);--color-secondary: #D9D9D9;--color-secondary-80: rgba(217, 217, 217, .8);--color-secondary-50: rgba(217, 217, 217, .5);--color-secondary-20: rgba(217, 217, 217, .2);--color-danger: #A22A44;--color-danger-80: rgba(162, 42, 68, .8);--color-danger-50: rgba(162, 42, 68, .5);--color-danger-20: rgba(162, 42, 68, .2);--color-light: #D9D9D9;--color-light-80: rgba(217, 217, 217, .8);--color-light-50: rgba(217, 217, 217, .5);--color-light-20: rgba(217, 217, 217, .2);--color-dark: #000000;--color-dark-80: rgba(0, 0, 0, .8);--color-dark-50: rgba(0, 0, 0, .5);--color-dark-20: rgba(0, 0, 0, .2);--max-width: 315px;--margin-v: 10px;--padding-h: 20px;--padding-v: 15px;--padding: 10px;--small-padding: 5px;--border-radius: 5px;--border-width: 1px;--border-style: solid;--large-mobile: 414px;--mobile-w: 480px;--tablet-w: 768px;--laptop-w: 1024px}h1{font-family:DM Sans,sans-serif;font-size:2em;margin:5px 0}h2{font-family:Dhyana,sans-serif;font-size:1.4em;margin:5px 0}h3{font-family:Dhyana,sans-serif;font-size:1.2em;margin:5px 0}.element-title{font-family:Doppio One,sans-serif;font-size:16px;font-weight:700;line-height:140%}.description-text{font-family:Dhyana,sans-serif;font-size:24px;line-height:140%}.card-text{font-family:Dhyana,sans-serif;font-size:16px;line-height:140%}html,body,div,p,span,button,link{color:var(--color-dark-80);font-family:Dhyana,sans-serif}\n"] }]
}], propDecorators: { title: [{
type: Input
}], schedule: [{
type: Input
}], clickHandler: [{
type: Output
}] } });
class ResourceSummary {
constructor(id, name, length) {
this.id = id;
this.name = name;
this.length = length;
}
getStyle() {
return `width: ${(100 / this.length) - 5}%`;
}
}
export class TurnSelectedEvent {
constructor(resourceId, datetime) {
this.resourceId = resourceId;
this.datetime = datetime;
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHVybi1zY2hlZHVsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy91aS1jb21wb25lbnRzL3NyYy91aS90dXJuLXNjaGVkdWxlL3R1cm4tc2NoZWR1bGUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdWktY29tcG9uZW50cy9zcmMvdWkvdHVybi1zY2hlZHVsZS90dXJuLXNjaGVkdWxlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQU8vRSxNQUFNLE9BQU8scUJBQXFCO0lBTGxDO1FBVW1CLGlCQUFZLEdBQUcsSUFBSSxZQUFZLEVBQXFCLENBQUM7S0E0QnZFO0lBMUJDLFFBQVE7UUFDTixNQUFNLElBQUksR0FBc0IsRUFBRSxDQUFDO1FBQ25DLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFO1lBQzlDLE1BQU0sTUFBTSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsTUFBTSxDQUFDO1lBQ3JDLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsUUFBUSxDQUFDLEVBQUUsQ0FBQyxJQUFJLGVBQWUsQ0FBQyxRQUFRLENBQUMsRUFBRSxFQUFFLFFBQVEsQ0FBQyxJQUFJLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQTtRQUNoRyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDakMsQ0FBQztJQUVELGNBQWMsQ0FBQyxRQUEwQixFQUFFLElBQVk7UUFDckQsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSSxpQkFBaUIsQ0FBQyxRQUFRLENBQUMsRUFBRSxFQUFFLElBQUksSUFBSSxDQUFDLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLElBQUksSUFBSSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDM0csQ0FBQztJQUVELFVBQVUsQ0FBQyxRQUEwQjtRQUNuQyxPQUFPLFFBQVEsQ0FBQyxNQUFNLEtBQUssV0FBVyxDQUFDO0lBQ3pDLENBQUM7SUFFRCxRQUFRLENBQUMsU0FBd0M7UUFDL0MsSUFBSSxTQUFTLEtBQUssU0FBUyxFQUFFO1lBQzNCLE9BQU8sYUFBYSxDQUFBO1NBQ3JCO1FBQ0QsT0FBTyxVQUFVLENBQUMsR0FBRyxHQUFDLENBQUMsU0FBUyxDQUFDLE1BQU0sQ0FBQyxDQUFDLEdBQUcsQ0FBRSxJQUFJLENBQUE7SUFDcEQsQ0FBQztJQUVELElBQUk7UUFDRixPQUFPLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUMsa0JBQWtCLEVBQUUsQ0FBQztJQUMzRCxDQUFDOztrSEFoQ1UscUJBQXFCO3NHQUFyQixxQkFBcUIscUpDUGxDLHN6QkF5QkE7MkZEbEJhLHFCQUFxQjtrQkFMakMsU0FBUzsrQkFDRSxrQkFBa0I7OEJBT1osS0FBSztzQkFBcEIsS0FBSztnQkFDVSxRQUFRO3NCQUF2QixLQUFLO2dCQUNXLFlBQVk7c0JBQTVCLE1BQU07O0FBOEJULE1BQU0sZUFBZTtJQUNuQixZQUNTLEVBQVUsRUFDVixJQUFZLEVBQ1gsTUFBYztRQUZmLE9BQUUsR0FBRixFQUFFLENBQVE7UUFDVixTQUFJLEdBQUosSUFBSSxDQUFRO1FBQ1gsV0FBTSxHQUFOLE1BQU0sQ0FBUTtJQUFJLENBQUM7SUFFN0IsUUFBUTtRQUNOLE9BQU8sVUFBVSxDQUFDLEdBQUcsR0FBRSxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUE7SUFDNUMsQ0FBQztDQUNGO0FBbUJELE1BQU0sT0FBTyxpQkFBaUI7SUFDNUIsWUFDUyxVQUFrQixFQUNsQixRQUFjO1FBRGQsZUFBVSxHQUFWLFVBQVUsQ0FBUTtRQUNsQixhQUFRLEdBQVIsUUFBUSxDQUFNO0lBQUksQ0FBQztDQUM3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndWktdHVybi1zY2hlZHVsZScsXG4gIHRlbXBsYXRlVXJsOiAnLi90dXJuLXNjaGVkdWxlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdHVybi1zY2hlZHVsZS5jb21wb25lbnQuY3NzJywgJy4uL2Fzc2V0cy9zdHlsZXMvdGhlbWUuY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgVHVyblNjaGVkdWxlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICBwdWJsaWMgcmVzb3VyY2VzOiBSZXNvdXJjZVN1bW1hcnlbXSB8IHVuZGVmaW5lZDtcbiAgQElucHV0KCkgcHVibGljIHRpdGxlOiBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIHB1YmxpYyBzY2hlZHVsZSE6IFR1cm5TY2hlZHVsZU1vZGVsO1xuICBAT3V0cHV0KCkgcHVibGljIGNsaWNrSGFuZGxlciA9IG5ldyBFdmVudEVtaXR0ZXI8VHVyblNlbGVjdGVkRXZlbnQ+KCk7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgY29uc3QgdGVtcDogUmVzb3VyY2VTdW1tYXJ5W10gPSBbXTtcbiAgICB0aGlzLnJlc291cmNlcyA9IHRoaXMuc2NoZWR1bGUudHVybnMubWFwKHR1cm4gPT4ge1xuICAgICAgY29uc3QgbGVuZ3RoID0gdHVybi5yZXNvdXJjZXMubGVuZ3RoO1xuICAgICAgcmV0dXJuIHR1cm4ucmVzb3VyY2VzLm1hcChyZXNvdXJjZSA9PiBuZXcgUmVzb3VyY2VTdW1tYXJ5KHJlc291cmNlLmlkLCByZXNvdXJjZS5uYW1lLCBsZW5ndGgpKVxuICAgIH0pLnJlZHVjZSh4ID0+IHRlbXAuY29uY2F0KHgpKTtcbiAgfVxuXG4gIG9uQ2xpY2tIYW5kbGVyKHJlc291cmNlOiBSZXNvdXJjZUR0b01vZGVsLCB0aW1lOiBzdHJpbmcpOiB2b2lkIHtcbiAgICB0aGlzLmNsaWNrSGFuZGxlci5lbWl0KG5ldyBUdXJuU2VsZWN0ZWRFdmVudChyZXNvdXJjZS5pZCwgbmV3IERhdGUoYCR7dGhpcy5zY2hlZHVsZS5kYXRlfVQke3RpbWV9OjAwYCkpKTtcbiAgfVxuXG4gIGlzRGlzYWJsZWQocmVzb3VyY2U6IFJlc291cmNlRHRvTW9kZWwpIDogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHJlc291cmNlLnN0YXR1cyAhPT0gJ2F2YWlsYWJsZSc7XG4gIH1cblxuICBnZXRTdHlsZShyZXNvdXJjZXM6IFJlc291cmNlU3VtbWFyeVtdIHwgdW5kZWZpbmVkKSB7XG4gICAgaWYgKHJlc291cmNlcyA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICByZXR1cm4gYHdpZHRoOjEwMCU7YFxuICAgIH1cbiAgICByZXR1cm4gYHdpZHRoOiAkeygxMDAvKHJlc291cmNlcy5sZW5ndGgpKSAtIDIgfSU7YFxuICB9XG5cbiAgZGF0ZSgpIDogc3RyaW5nIHtcbiAgICByZXR1cm4gbmV3IERhdGUodGhpcy5zY2hlZHVsZS5kYXRlKS50b0xvY2FsZURhdGVTdHJpbmcoKTtcbiAgfVxufVxuXG5jbGFzcyBSZXNvdXJjZVN1bW1hcnkge1xuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgaWQ6IHN0cmluZyxcbiAgICBwdWJsaWMgbmFtZTogc3RyaW5nLFxuICAgIHByaXZhdGUgbGVuZ3RoOiBudW1iZXIpIHsgfVxuXG4gIGdldFN0eWxlKCkge1xuICAgIHJldHVybiBgd2lkdGg6ICR7KDEwMC8gdGhpcy5sZW5ndGgpIC0gNX0lYFxuICB9XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgVHVyblNjaGVkdWxlTW9kZWwge1xuICBkYXRlOiBzdHJpbmc7XG4gIHR1cm5zOiBUdXJuRHRvTW9kZWxbXVxufVxuXG5leHBvcnQgaW50ZXJmYWNlIFR1cm5EdG9Nb2RlbCB7XG4gIHRpbWU6IHN0cmluZztcbiAgc3RhdGU6IHN0cmluZztcbiAgcmVzb3VyY2VzOiBSZXNvdXJjZUR0b01vZGVsW11cbn1cblxuZXhwb3J0IGludGVyZmFjZSBSZXNvdXJjZUR0b01vZGVsIHtcbiAgaWQ6IHN0cmluZztcbiAgbmFtZTogc3RyaW5nO1xuICBzdGF0dXM6IHN0cmluZztcbn1cblxuZXhwb3J0IGNsYXNzIFR1cm5TZWxlY3RlZEV2ZW50IHtcbiAgY29uc3RydWN0b3IoXG4gICAgcHVibGljIHJlc291cmNlSWQ6IHN0cmluZyxcbiAgICBwdWJsaWMgZGF0ZXRpbWU6IERhdGUpIHsgfVxufSIsIjxkaXYgY2xhc3M9XCJ0dXJuLXNjaGVkdWxlXCI+XG4gIDxoZWFkZXIgY2xhc3M9XCJ0dXJuLXNjaGVkdWxlLWhlYWRlclwiPlxuICAgIDxoMz57e3RpdGxlfX08L2gzPlxuICAgIDxoMz57e2RhdGUoKX19PC9oMz5cbiAgPC9oZWFkZXI+XG4gIDxkaXYgY2xhc3M9XCJ0dXJuLXNjaGVkdWxlLWJvZHlcIj5cbiAgICA8ZGl2IGNsYXNzPVwidHVybi1zY2hlZHVsZS1yZXNvdXJjZXNcIj5cbiAgICAgIDxzcGFuIGNsYXNzPVwidHVybi1zY2hlZHVsZS10aXRsZVwiXG4gICAgICAgICpuZ0Zvcj1cImxldCByZXNvdXJjZSBvZiByZXNvdXJjZXM7XCJcbiAgICAgICAgW3N0eWxlXT1cInJlc291cmNlLmdldFN0eWxlKClcIj5cbiAgICAgICAge3tyZXNvdXJjZS5uYW1lfX1cbiAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwidHVybi1zY2hlZHVsZS1ob3Vyc1wiICpuZ0Zvcj1cImxldCB0dXJuIG9mIHNjaGVkdWxlLnR1cm5zXCI+XG4gICAgICA8YnV0dG9uIGNsYXNzPVwidHVybi1zY2hlZHVsZS1idXR0b25cIlxuICAgICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgICAgKm5nRm9yPVwibGV0IHJlc291cmNlIG9mIHR1cm4ucmVzb3VyY2VzXCJcbiAgICAgICAgW2Rpc2FibGVkXT1cImlzRGlzYWJsZWQocmVzb3VyY2UpXCJcbiAgICAgICAgW3N0eWxlXT1cImdldFN0eWxlKHJlc291cmNlcylcIlxuICAgICAgICAoY2xpY2spPVwib25DbGlja0hhbmRsZXIocmVzb3VyY2UsIHR1cm4udGltZSlcIj5cbiAgICAgICAge3t0dXJuLnRpbWV9fVxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=