UNPKG

@open-e/oe-coordinator

Version:

This module is used to detect mouse movement on the border of HTMLElement. Useful usecase is to enable resize event in `div` element when mouse is on the border of it.

157 lines 10.2 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ import { Directive, Renderer2, HostListener, ElementRef, Input } from "@angular/core"; import { Subject } from "rxjs"; import { switchMap, takeUntil, repeat, tap } from "rxjs/operators"; var AttributeDragDirective = /** @class */ (function () { function AttributeDragDirective(renderer, _ref) { this.renderer = renderer; this._ref = _ref; this._pointerDown = new Subject(); this._pointerMove = new Subject(); this._pointerUp = new Subject(); this._margin = 0; } /** * @param {?} event * @return {?} */ AttributeDragDirective.prototype.onPointerDown = /** * @param {?} event * @return {?} */ function (event) { event.preventDefault(); this._pointerDown.next(event); }; /** * @param {?} event * @return {?} */ AttributeDragDirective.prototype.onPointerMove = /** * @param {?} event * @return {?} */ function (event) { this._pointerMove.next(event); }; /** * @param {?} event * @return {?} */ AttributeDragDirective.prototype.onPointerUp = /** * @param {?} event * @return {?} */ function (event) { this._pointerUp.next(event); }; /** * @return {?} */ AttributeDragDirective.prototype.ngOnInit = /** * @return {?} */ function () { this._pointerDown .asObservable() .pipe(tap((/** * @param {?} event * @return {?} */ function (event) { this._pageX = event.pageX - this._margin; })), switchMap((/** * @return {?} */ function () { return this._pointerMove; })), tap((/** * @param {?} event * @return {?} */ function (event) { this._margin = event.pageX - this._pageX; this.renderer.setStyle(this._ref.nativeElement, "margin-left", this._cutEdgeValue() + "px"); })), takeUntil(this._pointerUp), repeat()) .subscribe(); }; /** * @private * @return {?} */ AttributeDragDirective.prototype._cutEdgeValue = /** * @private * @return {?} */ function () { /** @type {?} */ var result = this._margin; if (this.min && this._margin < this.min) { result = this.min; } if (this.max && this._margin > this.max) { result = this.max; } return result; }; AttributeDragDirective.decorators = [ { type: Directive, args: [{ selector: "[horizonDrag]" },] } ]; /** @nocollapse */ AttributeDragDirective.ctorParameters = function () { return [ { type: Renderer2 }, { type: ElementRef } ]; }; AttributeDragDirective.propDecorators = { min: [{ type: Input }], max: [{ type: Input }], onPointerDown: [{ type: HostListener, args: ["mousedown", ["$event"],] }], onPointerMove: [{ type: HostListener, args: ["document:mousemove", ["$event"],] }], onPointerUp: [{ type: HostListener, args: ["document:mouseup", ["$event"],] }] }; return AttributeDragDirective; }()); export { AttributeDragDirective }; if (false) { /** * @type {?} * @private */ AttributeDragDirective.prototype._pointerDown; /** * @type {?} * @private */ AttributeDragDirective.prototype._pointerMove; /** * @type {?} * @private */ AttributeDragDirective.prototype._pointerUp; /** * @type {?} * @private */ AttributeDragDirective.prototype._margin; /** * @type {?} * @private */ AttributeDragDirective.prototype._pageX; /** @type {?} */ AttributeDragDirective.prototype.min; /** @type {?} */ AttributeDragDirective.prototype.max; /** * @type {?} * @private */ AttributeDragDirective.prototype.renderer; /** * @type {?} * @private */ AttributeDragDirective.prototype._ref; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhZy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9Ab3Blbi1lL29lLWNvb3JkaW5hdG9yLyIsInNvdXJjZXMiOlsibW9kdWxlL2NsYXNzL2RyYWcuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULFNBQVMsRUFDVCxZQUFZLEVBRVosVUFBVSxFQUNWLEtBQUssRUFDTixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQy9CLE9BQU8sRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUVuRTtJQVdFLGdDQUFvQixRQUFtQixFQUFVLElBQWdCO1FBQTdDLGFBQVEsR0FBUixRQUFRLENBQVc7UUFBVSxTQUFJLEdBQUosSUFBSSxDQUFZO1FBVHpELGlCQUFZLEdBQUcsSUFBSSxPQUFPLEVBQWMsQ0FBQztRQUN6QyxpQkFBWSxHQUFHLElBQUksT0FBTyxFQUFjLENBQUM7UUFDekMsZUFBVSxHQUFHLElBQUksT0FBTyxFQUFjLENBQUM7UUFFdkMsWUFBTyxHQUFXLENBQUMsQ0FBQztJQUt3QyxDQUFDOzs7OztJQUdyRSw4Q0FBYTs7OztJQURiLFVBQ2MsS0FBaUI7UUFDN0IsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2hDLENBQUM7Ozs7O0lBR0QsOENBQWE7Ozs7SUFEYixVQUNjLEtBQWlCO1FBQzdCLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2hDLENBQUM7Ozs7O0lBR0QsNENBQVc7Ozs7SUFEWCxVQUNZLEtBQWlCO1FBQzNCLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzlCLENBQUM7Ozs7SUFFRCx5Q0FBUTs7O0lBQVI7UUFDRSxJQUFJLENBQUMsWUFBWTthQUNkLFlBQVksRUFBRTthQUNkLElBQUksQ0FDSCxHQUFHOzs7O1FBQUMsVUFBUyxLQUFpQjtZQUM1QixJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQztRQUMzQyxDQUFDLEVBQUMsRUFDRixTQUFTOzs7UUFBQyxjQUFjLE9BQU8sSUFBSSxDQUFDLFlBQVksQ0FBQSxDQUFBLENBQUMsRUFBQyxFQUNsRCxHQUFHOzs7O1FBQUMsVUFBUyxLQUFpQjtZQUM1QixJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQztZQUN6QyxJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FDcEIsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQ3ZCLGFBQWEsRUFDVixJQUFJLENBQUMsYUFBYSxFQUFFLE9BQUksQ0FDNUIsQ0FBQztRQUNKLENBQUMsRUFBQyxFQUNGLFNBQVMsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEVBQzFCLE1BQU0sRUFBRSxDQUNUO2FBQ0EsU0FBUyxFQUFFLENBQUM7SUFDakIsQ0FBQzs7Ozs7SUFFTyw4Q0FBYTs7OztJQUFyQjs7WUFDTSxNQUFNLEdBQUcsSUFBSSxDQUFDLE9BQU87UUFFekIsSUFBSSxJQUFJLENBQUMsR0FBRyxJQUFJLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLEdBQUcsRUFBRTtZQUN2QyxNQUFNLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQztTQUNuQjtRQUVELElBQUksSUFBSSxDQUFDLEdBQUcsSUFBSSxJQUFJLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQyxHQUFHLEVBQUU7WUFDdkMsTUFBTSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUM7U0FDbkI7UUFFRCxPQUFPLE1BQU0sQ0FBQztJQUNoQixDQUFDOztnQkEvREYsU0FBUyxTQUFDLEVBQUUsUUFBUSxFQUFFLGVBQWUsRUFBRTs7OztnQkFUdEMsU0FBUztnQkFHVCxVQUFVOzs7c0JBY1QsS0FBSztzQkFDTCxLQUFLO2dDQUlMLFlBQVksU0FBQyxXQUFXLEVBQUUsQ0FBQyxRQUFRLENBQUM7Z0NBTXBDLFlBQVksU0FBQyxvQkFBb0IsRUFBRSxDQUFDLFFBQVEsQ0FBQzs4QkFLN0MsWUFBWSxTQUFDLGtCQUFrQixFQUFFLENBQUMsUUFBUSxDQUFDOztJQXdDOUMsNkJBQUM7Q0FBQSxBQWhFRCxJQWdFQztTQS9EWSxzQkFBc0I7Ozs7OztJQUNqQyw4Q0FBaUQ7Ozs7O0lBQ2pELDhDQUFpRDs7Ozs7SUFDakQsNENBQStDOzs7OztJQUUvQyx5Q0FBNEI7Ozs7O0lBQzVCLHdDQUF1Qjs7SUFDdkIscUNBQXFCOztJQUNyQixxQ0FBcUI7Ozs7O0lBRVQsMENBQTJCOzs7OztJQUFFLHNDQUF3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgRGlyZWN0aXZlLFxyXG4gIFJlbmRlcmVyMixcclxuICBIb3N0TGlzdGVuZXIsXHJcbiAgT25Jbml0LFxyXG4gIEVsZW1lbnRSZWYsXHJcbiAgSW5wdXRcclxufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQgeyBTdWJqZWN0IH0gZnJvbSBcInJ4anNcIjtcclxuaW1wb3J0IHsgc3dpdGNoTWFwLCB0YWtlVW50aWwsIHJlcGVhdCwgdGFwIH0gZnJvbSBcInJ4anMvb3BlcmF0b3JzXCI7XHJcblxyXG5ARGlyZWN0aXZlKHsgc2VsZWN0b3I6IFwiW2hvcml6b25EcmFnXVwiIH0pXHJcbmV4cG9ydCBjbGFzcyBBdHRyaWJ1dGVEcmFnRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0IHtcclxuICBwcml2YXRlIF9wb2ludGVyRG93biA9IG5ldyBTdWJqZWN0PE1vdXNlRXZlbnQ+KCk7XHJcbiAgcHJpdmF0ZSBfcG9pbnRlck1vdmUgPSBuZXcgU3ViamVjdDxNb3VzZUV2ZW50PigpO1xyXG4gIHByaXZhdGUgX3BvaW50ZXJVcCA9IG5ldyBTdWJqZWN0PE1vdXNlRXZlbnQ+KCk7XHJcblxyXG4gIHByaXZhdGUgX21hcmdpbjogbnVtYmVyID0gMDtcclxuICBwcml2YXRlIF9wYWdlWDogbnVtYmVyO1xyXG4gIEBJbnB1dCgpIG1pbjogbnVtYmVyO1xyXG4gIEBJbnB1dCgpIG1heDogbnVtYmVyO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlbmRlcmVyOiBSZW5kZXJlcjIsIHByaXZhdGUgX3JlZjogRWxlbWVudFJlZikge31cclxuXHJcbiAgQEhvc3RMaXN0ZW5lcihcIm1vdXNlZG93blwiLCBbXCIkZXZlbnRcIl0pXHJcbiAgb25Qb2ludGVyRG93bihldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcclxuICAgIHRoaXMuX3BvaW50ZXJEb3duLm5leHQoZXZlbnQpO1xyXG4gIH1cclxuXHJcbiAgQEhvc3RMaXN0ZW5lcihcImRvY3VtZW50Om1vdXNlbW92ZVwiLCBbXCIkZXZlbnRcIl0pXHJcbiAgb25Qb2ludGVyTW92ZShldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgdGhpcy5fcG9pbnRlck1vdmUubmV4dChldmVudCk7XHJcbiAgfVxyXG5cclxuICBASG9zdExpc3RlbmVyKFwiZG9jdW1lbnQ6bW91c2V1cFwiLCBbXCIkZXZlbnRcIl0pXHJcbiAgb25Qb2ludGVyVXAoZXZlbnQ6IE1vdXNlRXZlbnQpIHtcclxuICAgIHRoaXMuX3BvaW50ZXJVcC5uZXh0KGV2ZW50KTtcclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgdGhpcy5fcG9pbnRlckRvd25cclxuICAgICAgLmFzT2JzZXJ2YWJsZSgpXHJcbiAgICAgIC5waXBlKFxyXG4gICAgICAgIHRhcChmdW5jdGlvbihldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgICAgICAgdGhpcy5fcGFnZVggPSBldmVudC5wYWdlWCAtIHRoaXMuX21hcmdpbjtcclxuICAgICAgICB9KSxcclxuICAgICAgICBzd2l0Y2hNYXAoZnVuY3Rpb24gKCkgeyByZXR1cm4gdGhpcy5fcG9pbnRlck1vdmV9KSxcclxuICAgICAgICB0YXAoZnVuY3Rpb24oZXZlbnQ6IE1vdXNlRXZlbnQpIHtcclxuICAgICAgICAgIHRoaXMuX21hcmdpbiA9IGV2ZW50LnBhZ2VYIC0gdGhpcy5fcGFnZVg7XHJcbiAgICAgICAgICB0aGlzLnJlbmRlcmVyLnNldFN0eWxlKFxyXG4gICAgICAgICAgICB0aGlzLl9yZWYubmF0aXZlRWxlbWVudCxcclxuICAgICAgICAgICAgXCJtYXJnaW4tbGVmdFwiLFxyXG4gICAgICAgICAgICBgJHt0aGlzLl9jdXRFZGdlVmFsdWUoKX1weGBcclxuICAgICAgICAgICk7XHJcbiAgICAgICAgfSksXHJcbiAgICAgICAgdGFrZVVudGlsKHRoaXMuX3BvaW50ZXJVcCksXHJcbiAgICAgICAgcmVwZWF0KClcclxuICAgICAgKVxyXG4gICAgICAuc3Vic2NyaWJlKCk7XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIF9jdXRFZGdlVmFsdWUoKTogbnVtYmVyIHtcclxuICAgIGxldCByZXN1bHQgPSB0aGlzLl9tYXJnaW47XHJcbiAgICBcclxuICAgIGlmICh0aGlzLm1pbiAmJiB0aGlzLl9tYXJnaW4gPCB0aGlzLm1pbikge1xyXG4gICAgICByZXN1bHQgPSB0aGlzLm1pbjtcclxuICAgIH1cclxuXHJcbiAgICBpZiAodGhpcy5tYXggJiYgdGhpcy5fbWFyZ2luID4gdGhpcy5tYXgpIHtcclxuICAgICAgcmVzdWx0ID0gdGhpcy5tYXg7XHJcbiAgICB9XHJcblxyXG4gICAgcmV0dXJuIHJlc3VsdDtcclxuICB9XHJcbn1cclxuIl19