@node-projects/web-component-designer-visualization-addons 0.1.124 → 0.1.126

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.
Files changed (6) hide show
  1. package/dist/helpers/BindingsHelper.d.ts +1 -0
  2. package/dist/helpers/BindingsHelper.js +44 -22
  3. package/dist/scripting/ScriptCommands.d.ts +15 -0
  4. package/dist/scripting/ScriptSystem.d.ts +3 -1
  5. package/dist/scripting/ScriptSystem.js +55 -17
  6. package/package.json +5 -5
package/dist/helpers/BindingsHelper.d.ts CHANGED
@@ -27,6 +27,7 @@ export declare function parseBindingString(id: string): {
27
27
  parts: string[];
28
28
  signals: string[];
29
29
  };
30
+ export declare function getNestedProperty(obj: any, path: any): any;
30
31
  export declare class BindingsHelper {
31
32
  #private;
32
33
  _visualizationHandler: VisualizationHandler;
package/dist/helpers/BindingsHelper.js CHANGED
@@ -35,6 +35,16 @@ export function parseBindingString(id) {
35
35
  parts.push(tx);
36
36
  return { parts, signals };
37
37
  }
38
+ export function getNestedProperty(obj, path) {
39
+ const parts = path.split('.');
40
+ let current = obj;
41
+ for (const part of parts) {
42
+ if (current == null || typeof current !== 'object')
43
+ return undefined;
44
+ current = current[part];
45
+ }
46
+ return current;
47
+ }
38
48
  class IndirectSignal {
39
49
  parts;
40
50
  signals;
@@ -58,39 +68,51 @@ class IndirectSignal {
58
68
  let nm = this.signals[i];
59
69
  if (nm[0] === '?' && nm[1] === '?') {
60
70
  const propNm = nm.substring(2);
61
- this.handleValueChanged(root[propNm], i);
62
- const evtCallback = () => this.handleValueChanged(root[propNm], i);
63
- const evtName = bindingsHelper.getChangedEventName(root, propNm);
64
- root.addEventListener(evtName, (evtCallback));
65
- this.cleanupCalls.push(() => root.removeEventListener(evtName, evtCallback));
71
+ if (!propNm.includes('.')) {
72
+ this.handleValueChanged(root[propNm], i);
73
+ const evtCallback = () => this.handleValueChanged(root[propNm], i);
74
+ const evtName = bindingsHelper.getChangedEventName(root, propNm);
75
+ root.addEventListener(evtName, (evtCallback));
76
+ this.cleanupCalls.push(() => root.removeEventListener(evtName, evtCallback));
77
+ }
78
+ else {
79
+ const val = getNestedProperty(root, propNm);
80
+ this.handleValueChanged(val, i);
81
+ }
66
82
  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;
72
83
  }
73
84
  else if (nm[0] === '#' && nm[1] === '#') {
74
85
  const propNm = nm.substring(2);
75
- this.handleValueChanged(element[propNm], i);
76
- const evtCallback = () => this.handleValueChanged(element[propNm], i);
77
- const evtName = bindingsHelper.getChangedEventName(element, propNm);
78
- element.addEventListener(evtName, (evtCallback));
79
- this.cleanupCalls.push(() => element.removeEventListener(evtName, evtCallback));
86
+ if (!propNm.includes('.')) {
87
+ this.handleValueChanged(element[propNm], i);
88
+ const evtCallback = () => this.handleValueChanged(element[propNm], i);
89
+ const evtName = bindingsHelper.getChangedEventName(element, propNm);
90
+ element.addEventListener(evtName, (evtCallback));
91
+ this.cleanupCalls.push(() => element.removeEventListener(evtName, evtCallback));
92
+ }
93
+ else {
94
+ const val = getNestedProperty(element, propNm);
95
+ this.handleValueChanged(val, i);
96
+ }
80
97
  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;
86
98
  }
87
99
  else if (nm[0] === '?') {
88
100
  //TODO: react to changes of signal name in prop
89
- nm = root[nm.substring(1)];
101
+ if (!nm.includes('.')) {
102
+ nm = root[nm.substring(1)];
103
+ }
104
+ else {
105
+ nm = getNestedProperty(root, nm.substring(1));
106
+ }
90
107
  }
91
108
  else if (nm[0] === '#') {
92
109
  //TODO: react to changes of signal name in prop
93
- nm = element[nm.substring(1)];
110
+ if (!nm.includes('.')) {
111
+ nm = root[nm.substring(1)];
112
+ }
113
+ else {
114
+ nm = getNestedProperty(root, nm.substring(1));
115
+ }
94
116
  }
95
117
  let cb = (id, value) => this.handleValueChanged(value.val, i);
96
118
  const subscr = this.visualizationHandler.subscribeState(nm, cb);
package/dist/scripting/ScriptCommands.d.ts CHANGED
@@ -1,5 +1,12 @@
1
1
  export declare type ScriptCommands = RunnableScriptCommands | Comment | Condition | Exit | Label | Goto;
2
2
  export declare type RunnableScriptCommands = OpenScreen | OpenUrl | OpenDialog | CloseDialog | ToggleSignalValue | SetSignalValue | IncrementSignalValue | DecrementSignalValue | SetBitInSignal | ClearBitInSignal | ToggleBitInSignal | Console | CalculateSignalValue | Javascript | SetElementProperty | Delay | SwitchLanguage | Login | Logout | SubscribeSignal | UnsubscribeSignal | WriteSignalsInGroup | ClearSignalsInGroup | RunScript | CopySignalValuesFromFolder | ShowMessageBox | ExportSignalValuesAsJson | ImportSignalValuesFromJson;
3
+ /**
4
+ * signal - a signal (the default)
5
+ * property - a property defined in the current screen/control
6
+ * elementProperty - a property defined on the elment raising the event
7
+ * rootProperty - a property defined on the root element
8
+ */
9
+ export type signalTarget = 'signal' | 'property' | 'elementProperty' | 'rootProperty';
3
10
  export interface Comment {
4
11
  type: 'Comment';
5
12
  comment: string;
@@ -94,6 +101,7 @@ export interface SetSignalValue {
94
101
  * @TJS-format signal
95
102
  */
96
103
  signal: string;
104
+ target: signalTarget;
97
105
  value: any;
98
106
  additionalData?: string;
99
107
  }
@@ -104,6 +112,7 @@ export interface ToggleSignalValue {
104
112
  * @TJS-format signal
105
113
  */
106
114
  signal: string;
115
+ target: signalTarget;
107
116
  additionalData?: string;
108
117
  }
109
118
  export interface IncrementSignalValue {
@@ -114,6 +123,7 @@ export interface IncrementSignalValue {
114
123
  */
115
124
  signal: string;
116
125
  value: number;
126
+ target: signalTarget;
117
127
  additionalData?: string;
118
128
  }
119
129
  export interface CalculateSignalValue {
@@ -128,6 +138,7 @@ export interface CalculateSignalValue {
128
138
  * Example: {adapter.0.level} * 100 + 30
129
139
  */
130
140
  formula: string;
141
+ target: signalTarget;
131
142
  additionalData?: string;
132
143
  }
133
144
  export interface DecrementSignalValue {
@@ -138,6 +149,7 @@ export interface DecrementSignalValue {
138
149
  */
139
150
  signal: string;
140
151
  value: number;
152
+ target: signalTarget;
141
153
  additionalData?: string;
142
154
  }
143
155
  export interface SetBitInSignal {
@@ -150,6 +162,7 @@ export interface SetBitInSignal {
150
162
  /**
151
163
  * @default 0
152
164
  */
165
+ target: signalTarget;
153
166
  bitNumber: number;
154
167
  additionalData?: string;
155
168
  }
@@ -163,6 +176,7 @@ export interface ClearBitInSignal {
163
176
  /**
164
177
  * @default 0
165
178
  */
179
+ target: signalTarget;
166
180
  bitNumber: number;
167
181
  additionalData?: string;
168
182
  }
@@ -176,6 +190,7 @@ export interface ToggleBitInSignal {
176
190
  /**
177
191
  * @default 0
178
192
  */
193
+ target: signalTarget;
179
194
  bitNumber: number;
180
195
  additionalData?: string;
181
196
  }
package/dist/scripting/ScriptSystem.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { VisualisationElementScript } from "../interfaces/VisualisationElementScript.js";
2
2
  import { VisualizationHandler } from "../interfaces/VisualizationHandler.js";
3
- import { ScriptCommands } from "./ScriptCommands.js";
3
+ import { ScriptCommands, signalTarget } from "./ScriptCommands.js";
4
4
  export type contextType = {
5
5
  event: Event;
6
6
  element: Element;
@@ -13,6 +13,8 @@ export declare class ScriptSystem {
13
13
  _subscriptionCallback: () => void;
14
14
  constructor(visualizationHandler: VisualizationHandler);
15
15
  execute(scriptCommands: ScriptCommands[], outerContext: contextType): Promise<void>;
16
+ getValueFromTarget(target: signalTarget, name: string, context: contextType): Promise<any>;
17
+ setValueOnTarget(target: signalTarget, name: string, context: contextType, value: any): Promise<void>;
16
18
  runExternalScript(name: string, type: string): Promise<void>;
17
19
  runScriptCommand<T extends ScriptCommands>(command: T, context: contextType): Promise<void>;
18
20
  getTarget(context: contextType, targetSelectorTarget: 'element' | 'container', parentLevel: number): Element;
package/dist/scripting/ScriptSystem.js CHANGED
@@ -81,6 +81,34 @@ export class ScriptSystem {
81
81
  await this.runScriptCommand(c, outerContext);
82
82
  }
83
83
  }
84
+ async getValueFromTarget(target, name, context) {
85
+ if (target === 'property') {
86
+ return context.instance[name];
87
+ }
88
+ else if (target === 'elementProperty') {
89
+ return context.element[name];
90
+ }
91
+ else if (target === 'rootProperty') {
92
+ return context.root[name];
93
+ }
94
+ else {
95
+ return (await this._visualizationHandler.getState(this.getSignalName(name, context)))?.val;
96
+ }
97
+ }
98
+ async setValueOnTarget(target, name, context, value) {
99
+ if (target === 'property') {
100
+ context.instance[name] = value;
101
+ }
102
+ else if (target === 'elementProperty') {
103
+ context.element[name] = value;
104
+ }
105
+ else if (target === 'rootProperty') {
106
+ context.root[name] = value;
107
+ }
108
+ else {
109
+ await this._visualizationHandler.setState(this.getSignalName(name, context), value);
110
+ }
111
+ }
84
112
  async runExternalScript(name, type) {
85
113
  //TODO...
86
114
  }
@@ -112,61 +140,71 @@ export class ScriptSystem {
112
140
  }
113
141
  case 'ToggleSignalValue': {
114
142
  const signal = await this.getValue(command.signal, context);
115
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
116
- await this._visualizationHandler.setState(this.getSignalName(signal, context), !state?.val);
143
+ const target = await this.getValue(command.target, context);
144
+ let state = await this.getValueFromTarget(target, signal, context);
145
+ await this._visualizationHandler.setState(this.getSignalName(signal, context), !state);
117
146
  break;
118
147
  }
119
148
  case 'SetSignalValue': {
120
149
  const signal = await this.getValue(command.signal, context);
121
- await this._visualizationHandler.setState(this.getSignalName(signal, context), await this.getValue(command.value, context));
150
+ const target = await this.getValue(command.target, context);
151
+ await this.setValueOnTarget(target, signal, context, await this.getValue(command.value, context));
122
152
  break;
123
153
  }
124
154
  case 'IncrementSignalValue': {
125
155
  const signal = await this.getValue(command.signal, context);
126
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
127
- await this._visualizationHandler.setState(this.getSignalName(signal, context), (state.val + await this.getValue(command.value, context)));
156
+ const target = await this.getValue(command.target, context);
157
+ let state = await this.getValueFromTarget(target, signal, context);
158
+ const val = state + await this.getValue(command.value, context);
159
+ await this.setValueOnTarget(target, signal, context, val);
128
160
  break;
129
161
  }
130
162
  case 'DecrementSignalValue': {
131
163
  const signal = await this.getValue(command.signal, context);
132
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
133
- await this._visualizationHandler.setState(this.getSignalName(signal, context), state.val - await this.getValue(command.value, context));
164
+ const target = await this.getValue(command.target, context);
165
+ let state = await this.getValueFromTarget(target, signal, context);
166
+ const val = state - await this.getValue(command.value, context);
167
+ await this.setValueOnTarget(target, signal, context, val);
134
168
  break;
135
169
  }
136
170
  case 'CalculateSignalValue': {
137
171
  const formula = await this.getValue(command.formula, context);
172
+ const target = await this.getValue(command.target, context);
138
173
  const targetSignal = await this.getValue(command.targetSignal, context);
139
174
  let nm = await this.parseStringWithValues(formula, context);
140
175
  let result = eval(nm);
141
- await this._visualizationHandler.setState(this.getSignalName(targetSignal, context), result);
176
+ await this.setValueOnTarget(target, targetSignal, context, result);
142
177
  break;
143
178
  }
144
179
  case 'SetBitInSignal': {
145
180
  const signal = await this.getValue(command.signal, context);
146
181
  const bitNumber = await this.getValue(command.bitNumber ?? 0, context);
147
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
182
+ const target = await this.getValue(command.target, context);
183
+ let state = await this.getValueFromTarget(target, signal, context);
148
184
  let mask = Long.fromNumber(1).shiftLeft(bitNumber);
149
- const newVal = Long.fromNumber(state.val).or(mask).toNumber();
150
- await this._visualizationHandler.setState(this.getSignalName(signal, context), newVal);
185
+ const newVal = Long.fromNumber(state).or(mask).toNumber();
186
+ await this.setValueOnTarget(target, signal, context, newVal);
151
187
  break;
152
188
  }
153
189
  case 'ClearBitInSignal': {
154
190
  const signal = await this.getValue(command.signal, context);
155
191
  const bitNumber = await this.getValue(command.bitNumber ?? 0, context);
156
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
192
+ const target = await this.getValue(command.target, context);
193
+ let state = await this.getValueFromTarget(target, signal, context);
157
194
  let mask = Long.fromNumber(1).shiftLeft(bitNumber);
158
195
  mask.negate();
159
- const newVal = Long.fromNumber(state.val).and(mask).toNumber();
160
- await this._visualizationHandler.setState(this.getSignalName(signal, context), newVal);
196
+ const newVal = Long.fromNumber(state).and(mask).toNumber();
197
+ await this.setValueOnTarget(target, signal, context, newVal);
161
198
  break;
162
199
  }
163
200
  case 'ToggleBitInSignal': {
164
201
  const signal = await this.getValue(command.signal, context);
165
202
  const bitNumber = await this.getValue(command.bitNumber ?? 0, context);
166
- let state = await this._visualizationHandler.getState(this.getSignalName(signal, context));
203
+ const target = await this.getValue(command.target, context);
204
+ let state = await this.getValueFromTarget(target, signal, context);
167
205
  let mask = Long.fromNumber(1).shiftLeft(bitNumber);
168
- const newVal = Long.fromNumber(state.val).xor(mask).toNumber();
169
- await this._visualizationHandler.setState(this.getSignalName(signal, context), newVal);
206
+ const newVal = Long.fromNumber(state).xor(mask).toNumber();
207
+ await this.setValueOnTarget(target, signal, context, newVal);
170
208
  break;
171
209
  }
172
210
  case 'Javascript': {
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.124",
4
+ "version": "0.1.126",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
7
7
  "author": "jochen.kuehner@gmx.de",
@@ -13,16 +13,16 @@
13
13
  "prepublishOnly": "npm run build"
14
14
  },
15
15
  "dependencies": {
16
- "@adobe/css-tools": "^4.4.0",
17
- "@blockly/zoom-to-fit": "^6.0.9",
16
+ "@adobe/css-tools": ">=4.4.0",
17
+ "@blockly/zoom-to-fit": ">=6.0.9",
18
18
  "@node-projects/base-custom-webcomponent": ">=0.27.8",
19
19
  "@node-projects/propertygrid.webcomponent": ">=1.2.3",
20
20
  "@node-projects/splitview.webcomponent": ">=1.0.1",
21
21
  "@node-projects/web-component-designer": ">=0.1.224",
22
22
  "@node-projects/web-component-designer-codeview-monaco": ">=0.1.32",
23
23
  "@node-projects/web-component-designer-widgets-wunderbaum": ">=0.1.29",
24
- "blockly": "^11.1.1",
25
- "long": "^5.2.3"
24
+ "blockly": ">=11.1.1",
25
+ "long": ">=5.2.3"
26
26
  },
27
27
  "repository": {
28
28
  "type": "git",