@node-projects/web-component-designer-visualization-addons 0.1.50 → 0.1.52
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.
- package/dist/blockly/BlocklyJavascriptHelper.d.ts +2 -1
- package/dist/blockly/BlocklyJavascriptHelper.js +3 -4
- package/dist/blockly/BlocklyScriptEditor.d.ts +2 -1
- package/dist/blockly/BlocklyScriptEditor.js +4 -3
- package/dist/blockly/BlocklyToolbox.js +0 -2
- package/dist/blockly/components/GetState.js +1 -1
- package/dist/blockly/components/SetState.js +1 -1
- package/dist/components/EventAssignment.d.ts +2 -1
- package/dist/components/EventAssignment.js +4 -2
- package/dist/helpers/BindingsHelper.d.ts +2 -2
- package/dist/helpers/BindingsHelper.js +41 -24
- package/dist/interfaces/IScriptMultiplexValue.d.ts +1 -1
- package/dist/interfaces/IScriptMultiplexValue.js +1 -1
- package/dist/interfaces/VisualizationBinding.d.ts +2 -0
- package/dist/scripting/ScriptSystem.d.ts +1 -1
- package/dist/scripting/ScriptSystem.js +13 -2
- package/package.json +1 -1
|
@@ -1,2 +1,3 @@
|
|
|
1
|
+
import { VisualizationHandler } from '../interfaces/VisualizationHandler.js';
|
|
1
2
|
import './components/components.js';
|
|
2
|
-
export declare function generateEventCodeFromBlockly(data: any): Promise<(event: Event, shadowRoot: ShadowRoot, parameters: Record<string, any>, relativeSignalsPath: string) => void>;
|
|
3
|
+
export declare function generateEventCodeFromBlockly(data: any): Promise<(event: Event, shadowRoot: ShadowRoot, parameters: Record<string, any>, relativeSignalsPath: string, visualizationHandler: VisualizationHandler, context: any) => void>;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
//import Blockly from 'blockly';
|
|
2
1
|
import './components/components.js';
|
|
3
2
|
//TODO: remove imports, only leave Runtime
|
|
4
3
|
const prefix = `function extractPart(obj, propertyPath) {
|
|
@@ -15,7 +14,7 @@ function delay(ms) {
|
|
|
15
14
|
});
|
|
16
15
|
}
|
|
17
16
|
|
|
18
|
-
export async function run(eventData, shadowRoot, parameters, relativeSignalsPath) {
|
|
17
|
+
export async function run(eventData, shadowRoot, parameters, relativeSignalsPath, visualizationHandler, context) {
|
|
19
18
|
`;
|
|
20
19
|
const postfix = `}`;
|
|
21
20
|
export async function generateEventCodeFromBlockly(data) {
|
|
@@ -36,9 +35,9 @@ export async function generateEventCodeFromBlockly(data) {
|
|
|
36
35
|
//@ts-ignore
|
|
37
36
|
Blockly.JavaScript.addReservedWords('delay');
|
|
38
37
|
//@ts-ignore
|
|
39
|
-
Blockly.JavaScript.addReservedWords('
|
|
38
|
+
Blockly.JavaScript.addReservedWords('visualizationHandler');
|
|
40
39
|
//@ts-ignore
|
|
41
|
-
Blockly.JavaScript.addReservedWords('
|
|
40
|
+
Blockly.JavaScript.addReservedWords('context');
|
|
42
41
|
//@ts-ignore
|
|
43
42
|
let code = Blockly.JavaScript.workspaceToCode(workspace);
|
|
44
43
|
const scriptUrl = URL.createObjectURL(new Blob([prefix + code + postfix], { type: 'application/javascript' }));
|
|
@@ -8,7 +8,8 @@ export declare class BlocklyScriptEditor extends BaseCustomWebComponentConstruct
|
|
|
8
8
|
static blocklyStyle1: CSSStyleSheet;
|
|
9
9
|
static blocklyStyle2: CSSStyleSheet;
|
|
10
10
|
resizeObserver: ResizeObserver;
|
|
11
|
-
|
|
11
|
+
private _toolbox;
|
|
12
|
+
constructor(toolbox: any);
|
|
12
13
|
createBlockly(): void;
|
|
13
14
|
ready(): void;
|
|
14
15
|
save(): any;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { BaseCustomWebComponentConstructorAppend, html, css } from '@node-projects/base-custom-webcomponent';
|
|
2
|
-
import toolbox from './BlocklyToolbox.js';
|
|
3
2
|
//import Blockly from 'blockly';
|
|
4
3
|
export class BlocklyScriptEditor extends BaseCustomWebComponentConstructorAppend {
|
|
5
4
|
static template = html `
|
|
@@ -19,9 +18,11 @@ export class BlocklyScriptEditor extends BaseCustomWebComponentConstructorAppend
|
|
|
19
18
|
static blocklyStyle1;
|
|
20
19
|
static blocklyStyle2;
|
|
21
20
|
resizeObserver;
|
|
22
|
-
|
|
21
|
+
_toolbox;
|
|
22
|
+
constructor(toolbox) {
|
|
23
23
|
super();
|
|
24
24
|
super._restoreCachedInititalValues();
|
|
25
|
+
this._toolbox = toolbox;
|
|
25
26
|
this.blocklyDiv = this._getDomElement('blocklyDiv');
|
|
26
27
|
this._assignEvents();
|
|
27
28
|
this.createBlockly();
|
|
@@ -50,7 +51,7 @@ export class BlocklyScriptEditor extends BaseCustomWebComponentConstructorAppend
|
|
|
50
51
|
//@ts-ignore
|
|
51
52
|
this.workspace = Blockly.inject(this.blocklyDiv, {
|
|
52
53
|
theme: theme,
|
|
53
|
-
toolbox:
|
|
54
|
+
toolbox: this._toolbox,
|
|
54
55
|
renderer: renderer,
|
|
55
56
|
trashcan: true,
|
|
56
57
|
zoom: {
|
|
@@ -15,7 +15,7 @@ Blockly.Blocks['get_state'] = {
|
|
|
15
15
|
Blockly.JavaScript.forBlock['get_state'] = function (block, generator) {
|
|
16
16
|
//@ts-ignore
|
|
17
17
|
const id = Blockly.JavaScript.valueToCode(block, 'OID', Blockly.JavaScript.ORDER_ATOMIC);
|
|
18
|
-
const code = `(await
|
|
18
|
+
const code = `(await visualizationHandler.getState((${id}[0] === '.' ? relativeSignalsPath : '') + ${id})).val`;
|
|
19
19
|
//@ts-ignore
|
|
20
20
|
return [code, Blockly.JavaScript.ORDER_NONE];
|
|
21
21
|
};
|
|
@@ -21,6 +21,6 @@ Blockly.JavaScript.forBlock['set_state'] = function (block) {
|
|
|
21
21
|
const id = Blockly.JavaScript.valueToCode(block, 'OID', Blockly.JavaScript.ORDER_ATOMIC);
|
|
22
22
|
//@ts-ignore
|
|
23
23
|
const value = Blockly.JavaScript.valueToCode(block, 'VALUE', Blockly.JavaScript.ORDER_ATOMIC);
|
|
24
|
-
const code = `await
|
|
24
|
+
const code = `await visualizationHandler.setState((${id}[0] === '.' ? relativeSignalsPath : '') + ${id}, ${value});\n`;
|
|
25
25
|
return code;
|
|
26
26
|
};
|
|
@@ -16,6 +16,7 @@ export declare class EventAssignment extends BaseCustomWebComponentConstructorAp
|
|
|
16
16
|
static readonly is = "node-projects-visualization-event-assignment";
|
|
17
17
|
constructor();
|
|
18
18
|
ready(): void;
|
|
19
|
+
private _blocklyToolbox;
|
|
19
20
|
private _instanceServiceContainer;
|
|
20
21
|
private _selectionChangedHandler;
|
|
21
22
|
private _selectedItems;
|
|
@@ -24,7 +25,7 @@ export declare class EventAssignment extends BaseCustomWebComponentConstructorAp
|
|
|
24
25
|
private _scriptCommandsTypeInfo;
|
|
25
26
|
private _propertiesTypeInfo;
|
|
26
27
|
events: IEvent[];
|
|
27
|
-
initialize(visualizationHandler: VisualizationHandler, visualizationShell: VisualizationShell, scriptCommandsTypeInfo: any, propertiesTypeInfo: any): void;
|
|
28
|
+
initialize(visualizationHandler: VisualizationHandler, visualizationShell: VisualizationShell, scriptCommandsTypeInfo: any, propertiesTypeInfo: any, blocklyToolbox: any): void;
|
|
28
29
|
set instanceServiceContainer(value: InstanceServiceContainer);
|
|
29
30
|
protected _createControlsForScript(eventItem: IEvent): any;
|
|
30
31
|
protected _getScriptName(eventItem: IEvent): any;
|
|
@@ -67,6 +67,7 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
|
|
|
67
67
|
ready() {
|
|
68
68
|
this._bindingsParse();
|
|
69
69
|
}
|
|
70
|
+
_blocklyToolbox;
|
|
70
71
|
_instanceServiceContainer;
|
|
71
72
|
_selectionChangedHandler;
|
|
72
73
|
_selectedItems;
|
|
@@ -75,11 +76,12 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
|
|
|
75
76
|
_scriptCommandsTypeInfo;
|
|
76
77
|
_propertiesTypeInfo;
|
|
77
78
|
events;
|
|
78
|
-
initialize(visualizationHandler, visualizationShell, scriptCommandsTypeInfo, propertiesTypeInfo) {
|
|
79
|
+
initialize(visualizationHandler, visualizationShell, scriptCommandsTypeInfo, propertiesTypeInfo, blocklyToolbox) {
|
|
79
80
|
this._visualizationHandler = visualizationHandler;
|
|
80
81
|
this._visualizationShell = visualizationShell;
|
|
81
82
|
this._scriptCommandsTypeInfo = scriptCommandsTypeInfo;
|
|
82
83
|
this._propertiesTypeInfo = propertiesTypeInfo;
|
|
84
|
+
this._blocklyToolbox = blocklyToolbox;
|
|
83
85
|
}
|
|
84
86
|
set instanceServiceContainer(value) {
|
|
85
87
|
this._instanceServiceContainer = value;
|
|
@@ -304,7 +306,7 @@ export class EventAssignment extends BaseCustomWebComponentConstructorAppend {
|
|
|
304
306
|
}
|
|
305
307
|
async _editBlockly(e, eventItem) {
|
|
306
308
|
let selectedItem = this.selectedItems[0];
|
|
307
|
-
const edt = new BlocklyScriptEditor();
|
|
309
|
+
const edt = new BlocklyScriptEditor(this._blocklyToolbox);
|
|
308
310
|
edt.title = "Blockly Script for '" + eventItem.name + "' of '" + selectedItem.name + "'";
|
|
309
311
|
let data = selectedItem.getAttribute('@' + eventItem.name);
|
|
310
312
|
let parameters = null;
|
|
@@ -30,7 +30,7 @@ export declare class IndirectSignal {
|
|
|
30
30
|
private visualizationHandler;
|
|
31
31
|
private element;
|
|
32
32
|
private relativeSignalPath;
|
|
33
|
-
constructor(visualizationHandler: VisualizationHandler, id: string, valueChangedCb: (value: State) => void, element: Element, relativeSignalPath: string);
|
|
33
|
+
constructor(visualizationHandler: VisualizationHandler, id: string, valueChangedCb: (value: State) => void, element: Element, relativeSignalPath: string, root: HTMLElement);
|
|
34
34
|
private parseIndirectBinding;
|
|
35
35
|
handleValueChanged(value: any, index: number): void;
|
|
36
36
|
dispose(): void;
|
|
@@ -50,7 +50,7 @@ export declare class BindingsHelper {
|
|
|
50
50
|
applyBinding(element: Element, binding: namedBinding, relativeSignalPath: string, root: HTMLElement): () => void;
|
|
51
51
|
private addTwoWayBinding;
|
|
52
52
|
private static parseValueWithType;
|
|
53
|
-
handleValueChanged(element: Element, binding: namedBinding, value: any, valuesObject: any[], index: number, signalVarNames: string[], noParse: boolean): void;
|
|
53
|
+
handleValueChanged(element: Element, binding: namedBinding, value: any, valuesObject: any[], index: number, signalVarNames: string[], noParse: boolean, relativeSignalPath: string): void;
|
|
54
54
|
static camelToDotCase(text: string): string;
|
|
55
55
|
static dotToCamelCase(text: string): string;
|
|
56
56
|
}
|
|
@@ -53,7 +53,7 @@ export class IndirectSignal {
|
|
|
53
53
|
visualizationHandler;
|
|
54
54
|
element;
|
|
55
55
|
relativeSignalPath;
|
|
56
|
-
constructor(visualizationHandler, id, valueChangedCb, element, relativeSignalPath) {
|
|
56
|
+
constructor(visualizationHandler, id, valueChangedCb, element, relativeSignalPath, root) {
|
|
57
57
|
this.visualizationHandler = visualizationHandler;
|
|
58
58
|
this.valueChangedCb = valueChangedCb;
|
|
59
59
|
this.element = element;
|
|
@@ -63,11 +63,11 @@ export class IndirectSignal {
|
|
|
63
63
|
for (let i = 0; i < this.signals.length; i++) {
|
|
64
64
|
let nm = this.signals[i];
|
|
65
65
|
if (nm[0] === '?' && nm[1] === '?') {
|
|
66
|
-
this.handleValueChanged(
|
|
66
|
+
this.handleValueChanged(root[nm.substring(2)], i);
|
|
67
67
|
continue;
|
|
68
68
|
}
|
|
69
69
|
else if (nm[0] === '?') {
|
|
70
|
-
nm =
|
|
70
|
+
nm = root[nm.substring(1)];
|
|
71
71
|
}
|
|
72
72
|
let cb = (id, value) => this.handleValueChanged(value.val, i);
|
|
73
73
|
this.unsubscribeList.push([cb, this.visualizationHandler.subscribeState(nm, cb)]);
|
|
@@ -224,7 +224,8 @@ export class BindingsHelper {
|
|
|
224
224
|
!binding.expression && !binding.expressionTwoWay &&
|
|
225
225
|
binding.converter == null &&
|
|
226
226
|
!binding.type &&
|
|
227
|
-
!binding.historic
|
|
227
|
+
!binding.historic &&
|
|
228
|
+
!binding.writeBackSignal) {
|
|
228
229
|
if (targetName == 'textContent')
|
|
229
230
|
return [bindingPrefixContent + 'text', (binding.twoWay ? '=' : '') + (binding.inverted ? '!' : '') + binding.signal + (!binding.twoWay && binding.signal.includes(';') ? ';' : '') + eventsString];
|
|
230
231
|
if (targetName == 'innerHTML')
|
|
@@ -237,7 +238,8 @@ export class BindingsHelper {
|
|
|
237
238
|
!binding.expressionTwoWay &&
|
|
238
239
|
binding.converter == null &&
|
|
239
240
|
!binding.type &&
|
|
240
|
-
!binding.historic
|
|
241
|
+
!binding.historic &&
|
|
242
|
+
!binding.writeBackSignal) {
|
|
241
243
|
if (targetName == 'textContent')
|
|
242
244
|
return [bindingPrefixContent + 'text', (binding.inverted ? '!' : '') + binding.signal + ';' + binding.expression + eventsString];
|
|
243
245
|
if (targetName == 'innerHTML')
|
|
@@ -248,7 +250,8 @@ export class BindingsHelper {
|
|
|
248
250
|
!binding.expression && !binding.expressionTwoWay &&
|
|
249
251
|
binding.converter == null &&
|
|
250
252
|
!binding.type &&
|
|
251
|
-
!binding.historic
|
|
253
|
+
!binding.historic &&
|
|
254
|
+
!binding.writeBackSignal) {
|
|
252
255
|
return [bindingPrefixAttribute + PropertiesHelper.camelToDashCase(targetName), (binding.twoWay ? '=' : '') + (binding.inverted ? '!' : '') + binding.signal + (!binding.twoWay && binding.signal.includes(';') ? ';' : '') + eventsString];
|
|
253
256
|
}
|
|
254
257
|
//Multi Var Expressions
|
|
@@ -257,14 +260,16 @@ export class BindingsHelper {
|
|
|
257
260
|
!binding.expressionTwoWay &&
|
|
258
261
|
binding.converter == null &&
|
|
259
262
|
!binding.type &&
|
|
260
|
-
!binding.historic
|
|
263
|
+
!binding.historic &&
|
|
264
|
+
!binding.writeBackSignal) {
|
|
261
265
|
return [bindingPrefixAttribute + PropertiesHelper.camelToDashCase(targetName), (binding.twoWay ? '=' : '') + (binding.inverted ? '!' : '') + binding.signal + ';' + binding.expression + eventsString];
|
|
262
266
|
}
|
|
263
267
|
if (!needsJson && binding.target == BindingTarget.class &&
|
|
264
268
|
!binding.expression && !binding.expressionTwoWay &&
|
|
265
269
|
binding.converter == null &&
|
|
266
270
|
!binding.type &&
|
|
267
|
-
!binding.historic
|
|
271
|
+
!binding.historic &&
|
|
272
|
+
!binding.writeBackSignal) {
|
|
268
273
|
return [bindingPrefixClass + PropertiesHelper.camelToDashCase(targetName), (binding.inverted ? '!' : '') + binding.signal + (!binding.twoWay && binding.signal.includes(';') ? ';' : '') + eventsString];
|
|
269
274
|
}
|
|
270
275
|
//Multi Var Expressions
|
|
@@ -273,14 +278,16 @@ export class BindingsHelper {
|
|
|
273
278
|
!binding.expressionTwoWay &&
|
|
274
279
|
binding.converter == null &&
|
|
275
280
|
!binding.type &&
|
|
276
|
-
!binding.historic
|
|
281
|
+
!binding.historic &&
|
|
282
|
+
!binding.writeBackSignal) {
|
|
277
283
|
return [bindingPrefixClass + PropertiesHelper.camelToDashCase(targetName), (binding.inverted ? '!' : '') + binding.signal + ';' + binding.expression + eventsString];
|
|
278
284
|
}
|
|
279
285
|
if (!needsJson && binding.target == BindingTarget.css &&
|
|
280
286
|
!binding.expression && !binding.expressionTwoWay &&
|
|
281
287
|
binding.converter == null &&
|
|
282
288
|
!binding.type &&
|
|
283
|
-
!binding.historic
|
|
289
|
+
!binding.historic &&
|
|
290
|
+
!binding.writeBackSignal) {
|
|
284
291
|
return [bindingPrefixCss + PropertiesHelper.camelToDashCase(targetName), (binding.inverted ? '!' : '') + binding.signal + (!binding.twoWay && binding.signal.includes(';') ? ';' : '') + eventsString];
|
|
285
292
|
}
|
|
286
293
|
//Multi Var Expressions
|
|
@@ -289,14 +296,16 @@ export class BindingsHelper {
|
|
|
289
296
|
!binding.expressionTwoWay &&
|
|
290
297
|
binding.converter == null &&
|
|
291
298
|
!binding.type &&
|
|
292
|
-
!binding.historic
|
|
299
|
+
!binding.historic &&
|
|
300
|
+
!binding.writeBackSignal) {
|
|
293
301
|
return [bindingPrefixCss + PropertiesHelper.camelToDashCase(targetName), (binding.inverted ? '!' : '') + binding.signal + ';' + binding.expression + eventsString];
|
|
294
302
|
}
|
|
295
303
|
if (!needsJson && binding.target == BindingTarget.cssvar &&
|
|
296
304
|
!binding.expression && !binding.expressionTwoWay &&
|
|
297
305
|
binding.converter == null &&
|
|
298
306
|
!binding.type &&
|
|
299
|
-
!binding.historic
|
|
307
|
+
!binding.historic &&
|
|
308
|
+
!binding.writeBackSignal) {
|
|
300
309
|
return [bindingPrefixCssVar + BindingsHelper.camelToDotCase(targetName.substring(2)), (binding.inverted ? '!' : '') + binding.signal + (!binding.twoWay && binding.signal.includes(';') ? ';' : '') + eventsString];
|
|
301
310
|
}
|
|
302
311
|
//Multi Var Expressions
|
|
@@ -305,7 +314,8 @@ export class BindingsHelper {
|
|
|
305
314
|
!binding.expressionTwoWay &&
|
|
306
315
|
binding.converter == null &&
|
|
307
316
|
!binding.type &&
|
|
308
|
-
!binding.historic
|
|
317
|
+
!binding.historic &&
|
|
318
|
+
!binding.writeBackSignal) {
|
|
309
319
|
return [bindingPrefixCssVar + PropertiesHelper.camelToDashCase(targetName), (binding.inverted ? '!' : '') + binding.signal + ';' + binding.expression + eventsString];
|
|
310
320
|
}
|
|
311
321
|
if (binding.inverted === null || binding.inverted === false) {
|
|
@@ -571,7 +581,7 @@ export class BindingsHelper {
|
|
|
571
581
|
let disableValueChanged = false;
|
|
572
582
|
if (!disableValueChanged) {
|
|
573
583
|
disableValueChanged = true;
|
|
574
|
-
this.handleValueChanged(element, binding, root[nm], valuesObject, i, signalVars, false);
|
|
584
|
+
this.handleValueChanged(element, binding, root[nm], valuesObject, i, signalVars, false, relativeSignalPath);
|
|
575
585
|
disableValueChanged = false;
|
|
576
586
|
}
|
|
577
587
|
};
|
|
@@ -580,7 +590,7 @@ export class BindingsHelper {
|
|
|
580
590
|
cleanupCalls = [];
|
|
581
591
|
cleanupCalls.push(() => root.removeEventListener(PropertiesHelper.camelToDashCase(nm) + '-changed', evtCallback));
|
|
582
592
|
try {
|
|
583
|
-
this.handleValueChanged(element, binding, root[nm], valuesObject, i, signalVars, false);
|
|
593
|
+
this.handleValueChanged(element, binding, root[nm], valuesObject, i, signalVars, false, relativeSignalPath);
|
|
584
594
|
}
|
|
585
595
|
catch (err) {
|
|
586
596
|
console.error(err);
|
|
@@ -596,12 +606,12 @@ export class BindingsHelper {
|
|
|
596
606
|
mS = this._visualizationHandler.getNormalizedSignalName(mS, relativeSignalPath, element);
|
|
597
607
|
}
|
|
598
608
|
this._visualizationHandler.getObject(mS).then(x => {
|
|
599
|
-
this.handleValueChanged(element, binding, x, valuesObject, i, signalVars, true);
|
|
609
|
+
this.handleValueChanged(element, binding, x, valuesObject, i, signalVars, true, relativeSignalPath);
|
|
600
610
|
});
|
|
601
611
|
}
|
|
602
612
|
else {
|
|
603
613
|
if (s.includes('{')) {
|
|
604
|
-
let indirectSignal = new IndirectSignal(this._visualizationHandler, s, (value) => this.handleValueChanged(element, binding, value.val, valuesObject, i, signalVars, false), element, relativeSignalPath);
|
|
614
|
+
let indirectSignal = new IndirectSignal(this._visualizationHandler, s, (value) => this.handleValueChanged(element, binding, value.val, valuesObject, i, signalVars, false, relativeSignalPath), element, relativeSignalPath, root);
|
|
605
615
|
if (!cleanupCalls)
|
|
606
616
|
cleanupCalls = [];
|
|
607
617
|
cleanupCalls.push(() => indirectSignal.dispose());
|
|
@@ -615,7 +625,7 @@ export class BindingsHelper {
|
|
|
615
625
|
let myTimer = { timerId: -1 };
|
|
616
626
|
const loadHistoric = async () => {
|
|
617
627
|
const res = await this._visualizationHandler.getHistoricData(s, binding[1].historic);
|
|
618
|
-
this.handleValueChanged(element, binding, res?.values, valuesObject, i, signalVars, true);
|
|
628
|
+
this.handleValueChanged(element, binding, res?.values, valuesObject, i, signalVars, true, relativeSignalPath);
|
|
619
629
|
if (myTimer.timerId !== null)
|
|
620
630
|
myTimer.timerId = setTimeout(loadHistoric, binding[1].historic.reloadInterval);
|
|
621
631
|
};
|
|
@@ -629,12 +639,12 @@ export class BindingsHelper {
|
|
|
629
639
|
});
|
|
630
640
|
}
|
|
631
641
|
else
|
|
632
|
-
this._visualizationHandler.getHistoricData(s, binding[1].historic).then(x => this.handleValueChanged(element, binding, x?.values, valuesObject, i, signalVars, true));
|
|
642
|
+
this._visualizationHandler.getHistoricData(s, binding[1].historic).then(x => this.handleValueChanged(element, binding, x?.values, valuesObject, i, signalVars, true, relativeSignalPath));
|
|
633
643
|
}
|
|
634
644
|
else {
|
|
635
|
-
const cb = (id, value) => this.handleValueChanged(element, binding, value.val, valuesObject, i, signalVars, false);
|
|
645
|
+
const cb = (id, value) => this.handleValueChanged(element, binding, value.val, valuesObject, i, signalVars, false, relativeSignalPath);
|
|
636
646
|
unsubscribeList.push([s, cb, this._visualizationHandler.subscribeState(s, cb)]);
|
|
637
|
-
this._visualizationHandler.getState(s).then(x => this.handleValueChanged(element, binding, x?.val, valuesObject, i, signalVars, false));
|
|
647
|
+
this._visualizationHandler.getState(s).then(x => this.handleValueChanged(element, binding, x?.val, valuesObject, i, signalVars, false, relativeSignalPath));
|
|
638
648
|
if (binding[1].twoWay && i == 0) {
|
|
639
649
|
this.addTwoWayBinding(binding, element, v => this._visualizationHandler.setState(s, v));
|
|
640
650
|
}
|
|
@@ -694,13 +704,13 @@ export class BindingsHelper {
|
|
|
694
704
|
return value?.toString();
|
|
695
705
|
case 'integer':
|
|
696
706
|
return parseInt(value);
|
|
697
|
-
case 'bitOfNumber':
|
|
698
|
-
|
|
707
|
+
//case 'bitOfNumber':
|
|
708
|
+
// return parseInt(<any>value);
|
|
699
709
|
}
|
|
700
710
|
}
|
|
701
711
|
return value;
|
|
702
712
|
}
|
|
703
|
-
handleValueChanged(element, binding, value, valuesObject, index, signalVarNames, noParse) {
|
|
713
|
+
handleValueChanged(element, binding, value, valuesObject, index, signalVarNames, noParse, relativeSignalPath) {
|
|
704
714
|
let v = value;
|
|
705
715
|
//should this be done??
|
|
706
716
|
if (!noParse && index == 0)
|
|
@@ -768,6 +778,13 @@ export class BindingsHelper {
|
|
|
768
778
|
}
|
|
769
779
|
if (binding[1].inverted)
|
|
770
780
|
v = !v;
|
|
781
|
+
if (binding[1].writeBackSignal) {
|
|
782
|
+
let wb = binding[1].writeBackSignal;
|
|
783
|
+
if (wb[0] === '.') {
|
|
784
|
+
wb = relativeSignalPath + wb;
|
|
785
|
+
}
|
|
786
|
+
this._visualizationHandler.setState(wb, v, true);
|
|
787
|
+
}
|
|
771
788
|
if (binding[1].target == BindingTarget.property)
|
|
772
789
|
element[binding[0]] = v;
|
|
773
790
|
else if (binding[1].target == BindingTarget.attribute)
|
|
@@ -6,7 +6,7 @@ export declare class IScriptMultiplexValue {
|
|
|
6
6
|
* parameter - a parameter you hand over
|
|
7
7
|
* complexString - a string with signals (contained in {})
|
|
8
8
|
* complexSignal - read the value from a signal wich name is build here (it can contain other signals in {})
|
|
9
|
-
*
|
|
9
|
+
* expression - js expression, 'ctx' is context object
|
|
10
10
|
*/
|
|
11
11
|
source: 'signal' | 'property' | 'event' | 'parameter' | 'complexString' | 'complexSignal' | 'expression';
|
|
12
12
|
/**
|
|
@@ -6,7 +6,7 @@ export class IScriptMultiplexValue {
|
|
|
6
6
|
* parameter - a parameter you hand over
|
|
7
7
|
* complexString - a string with signals (contained in {})
|
|
8
8
|
* complexSignal - read the value from a signal wich name is build here (it can contain other signals in {})
|
|
9
|
-
*
|
|
9
|
+
* expression - js expression, 'ctx' is context object
|
|
10
10
|
*/
|
|
11
11
|
source;
|
|
12
12
|
/**
|
|
@@ -12,8 +12,10 @@ export interface VisualizationBinding {
|
|
|
12
12
|
compiledExpression?: Function;
|
|
13
13
|
compiledExpressionTwoWay?: Function;
|
|
14
14
|
type?: string;
|
|
15
|
+
writeBackSignal?: string;
|
|
15
16
|
historic?: {
|
|
16
17
|
reloadInterval?: number;
|
|
18
|
+
[nm: string]: any;
|
|
17
19
|
};
|
|
18
20
|
maybeLitElement?: boolean;
|
|
19
21
|
litEventNames?: string[];
|
|
@@ -20,5 +20,5 @@ export declare class ScriptSystem {
|
|
|
20
20
|
parseStringWithValues(text: string, context: contextType): Promise<string>;
|
|
21
21
|
getSignaName(name: string, outerContext: contextType): string;
|
|
22
22
|
static extractPart(obj: any, propertyPath: string): any;
|
|
23
|
-
assignAllScripts(source: string, javascriptCode: string, shadowRoot: ShadowRoot, instance: HTMLElement, assignExternalScript?: (element: Element, event: string, scriptData: any) => void): Promise<VisualisationElementScript>;
|
|
23
|
+
assignAllScripts(source: string, javascriptCode: string, shadowRoot: ShadowRoot, instance: HTMLElement, visualizationHandler: VisualizationHandler, context: any, assignExternalScript?: (element: Element, event: string, scriptData: any) => void): Promise<VisualisationElementScript>;
|
|
24
24
|
}
|
|
@@ -172,6 +172,11 @@ export class ScriptSystem {
|
|
|
172
172
|
}
|
|
173
173
|
return null;
|
|
174
174
|
}
|
|
175
|
+
case 'expression': {
|
|
176
|
+
//@ts-ignore
|
|
177
|
+
var ctx = outerContext;
|
|
178
|
+
return eval(value.name);
|
|
179
|
+
}
|
|
175
180
|
}
|
|
176
181
|
}
|
|
177
182
|
return value;
|
|
@@ -183,6 +188,12 @@ export class ScriptSystem {
|
|
|
183
188
|
var ctx = context;
|
|
184
189
|
return eval('ctx.' + name.substring(1));
|
|
185
190
|
}
|
|
191
|
+
else if (name[0] === '?' && name[1] === '??') {
|
|
192
|
+
return context.root[name.substring(2)];
|
|
193
|
+
}
|
|
194
|
+
else if (name[0] === '?') {
|
|
195
|
+
return await this._visualizationHandler.getState(this.getSignaName(context.root[name.substring(2)], context));
|
|
196
|
+
}
|
|
186
197
|
return await this._visualizationHandler.getState(this.getSignaName(name, context));
|
|
187
198
|
}
|
|
188
199
|
async parseStringWithValues(text, context) {
|
|
@@ -209,7 +220,7 @@ export class ScriptSystem {
|
|
|
209
220
|
}
|
|
210
221
|
return retVal;
|
|
211
222
|
}
|
|
212
|
-
async assignAllScripts(source, javascriptCode, shadowRoot, instance, assignExternalScript) {
|
|
223
|
+
async assignAllScripts(source, javascriptCode, shadowRoot, instance, visualizationHandler, context, assignExternalScript) {
|
|
213
224
|
const allElements = shadowRoot.querySelectorAll('*');
|
|
214
225
|
let jsObject = null;
|
|
215
226
|
if (javascriptCode) {
|
|
@@ -240,7 +251,7 @@ export class ScriptSystem {
|
|
|
240
251
|
e.addEventListener(evtName, async (evt) => {
|
|
241
252
|
if (!compiledFunc)
|
|
242
253
|
compiledFunc = await generateEventCodeFromBlockly(scriptObj);
|
|
243
|
-
compiledFunc(evt, shadowRoot, scriptObj.parameters, scriptObj.relativeSignalsPath ?? '');
|
|
254
|
+
compiledFunc(evt, shadowRoot, scriptObj.parameters, scriptObj.relativeSignalsPath ?? '', visualizationHandler, context);
|
|
244
255
|
});
|
|
245
256
|
}
|
|
246
257
|
else {
|
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.52",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
7
7
|
"author": "jochen.kuehner@gmx.de",
|