Marmelator/common-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lint

Browse Source
This commit is contained in:
Valentin Mihai 2022-12-06 00:58:33 +02:00
parent be87af0147
commit 5f9c754abf
2 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/lib/help-mode/help-mode.directive.ts
View File

@ -32,7 +32,14 @@ export class HelpModeDirective implements OnInit {
this._renderer.setAttribute(helperElement, 'target', '_blank');
this._renderer.addClass(helperElement, 'help-mode');
this._helpModeService.addElement(helperElementName, element, helperElement, this.scrollableParentView, this.overlappingElement, this.dialogElement);
this._helpModeService.addElement(
helperElementName,
element,
helperElement,
this.scrollableParentView,
this.overlappingElement,
this.dialogElement,
);
}
private _generateId(): string {

30
src/lib/help-mode/help-mode.service.ts
View File

@ -19,7 +19,7 @@ export const ScrollableParentViews = {
export type ScrollableParentView = keyof typeof ScrollableParentViews;
export const OverlappingElements = {
USER_MENU: 'USER_MENU'
USER_MENU: 'USER_MENU',
} as const;
export type OverlappingElement = keyof typeof OverlappingElements;
@ -124,7 +124,11 @@ export class HelpModeService {
});
}
private _isElementVisible(element: HTMLElement, scrollableParentView: ScrollableParentView, overlappingElementName: OverlappingElement): boolean {
private _isElementVisible(
element: HTMLElement,
scrollableParentView: ScrollableParentView,
overlappingElementName: OverlappingElement,
): boolean {
let elementRect: DOMRect = element.getBoundingClientRect();
if (elementRect.top === 0 && elementRect.left === 0 && elementRect.bottom === 0 && elementRect.bottom === 0) {
return false;
@ -184,13 +188,17 @@ export class HelpModeService {
Math.max(elementRect.left, overlappingElementRect.left) < Math.min(elementRect.right, overlappingElementRect.right) &&
Math.max(elementRect.top, overlappingElementRect.top) < Math.min(elementRect.bottom, overlappingElementRect.bottom)
);
}
return true;
}
private _updateHelperElement(element: HTMLElement, helperElement: HTMLElement, scrollableParentView: ScrollableParentView, overlappingElement: OverlappingElement) {
private _updateHelperElement(
element: HTMLElement,
helperElement: HTMLElement,
scrollableParentView: ScrollableParentView,
overlappingElement: OverlappingElement,
) {
if (this._isElementVisible(element, scrollableParentView, overlappingElement)) {
const dimensions = this._getElementDimensions(element);
helperElement.style.cssText = `
@ -206,12 +214,14 @@ export class HelpModeService {
}
private _enableHelperElements() {
Object.values(this._helperElements).forEach(({ element, helperElement, scrollableParentView,overlappingElement, dialogElement }) => {
if (this._dialogMode === dialogElement) {
document.body.appendChild(helperElement);
this._updateHelperElement(element, helperElement, scrollableParentView, overlappingElement);
}
});
Object.values(this._helperElements).forEach(
({ element, helperElement, scrollableParentView, overlappingElement, dialogElement }) => {
if (this._dialogMode === dialogElement) {
document.body.appendChild(helperElement);
this._updateHelperElement(element, helperElement, scrollableParentView, overlappingElement);
}
},
);
}
private _disableHelperElements() {