fuxa how to customize controls

Hello: fuxa how to customize controls

I have done the following work:

1. Added htmlyecomponent using angular cli

2. The code of editor.component.html file is modified as follows: <div class="svg-tool-button" matTooltip="{{'editor.controls-ye' | translate}}" [ngClass]="{'svg-tool-active': isModeActive('html_ye')}" (click)="setMode('html_ye')"> <span class="icon-tool icon-text"></span> </div>

3. The editor.component.ts file code is modified as follows: private getGaugeTitle(type) { let msg = ''; if (type.startsWith(HtmlInputComponent.TypeTag)) { this.translateService.get('editor.controls-input-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(HtmlYeComponent.TypeTag)) { this.translateService.get('editor.controls-ye-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(ValueComponent.TypeTag)) { this.translateService.get('editor.controls-output-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(HtmlButtonComponent.TypeTag)) { this.translateService.get('editor.controls-button-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(HtmlSelectComponent.TypeTag)) { this.translateService.get('editor.controls-select-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(GaugeProgressComponent.TypeTag)) { this.translateService.get('editor.controls-progress-settings').subscribe((txt: string) => { msg = txt }); } else if (type.startsWith(GaugeSemaphoreComponent.TypeTag)) { this.translateService.get('editor.controls-semaphore-settings').subscribe((txt: string) => { msg = txt }); } else { this.translateService.get('editor.controls-shape-settings').subscribe((txt: string) => { msg = txt }); } return msg; }

4. The code of gauges.component.ts file is modified as follows: `// list of gauges with input static GaugeWithInput = [HtmlInputComponent.prefix, HtmlSelectComponent.prefix, HtmlSwitchComponent.prefix,HtmlYeComponent.prefix.toLowerCase,HtmlWangComponent]; // list of gauges tags to check who as events like mouse click static GaugeWithEvents = [HtmlButtonComponent.TypeTag, GaugeSemaphoreComponent.TypeTag, ShapesComponent.TypeTag, ProcEngComponent.TypeTag, ApeShapesComponent.TypeTag]; // list of gauges tags to check who as events like mouse click static GaugeWithActions = [ApeShapesComponent, PipeComponent, ProcEngComponent, ShapesComponent, HtmlButtonComponent, HtmlSelectComponent, ValueComponent, HtmlInputComponent, GaugeSemaphoreComponent,HtmlYeComponent,HtmlWangComponent ]; // list of gauges components static Gauges = [ValueComponent, HtmlInputComponent, HtmlButtonComponent, HtmlBagComponent, HtmlSelectComponent, HtmlChartComponent, GaugeProgressComponent, GaugeSemaphoreComponent, ShapesComponent, ProcEngComponent, ApeShapesComponent, PipeComponent, SliderComponent, HtmlSwitchComponent,HtmlYeComponent,HtmlWangComponent];

   initInEditor(ga: GaugeSettings, res: any, ref: any) { if (ga.type.startsWith(GaugeProgressComponent.TypeTag)) { GaugeProgressComponent.initElement(ga); } else if (ga.type.startsWith(HtmlButtonComponent.TypeTag)) { HtmlButtonComponent.initElement(ga); } else if (ga.type.startsWith(HtmlYeComponent.TypeTag)) { HtmlYeComponent.initElement(ga,true); } else if (ga.type.startsWith(HtmlChartComponent.TypeTag)) { delete this.mapGauges[ga.id]; let gauge = HtmlChartComponent.detectChange(ga, res, ref); this.setChartPropety(gauge, ga.property); this.mapGauges[ga.id] = gauge; } else if (ga.type.startsWith(HtmlBagComponent.TypeTag)) { this.mapGauges[ga.id] = HtmlBagComponent.detectChange(ga, res, ref); } else if (ga.type.startsWith(PipeComponent.TypeTag)) { return this.mapGauges[ga.id] = PipeComponent.detectChange(ga, res, this.winRef); } else if (ga.type.startsWith(SliderComponent.TypeTag)) { return this.mapGauges[ga.id] = SliderComponent.detectChange(ga, res, ref); } else if (ga.type.startsWith(HtmlSwitchComponent.TypeTag)) { return this.mapGauges[ga.id] = HtmlSwitchComponent.detectChange(ga, res, ref); } return false; } `

5. From the code, I found that the ext-bundle.min.js file should also be modified. Whether the file code is automatically generated and whether there is a method to modify this file.