@davvidess/angular-split
Version:
Angular UI library to split views and allow dragging to resize areas using CSS flexbox layout.
1,175 lines • 109 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import * as tslib_1 from "tslib";
import { Component, Input, Output, ChangeDetectionStrategy, ChangeDetectorRef, Renderer2, ElementRef, NgZone, ViewChildren, QueryList, EventEmitter, ViewEncapsulation, } from '@angular/core';
import { Observable, Subject } from 'rxjs';
import { debounceTime } from 'rxjs/operators';
import { getInputPositiveNumber, getInputBoolean, isUserSizesValid, getAreaMinSize, getAreaMaxSize, getPointFromEvent, getElementPixelSize, getGutterSideAbsorptionCapacity, updateAreaSize, } from '../utils';
/**
* angular-split
*
*
* PERCENT MODE ([unit]="'percent'")
* ___________________________________________________________________________________________
* | A [g1] B [g2] C [g3] D [g4] E |
* |-------------------------------------------------------------------------------------------|
* | 20 30 20 15 15 | <-- [size]="x"
* | 10px 10px 10px 10px | <-- [gutterSize]="10"
* |calc(20% - 8px) calc(30% - 12px) calc(20% - 8px) calc(15% - 6px) calc(15% - 6px)| <-- CSS flex-basis property (with flex-grow&shrink at 0)
* | 152px 228px 152px 114px 114px | <-- el.getBoundingClientRect().width
* |___________________________________________________________________________________________|
* 800px <-- el.getBoundingClientRect().width
* flex-basis = calc( { area.size }% - { area.size/100 * nbGutter*gutterSize }px );
*
*
* PIXEL MODE ([unit]="'pixel'")
* ___________________________________________________________________________________________
* | A [g1] B [g2] C [g3] D [g4] E |
* |-------------------------------------------------------------------------------------------|
* | 100 250 * 150 100 | <-- [size]="y"
* | 10px 10px 10px 10px | <-- [gutterSize]="10"
* | 0 0 100px 0 0 250px 1 1 auto 0 0 150px 0 0 100px | <-- CSS flex property (flex-grow/flex-shrink/flex-basis)
* | 100px 250px 200px 150px 100px | <-- el.getBoundingClientRect().width
* |___________________________________________________________________________________________|
* 800px <-- el.getBoundingClientRect().width
*
*/
var SplitComponent = /** @class */ (function () {
function SplitComponent(ngZone, elRef, cdRef, renderer) {
this.ngZone = ngZone;
this.elRef = elRef;
this.cdRef = cdRef;
this.renderer = renderer;
this._direction = 'horizontal';
////
this._unit = 'percent';
////
this._gutterSize = 11;
////
this._gutterStep = 1;
////
this._restrictMove = false;
////
this._useTransition = false;
////
this._disabled = false;
////
this._dir = 'ltr';
////
this._gutterDblClickDuration = 0;
////
this.dragStart = new EventEmitter(false);
this.dragEnd = new EventEmitter(false);
this.gutterClick = new EventEmitter(false);
this.gutterDblClick = new EventEmitter(false);
this.dragProgressSubject = new Subject();
this.dragProgress$ = this.dragProgressSubject.asObservable();
////
this.isDragging = false;
this.isWaitingClear = false;
this.dragListeners = [];
this.snapshot = null;
this.startPoint = null;
this.endPoint = null;
this.displayedAreas = [];
this.hidedAreas = [];
this._clickTimeout = null;
// To force adding default class, could be override by user @Input() or not
this.direction = this._direction;
}
Object.defineProperty(SplitComponent.prototype, "direction", {
get: /**
* @return {?}
*/
function () {
return this._direction;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._direction = v === 'vertical' ? 'vertical' : 'horizontal';
this.renderer.addClass(this.elRef.nativeElement, "as-" + this._direction);
this.renderer.removeClass(this.elRef.nativeElement, "as-" + (this._direction === 'vertical' ? 'horizontal' : 'vertical'));
this.build(false, false);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "unit", {
get: /**
* @return {?}
*/
function () {
return this._unit;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._unit = v === 'pixel' ? 'pixel' : 'percent';
this.renderer.addClass(this.elRef.nativeElement, "as-" + this._unit);
this.renderer.removeClass(this.elRef.nativeElement, "as-" + (this._unit === 'pixel' ? 'percent' : 'pixel'));
this.build(false, true);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "gutterSize", {
get: /**
* @return {?}
*/
function () {
return this._gutterSize;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._gutterSize = getInputPositiveNumber(v, 11);
this.build(false, false);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "gutterStep", {
get: /**
* @return {?}
*/
function () {
return this._gutterStep;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._gutterStep = getInputPositiveNumber(v, 1);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "restrictMove", {
get: /**
* @return {?}
*/
function () {
return this._restrictMove;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._restrictMove = getInputBoolean(v);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "useTransition", {
get: /**
* @return {?}
*/
function () {
return this._useTransition;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._useTransition = getInputBoolean(v);
if (this._useTransition)
this.renderer.addClass(this.elRef.nativeElement, 'as-transition');
else
this.renderer.removeClass(this.elRef.nativeElement, 'as-transition');
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "disabled", {
get: /**
* @return {?}
*/
function () {
return this._disabled;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._disabled = getInputBoolean(v);
if (this._disabled)
this.renderer.addClass(this.elRef.nativeElement, 'as-disabled');
else
this.renderer.removeClass(this.elRef.nativeElement, 'as-disabled');
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "dir", {
get: /**
* @return {?}
*/
function () {
return this._dir;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._dir = v === 'rtl' ? 'rtl' : 'ltr';
this.renderer.setAttribute(this.elRef.nativeElement, 'dir', this._dir);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "gutterDblClickDuration", {
get: /**
* @return {?}
*/
function () {
return this._gutterDblClickDuration;
},
set: /**
* @param {?} v
* @return {?}
*/
function (v) {
this._gutterDblClickDuration = getInputPositiveNumber(v, 0);
},
enumerable: true,
configurable: true
});
Object.defineProperty(SplitComponent.prototype, "transitionEnd", {
get: /**
* @return {?}
*/
function () {
var _this = this;
return new Observable((/**
* @param {?} subscriber
* @return {?}
*/
function (subscriber) { return (_this.transitionEndSubscriber = subscriber); })).pipe(debounceTime(20));
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
SplitComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
var _this = this;
this.ngZone.runOutsideAngular((/**
* @return {?}
*/
function () {
// To avoid transition at first rendering
setTimeout((/**
* @return {?}
*/
function () { return _this.renderer.addClass(_this.elRef.nativeElement, 'as-init'); }));
}));
};
/**
* @private
* @return {?}
*/
SplitComponent.prototype.getNbGutters = /**
* @private
* @return {?}
*/
function () {
return this.displayedAreas.length === 0 ? 0 : this.displayedAreas.length - 1;
};
/**
* @param {?} component
* @return {?}
*/
SplitComponent.prototype.addArea = /**
* @param {?} component
* @return {?}
*/
function (component) {
/** @type {?} */
var newArea = {
component: component,
order: 0,
size: 0,
minSize: null,
maxSize: null,
};
if (component.visible === true) {
this.displayedAreas.push(newArea);
this.build(true, true);
}
else {
this.hidedAreas.push(newArea);
}
};
/**
* @param {?} component
* @return {?}
*/
SplitComponent.prototype.removeArea = /**
* @param {?} component
* @return {?}
*/
function (component) {
if (this.displayedAreas.some((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === component; }))) {
/** @type {?} */
var area = this.displayedAreas.find((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === component; }));
this.displayedAreas.splice(this.displayedAreas.indexOf(area), 1);
this.build(true, true);
}
else if (this.hidedAreas.some((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === component; }))) {
/** @type {?} */
var area = this.hidedAreas.find((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === component; }));
this.hidedAreas.splice(this.hidedAreas.indexOf(area), 1);
}
};
/**
* @param {?} component
* @param {?} resetOrders
* @param {?} resetSizes
* @return {?}
*/
SplitComponent.prototype.updateArea = /**
* @param {?} component
* @param {?} resetOrders
* @param {?} resetSizes
* @return {?}
*/
function (component, resetOrders, resetSizes) {
if (component.visible === true) {
this.build(resetOrders, resetSizes);
}
};
/**
* @param {?} component
* @return {?}
*/
SplitComponent.prototype.showArea = /**
* @param {?} component
* @return {?}
*/
function (component) {
var _a;
/** @type {?} */
var area = this.hidedAreas.find((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === component; }));
if (area === undefined) {
return;
}
/** @type {?} */
var areas = this.hidedAreas.splice(this.hidedAreas.indexOf(area), 1);
(_a = this.displayedAreas).push.apply(_a, tslib_1.__spread(areas));
this.build(true, true);
};
/**
* @param {?} comp
* @return {?}
*/
SplitComponent.prototype.hideArea = /**
* @param {?} comp
* @return {?}
*/
function (comp) {
var _a;
/** @type {?} */
var area = this.displayedAreas.find((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component === comp; }));
if (area === undefined) {
return;
}
/** @type {?} */
var areas = this.displayedAreas.splice(this.displayedAreas.indexOf(area), 1);
areas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
area.order = 0;
area.size = 0;
}));
(_a = this.hidedAreas).push.apply(_a, tslib_1.__spread(areas));
this.build(true, true);
};
/**
* @return {?}
*/
SplitComponent.prototype.getVisibleAreaSizes = /**
* @return {?}
*/
function () {
return this.displayedAreas.map((/**
* @param {?} a
* @return {?}
*/
function (a) { return (a.size === null ? '*' : a.size); }));
};
/**
* @param {?} sizes
* @return {?}
*/
SplitComponent.prototype.setVisibleAreaSizes = /**
* @param {?} sizes
* @return {?}
*/
function (sizes) {
if (sizes.length !== this.displayedAreas.length) {
return false;
}
/** @type {?} */
var formatedSizes = sizes.map((/**
* @param {?} s
* @return {?}
*/
function (s) { return getInputPositiveNumber(s, null); }));
/** @type {?} */
var isValid = isUserSizesValid(this.unit, formatedSizes);
if (isValid === false) {
return false;
}
// @ts-ignore
this.displayedAreas.forEach((/**
* @param {?} area
* @param {?} i
* @return {?}
*/
function (area, i) { return (area.component._size = formatedSizes[i]); }));
this.build(false, true);
return true;
};
/**
* @private
* @param {?} resetOrders
* @param {?} resetSizes
* @return {?}
*/
SplitComponent.prototype.build = /**
* @private
* @param {?} resetOrders
* @param {?} resetSizes
* @return {?}
*/
function (resetOrders, resetSizes) {
this.stopDragging();
// ¤ AREAS ORDER
if (resetOrders === true) {
// If user provided 'order' for each area, use it to sort them.
if (this.displayedAreas.every((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component.order !== null; }))) {
this.displayedAreas.sort((/**
* @param {?} a
* @param {?} b
* @return {?}
*/
function (a, b) { return (/** @type {?} */ (a.component.order)) - (/** @type {?} */ (b.component.order)); }));
}
// Then set real order with multiples of 2, numbers between will be used by gutters.
this.displayedAreas.forEach((/**
* @param {?} area
* @param {?} i
* @return {?}
*/
function (area, i) {
area.order = i * 2;
area.component.setStyleOrder(area.order);
}));
}
// ¤ AREAS SIZE
if (resetSizes === true) {
/** @type {?} */
var useUserSizes_1 = isUserSizesValid(this.unit, this.displayedAreas.map((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component.size; })));
switch (this.unit) {
case 'percent': {
/** @type {?} */
var defaultSize_1 = 100 / this.displayedAreas.length;
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
area.size = useUserSizes_1 ? (/** @type {?} */ (area.component.size)) : defaultSize_1;
area.minSize = getAreaMinSize(area);
area.maxSize = getAreaMaxSize(area);
}));
break;
}
case 'pixel': {
if (useUserSizes_1) {
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
area.size = area.component.size;
area.minSize = getAreaMinSize(area);
area.maxSize = getAreaMaxSize(area);
}));
}
else {
/** @type {?} */
var wildcardSizeAreas = this.displayedAreas.filter((/**
* @param {?} a
* @return {?}
*/
function (a) { return a.component.size === null; }))
// No wildcard area > Need to select one arbitrarily > first
;
// No wildcard area > Need to select one arbitrarily > first
if (wildcardSizeAreas.length === 0 && this.displayedAreas.length > 0) {
this.displayedAreas.forEach((/**
* @param {?} area
* @param {?} i
* @return {?}
*/
function (area, i) {
area.size = i === 0 ? null : area.component.size;
area.minSize = i === 0 ? null : getAreaMinSize(area);
area.maxSize = i === 0 ? null : getAreaMaxSize(area);
}));
}
// More than one wildcard area > Need to keep only one arbitrarly > first
else if (wildcardSizeAreas.length > 1) {
/** @type {?} */
var alreadyGotOne_1 = false;
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
if (area.component.size === null) {
if (alreadyGotOne_1 === false) {
area.size = null;
area.minSize = null;
area.maxSize = null;
alreadyGotOne_1 = true;
}
else {
area.size = 100;
area.minSize = null;
area.maxSize = null;
}
}
else {
area.size = area.component.size;
area.minSize = getAreaMinSize(area);
area.maxSize = getAreaMaxSize(area);
}
}));
}
}
break;
}
}
}
this.refreshStyleSizes();
this.cdRef.markForCheck();
};
/**
* @private
* @return {?}
*/
SplitComponent.prototype.refreshStyleSizes = /**
* @private
* @return {?}
*/
function () {
var _this = this;
///////////////////////////////////////////
// PERCENT MODE
if (this.unit === 'percent') {
// Only one area > flex-basis 100%
if (this.displayedAreas.length === 1) {
this.displayedAreas[0].component.setStyleFlex(0, 0, "100%", false, false);
}
// Multiple areas > use each percent basis
else {
/** @type {?} */
var sumGutterSize_1 = this.getNbGutters() * this.gutterSize;
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
area.component.setStyleFlex(0, 0, "calc( " + area.size + "% - " + ((/** @type {?} */ (area.size)) / 100) * sumGutterSize_1 + "px )", area.minSize !== null && area.minSize === area.size ? true : false, area.maxSize !== null && area.maxSize === area.size ? true : false);
}));
}
}
///////////////////////////////////////////
// PIXEL MODE
else if (this.unit === 'pixel') {
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
// Area with wildcard size
if (area.size === null) {
if (_this.displayedAreas.length === 1) {
area.component.setStyleFlex(1, 1, "100%", false, false);
}
else {
area.component.setStyleFlex(1, 1, "auto", false, false);
}
}
// Area with pixel size
else {
// Only one area > flex-basis 100%
if (_this.displayedAreas.length === 1) {
area.component.setStyleFlex(0, 0, "100%", false, false);
}
// Multiple areas > use each pixel basis
else {
area.component.setStyleFlex(0, 0, area.size + "px", area.minSize !== null && area.minSize === area.size ? true : false, area.maxSize !== null && area.maxSize === area.size ? true : false);
}
}
}));
}
};
/**
* @param {?} event
* @param {?} gutterNum
* @return {?}
*/
SplitComponent.prototype.clickGutter = /**
* @param {?} event
* @param {?} gutterNum
* @return {?}
*/
function (event, gutterNum) {
var _this = this;
/** @type {?} */
var tempPoint = getPointFromEvent(event)
// Be sure mouseup/touchend happened at same point as mousedown/touchstart to trigger click/dblclick
;
// Be sure mouseup/touchend happened at same point as mousedown/touchstart to trigger click/dblclick
if (this.startPoint && this.startPoint.x === tempPoint.x && this.startPoint.y === tempPoint.y) {
// If timeout in progress and new click > clearTimeout & dblClickEvent
if (this._clickTimeout !== null) {
window.clearTimeout(this._clickTimeout);
this._clickTimeout = null;
this.notify('dblclick', gutterNum);
this.stopDragging();
}
// Else start timeout to call clickEvent at end
else {
this._clickTimeout = window.setTimeout((/**
* @return {?}
*/
function () {
_this._clickTimeout = null;
_this.notify('click', gutterNum);
_this.stopDragging();
}), this.gutterDblClickDuration);
}
}
};
/**
* @param {?} event
* @param {?} gutterOrder
* @param {?} gutterNum
* @return {?}
*/
SplitComponent.prototype.startDragging = /**
* @param {?} event
* @param {?} gutterOrder
* @param {?} gutterNum
* @return {?}
*/
function (event, gutterOrder, gutterNum) {
var _this = this;
event.preventDefault();
event.stopPropagation();
this.startPoint = getPointFromEvent(event);
if (this.startPoint === null || this.disabled === true || this.isWaitingClear === true) {
return;
}
this.snapshot = {
gutterNum: gutterNum,
lastSteppedOffset: 0,
allAreasSizePixel: getElementPixelSize(this.elRef, this.direction) - this.getNbGutters() * this.gutterSize,
allInvolvedAreasSizePercent: 100,
areasBeforeGutter: [],
areasAfterGutter: [],
};
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) {
/** @type {?} */
var areaSnapshot = {
area: area,
sizePixelAtStart: getElementPixelSize(area.component.elRef, _this.direction),
sizePercentAtStart: _this.unit === 'percent' ? area.size : -1,
};
if (area.order < gutterOrder) {
if (_this.restrictMove === true) {
_this.snapshot.areasBeforeGutter = [areaSnapshot];
}
else {
_this.snapshot.areasBeforeGutter.unshift(areaSnapshot);
}
}
else if (area.order > gutterOrder) {
if (_this.restrictMove === true) {
if (_this.snapshot.areasAfterGutter.length === 0)
_this.snapshot.areasAfterGutter = [areaSnapshot];
}
else {
_this.snapshot.areasAfterGutter.push(areaSnapshot);
}
}
}));
this.snapshot.allInvolvedAreasSizePercent = tslib_1.__spread(this.snapshot.areasBeforeGutter, this.snapshot.areasAfterGutter).reduce((/**
* @param {?} t
* @param {?} a
* @return {?}
*/
function (t, a) { return t + a.sizePercentAtStart; }), 0);
if (this.snapshot.areasBeforeGutter.length === 0 || this.snapshot.areasAfterGutter.length === 0) {
return;
}
this.dragListeners.push(this.renderer.listen(this.elRef.nativeElement, 'mouseup', this.stopDragging.bind(this)));
this.dragListeners.push(this.renderer.listen(this.elRef.nativeElement, 'touchend', this.stopDragging.bind(this)));
this.dragListeners.push(this.renderer.listen(this.elRef.nativeElement, 'touchcancel', this.stopDragging.bind(this)));
this.ngZone.runOutsideAngular((/**
* @return {?}
*/
function () {
_this.dragListeners.push(_this.renderer.listen(_this.elRef.nativeElement, 'mousemove', _this.dragEvent.bind(_this)));
_this.dragListeners.push(_this.renderer.listen(_this.elRef.nativeElement, 'touchmove', _this.dragEvent.bind(_this)));
}));
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) { return area.component.lockEvents(); }));
this.isDragging = true;
this.renderer.addClass(this.elRef.nativeElement, 'as-dragging');
this.renderer.addClass(this.gutterEls.toArray()[this.snapshot.gutterNum - 1].nativeElement, 'as-dragged');
this.notify('start', this.snapshot.gutterNum);
};
/**
* @private
* @param {?} event
* @return {?}
*/
SplitComponent.prototype.dragEvent = /**
* @private
* @param {?} event
* @return {?}
*/
function (event) {
var _this = this;
event.preventDefault();
event.stopPropagation();
if (this._clickTimeout !== null) {
window.clearTimeout(this._clickTimeout);
this._clickTimeout = null;
}
if (this.isDragging === false) {
return;
}
this.endPoint = getPointFromEvent(event);
if (this.endPoint === null) {
return;
}
// Calculate steppedOffset
/** @type {?} */
var offset = this.direction === 'horizontal' ? this.startPoint.x - this.endPoint.x : this.startPoint.y - this.endPoint.y;
if (this.dir === 'rtl') {
offset = -offset;
}
/** @type {?} */
var steppedOffset = Math.round(offset / this.gutterStep) * this.gutterStep;
if (steppedOffset === this.snapshot.lastSteppedOffset) {
return;
}
this.snapshot.lastSteppedOffset = steppedOffset;
// Need to know if each gutter side areas could reacts to steppedOffset
/** @type {?} */
var areasBefore = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasBeforeGutter, -steppedOffset, this.snapshot.allAreasSizePixel);
/** @type {?} */
var areasAfter = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasAfterGutter, steppedOffset, this.snapshot.allAreasSizePixel)
// Each gutter side areas can't absorb all offset
;
// Each gutter side areas can't absorb all offset
if (areasBefore.remain !== 0 && areasAfter.remain !== 0) {
if (Math.abs(areasBefore.remain) === Math.abs(areasAfter.remain)) {
}
else if (Math.abs(areasBefore.remain) > Math.abs(areasAfter.remain)) {
areasAfter = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasAfterGutter, steppedOffset + areasBefore.remain, this.snapshot.allAreasSizePixel);
}
else {
areasBefore = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasBeforeGutter, -(steppedOffset - areasAfter.remain), this.snapshot.allAreasSizePixel);
}
}
// Areas before gutter can't absorbs all offset > need to recalculate sizes for areas after gutter.
else if (areasBefore.remain !== 0) {
areasAfter = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasAfterGutter, steppedOffset + areasBefore.remain, this.snapshot.allAreasSizePixel);
}
// Areas after gutter can't absorbs all offset > need to recalculate sizes for areas before gutter.
else if (areasAfter.remain !== 0) {
areasBefore = getGutterSideAbsorptionCapacity(this.unit, this.snapshot.areasBeforeGutter, -(steppedOffset - areasAfter.remain), this.snapshot.allAreasSizePixel);
}
if (this.unit === 'percent') {
// Hack because of browser messing up with sizes using calc(X% - Ypx) -> el.getBoundingClientRect()
// If not there, playing with gutters makes total going down to 99.99875% then 99.99286%, 99.98986%,..
/** @type {?} */
var all = tslib_1.__spread(areasBefore.list, areasAfter.list);
/** @type {?} */
var areaToReset_1 = all.find((/**
* @param {?} a
* @return {?}
*/
function (a) {
return a.percentAfterAbsorption !== 0 &&
a.percentAfterAbsorption !== a.areaSnapshot.area.minSize &&
a.percentAfterAbsorption !== a.areaSnapshot.area.maxSize;
}));
if (areaToReset_1) {
areaToReset_1.percentAfterAbsorption =
this.snapshot.allInvolvedAreasSizePercent -
all.filter((/**
* @param {?} a
* @return {?}
*/
function (a) { return a !== areaToReset_1; })).reduce((/**
* @param {?} total
* @param {?} a
* @return {?}
*/
function (total, a) { return total + a.percentAfterAbsorption; }), 0);
}
}
// Now we know areas could absorb steppedOffset, time to really update sizes
areasBefore.list.forEach((/**
* @param {?} item
* @return {?}
*/
function (item) { return updateAreaSize(_this.unit, item); }));
areasAfter.list.forEach((/**
* @param {?} item
* @return {?}
*/
function (item) { return updateAreaSize(_this.unit, item); }));
this.refreshStyleSizes();
this.notify('progress', this.snapshot.gutterNum);
};
/**
* @private
* @param {?=} event
* @return {?}
*/
SplitComponent.prototype.stopDragging = /**
* @private
* @param {?=} event
* @return {?}
*/
function (event) {
var _this = this;
if (event) {
event.preventDefault();
event.stopPropagation();
}
if (this.isDragging === false) {
return;
}
this.displayedAreas.forEach((/**
* @param {?} area
* @return {?}
*/
function (area) { return area.component.unlockEvents(); }));
while (this.dragListeners.length > 0) {
/** @type {?} */
var fct = this.dragListeners.pop();
if (fct)
fct();
}
// Warning: Have to be before "notify('end')"
// because "notify('end')"" can be linked to "[size]='x'" > "build()" > "stopDragging()"
this.isDragging = false;
// If moved from starting point, notify end
if (this.endPoint && (this.startPoint.x !== this.endPoint.x || this.startPoint.y !== this.endPoint.y)) {
this.notify('end', this.snapshot.gutterNum);
}
this.renderer.removeClass(this.elRef.nativeElement, 'as-dragging');
this.renderer.removeClass(this.gutterEls.toArray()[this.snapshot.gutterNum - 1].nativeElement, 'as-dragged');
this.snapshot = null;
this.isWaitingClear = true;
// Needed to let (click)="clickGutter(...)" event run and verify if mouse moved or not
this.ngZone.runOutsideAngular((/**
* @return {?}
*/
function () {
setTimeout((/**
* @return {?}
*/
function () {
_this.startPoint = null;
_this.endPoint = null;
_this.isWaitingClear = false;
}));
}));
};
/**
* @param {?} type
* @param {?} gutterNum
* @return {?}
*/
SplitComponent.prototype.notify = /**
* @param {?} type
* @param {?} gutterNum
* @return {?}
*/
function (type, gutterNum) {
var _this = this;
/** @type {?} */
var sizes = this.getVisibleAreaSizes();
if (type === 'start') {
this.dragStart.emit({ gutterNum: gutterNum, sizes: sizes });
}
else if (type === 'end') {
this.dragEnd.emit({ gutterNum: gutterNum, sizes: sizes });
}
else if (type === 'click') {
this.gutterClick.emit({ gutterNum: gutterNum, sizes: sizes });
}
else if (type === 'dblclick') {
this.gutterDblClick.emit({ gutterNum: gutterNum, sizes: sizes });
}
else if (type === 'transitionEnd') {
if (this.transitionEndSubscriber) {
this.ngZone.run((/**
* @return {?}
*/
function () { return _this.transitionEndSubscriber.next(sizes); }));
}
}
else if (type === 'progress') {
// Stay outside zone to allow users do what they want about change detection mechanism.
this.dragProgressSubject.next({ gutterNum: gutterNum, sizes: sizes });
}
};
/**
* @return {?}
*/
SplitComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.stopDragging();
};
SplitComponent.decorators = [
{ type: Component, args: [{
selector: 'as-split',
exportAs: 'asSplit',
changeDetection: ChangeDetectionStrategy.OnPush,
template: " <ng-content></ng-content>\n <ng-template ngFor [ngForOf]=\"displayedAreas\" let-index=\"index\" let-last=\"last\">\n <div\n *ngIf=\"last === false\"\n #gutterEls\n class=\"as-split-gutter\"\n [style.flex-basis.px]=\"gutterSize\"\n [style.order]=\"index * 2 + 1\"\n (mousedown)=\"startDragging($event, index * 2 + 1, index + 1)\"\n (touchstart)=\"startDragging($event, index * 2 + 1, index + 1)\"\n (mouseup)=\"clickGutter($event, index + 1)\"\n (touchend)=\"clickGutter($event, index + 1)\"\n >\n <div class=\"as-split-gutter-icon\"></div>\n </div>\n </ng-template>",
encapsulation: ViewEncapsulation.Emulated,
styles: [":host{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;overflow:hidden;width:100%;height:100%}:host>.as-split-gutter{flex-grow:0;flex-shrink:0;background-color:#eee;display:flex;align-items:center;justify-content:center}:host>.as-split-gutter>.as-split-gutter-icon{width:100%;height:100%;background-position:center center;background-repeat:no-repeat}:host ::ng-deep>.as-split-area{flex-grow:0;flex-shrink:0;overflow-x:hidden;overflow-y:auto}:host ::ng-deep>.as-split-area.as-hidden{flex:0 1 0px!important;overflow-x:hidden;overflow-y:hidden}:host.as-horizontal{flex-direction:row}:host.as-horizontal>.as-split-gutter{flex-direction:row;cursor:col-resize;height:100%}:host.as-horizontal>.as-split-gutter>.as-split-gutter-icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==)}:host.as-horizontal ::ng-deep>.as-split-area{height:100%}:host.as-vertical{flex-direction:column}:host.as-vertical>.as-split-gutter{flex-direction:column;cursor:row-resize;width:100%}:host.as-vertical>.as-split-gutter .as-split-gutter-icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFCAMAAABl/6zIAAAABlBMVEUAAADMzMzIT8AyAAAAAXRSTlMAQObYZgAAABRJREFUeAFjYGRkwIMJSeMHlBkOABP7AEGzSuPKAAAAAElFTkSuQmCC)}:host.as-vertical ::ng-deep>.as-split-area{width:100%}:host.as-vertical ::ng-deep>.as-split-area.as-hidden{max-width:0}:host.as-disabled>.as-split-gutter{cursor:default}:host.as-disabled>.as-split-gutter .as-split-gutter-icon{background-image:url(\"\")}:host.as-transition.as-init:not(.as-dragging) ::ng-deep>.as-split-area,:host.as-transition.as-init:not(.as-dragging)>.as-split-gutter{transition:flex-basis .3s}"]
}] }
];
/** @nocollapse */
SplitComponent.ctorParameters = function () { return [
{ type: NgZone },
{ type: ElementRef },
{ type: ChangeDetectorRef },
{ type: Renderer2 }
]; };
SplitComponent.propDecorators = {
direction: [{ type: Input }],
unit: [{ type: Input }],
gutterSize: [{ type: Input }],
gutterStep: [{ type: Input }],
restrictMove: [{ type: Input }],
useTransition: [{ type: Input }],
disabled: [{ type: Input }],
dir: [{ type: Input }],
gutterDblClickDuration: [{ type: Input }],
dragStart: [{ type: Output }],
dragEnd: [{ type: Output }],
gutterClick: [{ type: Output }],
gutterDblClick: [{ type: Output }],
transitionEnd: [{ type: Output }],
gutterEls: [{ type: ViewChildren, args: ['gutterEls',] }]
};
return SplitComponent;
}());
export { SplitComponent };
if (false) {
/**
* @type {?}
* @private
*/
SplitComponent.prototype._direction;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._unit;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._gutterSize;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._gutterStep;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._restrictMove;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._useTransition;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._disabled;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._dir;
/**
* @type {?}
* @private
*/
SplitComponent.prototype._gutterDblClickDuration;
/** @type {?} */
SplitComponent.prototype.dragStart;
/** @type {?} */
SplitComponent.prototype.dragEnd;
/** @type {?} */
SplitComponent.prototype.gutterClick;
/** @type {?} */
SplitComponent.prototype.gutterDblClick;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.transitionEndSubscriber;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.dragProgressSubject;
/** @type {?} */
SplitComponent.prototype.dragProgress$;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.isDragging;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.isWaitingClear;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.dragListeners;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.snapshot;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.startPoint;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.endPoint;
/** @type {?} */
SplitComponent.prototype.displayedAreas;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.hidedAreas;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.gutterEls;
/** @type {?} */
SplitComponent.prototype._clickTimeout;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.ngZone;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.elRef;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.cdRef;
/**
* @type {?}
* @private
*/
SplitComponent.prototype.renderer;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3BsaXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGRhdnZpZGVzcy9hbmd1bGFyLXNwbGl0LyIsInNvdXJjZXMiOlsibGliL2NvbXBvbmVudC9zcGxpdC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULEtBQUssRUFDTCxNQUFNLEVBQ04sdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixTQUFTLEVBR1QsVUFBVSxFQUNWLE1BQU0sRUFDTixZQUFZLEVBQ1osU0FBUyxFQUNULFlBQVksRUFDWixpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUE7QUFDdEIsT0FBTyxFQUFFLFVBQVUsRUFBYyxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUE7QUFDdEQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGdCQUFnQixDQUFBO0FBSTdDLE9BQU8sRUFDTCxzQkFBc0IsRUFDdEIsZUFBZSxFQUNmLGdCQUFnQixFQUNoQixjQUFjLEVBQ2QsY0FBYyxFQUNkLGlCQUFpQixFQUNqQixtQkFBbUIsRUFDbkIsK0JBQStCLEVBQy9CLGNBQWMsR0FDZixNQUFNLFVBQVUsQ0FBQTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBZ0NqQjtJQXdMRSx3QkFDVSxNQUFjLEVBQ2QsS0FBaUIsRUFDakIsS0FBd0IsRUFDeEIsUUFBbUI7UUFIbkIsV0FBTSxHQUFOLE1BQU0sQ0FBUTtRQUNkLFVBQUssR0FBTCxLQUFLLENBQVk7UUFDakIsVUFBSyxHQUFMLEtBQUssQ0FBbUI7UUFDeEIsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQXBLckIsZUFBVSxHQUE4QixZQUFZLENBQUE7O1FBb0JwRCxVQUFLLEdBQXdCLFNBQVMsQ0FBQTs7UUFpQnRDLGdCQUFXLEdBQVcsRUFBRSxDQUFBOztRQWN4QixnQkFBVyxHQUFXLENBQUMsQ0FBQTs7UUFZdkIsa0JBQWEsR0FBWSxLQUFLLENBQUE7O1FBWTlCLG1CQUFjLEdBQVksS0FBSyxDQUFBOztRQWUvQixjQUFTLEdBQVksS0FBSyxDQUFBOztRQWUxQixTQUFJLEdBQWtCLEtBQUssQ0FBQTs7UUFjM0IsNEJBQXVCLEdBQVcsQ0FBQyxDQUFBOztRQVlqQyxjQUFTLEdBQUcsSUFBSSxZQUFZLENBQWMsS0FBSyxDQUFDLENBQUE7UUFDaEQsWUFBTyxHQUFHLElBQUksWUFBWSxDQUFjLEtBQUssQ0FBQyxDQUFBO1FBQzlDLGdCQUFXLEdBQUcsSUFBSSxZQUFZLENBQWMsS0FBSyxDQUFDLENBQUE7UUFDbEQsbUJBQWMsR0FBRyxJQUFJLFlBQVksQ0FBYyxLQUFLLENBQUMsQ0FBQTtRQVN2RCx3QkFBbUIsR0FBeUIsSUFBSSxPQUFPLEVBQUUsQ0FBQTtRQUNqRSxrQkFBYSxHQUE0QixJQUFJLENBQUMsbUJBQW1CLENBQUMsWUFBWSxFQUFFLENBQUE7O1FBSXhFLGVBQVUsR0FBWSxLQUFLLENBQUE7UUFDM0IsbUJBQWMsR0FBWSxLQUFLLENBQUE7UUFDL0Isa0JBQWEsR0FBb0IsRUFBRSxDQUFBO1FBQ25DLGFBQVEsR0FBMEIsSUFBSSxDQUFBO1FBQ3RDLGVBQVUsR0FBa0IsSUFBSSxDQUFBO1FBQ2hDLGFBQVEsR0FBa0IsSUFBSSxDQUFBO1FBRXRCLG1CQUFjLEdBQWlCLEVBQUUsQ0FBQTtRQUNoQyxlQUFVLEdBQWlCLEVBQUUsQ0FBQTtRQStQOUMsa0JBQWEsR0FBa0IsSUFBSSxDQUFBO1FBclBqQywyRUFBMkU7UUFDM0UsSUFBSSxDQUFDLFNBQVMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFBO0lBQ2xDLENBQUM7SUF0S0Qsc0JBQWEscUNBQVM7Ozs7UUFZdEI7WUFDRSxPQUFPLElBQUksQ0FBQyxVQUFVLENBQUE7UUFDeEIsQ0FBQzs7Ozs7UUFkRCxVQUF1QixDQUE0QjtZQUNqRCxJQUFJLENBQUMsVUFBVSxHQUFHLENBQUMsS0FBSyxVQUFVLENBQUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFBO1lBRTlELElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLFFBQU0sSUFBSSxDQUFDLFVBQVksQ0FBQyxDQUFBO1lBQ3pFLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUN2QixJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsRUFDeEIsU0FBTSxJQUFJLENBQUMsVUFBVSxLQUFLLFVBQVUsQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUUsQ0FDbkUsQ0FBQTtZQUVELElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLEtBQUssQ0FBQyxDQUFBO1FBQzFCLENBQUM7OztPQUFBO0lBVUQsc0JBQWEsZ0NBQUk7Ozs7UUFTakI7WUFDRSxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUE7UUFDbkIsQ0FBQzs7Ozs7UUFYRCxVQUFrQixDQUFzQjtZQUN0QyxJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsS0FBSyxPQUFPLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFBO1lBRWhELElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLFFBQU0sSUFBSSxDQUFDLEtBQU8sQ0FBQyxDQUFBO1lBQ3BFLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLFNBQU0sSUFBSSxDQUFDLEtBQUssS0FBSyxPQUFPLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFFLENBQUMsQ0FBQTtZQUV6RyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsQ0FBQTtRQUN6QixDQUFDOzs7T0FBQTtJQVVELHNCQUFhLHNDQUFVOzs7O1FBTXZCO1lBQ0UsT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFBO1FBQ3pCLENBQUM7Ozs7O1FBUkQsVUFBd0IsQ0FBZ0I7WUFDdEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxzQkFBc0IsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUE7WUFFaEQsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQUUsS0FBSyxDQUFDLENBQUE7UUFDMUIsQ0FBQzs7O09BQUE7SUFVRCxzQkFBYSxzQ0FBVTs7OztRQUl2QjtZQUNFLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQTtRQUN6QixDQUFDOzs7OztRQU5ELFVBQXdCLENBQVM7WUFDL0IsSUFBSSxDQUFDLFdBQVcsR0FBRyxzQkFBc0IsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUE7UUFDakQsQ0FBQzs7O09BQUE7SUFVRCxzQkFBYSx3Q0FBWTs7OztRQUl6QjtZQUNFLE9BQU8sSUFBSSxDQUFDLGFBQWEsQ0FBQTtRQUMzQixDQUFDOzs7OztRQU5ELFVBQTBCLENBQVU7WUFDbEMsSUFBSSxDQUFDLGFBQWEsR0FBRyxlQUFlLENBQUMsQ0FBQyxDQUFDLENBQUE7UUFDekMsQ0FBQzs7O09BQUE7SUFVRCxzQkFBYSx5Q0FBYTs7OztRQU8xQjtZQUNFLE9BQU8sSUFBSSxDQUFDLGNBQWMsQ0FBQTtRQUM1QixDQUFDOzs7OztRQVRELFVBQTJCLENBQVU7WUFDbkMsSUFBSSxDQUFDLGNBQWMsR0FBRyxlQUFlLENBQUMsQ0FBQyxDQUFDLENBQUE7WUFFeEMsSUFBSSxJQUFJLENBQUMsY0FBYztnQkFBRSxJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsRUFBRSxlQUFlLENBQUMsQ0FBQTs7Z0JBQ3JGLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLGVBQWUsQ0FBQyxDQUFBO1FBQzNFLENBQUM7OztPQUFBO0lBVUQsc0JBQWEsb0NBQVE7Ozs7UUFPckI7WUFDRSxPQUFPLElBQUksQ0FBQyxTQUFTLENBQUE7UUFDdkIsQ0FBQzs7Ozs7UUFURCxVQUFzQixDQUFVO1lBQzlCLElBQUksQ0FBQyxTQUFTLEdBQUcsZUFBZSxDQUFDLENBQUMsQ0FBQyxDQUFBO1lBRW5DLElBQUksSUFBSSxDQUFDLFNBQVM7Z0JBQUUsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLEVBQUUsYUFBYSxDQUFDLENBQUE7O2dCQUM5RSxJQUFJLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsRUFBRSxhQUFhLENBQUMsQ0FBQTtRQUN6RSxDQUFDOzs7T0FBQTtJQVVELHNCQUFhLCtCQUFHOzs7O1FBTWhCO1lBQ0UsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFBO1FBQ2xCLENBQUM7Ozs7O1FBUkQsVUFBaUIsQ0FBZ0I7WUFDL0IsSUFBSSxDQUFDLElBQUksR0FBRyxDQUFDLEtBQUssS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQTtZQUV2QyxJQUFJLENBQUMsUUFBUSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsRUFBRSxLQUFLLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFBO1FBQ3hFLENBQUM7OztPQUFBO0lBVUQsc0JBQWEsa0RBQXNCOzs7O1FBSW5DO1lBQ0UsT0FBTyxJQUFJLENBQUMsdUJBQXVCLENBQUE7UUFDckMsQ0FBQzs7Ozs7UUFORCxVQUFvQyxDQUFTO1lBQzNDLElBQUksQ0FBQyx1QkFBdUIsR0FBRyxzQkFBc0IsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUE7UUFDN0QsQ0FBQzs7O09BQUE7SUFjRCxzQkFBYyx5Q0FBYTs7OztRQUEzQjtZQUFBLGlCQUlDO1lBSEMsT0FBTyxJQUFJLFVBQVU7Ozs7WUFBQyxVQUFDLFVBQVUsSUFBSyxPQUFBLENBQUMsS0FBSSxDQUFDLHVCQUF1QixHQUFHLFVBQVUsQ0FBQyxFQUEzQyxDQUEyQyxFQUFDLENBQUMsSUFBSSxDQUNyRixZQUFZLENBQW1CLEVBQUUsQ0FBQyxDQUNuQyxDQUFBO1FBQ0gsQ0FBQzs7O09BQUE7Ozs7SUE2Qk0sd0NBQWU7OztJQUF0QjtRQUFBLGlCQUtDO1FBSkMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxpQkFBaUI7OztRQUFDO1lBQzVCLHlDQUF5QztZQUN6QyxVQUFVOzs7WUFBQyxjQUFNLE9BQUEsS0FBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsS0FBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLEVBQUUsU0FBUyxDQUFDLEVBQTNELENBQTJELEVBQUMsQ0FBQTtRQUMvRSxDQUFDLEVBQUMsQ0FBQTtJQUNKLENBQUM7Ozs7O0lBRU8scUNBQVk7Ozs7SUFBcEI7UUFDRSxPQUFPLElBQUksQ0FBQyxjQUFjLENBQUMsTUF