@dotglitch/ngx-common
Version:
Angular components and utilities that are commonly used.
138 lines • 24.1 kB
JavaScript
import { NgTemplateOutlet } from '@angular/common';
import { Component, ContentChild, EventEmitter, Input, Output, TemplateRef } from '@angular/core';
import * as i0 from "@angular/core";
export class ParallaxCardComponent {
get wrapper() { return this.element.nativeElement; }
get cardFront() { return this.wrapper.querySelector('.card.front'); }
get cardBack() { return this.wrapper.querySelector('.card.backface'); }
get backgroundElement() { return this.cardFront.querySelector('.card-bg'); }
get backfaceBackgroundElement() { return this.cardBack.querySelector('.card-bg'); }
constructor(element, ngZone) {
this.element = element;
this.ngZone = ngZone;
/**
*
*/
this.loaded = new EventEmitter();
/**
* Width of the card
* @default `240px`
*/
this.width = '240px';
/**
* Height of the card
* @default `320px`
*/
this.height = '320px';
/**
* Inset padding of the parallax
* @default 80
*/
this.bgInset = 80;
/**
* Duration for the flip animation in ms
* @default 1200
*/
this.flipAnimationDuration = 1200;
this.renderCardFront = true;
this.renderCardBack = true;
this.showBackOfCard = false;
this.pointerX = 0;
this.pointerY = 0;
this.pointerLeave = 0;
this.render = () => {
const { width, height } = this.wrapper.getBoundingClientRect();
const mousePX = this.pointerX / width;
const mousePY = this.pointerY / height;
// Rotation factors
const rX = mousePX * this.bgInset / 1.75;
const rY = mousePY * -this.bgInset / 1.75;
// Translation factors
const tX = mousePX * -this.bgInset * 2;
const tY = mousePY * -this.bgInset * 2;
if (this.renderCardFront) {
this.backgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
}
if (this.renderCardBack) {
this.backfaceBackgroundElement.style.transform = `translateX(${tX}px) translateY(${tY}px)`;
}
if (this.showBackOfCard) {
this.cardFront.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
this.cardBack.style.transform = `rotateY(${-rX}deg) rotateX(${-rY}deg)`;
}
else {
this.cardFront.style.transform = `rotateY(${rX}deg) rotateX(${rY}deg)`;
this.cardBack.style.transform = `rotateY(180deg) rotateX(${-rY}deg)`;
}
};
}
ngAfterViewInit() {
const el = this.wrapper;
this.ngZone.runOutsideAngular(() => {
// Directly attach events to the wrapper
el.onpointermove = (e) => this.onPointerMove(e);
el.onpointerenter = () => this.onPointerEnter();
el.onpointerleave = () => this.onPointerLeave();
});
el.onclick = () => this.onClick();
this.loaded.emit();
}
onPointerMove(e) {
const { width, height, left, top } = this.wrapper.getBoundingClientRect();
this.pointerX = e.pageX - left - (width / 2);
this.pointerY = e.pageY - top - (height / 2);
this.render();
}
onPointerEnter() {
clearTimeout(this.pointerLeave);
}
onPointerLeave() {
this.pointerLeave = setTimeout(() => {
this.pointerX = 0;
this.pointerY = 0;
this.render();
}, 600);
}
// TODO: This can get intercepted in some states
onClick() {
this.showBackOfCard = !this.showBackOfCard;
this.render();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.2", type: ParallaxCardComponent, isStandalone: true, selector: "ngx-parallax-card", inputs: { width: "width", height: "height", bgInset: "bgInset", flipAnimationDuration: "flipAnimationDuration" }, outputs: { loaded: "loaded" }, host: { properties: { "style.width": "width", "style.height": "height", "style.--card-bg-inset": "-bgInset+\"px\"", "style.--flip-animation-duration": "flipAnimationDuration+\"ms\"", "class.flip": "showBackOfCard" } }, queries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: TemplateRef }, { propertyName: "background", first: true, predicate: ["background"], descendants: true, read: TemplateRef }, { propertyName: "backContent", first: true, predicate: ["backContent"], descendants: true, read: TemplateRef }, { propertyName: "backBackground", first: true, predicate: ["backBackground"], descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d;will-change:transform}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: ParallaxCardComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-parallax-card', imports: [
NgTemplateOutlet
], host: {
'[style.width]': 'width',
'[style.height]': 'height',
'[style.--card-bg-inset]': '-bgInset+"px"',
'[style.--flip-animation-duration]': 'flipAnimationDuration+"ms"',
'[class.flip]': 'showBackOfCard'
}, standalone: true, template: "@if (renderCardBack) {\n <div class=\"card backface\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"backBackground\" />\n </div>\n <div class=\"card-content\">\n <ng-template [ngTemplateOutlet]=\"backContent\" />\n </div>\n </div>\n}\n\n@if (renderCardFront) {\n <div class=\"card front\">\n <div class=\"card-bg\" style=\"transform: translateX(0) translateY(0)\">\n <ng-template [ngTemplateOutlet]=\"background\" />\n </div>\n <div class=\"card-content\">\n @if (content) {\n <ng-template [ngTemplateOutlet]=\"content\"/>\n }\n @else {\n <ng-content/>\n }\n </div>\n </div>\n}\n\n\n", styles: [":host{display:block;position:relative;cursor:pointer;--easing-function: cubic-bezier(.23, 1, .32, 1);--border-radius: 9px}.card{position:absolute;height:100%;width:100%;background-color:#333;backface-visibility:hidden;overflow:hidden;box-shadow:#0000 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px;border-radius:var(--border-radius);transition:transform var(--flip-animation-duration) var(--easing-function),box-shadow 2s var(--easing-function);transform-style:preserve-3d;will-change:transform}.card:hover{box-shadow:#fff6 0 0 40px 5px,#000000a8 0 30px 60px,inset #333 0 0 0 5px}.card:hover .card-content{border:2px solid #fff}.card-bg{inset:var(--card-bg-inset);position:absolute;pointer-events:none;transition:transform .6s var(--easing-function)}.card-content{position:absolute;top:0;color:#fff;height:100%;width:100%;z-index:1;border:2px solid rgba(255,255,255,0);border-radius:var(--border-radius);transition:transform .6s var(--easing-function),border-color .6s var(--easing-function)}\n"] }]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { content: [{
type: ContentChild,
args: ['content', { read: TemplateRef }]
}], background: [{
type: ContentChild,
args: ['background', { read: TemplateRef }]
}], backContent: [{
type: ContentChild,
args: ['backContent', { read: TemplateRef }]
}], backBackground: [{
type: ContentChild,
args: ['backBackground', { read: TemplateRef }]
}], loaded: [{
type: Output
}], width: [{
type: Input
}], height: [{
type: Input
}], bgInset: [{
type: Input
}], flipAnimationDuration: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFyYWxsYXgtY2FyZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21tb24vc3JjL2NvbXBvbmVudHMvcGFyYWxsYXgtY2FyZC9wYXJhbGxheC1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbW1vbi9zcmMvY29tcG9uZW50cy9wYXJhbGxheC1jYXJkL3BhcmFsbGF4LWNhcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDbkQsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsV0FBVyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQXVCdEgsTUFBTSxPQUFPLHFCQUFxQjtJQXdDOUIsSUFBWSxPQUFPLEtBQUssT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLGFBQTRCLENBQUMsQ0FBQyxDQUFDO0lBQzNFLElBQVksU0FBUyxLQUFLLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFnQixDQUFDLENBQUMsQ0FBQztJQUM1RixJQUFZLFFBQVEsS0FBSyxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLGdCQUFnQixDQUFnQixDQUFDLENBQUMsQ0FBQztJQUM5RixJQUFZLGlCQUFpQixLQUFLLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFtQixDQUFDLENBQUMsQ0FBQztJQUN0RyxJQUFZLHlCQUF5QixLQUFLLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFtQixDQUFDLENBQUMsQ0FBQztJQU03RyxZQUNxQixPQUFtQixFQUNuQixNQUFjO1FBRGQsWUFBTyxHQUFQLE9BQU8sQ0FBWTtRQUNu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SUFDakIsQ0FBQzs4R0E3RlEscUJBQXFCO2tHQUFyQixxQkFBcUIsb2dCQUdHLFdBQVcsbUdBQ1IsV0FBVyxxR0FHVixXQUFXLDJHQUNSLFdBQVcsNkJDaEN2RCwwekJBNEJBLHFpQ0RmUSxnQkFBZ0I7OzJGQVdYLHFCQUFxQjtrQkFoQmpDLFNBQVM7K0JBQ0ksbUJBQW1CLFdBR3BCO3dCQUNMLGdCQUFnQjtxQkFDbkIsUUFDSzt3QkFDRixlQUFlLEVBQUUsT0FBTzt3QkFDeEIsZ0JBQWdCLEVBQUUsUUFBUTt3QkFDMUIseUJBQXlCLEVBQUUsZUFBZTt3QkFDMUMsbUNBQW1DLEVBQUUsNEJBQTRCO3dCQUNqRSxjQUFjLEVBQUUsZ0JBQWdCO3FCQUNuQyxjQUNXLElBQUk7b0dBS2dDLE9BQU87c0JBQXRELFlBQVk7dUJBQUMsU0FBUyxFQUFFLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtnQkFDSyxVQUFVO3NCQUE1RCxZQUFZO3VCQUFDLFlBQVksRUFBRSxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7Z0JBR0csV0FBVztzQkFBOUQsWUFBWTt1QkFBQyxhQUFhLEVBQUUsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFO2dCQUNLLGNBQWM7c0JBQXBFLFlBQVk7dUJBQUMsZ0JBQWdCLEVBQUUsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFO2dCQUszQyxNQUFNO3NCQUFmLE1BQU07Z0JBTUUsS0FBSztzQkFBYixLQUFLO2dCQUtHLE1BQU07c0JBQWQsS0FBSztnQkFLRyxPQUFPO3NCQUFmLEtBQUs7Z0JBS0cscUJBQXFCO3NCQUE3QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdUZW1wbGF0ZU91dGxldCB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIENvbnRlbnRDaGlsZCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgTmdab25lLCBPdXRwdXQsIFRlbXBsYXRlUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbnR5cGUgQ1NTVW5pdFN0cmluZyA9ICdweCcgfCAnJScgfCAnZW0nIHwgJ2luJyB8ICcnO1xudHlwZSBDU1NVbml0ID0gYCR7bnVtYmVyfSR7Q1NTVW5pdFN0cmluZ31gIHwgYHZhcigtLSR7c3RyaW5nfSlgO1xudHlwZSBDU1NTdHJpbmcgPSBDU1NVbml0IHxcbiAgICBgY2FsYygke0NTU1VuaXR8Jyd9JHsnJ3wnICd9JHsnKyd8Jy0nfCcvJ3wnKid9JHsnJ3wnICd9JHtDU1NVbml0fCcnfSlgXG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnbmd4LXBhcmFsbGF4LWNhcmQnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9wYXJhbGxheC1jYXJkLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9wYXJhbGxheC1jYXJkLmNvbXBvbmVudC5zY3NzJ10sXG4gICAgaW1wb3J0czogW1xuICAgICAgICBOZ1RlbXBsYXRlT3V0bGV0XG4gICAgXSxcbiAgICBob3N0OiB7XG4gICAgICAgICdbc3R5bGUud2lkdGhdJzogJ3dpZHRoJyxcbiAgICAgICAgJ1tzdHlsZS5oZWlnaHRdJzogJ2hlaWdodCcsXG4gICAgICAgICdbc3R5bGUuLS1jYXJkLWJnLWluc2V0XSc6ICctYmdJbnNldCtcInB4XCInLFxuICAgICAgICAnW3N0eWxlLi0tZmxpcC1hbmltYXRpb24tZHVyYXRpb25dJzogJ2ZsaXBBbmltYXRpb25EdXJhdGlvbitcIm1zXCInLFxuICAgICAgICAnW2NsYXNzLmZsaXBdJzogJ3Nob3dCYWNrT2ZDYXJkJ1xuICAgIH0sXG4gICAgc3RhbmRhbG9uZTogdHJ1ZVxufSlcbmV4cG9ydCBjbGFzcyBQYXJhbGxheENhcmRDb21wb25lbnQge1xuXG4gICAgLy8gRnJvbnQgb2YgY2FyZFxuICAgIEBDb250ZW50Q2hpbGQoJ2NvbnRlbnQnLCB7IHJlYWQ6IFRlbXBsYXRlUmVmIH0pIGNvbnRlbnQ6IFRlbXBsYXRlUmVmPEVsZW1lbnRSZWY+O1xuICAgIEBDb250ZW50Q2hpbGQoJ2JhY2tncm91bmQnLCB7IHJlYWQ6IFRlbXBsYXRlUmVmIH0pIGJhY2tncm91bmQ6IFRlbXBsYXRlUmVmPEVsZW1lbnRSZWY+O1xuXG4gICAgLy8gQmFjayBvZiBjYXJkXG4gICAgQENvbnRlbnRDaGlsZCgnYmFja0NvbnRlbnQnLCB7IHJlYWQ6IFRlbXBsYXRlUmVmIH0pIGJhY2tDb250ZW50OiBUZW1wbGF0ZVJlZjxFbGVtZW50UmVmPjtcbiAgICBAQ29udGVudENoaWxkKCdiYWNrQmFja2dyb3VuZCcsIHsgcmVhZDogVGVtcGxhdGVSZWYgfSkgYmFja0JhY2tncm91bmQ6IFRlbXBsYXRlUmVmPEVsZW1lbnRSZWY+O1xuXG4gICAgLyoqXG4gICAgICpcbiAgICAgKi9cbiAgICBAT3V0cHV0KCkgbG9hZGVkID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gICAgLyoqXG4gICAgICogV2lkdGggb2YgdGhlIGNhcmRcbiAgICAgKiBAZGVmYXVsdCBgMjQwcHhgXG4gICAgICovXG4gICAgQElucHV0KCkgd2lkdGg6ICBDU1NTdHJpbmcgPSAnMjQwcHgnO1xuICAgIC8qKlxuICAgICAqIEhlaWdodCBvZiB0aGUgY2FyZFxuICAgICAqIEBkZWZhdWx0IGAzMjBweGBcbiAgICAgKi9cbiAgICBASW5wdXQoKSBoZWlnaHQ6IENTU1N0cmluZyA9ICczMjBweCc7XG4gICAgLyoqXG4gICAgICogSW5zZXQgcGFkZGluZyBvZiB0aGUgcGFyYWxsYXhcbiAgICAgKiBAZGVmYXVsdCA4MFxuICAgICAqL1xuICAgIEBJbnB1dCgpIGJnSW5zZXQ6ICBudW1iZXIgPSA4MDtcbiAgICAvKipcbiAgICAgKiBEdXJhdGlvbiBmb3IgdGhlIGZsaXAgYW5pbWF0aW9uIGluIG1zXG4gICAgICogQGRlZmF1bHQgMTIwMFxuICAgICAqL1xuICAgIEBJbnB1dCgpIGZsaXBBbmltYXRpb25EdXJhdGlvbjogIG51bWJlciA9IDEyMDA7XG5cbiAgICByZW5kZXJDYXJkRnJvbnQgPSB0cnVlO1xuICAgIHJlbmRlckNhcmRCYWNrID0gdHJ1ZTtcbiAgICBzaG93QmFja09mQ2FyZCA9IGZhbHNlO1xuXG4gICAgcHJpdmF0ZSBnZXQgd3JhcHBlcigpIHsgcmV0dXJuIHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50IGFzIEhUTUxFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgY2FyZEZyb250KCkgeyByZXR1cm4gdGhpcy53cmFwcGVyLnF1ZXJ5U2VsZWN0b3IoJy5jYXJkLmZyb250JykgYXMgSFRNTEVsZW1lbnQ7IH1cbiAgICBwcml2YXRlIGdldCBjYXJkQmFjaygpIHsgcmV0dXJuIHRoaXMud3JhcHBlci5xdWVyeVNlbGVjdG9yKCcuY2FyZC5iYWNrZmFjZScpIGFzIEhUTUxFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgYmFja2dyb3VuZEVsZW1lbnQoKSB7IHJldHVybiB0aGlzLmNhcmRGcm9udC5xdWVyeVNlbGVjdG9yKCcuY2FyZC1iZycpIGFzIEhUTUxEaXZFbGVtZW50OyB9XG4gICAgcHJpdmF0ZSBnZXQgYmFja2ZhY2VCYWNrZ3JvdW5kRWxlbWVudCgpIHsgcmV0dXJuIHRoaXMuY2FyZEJhY2sucXVlcnlTZWxlY3RvcignLmNhcmQtYmcnKSBhcyBIVE1MRGl2RWxlbWVudDsgfVxuXG4gICAgcHJpdmF0ZSBwb2ludGVyWCA9IDA7XG4gICAgcHJpdmF0ZSBwb2ludGVyWSA9IDA7XG4gICAgcHJpdmF0ZSBwb2ludGVyTGVhdmUgPSAwO1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByaXZhdGUgcmVhZG9ubHkgZWxlbWVudDogRWxlbWVudFJlZixcbiAgICAgICAgcHJpdmF0ZSByZWFkb25seSBuZ1pvbmU6IE5nWm9uZVxuICAgICkgeyB9XG5cbiAgICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgICAgIGNvbnN0IGVsID0gdGhpcy53cmFwcGVyO1xuXG4gICAgICAgIHRoaXMubmdab25lLnJ1bk91dHNpZGVBbmd1bGFyKCgpID0+IHtcbiAgICAgICAgICAgIC8vIERpcmVjdGx5IGF0dGFjaCBldmVudHMgdG8gdGhlIHdyYXBwZXJcbiAgICAgICAgICAgIGVsLm9ucG9pbnRlcm1vdmUgPSAoZSkgPT4gdGhpcy5vblBvaW50ZXJNb3ZlKGUpO1xuICAgICAgICAgICAgZWwub25wb2ludGVyZW50ZXIgPSAoKSA9PiB0aGlzLm9uUG9pbnRlckVudGVyKCk7XG4gICAgICAgICAgICBlbC5vbnBvaW50ZXJsZWF2ZSA9ICgpID0+IHRoaXMub25Qb2ludGVyTGVhdmUoKTtcbiAgICAgICAgfSlcbiAgICAgICAgZWwub25jbGljayA9ICgpID0+IHRoaXMub25DbGljaygpO1xuXG4gICAgICAgIHRoaXMubG9hZGVkLmVtaXQoKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJNb3ZlKGU6IFBvaW50ZXJFdmVudCkge1xuICAgICAgICBjb25zdCB7IHdpZHRoLCBoZWlnaHQsIGxlZnQsIHRvcCB9ID0gdGhpcy53cmFwcGVyLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgICAgICB0aGlzLnBvaW50ZXJYID0gZS5wYWdlWCAtIGxlZnQgLSAod2lkdGggLyAyKTtcbiAgICAgICAgdGhpcy5wb2ludGVyWSA9IGUucGFnZVkgLSB0b3AgLSAoaGVpZ2h0IC8gMik7XG5cbiAgICAgICAgdGhpcy5yZW5kZXIoKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJFbnRlcigpIHtcbiAgICAgICAgY2xlYXJUaW1lb3V0KHRoaXMucG9pbnRlckxlYXZlKTtcbiAgICB9XG5cbiAgICBvblBvaW50ZXJMZWF2ZSgpIHtcbiAgICAgICAgdGhpcy5wb2ludGVyTGVhdmUgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgIHRoaXMucG9pbnRlclggPSAwO1xuICAgICAgICAgICAgdGhpcy5wb2ludGVyWSA9IDA7XG4gICAgICAgICAgICB0aGlzLnJlbmRlcigpO1xuICAgICAgICB9LCA2MDApIGFzIGFueTtcbiAgICB9XG5cbiAgICAvLyBUT0RPOiBUaGlzIGNhbiBnZXQgaW50ZXJjZXB0ZWQgaW4gc29tZSBzdGF0ZXNcbiAgICBvbkNsaWNrKCkge1xuICAgICAgICB0aGlzLnNob3dCYWNrT2ZDYXJkID0gIXRoaXMuc2hvd0JhY2tPZkNhcmQ7XG4gICAgICAgIHRoaXMucmVuZGVyKClcbiAgICB9XG5cbiAgICByZW5kZXIgPSAoKSA9PiB7XG4gICAgICAgIGNvbnN0IHsgd2lkdGgsIGhlaWdodCB9ID0gdGhpcy53cmFwcGVyLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgICAgICBjb25zdCBtb3VzZVBYID0gdGhpcy5wb2ludGVyWCAvIHdpZHRoO1xuICAgICAgICBjb25zdCBtb3VzZVBZID0gdGhpcy5wb2ludGVyWSAvIGhlaWdodDtcblxuICAgICAgICAvLyBSb3RhdGlvbiBmYWN0b3JzXG4gICAgICAgIGNvbnN0IHJYID0gbW91c2VQWCAqIHRoaXMuYmdJbnNldCAvIDEuNzU7XG4gICAgICAgIGNvbnN0IHJZID0gbW91c2VQWSAqIC10aGlzLmJnSW5zZXQgLyAxLjc1O1xuXG4gICAgICAgIC8vIFRyYW5zbGF0aW9uIGZhY3RvcnNcbiAgICAgICAgY29uc3QgdFggPSBtb3VzZVBYICogLXRoaXMuYmdJbnNldCAqIDI7XG4gICAgICAgIGNvbnN0IHRZID0gbW91c2VQWSAqIC10aGlzLmJnSW5zZXQgKiAyO1xuXG4gICAgICAgIGlmICh0aGlzLnJlbmRlckNhcmRGcm9udCkge1xuICAgICAgICAgICAgdGhpcy5iYWNrZ3JvdW5kRWxlbWVudC5zdHlsZS50cmFuc2Zvcm0gPSBgdHJhbnNsYXRlWCgke3RYfXB4KSB0cmFuc2xhdGVZKCR7dFl9cHgpYDtcbiAgICAgICAgfVxuICAgICAgICBpZiAodGhpcy5yZW5kZXJDYXJkQmFjaykge1xuICAgICAgICAgICAgdGhpcy5iYWNrZmFjZUJhY2tncm91bmRFbGVtZW50LnN0eWxlLnRyYW5zZm9ybSA9IGB0cmFuc2xhdGVYKCR7dFh9cHgpIHRyYW5zbGF0ZVkoJHt0WX1weClgO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKHRoaXMuc2hvd0JhY2tPZkNhcmQpIHtcbiAgICAgICAgICAgIHRoaXMuY2FyZEZyb250LnN0eWxlLnRyYW5zZm9ybSA9IGByb3RhdGVZKDE4MGRlZykgcm90YXRlWCgkey1yWX1kZWcpYDtcbiAgICAgICAgICAgIHRoaXMuY2FyZEJhY2suc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoJHstclh9ZGVnKSByb3RhdGVYKCR7LXJZfWRlZylgO1xuICAgICAgICB9XG4gICAgICAgIGVsc2Uge1xuICAgICAgICAgICAgdGhpcy5jYXJkRnJvbnQuc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoJHtyWH1kZWcpIHJvdGF0ZVgoJHtyWX1kZWcpYDtcbiAgICAgICAgICAgIHRoaXMuY2FyZEJhY2suc3R5bGUudHJhbnNmb3JtID0gYHJvdGF0ZVkoMTgwZGVnKSByb3RhdGVYKCR7LXJZfWRlZylgO1xuICAgICAgICB9XG4gICAgfVxufVxuIiwiQGlmIChyZW5kZXJDYXJkQmFjaykge1xuICAgIDxkaXYgY2xhc3M9XCJjYXJkIGJhY2tmYWNlXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWJnXCIgc3R5bGU9XCJ0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMCkgdHJhbnNsYXRlWSgwKVwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImJhY2tCYWNrZ3JvdW5kXCIgLz5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWNvbnRlbnRcIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBbbmdUZW1wbGF0ZU91dGxldF09XCJiYWNrQ29udGVudFwiIC8+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxufVxuXG5AaWYgKHJlbmRlckNhcmRGcm9udCkge1xuICAgIDxkaXYgY2xhc3M9XCJjYXJkIGZyb250XCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWJnXCIgc3R5bGU9XCJ0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMCkgdHJhbnNsYXRlWSgwKVwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImJhY2tncm91bmRcIiAvPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNhcmQtY29udGVudFwiPlxuICAgICAgICAgICAgQGlmIChjb250ZW50KSB7XG4gICAgICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImNvbnRlbnRcIi8+XG4gICAgICAgICAgICB9XG4gICAgICAgICAgICBAZWxzZSB7XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRlbnQvPlxuICAgICAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbn1cblxuXG4iXX0=