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

solved comments

Browse Source
This commit is contained in:
Valentin 2021-08-16 18:18:22 +03:00
parent 0b2d787ba5
commit 94847c7fbd
2 changed files with 21 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/red-ui/src/app/modules/shared/directives/help-mode.directive.ts
View File

@ -9,7 +9,6 @@ import { LanguageService } from '@i18n/language.service';
})
export class HelpModeDirective implements OnInit {
@Input('redactionHelpMode') elementName: string;
private _lastChildCreated = null;
constructor(
private readonly _elementRef: ElementRef,
@ -29,8 +28,7 @@ export class HelpModeDirective implements OnInit {
this._renderer.addClass(helperElement, 'help-mode-on-mouse-over');
this._renderer.addClass(helperElement, `help-mode-on-mouse-over-${this.elementName}`);
this._helpModeService.elements.push(element);
this._helpModeService.helperElements[this.elementName] = helperElement;
this._helpModeService.addElement(this.elementName, element, helperElement);
}
@HostListener('click') onClick() {

38
apps/red-ui/src/app/modules/shared/services/help-mode.service.ts
View File

@ -1,7 +1,6 @@
import { Injectable, Renderer2, RendererFactory2 } from '@angular/core';
import { HelpModeDialogComponent } from '@components/help-mode-dialog/help-mode-dialog.component';
import { MatDialog } from '@angular/material/dialog';
import { forEach } from 'lodash';
@Injectable({
providedIn: 'root'
@ -9,10 +8,10 @@ import { forEach } from 'lodash';
export class HelpModeService {
isHelpModeActive = false;
helpModeDialogIsOpened = false;
elements = [];
helperElements = {};
private _renderer: Renderer2;
private _elements = {};
private readonly _renderer: Renderer2;
constructor(private readonly _dialog: MatDialog, private readonly _rendererFactory: RendererFactory2) {
this._renderer = this._rendererFactory.createRenderer(null, null);
@ -42,30 +41,33 @@ export class HelpModeService {
}
highlightHelperElements() {
for (const key of Object.keys(this.helperElements)) {
this._renderer.addClass(this.helperElements[key], 'highlight');
for (const key of Object.keys(this._elements)) {
const helperElement = this._elements[key].helperElement;
this._renderer.addClass(helperElement, 'highlight');
setTimeout(() => {
this._renderer.removeClass(this.helperElements[key], 'highlight');
this._renderer.removeClass(helperElement, 'highlight');
}, 500);
}
}
private _enableHelperElements() {
for (const [index, [elementName, helperElement]] of Object.entries(Object.entries(this.helperElements))) {
const element = this.elements[index];
this._renderer.setStyle(element, 'position', 'relative');
addElement(elementName, element, helperElement) {
this._elements[elementName] = { element, helperElement };
}
if (elementName === 'quick-filters') {
this._renderer.insertBefore(element, helperElement, element.firstChild);
} else {
this._renderer.appendChild(element, helperElement);
}
private _enableHelperElements() {
for (const key of Object.keys(this._elements)) {
const element = this._elements[key].element;
const helperElement = this._elements[key].helperElement;
this._renderer.setStyle(element, 'position', 'relative');
this._renderer.appendChild(element, helperElement);
}
}
private _disableHelperElements() {
for (const [index, [elementName, helperElement]] of Object.entries(Object.entries(this.helperElements))) {
const element = this.elements[index];
for (const key of Object.keys(this._elements)) {
const element = this._elements[key].element;
const helperElement = this._elements[key].helperElement;
this._renderer.removeStyle(element, 'position');
this._renderer.removeChild(element, helperElement);