|
|
|
@ -14,7 +14,16 @@ |
|
|
|
/// limitations under the License.
|
|
|
|
///
|
|
|
|
|
|
|
|
import { Component, forwardRef, Input, OnInit, Renderer2, ViewContainerRef } from '@angular/core'; |
|
|
|
import { |
|
|
|
Component, |
|
|
|
forwardRef, |
|
|
|
Injectable, |
|
|
|
Input, |
|
|
|
OnDestroy, |
|
|
|
OnInit, |
|
|
|
Renderer2, |
|
|
|
ViewContainerRef |
|
|
|
} from '@angular/core'; |
|
|
|
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; |
|
|
|
import { ColorSettings, ColorType, ComponentStyle } from '@shared/models/widget-settings.models'; |
|
|
|
import { MatButton } from '@angular/material/button'; |
|
|
|
@ -23,6 +32,33 @@ import { |
|
|
|
ColorSettingsPanelComponent |
|
|
|
} from '@home/components/widget/lib/settings/common/color-settings-panel.component'; |
|
|
|
|
|
|
|
@Injectable() |
|
|
|
export class ColorSettingsComponentService { |
|
|
|
|
|
|
|
private colorSettingsComponents = new Set<ColorSettingsComponent>(); |
|
|
|
|
|
|
|
constructor() {} |
|
|
|
|
|
|
|
public registerColorSettingsComponent(comp: ColorSettingsComponent) { |
|
|
|
this.colorSettingsComponents.add(comp); |
|
|
|
} |
|
|
|
|
|
|
|
public unregisterColorSettingsComponent(comp: ColorSettingsComponent) { |
|
|
|
this.colorSettingsComponents.delete(comp); |
|
|
|
} |
|
|
|
|
|
|
|
public getOtherColorSettingsComponents(comp: ColorSettingsComponent): ColorSettingsComponent[] { |
|
|
|
const result: ColorSettingsComponent[] = []; |
|
|
|
for (const component of this.colorSettingsComponents.values()) { |
|
|
|
if (component.settingsKey && component.modelValue && component !== comp) { |
|
|
|
result.push(component); |
|
|
|
} |
|
|
|
} |
|
|
|
return result; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
@Component({ |
|
|
|
selector: 'tb-color-settings', |
|
|
|
templateUrl: './color-settings.component.html', |
|
|
|
@ -35,11 +71,14 @@ import { |
|
|
|
} |
|
|
|
] |
|
|
|
}) |
|
|
|
export class ColorSettingsComponent implements OnInit, ControlValueAccessor { |
|
|
|
export class ColorSettingsComponent implements OnInit, ControlValueAccessor, OnDestroy { |
|
|
|
|
|
|
|
@Input() |
|
|
|
disabled: boolean; |
|
|
|
|
|
|
|
@Input() |
|
|
|
settingsKey: string; |
|
|
|
|
|
|
|
colorType = ColorType; |
|
|
|
|
|
|
|
modelValue: ColorSettings; |
|
|
|
@ -50,9 +89,15 @@ export class ColorSettingsComponent implements OnInit, ControlValueAccessor { |
|
|
|
|
|
|
|
constructor(private popoverService: TbPopoverService, |
|
|
|
private renderer: Renderer2, |
|
|
|
private viewContainerRef: ViewContainerRef) {} |
|
|
|
private viewContainerRef: ViewContainerRef, |
|
|
|
private colorSettingsComponentService: ColorSettingsComponentService) {} |
|
|
|
|
|
|
|
ngOnInit(): void { |
|
|
|
this.colorSettingsComponentService.registerColorSettingsComponent(this); |
|
|
|
} |
|
|
|
|
|
|
|
ngOnDestroy() { |
|
|
|
this.colorSettingsComponentService.unregisterColorSettingsComponent(this); |
|
|
|
} |
|
|
|
|
|
|
|
registerOnChange(fn: any): void { |
|
|
|
@ -81,7 +126,8 @@ export class ColorSettingsComponent implements OnInit, ControlValueAccessor { |
|
|
|
this.popoverService.hidePopover(trigger); |
|
|
|
} else { |
|
|
|
const ctx: any = { |
|
|
|
colorSettings: this.modelValue |
|
|
|
colorSettings: this.modelValue, |
|
|
|
settingsComponents: this.colorSettingsComponentService.getOtherColorSettingsComponents(this) |
|
|
|
}; |
|
|
|
const colorSettingsPanelPopover = this.popoverService.displayPopover(trigger, this.renderer, |
|
|
|
this.viewContainerRef, ColorSettingsPanelComponent, 'left', true, null, |
|
|
|
|
Igor Kulikov
3 years ago