-
Notifications
You must be signed in to change notification settings - Fork 162
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'master' into sboykova/editable-date-picker
- Loading branch information
Showing
16 changed files
with
1,484 additions
and
651 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
1,728 changes: 1,216 additions & 512 deletions
1,728
projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
107 changes: 27 additions & 80 deletions
107
projects/igniteui-angular/src/lib/services/overlay/position/auto-position-strategy.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,88 +1,35 @@ | ||
| import { PositionSettings, VerticalAlignment, HorizontalAlignment, Size } from './../utilities'; | ||
| import { VerticalAlignment, HorizontalAlignment, PositionSettings, Size } from './../utilities'; | ||
| import { IPositionStrategy } from './IPositionStrategy'; | ||
| import { ConnectedPositioningStrategy } from './connected-positioning-strategy'; | ||
| import { BaseFitPositionStrategy } from './base-fit-position-strategy'; | ||
|
|
||
| enum Axis { | ||
| X = 1, | ||
| Y = 0 | ||
| } | ||
| export class AutoPositionStrategy extends ConnectedPositioningStrategy implements IPositionStrategy { | ||
| public offsetPadding = 16; | ||
| private _initialSettings; | ||
|
|
||
| getViewPort(document) { // Material Design implementation | ||
| const clientRect = document.documentElement.getBoundingClientRect(); | ||
| const scrollPosition = { | ||
| top: -clientRect.top, | ||
| left: -clientRect.left | ||
| }; | ||
| const width = window.innerWidth; | ||
| const height = window.innerHeight; | ||
|
|
||
| return { | ||
| top: scrollPosition.top, | ||
| left: scrollPosition.left, | ||
| bottom: scrollPosition.top + height, | ||
| right: scrollPosition.left + width, | ||
| height, | ||
| width | ||
| }; | ||
| export class AutoPositionStrategy extends BaseFitPositionStrategy implements IPositionStrategy { | ||
| fitHorizontal(element: HTMLElement, settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect, minSize: Size) { | ||
| switch (settings.horizontalDirection) { | ||
| case HorizontalAlignment.Left: | ||
| settings.horizontalDirection = HorizontalAlignment.Right; | ||
| settings.horizontalStartPoint = HorizontalAlignment.Right; | ||
| break; | ||
| case HorizontalAlignment.Right: | ||
| settings.horizontalDirection = HorizontalAlignment.Left; | ||
| settings.horizontalStartPoint = HorizontalAlignment.Left; | ||
| break; | ||
| } | ||
|
|
||
| super.position(element, this._initialSize); | ||
| } | ||
|
|
||
| // The position method should return a <div> container that will host the component | ||
| /** @inheritdoc */ | ||
| position(contentElement: HTMLElement, size?: Size, document?: Document, initialCall?: boolean): void { | ||
| if (!initialCall) { | ||
| super.position(contentElement, size); | ||
| return; | ||
| fitVertical(element: HTMLElement, settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect, minSize: Size) { | ||
| switch (settings.verticalDirection) { | ||
| case VerticalAlignment.Top: | ||
| settings.verticalDirection = VerticalAlignment.Bottom; | ||
| settings.verticalStartPoint = VerticalAlignment.Bottom; | ||
| break; | ||
| case VerticalAlignment.Bottom: | ||
| settings.verticalDirection = VerticalAlignment.Top; | ||
| settings.verticalStartPoint = VerticalAlignment.Top; | ||
| break; | ||
| } | ||
| this._initialSettings = this._initialSettings || Object.assign({}, this._initialSettings, this.settings); | ||
| this.settings = this._initialSettings ? Object.assign({}, this.settings, this._initialSettings) : this.settings; | ||
| const viewPort = this.getViewPort(document); | ||
| super.position(contentElement, size); | ||
| const checkIfMoveHorizontal = (elem: HTMLElement) => { | ||
| const leftBound = elem.offsetLeft; | ||
| const rightBound = elem.offsetLeft + elem.lastElementChild.clientWidth; | ||
| switch (this.settings.horizontalDirection) { | ||
| case HorizontalAlignment.Left: | ||
| if (leftBound < viewPort.left) { | ||
| this.settings.horizontalDirection = HorizontalAlignment.Right; | ||
| this.settings.horizontalStartPoint = HorizontalAlignment.Right; | ||
| } | ||
| break; | ||
| case HorizontalAlignment.Right: | ||
| if (rightBound > viewPort.right) { | ||
| this.settings.horizontalDirection = HorizontalAlignment.Left; | ||
| this.settings.horizontalStartPoint = HorizontalAlignment.Left; | ||
| } | ||
| break; | ||
| default: | ||
| return; | ||
| } | ||
| }; | ||
| const checkIfMoveVertical = (elem: HTMLElement) => { | ||
| const topBound = elem.offsetTop; | ||
| const bottomBound = elem.offsetTop + elem.lastElementChild.clientHeight; | ||
| switch (this.settings.verticalDirection) { | ||
| case VerticalAlignment.Top: | ||
| if (topBound < viewPort.top) { | ||
| this.settings.verticalDirection = VerticalAlignment.Bottom; | ||
| this.settings.verticalStartPoint = VerticalAlignment.Bottom; | ||
| } | ||
| break; | ||
| case VerticalAlignment.Bottom: | ||
| if (bottomBound > viewPort.bottom) { | ||
| this.settings.verticalDirection = VerticalAlignment.Top; | ||
| this.settings.verticalStartPoint = VerticalAlignment.Top; | ||
| } | ||
| break; | ||
| default: | ||
| return; | ||
| } | ||
| }; | ||
| checkIfMoveVertical(contentElement); | ||
| checkIfMoveHorizontal(contentElement); | ||
| super.position(contentElement, size); | ||
|
|
||
| super.position(element, this._initialSize); | ||
| } | ||
| } |
71 changes: 71 additions & 0 deletions
71
projects/igniteui-angular/src/lib/services/overlay/position/base-fit-position-strategy.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| import { ConnectedPositioningStrategy } from './connected-positioning-strategy'; | ||
| import { IPositionStrategy } from './IPositionStrategy'; | ||
| import { HorizontalAlignment, VerticalAlignment, PositionSettings, Size } from '../utilities'; | ||
|
|
||
| export abstract class BaseFitPositionStrategy extends ConnectedPositioningStrategy implements IPositionStrategy { | ||
| protected _initialSettings: PositionSettings; | ||
| protected _initialSize: Size; | ||
|
|
||
| position(contentElement: HTMLElement, size: Size, document?: Document, initialCall?: boolean, minSize?: Size): void { | ||
| this._initialSize = size; | ||
| super.position(contentElement, size); | ||
| if (!initialCall) { | ||
| return; | ||
| } | ||
| this._initialSettings = this._initialSettings || Object.assign({}, this._initialSettings, this.settings); | ||
| this.settings = this._initialSettings ? Object.assign({}, this.settings, this._initialSettings) : this.settings; | ||
| const elementRect: ClientRect = contentElement.getBoundingClientRect(); | ||
| const viewPort: ClientRect = { | ||
| left: 0, | ||
| top: 0, | ||
| right: window.innerWidth, | ||
| bottom: window.innerHeight, | ||
| width: window.innerWidth, | ||
| height: window.innerHeight, | ||
| }; | ||
| if (this.shouldFitHorizontal(this.settings, elementRect, viewPort)) { | ||
| this.fitHorizontal(contentElement, this.settings, elementRect, viewPort, minSize); | ||
| } | ||
|
|
||
| if (this.shouldFitVertical(this.settings, elementRect, viewPort)) { | ||
| this.fitVertical(contentElement, this.settings, elementRect, viewPort, minSize); | ||
| } | ||
| } | ||
|
|
||
| protected shouldFitHorizontal(settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect): boolean { | ||
| switch (settings.horizontalDirection) { | ||
| case HorizontalAlignment.Left: | ||
| if (innerRect.left < outerRect.left) { | ||
| return true; | ||
| } | ||
| break; | ||
| case HorizontalAlignment.Right: | ||
| if (innerRect.right > outerRect.right) { | ||
| return true; | ||
| } | ||
| break; | ||
| } | ||
|
|
||
| return false; | ||
| } | ||
|
|
||
| protected shouldFitVertical(settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect): boolean { | ||
| switch (settings.verticalDirection) { | ||
| case VerticalAlignment.Top: | ||
| if (innerRect.top < outerRect.top) { | ||
| return true; | ||
| } | ||
| break; | ||
| case VerticalAlignment.Bottom: | ||
| if (innerRect.bottom > outerRect.bottom) { | ||
| return true; | ||
| } | ||
| break; | ||
| } | ||
|
|
||
| return false; | ||
| } | ||
|
|
||
| abstract fitHorizontal(element: HTMLElement, settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect, minSize: Size); | ||
| abstract fitVertical(element: HTMLElement, settings: PositionSettings, innerRect: ClientRect, outerRect: ClientRect, minSize: Size); | ||
| } |
Oops, something went wrong.