diff options
Diffstat (limited to 'deprecated-workflow-designer/sdc-workflow-designer-ui/src/app/paletx/core/overlay/overlay-directives.ts')
-rw-r--r-- | deprecated-workflow-designer/sdc-workflow-designer-ui/src/app/paletx/core/overlay/overlay-directives.ts | 329 |
1 files changed, 0 insertions, 329 deletions
diff --git a/deprecated-workflow-designer/sdc-workflow-designer-ui/src/app/paletx/core/overlay/overlay-directives.ts b/deprecated-workflow-designer/sdc-workflow-designer-ui/src/app/paletx/core/overlay/overlay-directives.ts deleted file mode 100644 index 5b8c1623..00000000 --- a/deprecated-workflow-designer/sdc-workflow-designer-ui/src/app/paletx/core/overlay/overlay-directives.ts +++ /dev/null @@ -1,329 +0,0 @@ -/** - * @license - * Copyright Google Inc. All Rights Reserved. - * - * Use of this source code is governed by an MIT-style license that can be - * found in the LICENSE file at https://angular.io/license - */ -/* tslint:disable:array-type member-access variable-name typedef - only-arrow-functions directive-class-suffix component-class-suffix - component-selector no-unnecessary-type-assertion arrow-parens*/ -import {TemplatePortal} from '@angular/cdk'; -import {Direction, Directionality} from '@angular/cdk'; -import {ESCAPE} from '@angular/cdk'; -import {Directive, ElementRef, EventEmitter, Input, OnChanges, OnDestroy, Optional, Output, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef} from '@angular/core'; -import {Subscription} from 'rxjs/Subscription'; - -import {Overlay} from './overlay'; -import {OverlayRef} from './overlay-ref'; -import {OverlayState} from './overlay-state'; -import {ConnectedOverlayPositionChange, ConnectionPositionPair} from './position/connected-position'; -import {ConnectedPositionStrategy} from './position/connected-position-strategy'; -import {ScrollStrategy} from './scroll/scroll-strategy'; - -/** Coerces a data-bound value (typically a string) to a boolean. */ -export function coerceBooleanProperty(value: any): boolean { - return value !== null && `${value}` !== 'false'; -} - - -/** Default set of positions for the overlay. Follows the behavior of a - * dropdown. */ -const defaultPositionList = [ - new ConnectionPositionPair( - {originX: 'start', originY: 'bottom'}, - {overlayX: 'start', overlayY: 'top'}), - new ConnectionPositionPair( - {originX: 'start', originY: 'top'}, - {overlayX: 'start', overlayY: 'bottom'}), -]; - - -/** - * Directive applied to an element to make it usable as an origin for an Overlay - * using a ConnectedPositionStrategy. - */ -@Directive({ - selector: '[nz-overlay-origin]', - exportAs: 'nzOverlayOrigin', -}) -export class OverlayOrigin { - constructor(public elementRef: ElementRef) {} -} - - -/** - * Directive to facilitate declarative creation of an Overlay using a - * ConnectedPositionStrategy. - */ -@Directive({selector: '[nz-connected-overlay]', exportAs: 'nzConnectedOverlay'}) -export class ConnectedOverlayDirective implements OnDestroy, OnChanges { - private _overlayRef: OverlayRef; - private _templatePortal: TemplatePortal; - private _hasBackdrop = false; - private _backdropSubscription: Subscription|null; - private _positionSubscription: Subscription; - private _offsetX = 0; - private _offsetY = 0; - private _position: ConnectedPositionStrategy; - private _escapeListener: Function; - - /** Origin for the connected overlay. */ - @Input() origin: OverlayOrigin; - - /** Registered connected position pairs. */ - @Input() positions: ConnectionPositionPair[]; - - /** The offset in pixels for the overlay connection point on the x-axis */ - @Input() - get offsetX(): number { - return this._offsetX; - } - - set offsetX(offsetX: number) { - this._offsetX = offsetX; - if (this._position) { - this._position.withOffsetX(offsetX); - } - } - - /** The offset in pixels for the overlay connection point on the y-axis */ - @Input() - get offsetY() { - return this._offsetY; - } - - set offsetY(offsetY: number) { - this._offsetY = offsetY; - if (this._position) { - this._position.withOffsetY(offsetY); - } - } - - /** The width of the overlay panel. */ - @Input() width: number|string; - - /** The height of the overlay panel. */ - @Input() height: number|string; - - /** The min width of the overlay panel. */ - @Input() minWidth: number|string; - - /** The min height of the overlay panel. */ - @Input() minHeight: number|string; - - /** The custom class to be set on the backdrop element. */ - @Input() backdropClass: string; - - /** The custom class to be set on the pane element. */ - @Input() paneClass: string; - - /** Strategy to be used when handling scroll events while the overlay is open. - */ - @Input() - scrollStrategy: ScrollStrategy = this._overlay.scrollStrategies.reposition(); - - /** Whether the overlay is open. */ - @Input() open = false; - - /** Whether or not the overlay should attach a backdrop. */ - @Input() - get hasBackdrop() { - return this._hasBackdrop; - } - - set hasBackdrop(value: any) { - this._hasBackdrop = coerceBooleanProperty(value); - } - - /** Event emitted when the backdrop is clicked. */ - @Output() backdropClick = new EventEmitter<void>(); - - /** Event emitted when the position has changed. */ - @Output() positionChange = new EventEmitter<ConnectedOverlayPositionChange>(); - - /** Event emitted when the overlay has been attached. */ - @Output() attach = new EventEmitter<void>(); - - /** Event emitted when the overlay has been detached. */ - @Output() detach = new EventEmitter<void>(); - - // TODO(jelbourn): inputs for size, scroll behavior, animation, etc. - - constructor( - private _overlay: Overlay, private _renderer: Renderer2, - templateRef: TemplateRef<any>, viewContainerRef: ViewContainerRef, - @Optional() private _dir: Directionality) { - this._templatePortal = new TemplatePortal(templateRef, viewContainerRef); - } - - /** The associated overlay reference. */ - get overlayRef(): OverlayRef { - return this._overlayRef; - } - - /** The element's layout direction. */ - get dir(): Direction { - return this._dir ? this._dir.value : 'ltr'; - } - - ngOnDestroy() { - this._destroyOverlay(); - } - - ngOnChanges(changes: SimpleChanges) { - if (changes['open']) { - this.open ? this._attachOverlay() : this._detachOverlay(); - } - } - - /** Creates an overlay */ - private _createOverlay() { - if (!this.positions || !this.positions.length) { - this.positions = defaultPositionList; - } - - this._overlayRef = - this._overlay.create(this._buildConfig(), this.paneClass); - } - - /** Builds the overlay config based on the directive's inputs */ - private _buildConfig(): OverlayState { - const overlayConfig = new OverlayState(); - - if (this.width || this.width === 0) { - overlayConfig.width = this.width; - } - - if (this.height || this.height === 0) { - overlayConfig.height = this.height; - } - - if (this.minWidth || this.minWidth === 0) { - overlayConfig.minWidth = this.minWidth; - } - - if (this.minHeight || this.minHeight === 0) { - overlayConfig.minHeight = this.minHeight; - } - - overlayConfig.hasBackdrop = this.hasBackdrop; - - if (this.backdropClass) { - overlayConfig.backdropClass = this.backdropClass; - } - - this._position = - this._createPositionStrategy() as ConnectedPositionStrategy; - overlayConfig.positionStrategy = this._position; - overlayConfig.scrollStrategy = this.scrollStrategy; - - return overlayConfig; - } - - /** Returns the position strategy of the overlay to be set on the overlay - * config */ - private _createPositionStrategy(): ConnectedPositionStrategy { - const pos = this.positions[0]; - const originPoint = {originX: pos.originX, originY: pos.originY}; - const overlayPoint = {overlayX: pos.overlayX, overlayY: pos.overlayY}; - - const strategy = - this._overlay.position() - .connectedTo(this.origin.elementRef, originPoint, overlayPoint) - .withOffsetX(this.offsetX) - .withOffsetY(this.offsetY); - - this._handlePositionChanges(strategy); - - return strategy; - } - - private _handlePositionChanges(strategy: ConnectedPositionStrategy): void { - for (let i = 1; i < this.positions.length; i++) { - strategy.withFallbackPosition( - { - originX: this.positions[i].originX, - originY: this.positions[i].originY - }, - { - overlayX: this.positions[i].overlayX, - overlayY: this.positions[i].overlayY - }); - } - - this._positionSubscription = strategy.onPositionChange.subscribe( - pos => this.positionChange.emit(pos)); - } - - /** Attaches the overlay and subscribes to backdrop clicks if backdrop exists - */ - private _attachOverlay() { - if (!this._overlayRef) { - this._createOverlay(); - } - - this._position.withDirection(this.dir); - this._overlayRef.getState().direction = this.dir; - this._initEscapeListener(); - - if (!this._overlayRef.hasAttached()) { - this._overlayRef.attach(this._templatePortal); - this.attach.emit(); - } - - if (this.hasBackdrop) { - this._backdropSubscription = - this._overlayRef.backdropClick().subscribe(() => { - this.backdropClick.emit(); - }); - } - } - - /** Detaches the overlay and unsubscribes to backdrop clicks if backdrop - * exists */ - private _detachOverlay() { - if (this._overlayRef) { - this._overlayRef.detach(); - this.detach.emit(); - } - - if (this._backdropSubscription) { - this._backdropSubscription.unsubscribe(); - this._backdropSubscription = null; - } - - if (this._escapeListener) { - this._escapeListener(); - } - } - - /** Destroys the overlay created by this directive. */ - private _destroyOverlay() { - if (this._overlayRef) { - this._overlayRef.dispose(); - } - - if (this._backdropSubscription) { - this._backdropSubscription.unsubscribe(); - } - - if (this._positionSubscription) { - this._positionSubscription.unsubscribe(); - } - - if (this._escapeListener) { - this._escapeListener(); - } - } - - /** Sets the event listener that closes the overlay when pressing Escape. */ - private _initEscapeListener() { - this._escapeListener = - this._renderer.listen('document', 'keydown', (event: KeyboardEvent) => { - if (event.keyCode === ESCAPE) { - this._detachOverlay(); - } - }); - } -} |