ngx-input-color
Version:
Angular color input component and color picker (with HSL, HSV, RGB, CMYK, HEX, alpha, eye-dropper, etc)
80 lines • 17.6 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { NgxColor } from '../../../utils/color-helper';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "../../../slider/slider.component";
export class CmykComponent {
set color(c) {
if (c.equals(this.inputColor))
return;
this.inputColor = c;
const cmyk = c.toCmyk();
this.cyan = cmyk.c;
this.magenta = cmyk.m;
this.yellow = cmyk.y;
this.key = cmyk.k;
this.updateSliderBackgrounds(cmyk);
}
constructor() {
this.cyanSliderBackground = '';
this.magentaSliderBackground = '';
this.yellowSliderBackground = '';
this.keySliderBackground = '';
this.cyan = 0;
this.magenta = 0;
this.yellow = 0;
this.key = 0;
this.colorChange = new EventEmitter();
}
ngOnInit() { }
generateColor() {
try {
const cmyk = { c: this.cyan, m: this.magenta, y: this.yellow, k: this.key };
const color = new NgxColor(cmyk);
this.updateSliderBackgrounds(cmyk);
if (color.equals(this.inputColor) == false) {
this.inputColor = color;
this.colorChange.emit(color);
}
}
catch (error) {
this.colorChange.emit(undefined);
}
}
updateSliderBackgrounds(cmyk) {
this.cyanSliderBackground = this.getChannelGradient('c', cmyk);
this.magentaSliderBackground = this.getChannelGradient('m', cmyk);
this.yellowSliderBackground = this.getChannelGradient('y', cmyk);
this.keySliderBackground = this.getChannelGradient('k', cmyk);
}
getChannelGradient(channel, cmyk) {
let baseColor = this.cloneColor(cmyk);
baseColor[channel] = channel == 'k' ? 1 : 0;
let startColor = NgxColor.cmykToRgba(baseColor);
let s = `rgb(${startColor.r}, ${startColor.g}, ${startColor.b})`;
baseColor[channel] = 100;
let endColor = NgxColor.cmykToRgba(baseColor);
let e = `rgb(${endColor.r}, ${endColor.g}, ${endColor.b})`;
return `linear-gradient(to right, ${s},${e})`;
}
isCmykEqual(a, b) {
if (!a || !b)
return false;
return a.c === b.c && a.m === b.m && a.y === b.y && a.k === b.k;
}
cloneColor(cmyk) {
return JSON.parse(JSON.stringify(cmyk));
// return Object.assign({}, cmyk);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CmykComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CmykComponent, selector: "app-cmyk", inputs: { color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<slider\r\n [(ngModel)]=\"cyan\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"cyanSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Cyan</span>\r\n <input type=\"number\" [(ngModel)]=\"cyan\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"magenta\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"magentaSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Magenta</span>\r\n <input type=\"number\" [(ngModel)]=\"magenta\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"yellow\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"yellowSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Yellow</span>\r\n <input type=\"number\" [(ngModel)]=\"yellow\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"key\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"keySliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Key</span>\r\n <input type=\"number\" [(ngModel)]=\"key\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:40px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SliderComponent, selector: "slider", inputs: ["step", "min", "max", "background", "isBgTransparent"], outputs: ["change"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CmykComponent, decorators: [{
type: Component,
args: [{ selector: 'app-cmyk', template: "<slider\r\n [(ngModel)]=\"cyan\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"cyanSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Cyan</span>\r\n <input type=\"number\" [(ngModel)]=\"cyan\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"magenta\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"magentaSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Magenta</span>\r\n <input type=\"number\" [(ngModel)]=\"magenta\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"yellow\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"yellowSliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Yellow</span>\r\n <input type=\"number\" [(ngModel)]=\"yellow\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n<slider\r\n [(ngModel)]=\"key\"\r\n [min]=\"0\"\r\n [max]=\"100\"\r\n [step]=\"1\"\r\n (change)=\"generateColor()\"\r\n [background]=\"keySliderBackground\">\r\n <div class=\"slider-title\">\r\n <span>Key</span>\r\n <input type=\"number\" [(ngModel)]=\"key\" min=\"0\" max=\"100\" step=\"1\" />\r\n </div>\r\n</slider>\r\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:40px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"] }]
}], ctorParameters: () => [], propDecorators: { color: [{
type: Input
}], colorChange: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY215ay5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtaW5wdXQtY29sb3Ivc3JjL2xpYi9pbnNwZWN0b3JzL2NteWsvY215ay5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtaW5wdXQtY29sb3Ivc3JjL2xpYi9pbnNwZWN0b3JzL2NteWsvY215ay5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQzs7OztBQVF2RCxNQUFNLE9BQU8sYUFBYTtJQVl4QixJQUFhLEtBQUssQ0FBQyxDQUFXO1FBQzVCLElBQUksQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDO1lBQUUsT0FBTztRQUN0QyxJQUFJLENBQUMsVUFBVSxHQUFHLENBQUMsQ0FBQztRQUNwQixNQUFNLElBQUksR0FBRyxDQUFDLENBQUMsTUFBTSxFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ25CLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQztRQUN0QixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDckIsSUFBSSxDQUFDLEdBQUcsR0FBRyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ2xCLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUNyQyxDQUFDO0lBRUQ7UUF0QkEseUJBQW9CLEdBQUcsRUFBRSxDQUFDO1FBQzFCLDRCQUF1QixHQUFHLEVBQUUsQ0FBQztRQUM3QiwyQkFBc0IsR0FBRyxFQUFFLENBQUM7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LEtBQUssQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ2xFLENBQUM7SUFFTyxVQUFVLENBQUMsSUFBVTtRQUMzQixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ3hDLGtDQUFrQztJQUNwQyxDQUFDOytHQWxFVSxhQUFhO21HQUFiLGFBQWEscUhDVDFCLGsyQ0FnREE7OzRGRHZDYSxhQUFhO2tCQUx6QixTQUFTOytCQUNFLFVBQVU7d0RBZ0JQLEtBQUs7c0JBQWpCLEtBQUs7Z0JBVUksV0FBVztzQkFBcEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTmd4Q29sb3IgfSBmcm9tICcuLi8uLi8uLi91dGlscy9jb2xvci1oZWxwZXInO1xyXG5pbXBvcnQgeyBDTVlLIH0gZnJvbSAnLi4vLi4vLi4vdXRpbHMvaW50ZXJmYWNlcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2FwcC1jbXlrJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vY215ay5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vY215ay5jb21wb25lbnQuc2NzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgQ215a0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgY3lhblNsaWRlckJhY2tncm91bmQgPSAnJztcclxuICBtYWdlbnRhU2xpZGVyQmFja2dyb3VuZCA9ICcnO1xyXG4gIHllbGxvd1NsaWRlckJhY2tncm91bmQgPSAnJztcclxuICBrZXlTbGlkZXJCYWNrZ3JvdW5kID0gJyc7XHJcblxyXG4gIGN5YW46IG51bWJlciA9IDA7XHJcbiAgbWFnZW50YTogbnVtYmVyID0gMDtcclxuICB5ZWxsb3c6IG51bWJlciA9IDA7XHJcbiAga2V5OiBudW1iZXIgPSAwO1xyXG4gIHByaXZhdGUgaW5wdXRDb2xvcj86IE5neENvbG9yO1xyXG5cclxuICBASW5wdXQoKSBzZXQgY29sb3IoYzogTmd4Q29sb3IpIHtcclxuICAgIGlmIChjLmVxdWFscyh0aGlzLmlucHV0Q29sb3IpKSByZXR1cm47XHJcbiAgICB0aGlzLmlucHV0Q29sb3IgPSBjO1xyXG4gICAgY29uc3QgY215ayA9IGMudG9DbXlrKCk7XHJcbiAgICB0aGlzLmN5YW4gPSBjbXlrLmM7XHJcbiAgICB0aGlzLm1hZ2VudGEgPSBjbXlrLm07XHJcbiAgICB0aGlzLnllbGxvdyA9IGNteWsueTtcclxuICAgIHRoaXMua2V5ID0gY215ay5rO1xyXG4gICAgdGhpcy51cGRhdGVTbGlkZXJCYWNrZ3JvdW5kcyhjbXlrKTtcclxuICB9XHJcbiAgQE91dHB1dCgpIGNvbG9yQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxOZ3hDb2xvciB8IHVuZGVmaW5lZD4oKTtcclxuICBjb25zdHJ1Y3RvcigpIHt9XHJcblxyXG4gIG5nT25Jbml0KCkge31cclxuICBnZW5lcmF0ZUNvbG9yKCkge1xyXG4gICAgdHJ5IHtcclxuICAgICAgY29uc3QgY215azogQ01ZSyA9IHsgYzogdGhpcy5jeWFuLCBtOiB0aGlzLm1hZ2VudGEsIHk6IHRoaXMueWVsbG93LCBrOiB0aGlzLmtleSB9O1xyXG4gICAgICBjb25zdCBjb2xvciA9IG5ldyBOZ3hDb2xvcihjbXlrKTtcclxuICAgICAgdGhpcy51cGRhdGVTbGlkZXJCYWNrZ3JvdW5kcyhjbXlrKTtcclxuICAgICAgaWYgKGNvbG9yLmVxdWFscyh0aGlzLmlucHV0Q29sb3IpID09IGZhbHNlKSB7XHJcbiAgICAgICAgdGhpcy5pbnB1dENvbG9yID0gY29sb3I7XHJcbiAgICAgICAgdGhpcy5jb2xvckNoYW5nZS5lbWl0KGNvbG9yKTtcclxuICAgICAgfVxyXG4gICAgfSBjYXRjaCAoZXJyb3IpIHtcclxuICAgICAgdGhpcy5jb2xvckNoYW5nZS5lbWl0KHVuZGVmaW5lZCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIHVwZGF0ZVNsaWRlckJhY2tncm91bmRzKGNteWs6IENNWUspIHtcclxuICAgIHRoaXMuY3lhblNsaWRlckJhY2tncm91bmQgPSB0aGlzLmdldENoYW5uZWxHcmFkaWVudCgnYycsIGNteWspO1xyXG4gICAgdGhpcy5tYWdlbnRhU2xpZGVyQmFja2dyb3VuZCA9IHRoaXMuZ2V0Q2hhbm5lbEdyYWRpZW50KCdtJywgY215ayk7XHJcbiAgICB0aGlzLnllbGxvd1NsaWRlckJhY2tncm91bmQgPSB0aGlzLmdldENoYW5uZWxHcmFkaWVudCgneScsIGNteWspO1xyXG4gICAgdGhpcy5rZXlTbGlkZXJCYWNrZ3JvdW5kID0gdGhpcy5nZXRDaGFubmVsR3JhZGllbnQoJ2snLCBjbXlrKTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgZ2V0Q2hhbm5lbEdyYWRpZW50KGNoYW5uZWw6IGtleW9mIENNWUssIGNteWs6IENNWUspOiBzdHJpbmcge1xyXG4gICAgbGV0IGJhc2VDb2xvciA9IHRoaXMuY2xvbmVDb2xvcihjbXlrKTtcclxuICAgIGJhc2VDb2xvcltjaGFubmVsXSA9IGNoYW5uZWwgPT0gJ2snID8gMSA6IDA7XHJcbiAgICBsZXQgc3RhcnRDb2xvciA9IE5neENvbG9yLmNteWtUb1JnYmEoYmFzZUNvbG9yKTtcclxuICAgIGxldCBzID0gYHJnYigke3N0YXJ0Q29sb3Iucn0sICR7c3RhcnRDb2xvci5nfSwgJHtzdGFydENvbG9yLmJ9KWA7XHJcbiAgICBiYXNlQ29sb3JbY2hhbm5lbF0gPSAxMDA7XHJcbiAgICBsZXQgZW5kQ29sb3IgPSBOZ3hDb2xvci5jbXlrVG9SZ2JhKGJhc2VDb2xvcik7XHJcbiAgICBsZXQgZSA9IGByZ2IoJHtlbmRDb2xvci5yfSwgJHtlbmRDb2xvci5nfSwgJHtlbmRDb2xvci5ifSlgO1xyXG5cclxuICAgIHJldHVybiBgbGluZWFyLWdyYWRpZW50KHRvIHJpZ2h0LCAgJHtzfSwke2V9KWA7XHJcbiAgfVxyXG4gIHByaXZhdGUgaXNDbXlrRXF1YWwoYT86IENNWUssIGI/OiBDTVlLKTogYm9vbGVhbiB7XHJcbiAgICBpZiAoIWEgfHwgIWIpIHJldHVybiBmYWxzZTtcclxuICAgIHJldHVybiBhLmMgPT09IGIuYyAmJiBhLm0gPT09IGIubSAmJiBhLnkgPT09IGIueSAmJiBhLmsgPT09IGIuaztcclxuICB9XHJcblxyXG4gIHByaXZhdGUgY2xvbmVDb2xvcihjbXlrOiBDTVlLKTogQ01ZSyB7XHJcbiAgICByZXR1cm4gSlNPTi5wYXJzZShKU09OLnN0cmluZ2lmeShjbXlrKSk7XHJcbiAgICAvLyByZXR1cm4gT2JqZWN0LmFzc2lnbih7fSwgY215ayk7XHJcbiAgfVxyXG59XHJcbiIsIjxzbGlkZXJcclxuICBbKG5nTW9kZWwpXT1cImN5YW5cIlxyXG4gIFttaW5dPVwiMFwiXHJcbiAgW21heF09XCIxMDBcIlxyXG4gIFtzdGVwXT1cIjFcIlxyXG4gIChjaGFuZ2UpPVwiZ2VuZXJhdGVDb2xvcigpXCJcclxuICBbYmFja2dyb3VuZF09XCJjeWFuU2xpZGVyQmFja2dyb3VuZFwiPlxyXG4gIDxkaXYgY2xhc3M9XCJzbGlkZXItdGl0bGVcIj5cclxuICAgIDxzcGFuPkN5YW48L3NwYW4+XHJcbiAgICA8aW5wdXQgdHlwZT1cIm51bWJlclwiIFsobmdNb2RlbCldPVwiY3lhblwiIG1pbj1cIjBcIiBtYXg9XCIxMDBcIiBzdGVwPVwiMVwiIC8+XHJcbiAgPC9kaXY+XHJcbjwvc2xpZGVyPlxyXG48c2xpZGVyXHJcbiAgWyhuZ01vZGVsKV09XCJtYWdlbnRhXCJcclxuICBbbWluXT1cIjBcIlxyXG4gIFttYXhdPVwiMTAwXCJcclxuICBbc3RlcF09XCIxXCJcclxuICAoY2hhbmdlKT1cImdlbmVyYXRlQ29sb3IoKVwiXHJcbiAgW2JhY2tncm91bmRdPVwibWFnZW50YVNsaWRlckJhY2tncm91bmRcIj5cclxuICA8ZGl2IGNsYXNzPVwic2xpZGVyLXRpdGxlXCI+XHJcbiAgICA8c3Bhbj5NYWdlbnRhPC9zcGFuPlxyXG4gICAgPGlucHV0IHR5cGU9XCJudW1iZXJcIiBbKG5nTW9kZWwpXT1cIm1hZ2VudGFcIiBtaW49XCIwXCIgbWF4PVwiMTAwXCIgc3RlcD1cIjFcIiAvPlxyXG4gIDwvZGl2PlxyXG48L3NsaWRlcj5cclxuPHNsaWRlclxyXG4gIFsobmdNb2RlbCldPVwieWVsbG93XCJcclxuICBbbWluXT1cIjBcIlxyXG4gIFttYXhdPVwiMTAwXCJcclxuICBbc3RlcF09XCIxXCJcclxuICAoY2hhbmdlKT1cImdlbmVyYXRlQ29sb3IoKVwiXHJcbiAgW2JhY2tncm91bmRdPVwieWVsbG93U2xpZGVyQmFja2dyb3VuZFwiPlxyXG4gIDxkaXYgY2xhc3M9XCJzbGlkZXItdGl0bGVcIj5cclxuICAgIDxzcGFuPlllbGxvdzwvc3Bhbj5cclxuICAgIDxpbnB1dCB0eXBlPVwibnVtYmVyXCIgWyhuZ01vZGVsKV09XCJ5ZWxsb3dcIiBtaW49XCIwXCIgbWF4PVwiMTAwXCIgc3RlcD1cIjFcIiAvPlxyXG4gIDwvZGl2PlxyXG48L3NsaWRlcj5cclxuPHNsaWRlclxyXG4gIFsobmdNb2RlbCldPVwia2V5XCJcclxuICBbbWluXT1cIjBcIlxyXG4gIFttYXhdPVwiMTAwXCJcclxuICBbc3RlcF09XCIxXCJcclxuICAoY2hhbmdlKT1cImdlbmVyYXRlQ29sb3IoKVwiXHJcbiAgW2JhY2tncm91bmRdPVwia2V5U2xpZGVyQmFja2dyb3VuZFwiPlxyXG4gIDxkaXYgY2xhc3M9XCJzbGlkZXItdGl0bGVcIj5cclxuICAgIDxzcGFuPktleTwvc3Bhbj5cclxuICAgIDxpbnB1dCB0eXBlPVwibnVtYmVyXCIgWyhuZ01vZGVsKV09XCJrZXlcIiBtaW49XCIwXCIgbWF4PVwiMTAwXCIgc3RlcD1cIjFcIiAvPlxyXG4gIDwvZGl2PlxyXG48L3NsaWRlcj5cclxuIl19