@xui/charts
Version:
xUI Charts for Angular
76 lines • 22.1 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';
import { AnalysisService } from './analysis.service';
import * as i0 from "@angular/core";
import * as i1 from "./analysis.service";
import * as i2 from "@angular/common";
import * as i3 from "@xui/components";
import * as i4 from "@angular/cdk/menu";
import * as i5 from "@angular/cdk/drag-drop";
import * as i6 from "./metrics/metrics.component";
import * as i7 from "./chart/chart.component";
export class XuiAnalysisComponent {
get charts() {
return this.analysisService.charts;
}
constructor(analysisService) {
this.analysisService = analysisService;
this.isDragging = this.analysisService.isDragging;
this.closed = false;
}
ngOnInit() {
const first = this.entities?.[0].entities[0];
this.analysisService.addChart(0, [
{
entity: first,
metric: first?.metrics?.[0].metrics?.[0]
}
]);
this.analysisService.addTrend(0, {
entity: first,
metric: first?.metrics?.[0].metrics?.[1]
});
this.analysisService.addChart(1, [
{
entity: first,
metric: first?.metrics?.[0].metrics?.[0]
}
]);
this.analysisService.addChart(3, [
{
entity: first,
metric: first?.metrics?.[0].metrics?.[0]
}
]);
// this.analysisService.addTrend(0, {
// entity: first,
// metric: first?.metrics?.[0].metrics?.[1]!
// });
// this.analysisService.addTrend(0, {
// entity: first,
// metric: first?.metrics?.[0].metrics?.[1]!
// });
// this.analysisService.addTrend(0, {
// entity: first,
// metric: first?.metrics?.[0].metrics?.[1]!
// });
}
dropped(event, index, isPlaceholder = true) {
if (isPlaceholder) {
this.analysisService.addChart(index, [event.item.data]);
}
else {
this.analysisService.addTrend(index, event.item.data);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XuiAnalysisComponent, deps: [{ token: i1.AnalysisService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: XuiAnalysisComponent, selector: "xui-analysis", inputs: { entities: "entities", loadData: "loadData" }, providers: [AnalysisService], exportAs: ["xuiAnalysis"], ngImport: i0, template: "<div class=\"header\">\n <p>New Analysis</p>\n <div class=\"buttons\">\n <xui-button><xui-icon icon=\"add_circle\"></xui-icon> New</xui-button>\n <xui-button><xui-icon icon=\"save\"></xui-icon> Save</xui-button>\n <xui-button><xui-icon icon=\"file_open\"></xui-icon> Load</xui-button>\n\n <xui-button><xui-icon icon=\"file_save\"></xui-icon> Export</xui-button>\n <xui-button><xui-icon icon=\"share\"></xui-icon> Share</xui-button>\n\n <xui-button [cdkMenuTriggerFor]=\"moreMenu\">More <xui-icon icon=\"arrow_drop_down\"></xui-icon></xui-button>\n\n <ng-template #moreMenu>\n <xui-context-menu cdkMenu>\n <xui-button cdkMenuItem>Save as ...</xui-button>\n <xui-button cdkMenuItem color=\"error\">\n Delete\n <xui-icon icon=\"delete-outline\"></xui-icon>\n </xui-button>\n </xui-context-menu>\n </ng-template>\n </div>\n</div>\n\n<div class=\"content\" cdkDropListGroup>\n <div class=\"drawer\" [class.closed]=\"closed\">\n <xui-tab-group>\n <xui-tab title=\"Metrics\">\n <xui-metrics [entities]=\"entities\"></xui-metrics>\n </xui-tab>\n <xui-tab title=\"Data\">Data</xui-tab>\n </xui-tab-group>\n\n <xui-button class=\"toggle\" type=\"icon\" (click)=\"closed = !closed\">\n <xui-icon [icon]=\"closed ? 'chevron-double-right' : 'chevron-double-left'\"></xui-icon>\n </xui-button>\n </div>\n\n <div class=\"charts\">\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, 0)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n\n @for (chart of charts; track chart; let i = $index) {\n <ng-container>\n <div class=\"placeholder-group\">\n <xui-analysis-chart [index]=\"i\" cdkDropList />\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, i, false)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n </div>\n\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, i + 1)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n </ng-container>\n }\n </div>\n</div>\n", styles: [":host{height:600px;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;background-color:var(--color-bg-secondary)}.header{display:flex;justify-content:space-between;align-items:center;padding:4px 12px;border-bottom:1px solid gray}.header p{font-weight:500}.header .buttons{display:flex}.content{height:100%;display:flex}.content .drawer{position:relative;width:45%;height:100%;border-right:1px solid gray;overflow:hidden;transition:width ease-in-out .5s}.content .drawer xui-tab-group{height:100%;transition:opacity ease-in-out .5s}.content .drawer.closed{width:45px}.content .drawer.closed xui-tab-group{opacity:0}.content .drawer .toggle{position:absolute;top:4px;right:4px}.content .charts{flex:1;display:flex;gap:12px;flex-direction:column;padding:24px 16px 0;overflow-y:auto}.content .charts .placeholder-group{position:relative;width:100%}.content .charts .placeholder-group .placeholder{position:absolute;inset:0;height:auto}.content .charts .placeholder{flex:0 0 auto;height:48px;display:grid;place-items:center;font-size:1.3rem;font-weight:600;color:var(--color-primary-default);border:3px dashed currentColor;border-radius:8px;background:oklch(var(--color-primary-default-lch)/.2) url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='24' height='24' viewBox='0 0 24 24'><path fill='#4CAF50' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M13,7H11V11H7V13H11V17H13V13H17V11H13V7Z' /></svg>\") center no-repeat;background-size:100px auto}.content .charts .placeholder:hover{color:var(--success-color-default);border-color:currentColor;background:oklch(var(--color-success-default-lch)/.2)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.XuiButton, selector: "xui-button", inputs: ["type", "size", "color", "shine", "disabled", "stateDelay", "onClick"], outputs: ["click"] }, { kind: "component", type: i3.XuiIcon, selector: "xui-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "icon"], exportAs: ["xuiIcon"] }, { kind: "component", type: i3.XuiContextMenu, selector: "xui-context-menu", inputs: ["anchor"], outputs: ["afterClosed"] }, { kind: "directive", type: i4.CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: i4.CdkMenuItem, selector: "[cdkMenuItem]", inputs: ["cdkMenuItemDisabled", "cdkMenuitemTypeaheadLabel"], outputs: ["cdkMenuItemTriggered"], exportAs: ["cdkMenuItem"] }, { kind: "directive", type: i4.CdkMenuTrigger, selector: "[cdkMenuTriggerFor]", inputs: ["cdkMenuTriggerFor", "cdkMenuPosition", "cdkMenuTriggerData"], outputs: ["cdkMenuOpened", "cdkMenuClosed"], exportAs: ["cdkMenuTriggerFor"] }, { kind: "component", type: i3.XuiTab, selector: "xui-tab", inputs: ["title", "disabled"] }, { kind: "component", type: i3.XuiTabGroup, selector: "xui-tab-group" }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: i6.MetricsComponent, selector: "xui-metrics", inputs: ["entities"] }, { kind: "component", type: i7.ChartComponent, selector: "xui-analysis-chart", inputs: ["index"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XuiAnalysisComponent, decorators: [{
type: Component,
args: [{ selector: 'xui-analysis', exportAs: 'xuiAnalysis', encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, providers: [AnalysisService], template: "<div class=\"header\">\n <p>New Analysis</p>\n <div class=\"buttons\">\n <xui-button><xui-icon icon=\"add_circle\"></xui-icon> New</xui-button>\n <xui-button><xui-icon icon=\"save\"></xui-icon> Save</xui-button>\n <xui-button><xui-icon icon=\"file_open\"></xui-icon> Load</xui-button>\n\n <xui-button><xui-icon icon=\"file_save\"></xui-icon> Export</xui-button>\n <xui-button><xui-icon icon=\"share\"></xui-icon> Share</xui-button>\n\n <xui-button [cdkMenuTriggerFor]=\"moreMenu\">More <xui-icon icon=\"arrow_drop_down\"></xui-icon></xui-button>\n\n <ng-template #moreMenu>\n <xui-context-menu cdkMenu>\n <xui-button cdkMenuItem>Save as ...</xui-button>\n <xui-button cdkMenuItem color=\"error\">\n Delete\n <xui-icon icon=\"delete-outline\"></xui-icon>\n </xui-button>\n </xui-context-menu>\n </ng-template>\n </div>\n</div>\n\n<div class=\"content\" cdkDropListGroup>\n <div class=\"drawer\" [class.closed]=\"closed\">\n <xui-tab-group>\n <xui-tab title=\"Metrics\">\n <xui-metrics [entities]=\"entities\"></xui-metrics>\n </xui-tab>\n <xui-tab title=\"Data\">Data</xui-tab>\n </xui-tab-group>\n\n <xui-button class=\"toggle\" type=\"icon\" (click)=\"closed = !closed\">\n <xui-icon [icon]=\"closed ? 'chevron-double-right' : 'chevron-double-left'\"></xui-icon>\n </xui-button>\n </div>\n\n <div class=\"charts\">\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, 0)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n\n @for (chart of charts; track chart; let i = $index) {\n <ng-container>\n <div class=\"placeholder-group\">\n <xui-analysis-chart [index]=\"i\" cdkDropList />\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, i, false)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n </div>\n\n <div class=\"placeholder\" cdkDropList (cdkDropListDropped)=\"dropped($event, i + 1)\" *ngIf=\"isDragging()\">\n Drop Here to Add Metric\n </div>\n </ng-container>\n }\n </div>\n</div>\n", styles: [":host{height:600px;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;background-color:var(--color-bg-secondary)}.header{display:flex;justify-content:space-between;align-items:center;padding:4px 12px;border-bottom:1px solid gray}.header p{font-weight:500}.header .buttons{display:flex}.content{height:100%;display:flex}.content .drawer{position:relative;width:45%;height:100%;border-right:1px solid gray;overflow:hidden;transition:width ease-in-out .5s}.content .drawer xui-tab-group{height:100%;transition:opacity ease-in-out .5s}.content .drawer.closed{width:45px}.content .drawer.closed xui-tab-group{opacity:0}.content .drawer .toggle{position:absolute;top:4px;right:4px}.content .charts{flex:1;display:flex;gap:12px;flex-direction:column;padding:24px 16px 0;overflow-y:auto}.content .charts .placeholder-group{position:relative;width:100%}.content .charts .placeholder-group .placeholder{position:absolute;inset:0;height:auto}.content .charts .placeholder{flex:0 0 auto;height:48px;display:grid;place-items:center;font-size:1.3rem;font-weight:600;color:var(--color-primary-default);border:3px dashed currentColor;border-radius:8px;background:oklch(var(--color-primary-default-lch)/.2) url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='24' height='24' viewBox='0 0 24 24'><path fill='#4CAF50' d='M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M13,7H11V11H7V13H11V17H13V13H17V11H13V7Z' /></svg>\") center no-repeat;background-size:100px auto}.content .charts .placeholder:hover{color:var(--success-color-default);border-color:currentColor;background:oklch(var(--color-success-default-lch)/.2)}\n"] }]
}], ctorParameters: () => [{ type: i1.AnalysisService }], propDecorators: { entities: [{
type: Input
}], loadData: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5hbHlzaXMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy9jaGFydHMvc3JjL2FuYWx5c2lzL2FuYWx5c2lzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL2xpYnMvY2hhcnRzL3NyYy9hbmFseXNpcy9hbmFseXNpcy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUc3RixPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7Ozs7Ozs7OztBQVdyRCxNQUFNLE9BQU8sb0JBQW9CO0lBTy9CLElBQUksTUFBTTtRQUNSLE9BQU8sSUFBSSxDQUFDLGVBQWUsQ0FBQyxNQUFNLENBQUM7SUFDckMsQ0FBQztJQUVELFlBQW9CLGVBQWdDO1FBQWhDLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtRQVZwRCxlQUFVLEdBQUcsSUFBSSxDQUFDLGVBQWUsQ0FBQyxVQUFVLENBQUM7UUFDN0MsV0FBTSxHQUFHLEtBQUssQ0FBQztJQVN3QyxDQUFDO0lBRXhELFFBQVE7UUFDTixNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBRSxDQUFDO1FBQzlDLElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLENBQUMsRUFBRTtZQUMvQjtnQkFDRSxNQUFNLEVBQUUsS0FBSztnQkFDYixNQUFNLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBRTthQUMxQztTQUNGLENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLENBQUMsRUFBRTtZQUMvQixNQUFNLEVBQUUsS0FBSztZQUNiLE1BQU0sRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQyxDQUFFO1NBQzFDLENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLENBQUMsRUFBRTtZQUMvQjtnQkFDRSxNQUFNLEVBQUUsS0FBSztnQkFDYixNQUFNLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBRTthQUMxQztTQUNGLENBQUMsQ0FBQztRQUVILElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLENBQUMsRUFBRTtZQUMvQjtnQkFDRSxNQUFNLEVBQUUsS0FBSztnQkFDYixNQUFNLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sRUFBRSxDQUFDLENBQUMsQ0FBRTthQUMxQztTQUNGLENBQUMsQ0FBQztRQUVILHFDQUFxQztRQUNyQyxtQkFBbUI7UUFDbkIsOENBQThDO1FBQzlDLE1BQU07UUFDTixxQ0FBcUM7UUFDckMsbUJBQW1CO1FBQ25CLDhDQUE4QztRQUM5QyxNQUFNO1FBQ04scUNBQXFDO1FBQ3JDLG1CQUFtQjtRQUNuQiw4Q0FBOEM7UUFDOUMsTUFBTTtJQUNSLENBQUM7SUFFRCxPQUFPLENBQUMsS0FBdUIsRUFBRSxLQUFhLEVBQUUsYUFBYSxHQUFHLElBQUk7UUFDbEUsSUFBSSxhQUFhLEVBQUUsQ0FBQztZQUNsQixJQUFJLENBQUMsZUFBZSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDMUQsQ0FBQzthQUFNLENBQUM7WUFDTixJQUFJLENBQUMsZUFBZSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUN4RCxDQUFDO0lBQ0gsQ0FBQzs4R0E3RFUsb0JBQW9CO2tHQUFwQixvQkFBb0IsK0ZBRnBCLENBQUMsZUFBZSxDQUFDLHFEQ1o5QixtcEVBMkRBOzsyRkQ3Q2Esb0JBQW9CO2tCQVRoQyxTQUFTOytCQUNFLGNBQWMsWUFDZCxhQUFhLGlCQUNSLGlCQUFpQixDQUFDLFFBQVEsbUJBQ3hCLHVCQUF1QixDQUFDLE1BQU0sYUFHcEMsQ0FBQyxlQUFlLENBQUM7b0ZBTW5CLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRW50aXR5R3JvdXAsIEVudGl0eUlkIH0gZnJvbSAnLi9hbmFseXNpcy50eXBlcyc7XG5pbXBvcnQgeyBDZGtEcmFnRHJvcCB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9kcmFnLWRyb3AnO1xuaW1wb3J0IHsgQW5hbHlzaXNTZXJ2aWNlIH0gZnJvbSAnLi9hbmFseXNpcy5zZXJ2aWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAneHVpLWFuYWx5c2lzJyxcbiAgZXhwb3J0QXM6ICd4dWlBbmFseXNpcycsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLkVtdWxhdGVkLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgc3R5bGVVcmxzOiBbJy4vYW5hbHlzaXMuc2NzcyddLFxuICB0ZW1wbGF0ZVVybDogJy4vYW5hbHlzaXMuY29tcG9uZW50Lmh0bWwnLFxuICBwcm92aWRlcnM6IFtBbmFseXNpc1NlcnZpY2VdXG59KVxuZXhwb3J0IGNsYXNzIFh1aUFuYWx5c2lzQ29tcG9uZW50IHtcbiAgaXNEcmFnZ2luZyA9IHRoaXMuYW5hbHlzaXNTZXJ2aWNlLmlzRHJhZ2dpbmc7XG4gIGNsb3NlZCA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpIGVudGl0aWVzPzogRW50aXR5R3JvdXBbXTtcbiAgQElucHV0KCkgbG9hZERhdGE/OiAoZW50aXR5SWQ6IEVudGl0eUlkLCBtZXRyaWNJZDogRW50aXR5SWQpID0+IHsgZGF0ZTogc3RyaW5nOyB2YWx1ZTogbnVtYmVyIH07XG5cbiAgZ2V0IGNoYXJ0cygpIHtcbiAgICByZXR1cm4gdGhpcy5hbmFseXNpc1NlcnZpY2UuY2hhcnRzO1xuICB9XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBhbmFseXNpc1NlcnZpY2U6IEFuYWx5c2lzU2VydmljZSkge31cblxuICBuZ09uSW5pdCgpIHtcbiAgICBjb25zdCBmaXJzdCA9IHRoaXMuZW50aXRpZXM/LlswXS5lbnRpdGllc1swXSE7XG4gICAgdGhpcy5hbmFseXNpc1NlcnZpY2UuYWRkQ2hhcnQoMCwgW1xuICAgICAge1xuICAgICAgICBlbnRpdHk6IGZpcnN0LFxuICAgICAgICBtZXRyaWM6IGZpcnN0Py5tZXRyaWNzPy5bMF0ubWV0cmljcz8uWzBdIVxuICAgICAgfVxuICAgIF0pO1xuXG4gICAgdGhpcy5hbmFseXNpc1NlcnZpY2UuYWRkVHJlbmQoMCwge1xuICAgICAgZW50aXR5OiBmaXJzdCxcbiAgICAgIG1ldHJpYzogZmlyc3Q/Lm1ldHJpY3M/LlswXS5tZXRyaWNzPy5bMV0hXG4gICAgfSk7XG5cbiAgICB0aGlzLmFuYWx5c2lzU2VydmljZS5hZGRDaGFydCgxLCBbXG4gICAgICB7XG4gICAgICAgIGVudGl0eTogZmlyc3QsXG4gICAgICAgIG1ldHJpYzogZmlyc3Q/Lm1ldHJpY3M/LlswXS5tZXRyaWNzPy5bMF0hXG4gICAgICB9XG4gICAgXSk7XG5cbiAgICB0aGlzLmFuYWx5c2lzU2VydmljZS5hZGRDaGFydCgzLCBbXG4gICAgICB7XG4gICAgICAgIGVudGl0eTogZmlyc3QsXG4gICAgICAgIG1ldHJpYzogZmlyc3Q/Lm1ldHJpY3M/LlswXS5tZXRyaWNzPy5bMF0hXG4gICAgICB9XG4gICAgXSk7XG5cbiAgICAvLyB0aGlzLmFuYWx5c2lzU2VydmljZS5hZGRUcmVuZCgwLCB7XG4gICAgLy8gICBlbnRpdHk6IGZpcnN0LFxuICAgIC8vICAgbWV0cmljOiBmaXJzdD8ubWV0cmljcz8uWzBdLm1ldHJpY3M/LlsxXSFcbiAgICAvLyB9KTtcbiAgICAvLyB0aGlzLmFuYWx5c2lzU2VydmljZS5hZGRUcmVuZCgwLCB7XG4gICAgLy8gICBlbnRpdHk6IGZpcnN0LFxuICAgIC8vICAgbWV0cmljOiBmaXJzdD8ubWV0cmljcz8uWzBdLm1ldHJpY3M/LlsxXSFcbiAgICAvLyB9KTtcbiAgICAvLyB0aGlzLmFuYWx5c2lzU2VydmljZS5hZGRUcmVuZCgwLCB7XG4gICAgLy8gICBlbnRpdHk6IGZpcnN0LFxuICAgIC8vICAgbWV0cmljOiBmaXJzdD8ubWV0cmljcz8uWzBdLm1ldHJpY3M/LlsxXSFcbiAgICAvLyB9KTtcbiAgfVxuXG4gIGRyb3BwZWQoZXZlbnQ6IENka0RyYWdEcm9wPGFueT4sIGluZGV4OiBudW1iZXIsIGlzUGxhY2Vob2xkZXIgPSB0cnVlKSB7XG4gICAgaWYgKGlzUGxhY2Vob2xkZXIpIHtcbiAgICAgIHRoaXMuYW5hbHlzaXNTZXJ2aWNlLmFkZENoYXJ0KGluZGV4LCBbZXZlbnQuaXRlbS5kYXRhXSk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuYW5hbHlzaXNTZXJ2aWNlLmFkZFRyZW5kKGluZGV4LCBldmVudC5pdGVtLmRhdGEpO1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImhlYWRlclwiPlxuICA8cD5OZXcgQW5hbHlzaXM8L3A+XG4gIDxkaXYgY2xhc3M9XCJidXR0b25zXCI+XG4gICAgPHh1aS1idXR0b24+PHh1aS1pY29uIGljb249XCJhZGRfY2lyY2xlXCI+PC94dWktaWNvbj4gTmV3PC94dWktYnV0dG9uPlxuICAgIDx4dWktYnV0dG9uPjx4dWktaWNvbiBpY29uPVwic2F2ZVwiPjwveHVpLWljb24+IFNhdmU8L3h1aS1idXR0b24+XG4gICAgPHh1aS1idXR0b24+PHh1aS1pY29uIGljb249XCJmaWxlX29wZW5cIj48L3h1aS1pY29uPiBMb2FkPC94dWktYnV0dG9uPlxuXG4gICAgPHh1aS1idXR0b24+PHh1aS1pY29uIGljb249XCJmaWxlX3NhdmVcIj48L3h1aS1pY29uPiBFeHBvcnQ8L3h1aS1idXR0b24+XG4gICAgPHh1aS1idXR0b24+PHh1aS1pY29uIGljb249XCJzaGFyZVwiPjwveHVpLWljb24+IFNoYXJlPC94dWktYnV0dG9uPlxuXG4gICAgPHh1aS1idXR0b24gW2Nka01lbnVUcmlnZ2VyRm9yXT1cIm1vcmVNZW51XCI+TW9yZSA8eHVpLWljb24gaWNvbj1cImFycm93X2Ryb3BfZG93blwiPjwveHVpLWljb24+PC94dWktYnV0dG9uPlxuXG4gICAgPG5nLXRlbXBsYXRlICNtb3JlTWVudT5cbiAgICAgIDx4dWktY29udGV4dC1tZW51IGNka01lbnU+XG4gICAgICAgIDx4dWktYnV0dG9uIGNka01lbnVJdGVtPlNhdmUgYXMgLi4uPC94dWktYnV0dG9uPlxuICAgICAgICA8eHVpLWJ1dHRvbiBjZGtNZW51SXRlbSBjb2xvcj1cImVycm9yXCI+XG4gICAgICAgICAgRGVsZXRlXG4gICAgICAgICAgPHh1aS1pY29uIGljb249XCJkZWxldGUtb3V0bGluZVwiPjwveHVpLWljb24+XG4gICAgICAgIDwveHVpLWJ1dHRvbj5cbiAgICAgIDwveHVpLWNvbnRleHQtbWVudT5cbiAgICA8L25nLXRlbXBsYXRlPlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48ZGl2IGNsYXNzPVwiY29udGVudFwiIGNka0Ryb3BMaXN0R3JvdXA+XG4gIDxkaXYgY2xhc3M9XCJkcmF3ZXJcIiBbY2xhc3MuY2xvc2VkXT1cImNsb3NlZFwiPlxuICAgIDx4dWktdGFiLWdyb3VwPlxuICAgICAgPHh1aS10YWIgdGl0bGU9XCJNZXRyaWNzXCI+XG4gICAgICAgIDx4dWktbWV0cmljcyBbZW50aXRpZXNdPVwiZW50aXRpZXNcIj48L3h1aS1tZXRyaWNzPlxuICAgICAgPC94dWktdGFiPlxuICAgICAgPHh1aS10YWIgdGl0bGU9XCJEYXRhXCI+RGF0YTwveHVpLXRhYj5cbiAgICA8L3h1aS10YWItZ3JvdXA+XG5cbiAgICA8eHVpLWJ1dHRvbiBjbGFzcz1cInRvZ2dsZVwiIHR5cGU9XCJpY29uXCIgKGNsaWNrKT1cImNsb3NlZCA9ICFjbG9zZWRcIj5cbiAgICAgIDx4dWktaWNvbiBbaWNvbl09XCJjbG9zZWQgPyAnY2hldnJvbi1kb3VibGUtcmlnaHQnIDogJ2NoZXZyb24tZG91YmxlLWxlZnQnXCI+PC94dWktaWNvbj5cbiAgICA8L3h1aS1idXR0b24+XG4gIDwvZGl2PlxuXG4gIDxkaXYgY2xhc3M9XCJjaGFydHNcIj5cbiAgICA8ZGl2IGNsYXNzPVwicGxhY2Vob2xkZXJcIiBjZGtEcm9wTGlzdCAoY2RrRHJvcExpc3REcm9wcGVkKT1cImRyb3BwZWQoJGV2ZW50LCAwKVwiICpuZ0lmPVwiaXNEcmFnZ2luZygpXCI+XG4gICAgICBEcm9wIEhlcmUgdG8gQWRkIE1ldHJpY1xuICAgIDwvZGl2PlxuXG4gICAgQGZvciAoY2hhcnQgb2YgY2hhcnRzOyB0cmFjayBjaGFydDsgbGV0IGkgPSAkaW5kZXgpIHtcbiAgICAgIDxuZy1jb250YWluZXI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJwbGFjZWhvbGRlci1ncm91cFwiPlxuICAgICAgICAgIDx4dWktYW5hbHlzaXMtY2hhcnQgW2luZGV4XT1cImlcIiBjZGtEcm9wTGlzdCAvPlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJwbGFjZWhvbGRlclwiIGNka0Ryb3BMaXN0IChjZGtEcm9wTGlzdERyb3BwZWQpPVwiZHJvcHBlZCgkZXZlbnQsIGksIGZhbHNlKVwiICpuZ0lmPVwiaXNEcmFnZ2luZygpXCI+XG4gICAgICAgICAgICBEcm9wIEhlcmUgdG8gQWRkIE1ldHJpY1xuICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2Rpdj5cblxuICAgICAgICA8ZGl2IGNsYXNzPVwicGxhY2Vob2xkZXJcIiBjZGtEcm9wTGlzdCAoY2RrRHJvcExpc3REcm9wcGVkKT1cImRyb3BwZWQoJGV2ZW50LCBpICsgMSlcIiAqbmdJZj1cImlzRHJhZ2dpbmcoKVwiPlxuICAgICAgICAgIERyb3AgSGVyZSB0byBBZGQgTWV0cmljXG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgfVxuICA8L2Rpdj5cbjwvZGl2PlxuIl19