@node-projects/web-component-designer-visualization-addons 0.1.120 → 0.1.122
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -28,10 +28,11 @@ export declare class BindingsEditor extends BaseCustomWebComponentConstructorApp
|
|
|
28
28
|
key: string;
|
|
29
29
|
value: any;
|
|
30
30
|
}[];
|
|
31
|
+
convertersString: string;
|
|
31
32
|
objectValueType: string;
|
|
32
33
|
protected _property: IProperty;
|
|
33
34
|
protected _binding: IBinding & {
|
|
34
|
-
converter: Record<string, any
|
|
35
|
+
converter: Record<string, any> | string;
|
|
35
36
|
};
|
|
36
37
|
protected _bindingTarget: BindingTarget;
|
|
37
38
|
protected _serviceContainer: ServiceContainer;
|
|
@@ -41,7 +42,9 @@ export declare class BindingsEditor extends BaseCustomWebComponentConstructorApp
|
|
|
41
42
|
protected _objNmInput: HTMLInputElement;
|
|
42
43
|
constructor(property: IProperty, binding: IBinding & {
|
|
43
44
|
converter: Record<string, any>;
|
|
44
|
-
}, bindingTarget: BindingTarget, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer, shell: VisualizationShell
|
|
45
|
+
}, bindingTarget: BindingTarget, serviceContainer: ServiceContainer, instanceServiceContainer: InstanceServiceContainer, shell: VisualizationShell, config?: {
|
|
46
|
+
namedConverters: boolean;
|
|
47
|
+
});
|
|
45
48
|
ready(): void;
|
|
46
49
|
_focusRow(index: number): void;
|
|
47
50
|
_updatefocusedRow(): void;
|
|
@@ -56,8 +56,8 @@ export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
|
|
|
56
56
|
</div>
|
|
57
57
|
<div class="vertical-grid" style="margin-top: 10px;">
|
|
58
58
|
<div>
|
|
59
|
-
<div class="input-headline">
|
|
60
|
-
<span>converter</span
|
|
59
|
+
<div class="input-headline" style="display: flex;align-items: center;">
|
|
60
|
+
<span>converter</span>:<input id="namedConverterInput" style="width: 100%; margin-left: 15px;" value="{{?this.convertersString::change}}">
|
|
61
61
|
</div>
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
@@ -181,6 +181,7 @@ export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
|
|
|
181
181
|
events = '';
|
|
182
182
|
invert = false;
|
|
183
183
|
converters = [];
|
|
184
|
+
convertersString;
|
|
184
185
|
objectValueType;
|
|
185
186
|
_property;
|
|
186
187
|
_binding;
|
|
@@ -190,7 +191,7 @@ export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
|
|
|
190
191
|
_shell;
|
|
191
192
|
_activeRow = -1;
|
|
192
193
|
_objNmInput;
|
|
193
|
-
constructor(property, binding, bindingTarget, serviceContainer, instanceServiceContainer, shell) {
|
|
194
|
+
constructor(property, binding, bindingTarget, serviceContainer, instanceServiceContainer, shell, config = { namedConverters: true }) {
|
|
194
195
|
super();
|
|
195
196
|
super._restoreCachedInititalValues();
|
|
196
197
|
this._objNmInput = this._getDomElement('objectName');
|
|
@@ -200,6 +201,9 @@ export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
|
|
|
200
201
|
this._serviceContainer = serviceContainer;
|
|
201
202
|
this._instanceServiceContainer = instanceServiceContainer;
|
|
202
203
|
this._shell = shell;
|
|
204
|
+
if (!config?.namedConverters) {
|
|
205
|
+
this._getDomElement('namedConverterInput').style.display = 'none';
|
|
206
|
+
}
|
|
203
207
|
}
|
|
204
208
|
ready() {
|
|
205
209
|
this._parseAttributesToProperties();
|
|
@@ -218,8 +222,13 @@ export class BindingsEditor extends BaseCustomWebComponentConstructorAppend {
|
|
|
218
222
|
if (this._binding.bindableObjectNames)
|
|
219
223
|
this.objectNames = this._binding.bindableObjectNames.join(';');
|
|
220
224
|
if (this._binding.converter) {
|
|
221
|
-
|
|
222
|
-
this.
|
|
225
|
+
if (typeof this._binding.converter === 'string') {
|
|
226
|
+
this.convertersString = this._binding.converter;
|
|
227
|
+
}
|
|
228
|
+
else {
|
|
229
|
+
for (let c in this._binding.converter) {
|
|
230
|
+
this.converters.push({ key: c, value: this._binding.converter[c] });
|
|
231
|
+
}
|
|
223
232
|
}
|
|
224
233
|
}
|
|
225
234
|
if (this._binding.changedEvents && this._binding.changedEvents.length)
|
|
@@ -30,6 +30,7 @@ export declare function parseBindingString(id: string): {
|
|
|
30
30
|
export declare class BindingsHelper {
|
|
31
31
|
#private;
|
|
32
32
|
_visualizationHandler: VisualizationHandler;
|
|
33
|
+
namedConverterCallback: (converter: string, value: any, element: Element, binding: namedBinding) => any;
|
|
33
34
|
constructor(visualizationHandler: VisualizationHandler);
|
|
34
35
|
getChangedEventName(element: Element, propertyName: string): string;
|
|
35
36
|
parseBinding(element: Element, name: string, value: string, bindingTarget: BindingTarget, prefix: string): namedBinding;
|
|
@@ -64,6 +64,11 @@ class IndirectSignal {
|
|
|
64
64
|
root.addEventListener(evtName, (evtCallback));
|
|
65
65
|
this.cleanupCalls.push(() => root.removeEventListener(evtName, evtCallback));
|
|
66
66
|
continue;
|
|
67
|
+
//} else if (nm[0] === '?' && nm[1] === '$') {
|
|
68
|
+
// const attrNm = nm.substring(2);
|
|
69
|
+
// let val = root.getAttribute(attrNm);
|
|
70
|
+
// this.handleValueChanged(val, i);
|
|
71
|
+
// continue;
|
|
67
72
|
}
|
|
68
73
|
else if (nm[0] === '#' && nm[1] === '#') {
|
|
69
74
|
const propNm = nm.substring(2);
|
|
@@ -73,6 +78,11 @@ class IndirectSignal {
|
|
|
73
78
|
element.addEventListener(evtName, (evtCallback));
|
|
74
79
|
this.cleanupCalls.push(() => element.removeEventListener(evtName, evtCallback));
|
|
75
80
|
continue;
|
|
81
|
+
//} else if (nm[0] === '#' && nm[1] === '$') {
|
|
82
|
+
// const attrNm = nm.substring(2);
|
|
83
|
+
// let val = element.getAttribute(attrNm);
|
|
84
|
+
// this.handleValueChanged(val, i);
|
|
85
|
+
// continue;
|
|
76
86
|
}
|
|
77
87
|
else if (nm[0] === '?') {
|
|
78
88
|
//TODO: react to changes of signal name in prop
|
|
@@ -136,6 +146,7 @@ class IndirectSignal {
|
|
|
136
146
|
}
|
|
137
147
|
export class BindingsHelper {
|
|
138
148
|
_visualizationHandler;
|
|
149
|
+
namedConverterCallback;
|
|
139
150
|
constructor(visualizationHandler) {
|
|
140
151
|
this._visualizationHandler = visualizationHandler;
|
|
141
152
|
}
|
|
@@ -830,50 +841,55 @@ export class BindingsHelper {
|
|
|
830
841
|
valuesObject[signalVarNames.length - 1] = v;
|
|
831
842
|
}
|
|
832
843
|
if (binding[1].converter) {
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
v = new Function(signalVarNames, 'return `' + binding[1].converter[stringValue] + '`')(...valuesObject);
|
|
844
|
+
if (typeof binding[1].converter === 'string') {
|
|
845
|
+
v = this.namedConverterCallback(binding[1].converter, v, element, binding);
|
|
836
846
|
}
|
|
837
847
|
else {
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
break;
|
|
848
|
+
const stringValue = (v != null ? v.toString() : v);
|
|
849
|
+
if (stringValue in binding[1].converter) {
|
|
850
|
+
v = new Function(signalVarNames, 'return `' + binding[1].converter[stringValue] + '`')(...valuesObject);
|
|
851
|
+
}
|
|
852
|
+
else {
|
|
853
|
+
//@ts-ignore
|
|
854
|
+
const nr = parseFloat(v);
|
|
855
|
+
for (let c in binding[1].converter) {
|
|
856
|
+
if (c.length > 2 && c[0] === '>' && c[1] === '=') {
|
|
857
|
+
const wr = parseFloat(c.substring(2));
|
|
858
|
+
if (nr >= wr) {
|
|
859
|
+
v = new Function(signalVarNames, 'return `' + binding[1].converter[c] + '`')(...valuesObject);
|
|
860
|
+
break;
|
|
861
|
+
}
|
|
853
862
|
}
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
863
|
+
else if (c.length > 2 && c[0] === '<' && c[1] === '=') {
|
|
864
|
+
const wr = parseFloat(c.substring(2));
|
|
865
|
+
if (nr <= wr) {
|
|
866
|
+
v = new Function(signalVarNames, 'return `' + binding[1].converter[c] + '`')(...valuesObject);
|
|
867
|
+
break;
|
|
868
|
+
}
|
|
860
869
|
}
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
870
|
+
else if (c.length > 1 && c[0] === '>') {
|
|
871
|
+
const wr = parseFloat(c.substring(1));
|
|
872
|
+
if (nr > wr) {
|
|
873
|
+
v = new Function(signalVarNames, 'return `' + binding[1].converter[c] + '`')(...valuesObject);
|
|
874
|
+
break;
|
|
875
|
+
}
|
|
867
876
|
}
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
if (sp.length > 1) {
|
|
872
|
-
if ((sp[0] === '' || nr >= parseFloat(sp[0])) && (sp[1] === '' || parseFloat(sp[1]) >= nr)) {
|
|
877
|
+
else if (c.length > 1 && c[0] === '<') {
|
|
878
|
+
const wr = parseFloat(c.substring(1));
|
|
879
|
+
if (nr < wr) {
|
|
873
880
|
v = new Function(signalVarNames, 'return `' + binding[1].converter[c] + '`')(...valuesObject);
|
|
874
881
|
break;
|
|
875
882
|
}
|
|
876
883
|
}
|
|
884
|
+
else {
|
|
885
|
+
const sp = c.split('-');
|
|
886
|
+
if (sp.length > 1) {
|
|
887
|
+
if ((sp[0] === '' || nr >= parseFloat(sp[0])) && (sp[1] === '' || parseFloat(sp[1]) >= nr)) {
|
|
888
|
+
v = new Function(signalVarNames, 'return `' + binding[1].converter[c] + '`')(...valuesObject);
|
|
889
|
+
break;
|
|
890
|
+
}
|
|
891
|
+
}
|
|
892
|
+
}
|
|
877
893
|
}
|
|
878
894
|
}
|
|
879
895
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"description": "web-component-designer addon for visualizations",
|
|
3
3
|
"name": "@node-projects/web-component-designer-visualization-addons",
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.122",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
7
7
|
"author": "jochen.kuehner@gmx.de",
|