@node-projects/web-component-designer-visualization-addons 0.1.148 → 0.1.150
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/BlocklyScriptEditor.d.ts +0 -2
- package/dist/blockly/BlocklyScriptEditor.js +0 -11
- package/dist/components/BindingsEditor.d.ts +27 -12
- package/dist/components/BindingsEditor.js +570 -206
- package/dist/components/BindingsEditorHelp.d.ts +1 -0
- package/dist/components/BindingsEditorHelp.js +228 -0
- package/dist/index-min.js +493 -118
- package/dist/services/VisualizationBindingsService.js +9 -1
- package/package.json +3 -3
package/dist/index-min.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
Blockly.Blocks.console={init:function(){this.appendDummyInput().appendField("console").appendField(new Blockly.FieldDropdown([["debug","DEBUG"],["error","ERROR"],["info","INFO"],["log","LOG"],["warn","WARN"]]),"LEVEL"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.console=function(
|
|
2
|
-
`};Blockly.Blocks.debugger={init:function(){this.appendDummyInput().appendField("debugger"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.debugger=function(
|
|
3
|
-
`};Blockly.Blocks.delay={init:function(){this.appendValueInput("DELAY").setCheck("Number").appendField("delay"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.delay=function(
|
|
4
|
-
`};Blockly.Blocks.get_parameter={init:function(){this.appendValueInput("NAME").setCheck("String").appendField("get_parameter"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_parameter=function(
|
|
5
|
-
`:t==="ATTRIBUTE"?
|
|
6
|
-
`:t==="STYLE"&&(
|
|
7
|
-
`),
|
|
8
|
-
`};Blockly.defineBlocksWithJsonArray([{type:"start_event",message0:"Event %1",nextStatement:null,style:"hat_blocks",args0:[{type:"field_variable",name:"EVENTVAR",variable:"event"}]}]);Blockly.JavaScript.forBlock.start_event=function(
|
|
9
|
-
`};var
|
|
1
|
+
Blockly.Blocks.console={init:function(){this.appendDummyInput().appendField("console").appendField(new Blockly.FieldDropdown([["debug","DEBUG"],["error","ERROR"],["info","INFO"],["log","LOG"],["warn","WARN"]]),"LEVEL"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.console=function(l,t){var s=l.getFieldValue("LEVEL");let e=Blockly.JavaScript.valueToCode(l,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`console['${s.toLowerCase()}'](${e});
|
|
2
|
+
`};Blockly.Blocks.debugger={init:function(){this.appendDummyInput().appendField("debugger"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.debugger=function(l){return`debugger;
|
|
3
|
+
`};Blockly.Blocks.delay={init:function(){this.appendValueInput("DELAY").setCheck("Number").appendField("delay"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.delay=function(l){return"await delay("+Blockly.JavaScript.valueToCode(l,"DELAY",Blockly.JavaScript.ORDER_ATOMIC)+`);
|
|
4
|
+
`};Blockly.Blocks.get_parameter={init:function(){this.appendValueInput("NAME").setCheck("String").appendField("get_parameter"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_parameter=function(l,t){return[`context.parameters[${Blockly.JavaScript.valueToCode(l,"NAME",Blockly.JavaScript.ORDER_ATOMIC)}]`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_state={init:function(){this.appendValueInput("OID").setCheck("String").appendField("get_state"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_state=function(l,t){let s=Blockly.JavaScript.valueToCode(l,"OID",Blockly.JavaScript.ORDER_ATOMIC);return[`(await visualizationHandler.getState((${s}[0] === '.' ? relativeSignalsPath : '') + ${s})).val`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.get_sub_property={init:function(){this.appendDummyInput().appendField("getSubProperty"),this.appendValueInput("OBJECT").setCheck("Object").appendField("object"),this.appendValueInput("PROPERTYPATH").setCheck("String").appendField("propertypath"),this.setInputsInline(!0),this.setOutput(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.get_sub_property=function(l,t){let s=Blockly.JavaScript.valueToCode(l,"OBJECT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(l,"PROPERTYPATH",Blockly.JavaScript.ORDER_ATOMIC);return[`extractPart(${s}, ${e})`,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.open_screen={init:function(){this.appendDummyInput().appendField("open screen"),this.appendValueInput("SCREEN").setCheck("String").appendField("screen"),this.appendValueInput("RELATIVESIGNALSPATH").setCheck("String").appendField("relativeSignalsPath"),this.appendValueInput("NOHISTORY").setCheck("Boolean").appendField("noHistory"),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.open_screen=function(l){let t=Blockly.JavaScript.valueToCode(l,"SCREEN",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(l,"RELATIVESIGNALSPATH",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(l,"NOHISTORY",Blockly.JavaScript.ORDER_ATOMIC);return`RUNTIME.openScreen({screen: ${t}, relativeSignalsPath: ${s}, noHistory: ${e}})`};Blockly.Blocks.query_selector={init:function(){this.appendDummyInput().appendField("querySelector").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Element"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector=function(l,t){var s=l.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(l,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelector(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.host.getRootNode().querySelector(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.query_selector_all={init:function(){this.appendDummyInput().appendField("querySelectorAll").appendField(new Blockly.FieldDropdown([["currentScreen","CURRENTSCREEN"],["parentScreen","PARENTSCREEN"]]),"SOURCE"),this.appendValueInput("SELECTOR").setCheck("String").appendField("selector"),this.setInputsInline(!0),this.setOutput(!0,"Array"),this.setColour(230)}};Blockly.JavaScript.forBlock.query_selector_all=function(l,t){var s=l.getFieldValue("SOURCE");let e=Blockly.JavaScript.valueToCode(l,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),i;return s==="CURRENTSCREEN"?i=`shadowRoot.querySelectorall(${e})`:s==="PARENTSCREEN"&&(i=`shadowRoot.querySelectorall(${e})`),[i,Blockly.JavaScript.ORDER_NONE]};Blockly.Blocks.set_element={init:function(){this.appendDummyInput().appendField("setElement").appendField(new Blockly.FieldDropdown([["property","PROPERTY"],["attribute","ATTRIBUTE"],["style","STYLE"]]),"TARGET"),this.appendValueInput("ELEMENT").setCheck("Element").appendField("element"),this.appendValueInput("NAME").setCheck("String").appendField("name"),this.appendValueInput("VALUE").setCheck(null).appendField("value"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.set_element=function(l){var t=l.getFieldValue("TARGET");let s=Blockly.JavaScript.valueToCode(l,"ELEMENT",Blockly.JavaScript.ORDER_ATOMIC),e=Blockly.JavaScript.valueToCode(l,"NAME",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(l,"VALUE",Blockly.JavaScript.ORDER_ATOMIC),n="";return t==="PROPERTY"?n+=s+"["+e+"] = "+i+`;
|
|
5
|
+
`:t==="ATTRIBUTE"?n+=s+".setAttribute("+e+", "+i+`);
|
|
6
|
+
`:t==="STYLE"&&(n+=s+".style["+e+"] = "+i+`;
|
|
7
|
+
`),n};Blockly.Blocks.set_state={init:function(){this.appendValueInput("OID").setCheck("String").appendField("set_state"),this.appendValueInput("VALUE").setCheck(null).appendField("with"),this.setInputsInline(!0),this.setPreviousStatement(!0,null),this.setNextStatement(!0,null),this.setColour(230)}};Blockly.JavaScript.forBlock.set_state=function(l){let t=Blockly.JavaScript.valueToCode(l,"OID",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(l,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`await visualizationHandler.setState((${t}[0] === '.' ? relativeSignalsPath : '') + ${t}, ${s});
|
|
8
|
+
`};Blockly.defineBlocksWithJsonArray([{type:"start_event",message0:"Event %1",nextStatement:null,style:"hat_blocks",args0:[{type:"field_variable",name:"EVENTVAR",variable:"event"}]}]);Blockly.JavaScript.forBlock.start_event=function(l){return Blockly.JavaScript.getVariableName(l.getField("EVENTVAR").variable.name)+` = eventData;
|
|
9
|
+
`};var He=`function extractPart(obj, propertyPath) {
|
|
10
10
|
let retVal = obj;
|
|
11
11
|
for (let p of propertyPath.split('.')) {
|
|
12
12
|
retVal = retVal?.[p];
|
|
@@ -21,16 +21,16 @@ function delay(ms) {
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
export async function run(eventData, shadowRoot, parameters, relativeSignalsPath, visualizationHandler, context) {
|
|
24
|
-
`,
|
|
24
|
+
`,Je="}";async function ve(l){let t=new Blockly.Workspace;Blockly.serialization.workspaces.load(l,t),Blockly.JavaScript.addReservedWords("eventData"),Blockly.JavaScript.addReservedWords("shadowRoot"),Blockly.JavaScript.addReservedWords("extractPart"),Blockly.JavaScript.addReservedWords("parameters"),Blockly.JavaScript.addReservedWords("relativeSignalsPath"),Blockly.JavaScript.addReservedWords("delay"),Blockly.JavaScript.addReservedWords("visualizationHandler"),Blockly.JavaScript.addReservedWords("context");let s=Blockly.JavaScript.workspaceToCode(t);return(await import(URL.createObjectURL(new Blob([He+s+Je],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as Ue,html as $e,css as Ge}from"@node-projects/base-custom-webcomponent";var A=class extends Ue{static template=$e`
|
|
25
25
|
<div id="blocklyDiv" style="position: absolute; width: 100%; height: 100%;"></div>
|
|
26
|
-
`;static style=
|
|
26
|
+
`;static style=Ge`
|
|
27
27
|
:host {
|
|
28
28
|
box-sizing: border-box;
|
|
29
29
|
position: absolute;
|
|
30
30
|
height: 100%;
|
|
31
31
|
width: 100%;
|
|
32
32
|
display: block;
|
|
33
|
-
}`;static is="node-projects-blockly-script-editor";blocklyDiv;workspace;
|
|
33
|
+
}`;static is="node-projects-blockly-script-editor";blocklyDiv;workspace;resizeObserver;_toolbox;constructor(t){super(),super._restoreCachedInititalValues(),this._toolbox=t,this.blocklyDiv=this._getDomElement("blocklyDiv"),this._assignEvents(),this.createBlockly()}createBlockly(){let t="zelos",e=Blockly.Theme.defineTheme("webui",{base:Blockly.Themes.Zelos,blockStyles:{hat_blocks:{colourPrimary:"#4a148c"}},categoryStyles:{start_category:{colour:"#4a148c"},system_category:{colour:"#01579b"}}});this.workspace=Blockly.inject(this.blocklyDiv,{theme:e,toolbox:this._toolbox,renderer:t,trashcan:!0,zoom:{controls:!0,wheel:!1,startScale:.7,maxScale:3,minScale:.3,scaleSpeed:1.2,pinch:!1},move:{scrollbars:{horizontal:!0,vertical:!0},drag:!0,wheel:!0},maxInstances:{start_event:1}}),new ZoomToFitControl(this.workspace).init()}ready(){Blockly.svgResize(this.workspace),this.resizeObserver=new ResizeObserver(t=>{Blockly.svgResize(this.workspace)}),this.resizeObserver.observe(this)}save(){return Blockly.serialization.workspaces.save(this.workspace)}load(t){Blockly.serialization.workspaces.load(t,this.workspace)}};customElements.define(A.is,A);import{BaseCustomWebComponentConstructorAppend as Ze,html as Ke,css as Qe}from"@node-projects/base-custom-webcomponent";import{BindingMode as et,BindingTarget as be,assetsPath as K}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as qe,html as Xe,css as Ye}from"@node-projects/base-custom-webcomponent";var z=class extends qe{static template=Xe`
|
|
34
34
|
<span style="position:absolute;left:30px;top:26px;">from</span>
|
|
35
35
|
<span style="position:absolute;left:30px;top:77px;">count</span>
|
|
36
36
|
<span style="position:absolute;left:30px;top:123px;">limit</span>
|
|
@@ -97,106 +97,304 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
97
97
|
<input css:visibility="[[this.historic.aggregate == 'quantile' ? 'visible' : 'collapse']]" value="{{this.historic.quantile}}" type="number" id="quantile" style="position:absolute;left:107px;top:325px;width:153px;">
|
|
98
98
|
<span css:visibility="[[this.historic.aggregate == 'quantile' ? 'visible' : 'collapse']]" id="lblQuantile" style="position:absolute;left:30px;top:325px;">quantile</span>
|
|
99
99
|
<span style="position:absolute;left:34px;top:417px;">instance</span>
|
|
100
|
-
<input type="text" value="{{?this.historic.instance}}" style="position:absolute;left:104px;top:419px;width:155px;">`;static style=
|
|
100
|
+
<input type="text" value="{{?this.historic.instance}}" style="position:absolute;left:104px;top:419px;width:155px;">`;static style=Ye`
|
|
101
101
|
:host {
|
|
102
102
|
box-sizing: border-box;
|
|
103
|
-
}`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(t){super(),this._restoreCachedInititalValues(),this.historic=t??{reloadInterval:2e3}}ready(){this._bindingsParse()}#e=!1;refresh(){this.#e||(this.#e=!0,this._bindingsRefresh(null,!0),this.#e=!1)}};customElements.define(
|
|
103
|
+
}`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(t){super(),this._restoreCachedInititalValues(),this.historic=t??{reloadInterval:2e3}}ready(){this._bindingsParse()}#e=!1;refresh(){this.#e||(this.#e=!0,this._bindingsRefresh(null,!0),this.#e=!1)}};customElements.define(z.is,z);var de=`<!DOCTYPE html>
|
|
104
|
+
<html>
|
|
105
|
+
<head>
|
|
106
|
+
<meta charset="UTF-8">
|
|
107
|
+
<style>
|
|
108
|
+
:root { --accent: #2c6e9b; }
|
|
109
|
+
|
|
110
|
+
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
|
111
|
+
|
|
112
|
+
html, body {
|
|
113
|
+
width: 100%;
|
|
114
|
+
height: 100%;
|
|
115
|
+
font-family: Segoe UI, Arial, sans-serif;
|
|
116
|
+
font-size: 13px;
|
|
117
|
+
color: #333;
|
|
118
|
+
background: #f0f1f3;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.content {
|
|
122
|
+
height: 100%;
|
|
123
|
+
overflow-y: auto;
|
|
124
|
+
padding: 10px 14px 16px;
|
|
125
|
+
display: flex;
|
|
126
|
+
flex-direction: column;
|
|
127
|
+
gap: 12px;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.intro-banner {
|
|
131
|
+
background: #ffffff;
|
|
132
|
+
border-left: 4px solid var(--accent);
|
|
133
|
+
border-radius: 4px;
|
|
134
|
+
padding: 8px 12px;
|
|
135
|
+
font-size: 12px;
|
|
136
|
+
line-height: 1.5;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.intro-banner code {
|
|
140
|
+
font-family: Consolas, monospace;
|
|
141
|
+
background: #eef2f6;
|
|
142
|
+
padding: 1px 4px;
|
|
143
|
+
border-radius: 3px;
|
|
144
|
+
color: #2c4a68;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
.content-section {
|
|
148
|
+
background: #ffffff;
|
|
149
|
+
border-radius: 6px;
|
|
150
|
+
padding: 8px 10px 10px;
|
|
151
|
+
display: flex;
|
|
152
|
+
flex-direction: column;
|
|
153
|
+
gap: 6px;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.section-title {
|
|
157
|
+
display: flex;
|
|
158
|
+
align-items: baseline;
|
|
159
|
+
gap: 8px;
|
|
160
|
+
border-bottom: 2px solid var(--accent);
|
|
161
|
+
font-size: 13px;
|
|
162
|
+
font-weight: bold;
|
|
163
|
+
padding-bottom: 4px;
|
|
164
|
+
color: #24405c;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
.section-num {
|
|
168
|
+
display: inline-flex;
|
|
169
|
+
align-items: center;
|
|
170
|
+
justify-content: center;
|
|
171
|
+
width: 18px;
|
|
172
|
+
height: 18px;
|
|
173
|
+
border-radius: 50%;
|
|
174
|
+
background: var(--accent);
|
|
175
|
+
color: white;
|
|
176
|
+
font-size: 10px;
|
|
177
|
+
font-weight: bold;
|
|
178
|
+
flex-shrink: 0;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.section-hint {
|
|
182
|
+
font-size: 11px;
|
|
183
|
+
font-weight: normal;
|
|
184
|
+
color: #808080;
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
.snippet {
|
|
188
|
+
font-family: Consolas, "Courier New", monospace;
|
|
189
|
+
font-size: 11px;
|
|
190
|
+
background: #f6f8fa;
|
|
191
|
+
color: #24292e;
|
|
192
|
+
border: 1px solid #e1e4e8;
|
|
193
|
+
border-radius: 4px;
|
|
194
|
+
padding: 6px 10px;
|
|
195
|
+
white-space: pre;
|
|
196
|
+
overflow-x: auto;
|
|
197
|
+
line-height: 1.6;
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
.ref-table {
|
|
201
|
+
width: 100%;
|
|
202
|
+
border-collapse: collapse;
|
|
203
|
+
font-size: 12px;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.ref-table th {
|
|
207
|
+
text-align: left;
|
|
208
|
+
font-weight: 600;
|
|
209
|
+
color: #24405c;
|
|
210
|
+
border-bottom: 1px solid #d0d7de;
|
|
211
|
+
padding: 4px 6px;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
.ref-table td {
|
|
215
|
+
padding: 3px 6px;
|
|
216
|
+
border-bottom: 1px solid #f0f0f0;
|
|
217
|
+
vertical-align: top;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.ref-table tr:last-child td { border-bottom: none; }
|
|
221
|
+
|
|
222
|
+
.ref-table td:first-child {
|
|
223
|
+
font-family: Consolas, monospace;
|
|
224
|
+
color: #005cc5;
|
|
225
|
+
white-space: nowrap;
|
|
226
|
+
width: 110px;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
.note {
|
|
230
|
+
font-size: 11px;
|
|
231
|
+
color: #666;
|
|
232
|
+
font-style: italic;
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
code {
|
|
236
|
+
font-family: Consolas, monospace;
|
|
237
|
+
background: #eef2f6;
|
|
238
|
+
padding: 1px 4px;
|
|
239
|
+
border-radius: 3px;
|
|
240
|
+
color: #2c4a68;
|
|
241
|
+
font-size: 11px;
|
|
242
|
+
}
|
|
243
|
+
</style>
|
|
244
|
+
</head>
|
|
245
|
+
<body>
|
|
246
|
+
<div class="content">
|
|
247
|
+
|
|
248
|
+
<div class="intro-banner">
|
|
249
|
+
A <strong>Binding</strong> connects one or more signals to a property of an element.<br>
|
|
250
|
+
An optional <strong>formula</strong> transforms the signal values before they are applied.
|
|
251
|
+
A <strong>converter</strong> maps the final value to a display value.
|
|
252
|
+
</div>
|
|
253
|
+
|
|
254
|
+
<div class="content-section">
|
|
255
|
+
<div class="section-title"><span class="section-num">1</span> Signals (Objects) <span class="section-hint">what data to read</span></div>
|
|
256
|
+
<div class="note" style="margin-bottom:2px;">Each row adds one signal. The <em>name</em> column sets the variable name used in the formula.</div>
|
|
257
|
+
<pre class="snippet"><span style="color:#6a737d;font-style:italic">// name column empty \u2192 variable is __0, __1, __2 \u2026 (positional)</span>
|
|
258
|
+
<span style="color:#6a737d;font-style:italic">// name column filled \u2192 variable uses that name in the formula</span>
|
|
259
|
+
|
|
260
|
+
<span style="color:#005cc5">name</span>: mySpeed <span style="color:#005cc5">signal</span>: .Drive.Speed \u2192 accessible as mySpeed
|
|
261
|
+
<span style="color:#005cc5">name</span>: (empty) <span style="color:#005cc5">signal</span>: .Drive.Active \u2192 accessible as __1 (second row)</pre>
|
|
262
|
+
<div class="note">Multiple signals let you combine values in a formula, e.g. <code>__0 > 0 && __1</code>.</div>
|
|
263
|
+
</div>
|
|
264
|
+
|
|
265
|
+
<div class="content-section">
|
|
266
|
+
<div class="section-title"><span class="section-num">2</span> Signal path prefixes & special paths <span class="section-hint">special access modes</span></div>
|
|
267
|
+
<table class="ref-table">
|
|
268
|
+
<tr><th>Prefix / Pattern</th><th>What it accesses</th></tr>
|
|
269
|
+
<tr><td>(none)</td><td>The signal's current value directly</td></tr>
|
|
270
|
+
<tr><td>__name</td><td>Internal screen variable \u2014 local to the current screen, not connected to any external data source. Initial value is <code>null</code>. Useful for screen-local state like tab selection or panel visibility.</td></tr>
|
|
271
|
+
<tr><td>?name</td><td>A property of the signal object itself (e.g. <code>?quality</code> \u2192 signal quality)</td></tr>
|
|
272
|
+
<tr><td>??name</td><td>The value of a property of the signal object</td></tr>
|
|
273
|
+
<tr><td>#name</td><td>A property of the bound target element</td></tr>
|
|
274
|
+
<tr><td>##name</td><td>The current value of a property of the bound target element</td></tr>
|
|
275
|
+
<tr><td>$objectId</td><td>The entire signal configuration object (meta-data)</td></tr>
|
|
276
|
+
<tr><td>\xA7name</td><td>A special framework-provided value (if supported)</td></tr>
|
|
277
|
+
<tr><td>{name}</td><td>Dynamic signal path: embed another signal's value inside the path, e.g. <code>.Plant.{.ActiveLine}.Speed</code></td></tr>
|
|
278
|
+
</table>
|
|
279
|
+
</div>
|
|
280
|
+
|
|
281
|
+
<div class="content-section">
|
|
282
|
+
<div class="section-title"><span class="section-num">3</span> Formula <span class="section-hint">transform signal values with JavaScript</span></div>
|
|
283
|
+
<div class="note" style="margin-bottom:2px;">Leave the formula empty to pass the first signal's value through unchanged.</div>
|
|
284
|
+
<pre class="snippet"><span style="color:#6a737d;font-style:italic">// Access signal values by position or by name:</span>
|
|
285
|
+
__0 * 100 <span style="color:#6a737d;font-style:italic">// first signal \xD7 100</span>
|
|
286
|
+
__0 > 0 && __1 <span style="color:#6a737d;font-style:italic">// combine two signals</span>
|
|
287
|
+
speed > limit <span style="color:#6a737d;font-style:italic">// named variables</span>
|
|
288
|
+
|
|
289
|
+
<span style="color:#6a737d;font-style:italic">// Special variables available in the formula:</span>
|
|
290
|
+
__ctx <span style="color:#6a737d;font-style:italic">// the full binding context object</span>
|
|
291
|
+
__res <span style="color:#6a737d;font-style:italic">// the result of the previous evaluation</span></pre>
|
|
292
|
+
<div class="note">The formula must be a single JavaScript expression that returns a value (no <code>return</code> statement needed).</div>
|
|
293
|
+
</div>
|
|
294
|
+
|
|
295
|
+
<div class="content-section">
|
|
296
|
+
<div class="section-title"><span class="section-num">4</span> Write Back & Two-Way <span class="section-hint">send values back to signals</span></div>
|
|
297
|
+
<pre class="snippet"><span style="color:#6a737d;font-style:italic">// Write back signal</span>
|
|
298
|
+
<span style="color:#6a737d;font-style:italic">// \u2192 writes the formula result back to a signal whenever</span>
|
|
299
|
+
<span style="color:#6a737d;font-style:italic">// the element property changes (useful for derived values)</span>
|
|
300
|
+
|
|
301
|
+
<span style="color:#6a737d;font-style:italic">// Two-Way binding</span>
|
|
302
|
+
<span style="color:#6a737d;font-style:italic">// \u2192 also sets the signal when the element fires a DOM event</span>
|
|
303
|
+
<span style="color:#6a737d;font-style:italic">// (e.g. "change" for inputs). Enable "events" to configure</span>
|
|
304
|
+
<span style="color:#6a737d;font-style:italic">// which events trigger the write-back.</span>
|
|
305
|
+
<span style="color:#6a737d;font-style:italic">// \u2192 "formula write back" applies a reverse transformation</span>
|
|
306
|
+
<span style="color:#6a737d;font-style:italic">// before writing (useful when the formula changes the scale)</span></pre>
|
|
307
|
+
<div class="note">Two-Way is only available for <em>property</em> and <em>attribute</em> targets. Separate multiple event names with a semicolon.</div>
|
|
308
|
+
</div>
|
|
309
|
+
|
|
310
|
+
<div class="content-section">
|
|
311
|
+
<div class="section-title"><span class="section-num">5</span> Converter <span class="section-hint">map values to display values</span></div>
|
|
312
|
+
<div class="note" style="margin-bottom:4px;">Use the table to map specific conditions to output values. The <em>condition</em> column supports several matching modes:</div>
|
|
313
|
+
<table class="ref-table">
|
|
314
|
+
<tr><th>Condition key</th><th>Matches when \u2026</th></tr>
|
|
315
|
+
<tr><td>true / false</td><td>Signal value equals the boolean</td></tr>
|
|
316
|
+
<tr><td>42</td><td>Signal value equals the number exactly</td></tr>
|
|
317
|
+
<tr><td>running</td><td>Signal value equals the string "running"</td></tr>
|
|
318
|
+
<tr><td>>10</td><td>Signal value is greater than 10</td></tr>
|
|
319
|
+
<tr><td>>=5</td><td>Signal value is \u2265 5</td></tr>
|
|
320
|
+
<tr><td><3</td><td>Signal value is < 3</td></tr>
|
|
321
|
+
<tr><td>10-20</td><td>Signal value is in the range 10 \u2026 20 (inclusive)</td></tr>
|
|
322
|
+
<tr><td>default</td><td>Fallback when no other key matches</td></tr>
|
|
323
|
+
</table>
|
|
324
|
+
<div class="note" style="margin-top:4px;">The value column supports template literals \u2014 use <code>\${value}</code> to embed the original signal value in the output string.</div>
|
|
325
|
+
<div class="note" style="margin-top:4px;"><strong>Named converter:</strong> enter a converter name in the <em>converter</em> field above the table to use a pre-registered converter instead of the inline table.</div>
|
|
326
|
+
</div>
|
|
327
|
+
|
|
328
|
+
</div>
|
|
329
|
+
</body>
|
|
330
|
+
</html>`;var Q=class l extends Ze{static template=Ke`
|
|
104
331
|
<div id="root">
|
|
105
332
|
<div class="vertical-grid">
|
|
106
|
-
<div
|
|
107
|
-
<div
|
|
333
|
+
<div id="full-width-col">
|
|
334
|
+
<div id="signals-area">
|
|
108
335
|
<div class="row">
|
|
109
|
-
<span
|
|
110
|
-
|
|
111
|
-
<div id="groupObjectName" style="display:flex;align-items: flex-end;">
|
|
112
|
-
<input id="objectName" class="row" value="{{?this.objectNames::change}}" style="flex-grow: 1;">
|
|
113
|
-
<button @click="_clear" style="height: 22px">X</button>
|
|
114
|
-
<button @click="_select" style="height: 22px">...</button>
|
|
336
|
+
<span class="section-label" title="Add signals by name and path. The variable name is used in the formula (__0, __1,... or a custom name).
Access signal objects in properties via ?propertyName, access the propertyValue via ??propertyName.
Access signal objects in properties of the target via #propertyName, access a propertyValue of the target via ##propertyName.
Bind to signal configurations via $objectId.
Bind to special values via §name (if supported by your framework).
You could also use signals inside of a Signal Name via {name}">objects</span>
|
|
337
|
+
<button id="helpBtn" class="info-btn" title="Help"><svg viewBox="0 0 512 512" width="16" height="16"><path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/></svg></button>
|
|
115
338
|
</div>
|
|
116
|
-
<div
|
|
117
|
-
<
|
|
118
|
-
|
|
119
|
-
<
|
|
120
|
-
<
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
</
|
|
124
|
-
</div>
|
|
125
|
-
<div id="groupBindingMode" class="row">
|
|
126
|
-
<input type="checkbox" disabled="[[!this.twoWayPossible]]" checked="{{this.twoWay::change}}" @change="_refresh">
|
|
127
|
-
<span>two way binding</span>
|
|
128
|
-
<span css:display="[[this.twoWay ? 'inline' : 'none']]" style="margin-left: 15px">events: </span>
|
|
129
|
-
<input css:display="[[this.twoWay ? 'inline-block' : 'none']]" title="to use multiple events, seprate them with semicolon (;)" class="row" value="{{?this.events::change}}" style="flex-grow: 1;">
|
|
339
|
+
<div class="bordered-section">
|
|
340
|
+
<div id="signalListHeader" class="signal-row signal-header">
|
|
341
|
+
<span class="signal-header-name">name</span>
|
|
342
|
+
<span class="signal-header-signal">signal</span>
|
|
343
|
+
<span class="signal-header-spacer"></span>
|
|
344
|
+
</div>
|
|
345
|
+
<div id="signalListContainer"></div>
|
|
346
|
+
<button id="addSignalBtn" class="add-signal-btn" @click="[[this._addSignal()]]">+ Add signal</button>
|
|
130
347
|
</div>
|
|
131
|
-
<div id="groupinvert" class="row"
|
|
348
|
+
<div id="groupinvert" class="row">
|
|
132
349
|
<input type="checkbox" checked="{{this.invert::change}}">
|
|
133
350
|
<span>invert logic</span>
|
|
134
|
-
<button css:border="[[this.historic ? 'solid lime 5px' : 'none']]"
|
|
351
|
+
<button id="historicBtn" css:border="[[this.historic ? 'solid lime 5px' : 'none']]" @click="[[this.showHistoric()]]">historic</button>
|
|
135
352
|
</div>
|
|
136
353
|
<div class="row">
|
|
137
|
-
<span
|
|
354
|
+
<span class="section-label" title="javascript expression. access context with __ctx, result with __res, objects by name (__0, __1,... or custom name)">formula</span>
|
|
138
355
|
</div>
|
|
139
356
|
<div class="row">
|
|
140
|
-
<node-projects-code-view-monaco id="expression" single-row language="javascript"
|
|
357
|
+
<node-projects-code-view-monaco id="expression" single-row language="javascript" .code="{{?this.expression}}" @code-changed="_refresh"></node-projects-code-view-monaco>
|
|
141
358
|
</div>
|
|
142
359
|
<div class="row">
|
|
143
|
-
|
|
144
|
-
|
|
360
|
+
<span class="section-label writeback-label" title="write back the value build by a formula to a signal. maybe only usefull when a formula is used.">write back signal :</span>
|
|
361
|
+
<input class="writeback-input" .disabled="[[!this.expression]]" value="{{?this.writeBackSignal::change}}">
|
|
145
362
|
</div>
|
|
146
|
-
<div class="row">
|
|
147
|
-
<
|
|
363
|
+
<div id="groupBindingMode" class="row">
|
|
364
|
+
<input type="checkbox" disabled="[[!this.twoWayPossible]]" checked="{{this.twoWay::change}}" @change="_refresh">
|
|
365
|
+
<span>two way binding</span>
|
|
366
|
+
<span class="events-label" css:display="[[this.twoWay ? 'inline' : 'none']]">events: </span>
|
|
367
|
+
<input class="events-input" css:display="[[this.twoWay ? 'inline-block' : 'none']]" title="to use multiple events, seprate them with semicolon (;)" value="{{?this.events::change}}">
|
|
148
368
|
</div>
|
|
149
|
-
<div
|
|
150
|
-
<
|
|
369
|
+
<div css:display="[[this.twoWay ? 'block' : 'none']]">
|
|
370
|
+
<div class="row">
|
|
371
|
+
<span class="section-label" title="javascript expression. access property with 'value'">formula write back (two way)</span>
|
|
372
|
+
</div>
|
|
373
|
+
<div class="row">
|
|
374
|
+
<node-projects-code-view-monaco id="expression2way" .read-only="[[!this.twoWay]]" $readonly="[[!this.twoWay]]" single-row language="javascript" .code="{{?this.expressionTwoWay}}"></node-projects-code-view-monaco>
|
|
375
|
+
</div>
|
|
151
376
|
</div>
|
|
152
377
|
</div>
|
|
153
378
|
</div>
|
|
154
379
|
</div>
|
|
155
|
-
<div
|
|
156
|
-
<
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
</div>
|
|
160
|
-
</div>
|
|
380
|
+
<div id="namedConverterRow" class="row">
|
|
381
|
+
<span class="converter-label">converter :</span>
|
|
382
|
+
<input id="namedConverterInput" value="{{?this.convertersString::change}}">
|
|
383
|
+
<button id="namedConverterBrowse" class="signal-select-btn" @click="[[this._selectNamedConverter()]]">...</button>
|
|
161
384
|
</div>
|
|
162
|
-
<div class="
|
|
163
|
-
<div class="
|
|
164
|
-
<
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
<div style="width: 59%">value</div>
|
|
168
|
-
</div>
|
|
169
|
-
<template repeat:item="[[this.converters]]">
|
|
170
|
-
<div css:background-color="[[item.activeRow ? 'gray' : '']]" style="width: 100%; display: flex; height: 26px; justify-content: center; align-items: center; gap: 5px;">
|
|
171
|
-
<input type="text" value="{{item.key}}" @focus="[[this._focusRow(index)]]" style="width: 39%">
|
|
172
|
-
<input type="[[this._property.type == 'color' ? 'color' : 'text']]" value="{{item.value}}" @focus="[[this._focusRow(index)]]" style="width: 59%">
|
|
173
|
-
</div>
|
|
174
|
-
</template>
|
|
175
|
-
</div>
|
|
176
|
-
</div>
|
|
177
|
-
<div class="controlbox" id="grid-controls">
|
|
178
|
-
<button type="button" id="add-row-button" value="add" @click="addConverter">
|
|
179
|
-
<span>add</span>
|
|
180
|
-
</button>
|
|
181
|
-
<button id="remove-row-button" value="remove" style="margin-top: 6px;" @click="removeConverter">
|
|
182
|
-
<span>remove</span>
|
|
183
|
-
</button>
|
|
385
|
+
<div class="bordered-section">
|
|
386
|
+
<div class="signal-row signal-header">
|
|
387
|
+
<span class="converter-header-col">condition</span>
|
|
388
|
+
<span class="converter-header-col">value</span>
|
|
389
|
+
<span class="converter-header-spacer"></span>
|
|
184
390
|
</div>
|
|
391
|
+
<div id="converterListContainer"></div>
|
|
392
|
+
<button class="add-signal-btn" @click="[[this._addConverter()]]">+ Add entry</button>
|
|
185
393
|
</div>
|
|
186
|
-
</div>`;static style=
|
|
394
|
+
</div>`;static style=Qe`
|
|
187
395
|
:host {
|
|
188
396
|
box-sizing: border-box;
|
|
189
397
|
}
|
|
190
|
-
|
|
191
|
-
#converterGrid {
|
|
192
|
-
display: flex;
|
|
193
|
-
gap: 2px;
|
|
194
|
-
flex-direction: column;
|
|
195
|
-
}
|
|
196
|
-
#converterGrid input {
|
|
197
|
-
height: 20px;
|
|
198
|
-
box-sizing: border-box;
|
|
199
|
-
}
|
|
200
398
|
|
|
201
399
|
.padding_top {
|
|
202
400
|
padding-top: 30px;
|
|
@@ -208,9 +406,9 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
208
406
|
align-items: center;
|
|
209
407
|
}
|
|
210
408
|
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
409
|
+
#converterListContainer {
|
|
410
|
+
max-height: 72px;
|
|
411
|
+
overflow-y: auto;
|
|
214
412
|
}
|
|
215
413
|
|
|
216
414
|
.input-headline {
|
|
@@ -241,7 +439,95 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
241
439
|
gap: 30px;
|
|
242
440
|
}
|
|
243
441
|
|
|
244
|
-
#
|
|
442
|
+
#full-width-col {
|
|
443
|
+
grid-column: 1/3;
|
|
444
|
+
}
|
|
445
|
+
|
|
446
|
+
#signals-area {
|
|
447
|
+
display: flex;
|
|
448
|
+
flex-direction: column;
|
|
449
|
+
}
|
|
450
|
+
|
|
451
|
+
.section-label {
|
|
452
|
+
cursor: pointer;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
.bordered-section {
|
|
456
|
+
border: solid 1px black;
|
|
457
|
+
padding: 10px;
|
|
458
|
+
}
|
|
459
|
+
|
|
460
|
+
.signal-header-name {
|
|
461
|
+
flex: 0 0 80px;
|
|
462
|
+
}
|
|
463
|
+
|
|
464
|
+
.signal-header-signal, .converter-header-col {
|
|
465
|
+
flex: 1 1 auto;
|
|
466
|
+
}
|
|
467
|
+
|
|
468
|
+
.signal-header-spacer {
|
|
469
|
+
flex: 0 0 72px;
|
|
470
|
+
}
|
|
471
|
+
|
|
472
|
+
.converter-header-spacer {
|
|
473
|
+
flex: 0 0 47px;
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
#groupinvert {
|
|
477
|
+
position: relative;
|
|
478
|
+
}
|
|
479
|
+
|
|
480
|
+
#historicBtn {
|
|
481
|
+
position: absolute;
|
|
482
|
+
right: 1px;
|
|
483
|
+
top: 5px;
|
|
484
|
+
padding: 10px;
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
node-projects-code-view-monaco {
|
|
488
|
+
width: 100%;
|
|
489
|
+
min-height: 17px;
|
|
490
|
+
height: 17px;
|
|
491
|
+
position: relative;
|
|
492
|
+
overflow: hidden;
|
|
493
|
+
resize: vertical;
|
|
494
|
+
}
|
|
495
|
+
|
|
496
|
+
.writeback-label {
|
|
497
|
+
white-space: nowrap;
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
.writeback-input {
|
|
501
|
+
width: 100%;
|
|
502
|
+
margin-left: 5px;
|
|
503
|
+
}
|
|
504
|
+
|
|
505
|
+
.events-label {
|
|
506
|
+
margin-left: 15px;
|
|
507
|
+
}
|
|
508
|
+
|
|
509
|
+
.events-input {
|
|
510
|
+
flex-grow: 1;
|
|
511
|
+
}
|
|
512
|
+
|
|
513
|
+
#namedConverterRow {
|
|
514
|
+
margin-top: 6px;
|
|
515
|
+
}
|
|
516
|
+
|
|
517
|
+
.converter-label {
|
|
518
|
+
white-space: nowrap;
|
|
519
|
+
}
|
|
520
|
+
|
|
521
|
+
#namedConverterInput {
|
|
522
|
+
flex: 1;
|
|
523
|
+
margin-left: 5px;
|
|
524
|
+
}
|
|
525
|
+
|
|
526
|
+
#namedConverterBrowse {
|
|
527
|
+
margin-left: 3px;
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
#grid input, #list input {
|
|
245
531
|
border:0px;
|
|
246
532
|
}
|
|
247
533
|
|
|
@@ -249,18 +535,107 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
249
535
|
height: 24px;
|
|
250
536
|
font-size: inherit;
|
|
251
537
|
}
|
|
252
|
-
|
|
538
|
+
|
|
253
539
|
node-projects-code-view-monaco:not([readonly]) {
|
|
254
540
|
border: 1px black solid;
|
|
255
541
|
}
|
|
256
|
-
|
|
542
|
+
|
|
257
543
|
node-projects-code-view-monaco[readonly] {
|
|
258
544
|
border: 1px lightgray solid;
|
|
259
|
-
}
|
|
545
|
+
}
|
|
546
|
+
|
|
547
|
+
.signal-header {
|
|
548
|
+
color: #888;
|
|
549
|
+
font-size: 11px;
|
|
550
|
+
margin-top: 3px;
|
|
551
|
+
}
|
|
552
|
+
|
|
553
|
+
.signal-row {
|
|
554
|
+
display: flex;
|
|
555
|
+
align-items: center;
|
|
556
|
+
gap: 3px;
|
|
557
|
+
}
|
|
558
|
+
|
|
559
|
+
.signal-row input {
|
|
560
|
+
height: 22px;
|
|
561
|
+
box-sizing: border-box;
|
|
562
|
+
}
|
|
563
|
+
|
|
564
|
+
.signal-name-input {
|
|
565
|
+
min-width: 80px;
|
|
566
|
+
flex: 0 0 80px;
|
|
567
|
+
font-family: monospace;
|
|
568
|
+
}
|
|
569
|
+
|
|
570
|
+
.signal-path-input {
|
|
571
|
+
flex: 1 1 auto;
|
|
572
|
+
}
|
|
573
|
+
|
|
574
|
+
.signal-icon-btn {
|
|
575
|
+
flex: 0 0 22px;
|
|
576
|
+
width: 22px;
|
|
577
|
+
height: 22px;
|
|
578
|
+
padding: 0;
|
|
579
|
+
cursor: pointer;
|
|
580
|
+
display: flex;
|
|
581
|
+
align-items: center;
|
|
582
|
+
justify-content: center;
|
|
583
|
+
}
|
|
584
|
+
|
|
585
|
+
.signal-icon-btn img {
|
|
586
|
+
width: 12px;
|
|
587
|
+
height: 12px;
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
.signal-select-btn {
|
|
591
|
+
flex: 0 0 26px;
|
|
592
|
+
width: 26px;
|
|
593
|
+
height: 22px;
|
|
594
|
+
padding: 0;
|
|
595
|
+
cursor: pointer;
|
|
596
|
+
font-size: 11px;
|
|
597
|
+
}
|
|
598
|
+
|
|
599
|
+
#signalListContainer {
|
|
600
|
+
display: flex;
|
|
601
|
+
flex-direction: column;
|
|
602
|
+
gap: 3px;
|
|
603
|
+
max-height: 72px;
|
|
604
|
+
overflow-y: auto;
|
|
605
|
+
}
|
|
606
|
+
|
|
607
|
+
.add-signal-btn {
|
|
608
|
+
align-self: flex-start;
|
|
609
|
+
margin-top: 4px;
|
|
610
|
+
height: 22px;
|
|
611
|
+
cursor: pointer;
|
|
612
|
+
font-size: 11px;
|
|
613
|
+
}
|
|
614
|
+
|
|
615
|
+
.info-btn {
|
|
616
|
+
display: flex;
|
|
617
|
+
align-items: center;
|
|
618
|
+
justify-content: center;
|
|
619
|
+
width: 22px;
|
|
620
|
+
height: 22px;
|
|
621
|
+
padding: 0;
|
|
622
|
+
border: none;
|
|
623
|
+
background: transparent;
|
|
624
|
+
cursor: pointer;
|
|
625
|
+
flex-shrink: 0;
|
|
626
|
+
margin-left: auto;
|
|
627
|
+
}
|
|
628
|
+
|
|
629
|
+
.info-btn:hover {
|
|
630
|
+
background: #eee;
|
|
631
|
+
border-radius: 3px;
|
|
632
|
+
}`;static is="node-projects-visualization-bindings-editor";static properties={twoWayPossible:Boolean,twoWay:Boolean,expression:String,events:String,invert:Boolean,historic:Object};twoWayPossible=!1;twoWay=!1;expression="";writeBackSignal="";expressionTwoWay="";historic;objectNames="";events="";invert=!1;converters=[];static namedConverters=[];static helpSections=[];convertersString;get converter(){if(this.convertersString)return this.convertersString;if(this.converters.length>0)return Object.fromEntries(this.converters.map(t=>[t.key,t.value]))}_property;_binding;_bindingTarget;_serviceContainer;_instanceServiceContainer;_shell;_signals=[];_signalListContainer;_converterListContainer;constructor(t,s,e,i,n,r,a={}){super(),super._restoreCachedInititalValues(),this._property=t,this._binding=s,this._bindingTarget=e,this._serviceContainer=i,this._instanceServiceContainer=n,this._shell=r,a?.namedConverters===!1&&(this._getDomElement("namedConverterRow").style.display="none");let c=this._getDomElement("historicBtn");a?.showHistoric===!1?c.style.display="none":a?.historicLabel&&(c.textContent=a.historicLabel)}ready(){if(this._parseAttributesToProperties(),this._assignEvents(),this._signalListContainer=this._getDomElement("signalListContainer"),this._converterListContainer=this._getDomElement("converterListContainer"),this._getDomElement("helpBtn").onclick=()=>this._showHelp(),l.namedConverters.length===0&&(this._getDomElement("namedConverterBrowse").style.display="none"),this.twoWayPossible=!1,(this._bindingTarget==be.property||this._bindingTarget==be.attribute)&&(this.twoWayPossible=!0),this._binding){if(this.twoWay=this._binding.mode==et.twoWay,this.expression=this._binding.expression,this.writeBackSignal=this._binding.writeBackSignal,this.expressionTwoWay=this._binding.expressionTwoWay,this.historic=this._binding.historic,this.invert=this._binding.invert,this._binding.bindableObjectNames&&(this.objectNames=this._binding.bindableObjectNames.join(";")),this._binding.converter)if(typeof this._binding.converter=="string")this.convertersString=this._binding.converter;else for(let t in this._binding.converter)this.converters.push({key:t,value:this._binding.converter[t]});this._binding.changedEvents&&this._binding.changedEvents.length&&(this.events=this._binding.changedEvents.join(";"))}if(this.expression){let t=this._getDomElement("expression");this.expression.indexOf(`
|
|
260
633
|
`)>=0&&(t.style.height="51px")}if(this.expressionTwoWay){let t=this._getDomElement("expression2way");this.expressionTwoWay.indexOf(`
|
|
261
|
-
`)>=0&&(t.style.height="51px")}this.
|
|
634
|
+
`)>=0&&(t.style.height="51px")}this._signals=this._parseObjectNames(this.objectNames),this._signals.length===0&&this._signals.push({name:"",signal:""}),this._renderSignalList(),this._renderConverterList(),this._bindingsParse()}_parseObjectNames(t){return t?t.split(";").filter(s=>s.length>0).map(s=>{let e=s.indexOf(":");return e>0?{name:s.slice(0,e),signal:s.slice(e+1)}:{name:"",signal:s}}):[]}_signalsToObjectNames(){return this._signals.map(t=>t.name?t.name+":"+t.signal:t.signal).join(";")}_renderSignalList(){let t=this._signalListContainer;t.innerHTML="",this._signals.forEach((s,e)=>{let i=document.createElement("div");i.className="signal-row";let n=document.createElement("input");n.className="signal-name-input",n.placeholder=`__${e}`,n.value=s.name,n.title="variable name used in the formula (defaults to __"+e+" if empty)",n.oninput=()=>{this._signals[e].name=n.value,this._syncSignals()};let r=document.createElement("input");r.className="signal-path-input",r.value=s.signal,r.placeholder="signal path",r.title="signal path (prefix: ? = signalProperty, ?? = property value, # = target property, ## = target property value)",r.oninput=()=>{this._signals[e].signal=r.value,this._syncSignals()};let a=document.createElement("button");a.className="signal-icon-btn",a.title="Duplicate";let c=document.createElement("img");c.src=K+"icons/copy.svg",c.style.cssText="width:12px; height:12px;",a.appendChild(c),a.onclick=()=>{this._signals.splice(e+1,0,{...this._signals[e]}),this._syncSignals(),this._renderSignalList()};let o=document.createElement("button");o.className="signal-select-btn",o.textContent="...",o.title="Browse signal",o.onclick=()=>this._selectForRow(e,r);let p=document.createElement("button");p.className="signal-icon-btn",p.title="Remove";let h=document.createElement("img");h.src=K+"icons/delete.svg",h.style.cssText="width:12px; height:12px;",p.appendChild(h),p.onclick=()=>{this._signals.splice(e,1),this._syncSignals(),this._renderSignalList()},i.appendChild(n),i.appendChild(r),i.appendChild(o),i.appendChild(a),i.appendChild(p),t.appendChild(i)})}_syncSignals(){this.objectNames=this._signalsToObjectNames(),this._bindingsRefresh()}_addSignal(){this._signals.push({name:"",signal:""}),this._renderSignalList()}async _selectForRow(t,s){let e=this._shell.createBindableObjectBrowser();e.initialize(this._serviceContainer,this._instanceServiceContainer,"binding"),e.title="select signal...";let i=new AbortController;if(e.objectDoubleclicked.on(()=>{i.abort();let r="";e.selectedObject.specialType=="signalProperty"?r="?":e.selectedObject.bindabletype==="property"&&(r="??"),this._signals[t].signal=r+e.selectedObject.fullName,s.value=this._signals[t].signal,this._syncSignals()}),await this._shell.openConfirmation(e,{x:100,y:100,width:400,height:300,parent:this,abortSignal:i.signal})){let r="";e.selectedObject.specialType=="signalProperty"?r="?":e.selectedObject.bindabletype==="property"&&(r="??"),this._signals[t].signal=r+e.selectedObject.fullName,s.value=this._signals[t].signal,this._syncSignals()}}_renderConverterList(){let t=this._converterListContainer;t.innerHTML="";let s=this._property?.type==="color"?"color":"text";this.converters.forEach((e,i)=>{let n=document.createElement("div");n.className="signal-row";let r=document.createElement("input");r.style.cssText="flex:1 1 auto; height:22px; box-sizing:border-box;",r.value=e.key,r.placeholder="condition",r.oninput=()=>{this.converters[i].key=r.value};let a=document.createElement("input");a.type=s,a.style.cssText="flex:1 1 auto; height:22px; box-sizing:border-box;",a.value=e.value,a.placeholder="value",a.oninput=()=>{this.converters[i].value=a.value};let c=document.createElement("button");c.className="signal-icon-btn",c.title="Duplicate";let o=document.createElement("img");o.src=K+"icons/copy.svg",o.style.cssText="width:12px; height:12px;",c.appendChild(o),c.onclick=()=>{this.converters.splice(i+1,0,{...this.converters[i]}),this._renderConverterList()};let p=document.createElement("button");p.className="signal-icon-btn",p.title="Remove";let h=document.createElement("img");h.src=K+"icons/delete.svg",h.style.cssText="width:12px; height:12px;",p.appendChild(h),p.onclick=()=>{this.converters.splice(i,1),this._renderConverterList()},n.appendChild(r),n.appendChild(a),n.appendChild(c),n.appendChild(p),t.appendChild(n)})}_addConverter(){this.converters.push({key:"",value:""}),this._renderConverterList()}async _selectNamedConverter(){let t=l.namedConverters;if(t.length===0)return;let s="",e=null,i=document.createElement("div");i.style.cssText="display:flex; flex-direction:column; height:100%; box-sizing:border-box; font-size:12px;";let n=document.createElement("div");n.style.cssText="padding:6px 8px 4px; color:#666; font-size:11px; border-bottom:1px solid #e0e0e0; flex-shrink:0;",n.textContent="Select a converter and confirm with OK.",i.appendChild(n);let r=document.createElement("div");r.style.cssText="flex:1; overflow-y:auto; padding:4px;",i.appendChild(r);let a=p=>{p.style.background="",p.style.borderLeftColor="transparent"},c=(p,h)=>{e&&a(e),e=p,p.style.background="#e8f4fd",p.style.borderLeftColor="#0078d7",s=h};for(let p of t){let h=document.createElement("div");h.style.cssText="padding:5px 6px 5px 9px; cursor:pointer; border-radius:3px; border-left:3px solid transparent; margin-bottom:2px;";let m=document.createElement("div");if(m.style.cssText="font-family:monospace; font-weight:bold; color:#111;",m.textContent=p.name,h.appendChild(m),p.description){let u=document.createElement("div");u.style.cssText="color:#555; font-size:11px; margin-top:2px;",u.textContent=p.description,h.appendChild(u)}if(p.converter&&Object.keys(p.converter).length>0){let u=document.createElement("div");u.style.cssText="display:grid; grid-template-columns:max-content max-content 1fr; gap:1px 6px; margin-top:4px; padding:4px 6px; background:#f5f5f5; border-radius:2px; font-family:monospace; font-size:11px; color:#333;";for(let[d,g]of Object.entries(p.converter)){let f=document.createElement("span");f.style.cssText="color:#555; text-align:right;",f.textContent=d;let b=document.createElement("span");b.style.cssText="color:#aaa;",b.textContent="\u2192";let _=document.createElement("span");_.style.cssText="color:#0078d7; font-weight:bold;",_.textContent=String(g),u.appendChild(f),u.appendChild(b),u.appendChild(_)}h.appendChild(u)}h.onmouseenter=()=>{h!==e&&(h.style.background="#f5f5f5")},h.onmouseleave=()=>{h!==e&&(h.style.background="")},h.onclick=()=>c(h,p.name),r.appendChild(h)}await this._shell.openConfirmation(i,{x:100,y:100,width:320,height:300,parent:this})&&s&&(this.convertersString=s,this._getDomElement("namedConverterInput").value=s,this._bindingsRefresh())}_refresh(){requestAnimationFrame(()=>{this._bindingsRefresh()})}async showHistoric(){let t=new z(this.historic),s=new AbortController;t.title="Edit historic binding to: "+this._property.name,await this._shell.openConfirmation(t,{x:100,y:100,width:420,height:510,parent:this,abortSignal:s.signal,disableResize:!0,cancelText:"Remove"})?this.historic=t.historic:this.historic=null,this._bindingsRefresh()}_showHelp(){let t=document.createElement("iframe");t.srcdoc=l.helpSections.length>0?de.replace(`</div>
|
|
635
|
+
</body>`,l.helpSections.join("")+`</div>
|
|
636
|
+
</body>`):de,t.style.cssText="width:100%; height:100%; border:none; display:block;",this._shell.openModal(t,{title:"Bindings Editor Help",parent:this,x:-660,y:-80,width:630,height:580})}};customElements.define(Q.is,Q);import{BaseCustomWebComponentConstructorAppend as pt,TypedEvent as dt,css as ut,html as ht}from"@node-projects/base-custom-webcomponent";import{ContextMenu as mt,assetsPath as ue}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as Ce}from"@node-projects/propertygrid.webcomponent";import{defaultOptions as gt,defaultStyle as ft}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as yt}from"wunderbaum";import vt from"wunderbaum/dist/wunderbaum.css"with{type:"css"};import{PropertyGrid as tt}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as xe}from"@node-projects/web-component-designer-codeview-monaco";var q=class extends tt{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;setNameColumnWidth(t){let s=this._tree?.columns?.[0];s&&(s.width=t+"px",this._tree.update("colStructure"))}async getEditorForType(t,s,e,i,n){if(this.getSpecialEditorForType){let r=await this.getSpecialEditorForType(t,s,e,i,n);if(r)return r}switch(t.format){case"screen":{let r=document.createElement("select");r.style.width="100%";let a=document.createElement("option");a.value=s??"",a.innerText=s??"",r.appendChild(a);for(let c of await this.visualizationHandler.getAllNames("screen")){if(c==s)continue;let o=document.createElement("option");o.value=c,o.innerText=c,r.appendChild(o)}return r.onchange=()=>{this.setPropertyValue(e,r.value)},r.value=s,r}case"signal":{let r=document.createElement("div");r.style.display="flex";let a=document.createElement("input");a.value=s??"",a.style.flexGrow="1",a.style.width="0",a.onchange=o=>this.setPropertyValue(e,a.value),a.onfocus=o=>{a.selectionStart=0,a.selectionEnd=a.value?.length},r.appendChild(a);let c=document.createElement("button");return c.textContent="...",c.onclick=async()=>{let o=this.visualizationShell.createBindableObjectBrowser();o.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),o.title="select signal...";let p=new AbortController;o.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(o.selectedObject),p.abort(),a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value)}),await this.visualizationShell.openConfirmation(o,{x:100,y:100,width:400,height:300,parent:this,abortSignal:p.signal})&&(a.value=o.selectedObject.fullName,this.setPropertyValue(e,a.value))},r.appendChild(c),r}case"html":case"script":{let r=document.createElement("div");r.style.boxSizing="border-box",r.style.width="100%",r.style.display="flex";let a=document.createElement("textarea");a.style.boxSizing="border-box",a.value=s??"",a.style.width="100%",a.onblur=o=>{this.setPropertyValue(e,a.value)},r.appendChild(a);let c=document.createElement("button");return c.innerHTML="...",c.style.boxSizing="border-box",c.onclick=async()=>{let o=new xe,p=await xe.getMonacoLib();if(t.format=="html")o.language="html";else{let m={content:`declare global {
|
|
262
637
|
var context: { event: Event, element: Element };
|
|
263
|
-
}`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([
|
|
638
|
+
}`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([m]),o.language="javascript"}o.code=a.value,o.style.position="relative",await this.visualizationShell.openConfirmation(o,{x:200,y:200,width:600,height:400,parent:this})&&(a.value=o.getText(),this.setPropertyValue(e,a.value))},r.appendChild(c),r}}return super.getEditorForType(t,s,e,i,n)}};customElements.define("node-projects-visualization-property-grid",q);import{CodeViewMonaco as Te}from"@node-projects/web-component-designer-codeview-monaco";import{BaseCustomWebComponentConstructorAppend as it,TypedEvent as we,css as at,html as nt}from"@node-projects/base-custom-webcomponent";import{defaultOptions as ot,defaultStyle as rt}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as lt}from"wunderbaum";import ct from"wunderbaum/dist/wunderbaum.css"with{type:"css"};function st(l){return l.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">")}function B(l){return st(l).replace(/("(?:\\.|[^"\\])*")(\s*:)?|\b(true|false|null)\b|\b(-?\d+(?:\.\d+)?)\b/g,(s,e,i,n,r)=>e?`<span class="${i?"cs-key":"cs-str"}">${e}</span>${i??""}`:n?`<span class="cs-bool">${n}</span>`:r?`<span class="cs-num">${r}</span>`:s)}var L=class l extends it{static style=at`
|
|
264
639
|
:host {
|
|
265
640
|
display: block;
|
|
266
641
|
background: white;
|
|
@@ -405,7 +780,7 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
405
780
|
font-style: italic;
|
|
406
781
|
color: #666;
|
|
407
782
|
}
|
|
408
|
-
`;static template=
|
|
783
|
+
`;static template=nt`
|
|
409
784
|
<div class="root">
|
|
410
785
|
<input id="filter" placeholder="Filter..." autocomplete="off">
|
|
411
786
|
<div class="content">
|
|
@@ -419,14 +794,14 @@ export async function run(eventData, shadowRoot, parameters, relativeSignalsPath
|
|
|
419
794
|
<button id="closeBtn" @click="[[this.closeClicked()]]">Close</button>
|
|
420
795
|
</div>
|
|
421
796
|
</div>
|
|
422
|
-
`;static is="node-projects-visualization-simple-script-command-picker";_title;get title(){return this._title}set title(t){this._title=t}selectedType;commandTypeChosen=new
|
|
797
|
+
`;static is="node-projects-visualization-simple-script-command-picker";_title;get title(){return this._title}set title(t){this._title=t}selectedType;commandTypeChosen=new we;closeRequested=new we;_tree;_filter;_descriptionDiv;_addBtn;_typeInfo;_descriptions;constructor(){super(),this._restoreCachedInititalValues(),this.shadowRoot.adoptedStyleSheets=[ct,rt,l.style],this._descriptionDiv=this._getDomElement("description"),this._addBtn=this._getDomElement("addBtn"),this._filter=this._getDomElement("filter"),this._filter.onkeyup=()=>{let t=this._filter.value;this._tree.filterNodes(s=>new RegExp(t,"i").test(s.title),{})},this._tree=new lt({...ot,element:this._getDomElement("commandList"),icon:!1,filter:{autoExpand:!0,mode:"hide",highlight:!0},activate:t=>{this.selectedType=t.node.title,this._addBtn.disabled=!1,this._renderDescription(t.node.title)},dblclick:t=>(this.selectedType=t.node.title,this.commandTypeChosen.emit(),!1),render:t=>{t.isNew&&(t.nodeElem.oncontextmenu=s=>(s.preventDefault(),!1))},dnd:{guessDropEffect:!1,serializeClipboardData:!0,dragStart:t=>(t.event.dataTransfer.effectAllowed="copy",t.event.dataTransfer.dropEffect="copy",!0)}})}async ready(){this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents()}addClicked(){this.selectedType&&this.commandTypeChosen.emit()}closeClicked(){this.closeRequested.emit()}_renderDescription(t){let s=this._descriptions?.[t];if(s){this._descriptionDiv.innerHTML=`
|
|
423
798
|
<div class="cmd-title">${t}<span class="hint">${s.description}</span></div>
|
|
424
|
-
<pre class="snippet">${
|
|
799
|
+
<pre class="snippet">${B(s.example)}</pre>
|
|
425
800
|
${s.note?`<div class="note">${s.note}</div>`:""}
|
|
426
801
|
`;return}let e=this._typeInfo?.definitions?.[t]?.description;this._descriptionDiv.innerHTML=`
|
|
427
802
|
<div class="cmd-title">${t}</div>
|
|
428
803
|
${e?`<div class="note">${e}</div>`:""}
|
|
429
|
-
`}loadCommands(t,s){this._typeInfo=t,this._descriptions=s??{};let e=Object.keys(t.definitions).filter(i=>t.definitions[i].type==="object"&&i!=="ScriptCommands");this._tree.root.addChildren(e.map(i=>({title:i})))}};customElements.define(
|
|
804
|
+
`}loadCommands(t,s){this._typeInfo=t,this._descriptions=s??{};let e=Object.keys(t.definitions).filter(i=>t.definitions[i].type==="object"&&i!=="ScriptCommands");this._tree.root.addChildren(e.map(i=>({title:i})))}};customElements.define(L.is,L);function _e(l,t){return`<span class="cs-attr">${l}</span>='${B(t)}'`}var Se=`<!DOCTYPE html>
|
|
430
805
|
<html>
|
|
431
806
|
<head>
|
|
432
807
|
<meta charset="UTF-8">
|
|
@@ -547,7 +922,7 @@ html, body {
|
|
|
547
922
|
|
|
548
923
|
<div class="content-section">
|
|
549
924
|
<div class="section-title"><span class="section-num">1</span> Basic structure <span class="section-hint">commands array, sequential execution</span></div>
|
|
550
|
-
<pre class="snippet">${
|
|
925
|
+
<pre class="snippet">${_e("@click",`{"commands":[
|
|
551
926
|
{ "type": "SetSignalValue", "signal": ".Some.Signal", "value": true },
|
|
552
927
|
{ "type": "SetSignalValue", "signal": ".Some.Other", "value": false }
|
|
553
928
|
]}`)}</pre>
|
|
@@ -557,22 +932,22 @@ html, body {
|
|
|
557
932
|
<div class="content-section">
|
|
558
933
|
<div class="section-title"><span class="section-num">2</span> Dynamic / indirect values <span class="section-hint">IScriptMultiplexValue</span></div>
|
|
559
934
|
<div class="note">Instead of a plain value, most command values can be an object <code>{ "source": ..., "name": ... }</code> that is resolved at runtime.</div>
|
|
560
|
-
<pre class="snippet">${
|
|
561
|
-
${
|
|
562
|
-
${
|
|
935
|
+
<pre class="snippet">${B('{ "source": "expression", "name": "ctx.event.srcElement.value" }')} <span class="cs-comment">// js expression, 'ctx' is the context object</span>
|
|
936
|
+
${B('{ "source": "complexString", "name": "prefix-{.Some.Signal}-suffix" }')} <span class="cs-comment">// signal names in {}</span>
|
|
937
|
+
${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">// a parameter handed into the script</span></pre>
|
|
563
938
|
<div class="note">Other sources: signal, property, signalInProperty, event, complexSignal, context, elementProperty. The property grid's "..." button opens an editor for these.</div>
|
|
564
939
|
</div>
|
|
565
940
|
|
|
566
941
|
<div class="content-section">
|
|
567
942
|
<div class="section-title"><span class="section-num">3</span> Cyclic events <span class="section-hint">re-triggering timer event</span></div>
|
|
568
|
-
<pre class="snippet">${
|
|
943
|
+
<pre class="snippet">${_e("@cyclic:100",`{"commands":[
|
|
569
944
|
{ "type": "SetSignalValue", "signal": ".Local.Tick", "value": true }
|
|
570
945
|
]}`)}</pre>
|
|
571
946
|
<div class="note">A <code>@cyclic:<ms></code> event retriggers itself automatically every <ms> milliseconds.</div>
|
|
572
947
|
</div>
|
|
573
948
|
</div>
|
|
574
949
|
</body>
|
|
575
|
-
</html>`;var
|
|
950
|
+
</html>`;var ke={Comment:{description:"has no effect on script execution",example:'{ "type": "Comment", "comment": "explains the next step" }'},OpenScreen:{description:"navigate to a screen (with history)",example:'{ "type": "OpenScreen", "screen": "MyScreen" }'},OpenDialog:{description:"open a screen as a movable/closable dialog",example:`{ "type": "OpenDialog", "screen": "MyScreen", "title": "My Dialog",
|
|
576
951
|
"moveable": true, "closeable": true }`},CloseDialog:{description:"close the parent dialog this command runs in",example:'{ "type": "CloseDialog" }'},OpenUrl:{description:"open an URL, optionally as an in-app dialog",example:'{ "type": "OpenUrl", "url": "https://example.com", "target": "_blank", "openInDialog": false }'},ShowMessageBox:{description:"ask the user to confirm before continuing",example:`{ "type": "ShowMessageBox", "title": "Confirm", "message": "Are you sure?",
|
|
577
952
|
"messageType": "warning", "buttons": "yesNo", "resultSignal": ".Local.Result",
|
|
578
953
|
"exitScriptOnCancel": true }`,note:"exitScriptOnCancel: true stops the chain when the user picks a negative button."},ShowPrompt:{description:"ask the user for text input",example:`{ "type": "ShowPrompt", "title": "Name?", "message": "Enter a name",
|
|
@@ -581,7 +956,7 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
581
956
|
"targetSelector": ".my-class", "name": "disabled", "value": true }`,note:'target: "property" (default) | "attribute" | "css" | "class". targetSelectorTarget: "container" (screen/customControl, default) | "element" (current element).'},Delay:{description:"pause the script chain",example:'{ "type": "Delay", "value": 500 }'},Console:{description:"write a message to the browser console",example:'{ "type": "Console", "target": "log", "message": "done" }',note:'target: "log" (default) | "info" | "debug" | "warn" | "error".'},SwitchLanguage:{description:"switch the active UI language",example:'{ "type": "SwitchLanguage", "language": "en" }'},Login:{description:"log a user in",example:'{ "type": "Login", "username": "user", "password": "pass" }'},Logout:{description:"log the current user out",example:'{ "type": "Logout" }'},SubscribeSignal:{description:"subscribe to a signal so its updates are pushed to the client",example:'{ "type": "SubscribeSignal", "signal": ".Some.Signal", "oneTime": false }'},UnsubscribeSignal:{description:"unsubscribe from a previously subscribed signal",example:'{ "type": "UnsubscribeSignal", "signal": ".Some.Signal" }'},WriteSignalsInGroup:{description:"write all pending signal values of a named group",example:'{ "type": "WriteSignalsInGroup", "group": "MyGroup" }'},ClearSignalsInGroup:{description:"clear all pending signal values of a named group",example:'{ "type": "ClearSignalsInGroup", "group": "MyGroup" }'},RunScript:{description:"run another named script",example:'{ "type": "RunScript", "name": "MyScript", "scriptType": "SimpleScript" }'},CopySignalValuesFromFolder:{description:"copy signal values from one signal folder to another",example:'{ "type": "CopySignalValuesFromFolder", "sourceFolder": ".Source", "destinationFolder": ".Target" }'},ExportSignalValuesAsJson:{description:"export matching signal values as a downloadable JSON file",example:'{ "type": "ExportSignalValuesAsJson", "regex": "^\\\\.Some\\\\..*", "fileName": "export.json" }'},ImportSignalValuesFromJson:{description:"import signal values from a JSON string",example:'{ "type": "ImportSignalValuesFromJson", "data": "{ \\".Some.Signal\\": true }" }'},Repeat:{description:"jump back to a label a number of times, or indefinitely",example:'{ "type": "Repeat", "label": "lbl_loop", "count": 0, "mode": "eventValid" }',note:'mode: "eventValid" (default, repeats until the event is no longer active) | "always" (repeats until count is 0 or indefinitely when count is 0).'},Condition:{description:"compare two values and jump to a label depending on the result",example:`{ "type": "Condition", "value1": {"source":"signal","name":".Is.On"}, "value2": true,
|
|
582
957
|
"comparisonType": "==", "trueGotoLabel": "lbl_off", "falseGotoLabel": "lbl_on" }`,note:"comparisonType: ==null | !=null | ==true | ==false | == | != | > | < | >= | <= | && | ||."},If:{description:"evaluate a formula and run nested commands depending on the result",example:`{ "type": "If",
|
|
583
958
|
"signals": [{"source":"signal","name":".Is.On"}, {"varName":"ready","source":"signal","name":".Is.Ready"}],
|
|
584
|
-
"formula": "__0 == true && ready == false", "trueCommands": [], "elseCommands": [] }`,note:"signals is a list of values (like Condition.value1). Each is referenced in the formula either positionally as __0, __1, ... or, if varName is set, by that name. trueCommands/elseCommands are edited as nested commands in the tree, not as JSON here."},Exit:{description:"stop executing the current script chain",example:'{ "type": "Exit" }'},Label:{description:"a named jump target for Condition / Goto / Repeat",example:'{ "type": "Label", "label": "lbl_on" }'},Goto:{description:"jump unconditionally to a label",example:'{ "type": "Goto", "label": "lbl_on" }'}};import"@node-projects/splitview.webcomponent";var
|
|
959
|
+
"formula": "__0 == true && ready == false", "trueCommands": [], "elseCommands": [] }`,note:"signals is a list of values (like Condition.value1). Each is referenced in the formula either positionally as __0, __1, ... or, if varName is set, by that name. trueCommands/elseCommands are edited as nested commands in the tree, not as JSON here."},Exit:{description:"stop executing the current script chain",example:'{ "type": "Exit" }'},Label:{description:"a named jump target for Condition / Goto / Repeat",example:'{ "type": "Label", "label": "lbl_on" }'},Goto:{description:"jump unconditionally to a label",example:'{ "type": "Goto", "label": "lbl_on" }'}};import"@node-projects/splitview.webcomponent";var D=class l{static upgradeScriptCommand(t){return t.type==="SetElementProperty"?l.upgradeSetElementProperty(t):(t.type==="If"&&(t.trueCommands=(t.trueCommands??[]).map(s=>l.upgradeScriptCommand(s)),t.elseCommands=(t.elseCommands??[]).map(s=>l.upgradeScriptCommand(s))),t)}static upgradeSetElementProperty(t){return t.targetSelectorTarget==="currentScreen"?t.targetSelectorTarget="container":t.targetSelectorTarget==="parentScreen"?(t.targetSelectorTarget="container",t.parentIndex=1):t.targetSelectorTarget==="currentElement"?t.targetSelectorTarget="element":t.targetSelectorTarget==="parentElement"&&(t.targetSelectorTarget="element",t.parentIndex=1),t}};var j="application/x-simple-script-move",W=class l extends pt{static style=ut`
|
|
585
960
|
:host {
|
|
586
961
|
background: white;
|
|
587
962
|
}
|
|
@@ -779,7 +1154,7 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
779
1154
|
height: 12px;
|
|
780
1155
|
cursor: pointer;
|
|
781
1156
|
}
|
|
782
|
-
`;static template=
|
|
1157
|
+
`;static template=ht`
|
|
783
1158
|
<div class="root">
|
|
784
1159
|
<div class="content">
|
|
785
1160
|
<node-projects-split-view
|
|
@@ -829,8 +1204,8 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
829
1204
|
</node-projects-split-view>
|
|
830
1205
|
</div>
|
|
831
1206
|
</div>
|
|
832
|
-
`;static is="node-projects-visualization-simple-script-editor";_title;get title(){return this._title}set title(t){this._title=t}serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;helpRequested=new ct;commandDescriptions={...Se};_script;_commandListDiv;_commandListFancyTree;_propertygrid;_splitView;_codeView;_codeToggleBtn;_addCommandBtn;_showingCode=!1;_dragFromHandle=!1;_draggedNode=null;constructor(){super(),this._restoreCachedInititalValues(),this._commandListDiv=this._getDomElement("commandList"),this._propertygrid=this._getDomElement("propertygrid"),this._splitView=this._getDomElement("splitView"),this._codeView=this._getDomElement("codeView"),this._codeToggleBtn=this._getDomElement("codeToggleBtn"),this._addCommandBtn=this._getDomElement("addCommandBtn");let t=this._getDomElement("listContent");t.addEventListener("mousedown",s=>{this._dragFromHandle=!!s.target?.closest(".drag-handle")}),document.addEventListener("dragend",()=>{this._draggedNode=null},!0),t.addEventListener("dragover",s=>{if(s.preventDefault(),s.dataTransfer){let e=s.dataTransfer.types.includes(j);s.dataTransfer.dropEffect=e?"move":"copy"}}),t.addEventListener("drop",s=>{if(s.preventDefault(),s.dataTransfer?.types.includes(j)&&this._draggedNode){let i=this._commandListFancyTree.root.children,r=i?.[i.length-1];r&&this._draggedNode.moveTo(r,"after"),this._draggedNode.setClass("wb-drag-source",!1)}else{let i=s.dataTransfer?.getData("text/plain");if(i){let r={type:i};this._commandListFancyTree.root.addChildren(this.createTreeItem(r))}}}),this.shadowRoot.adoptedStyleSheets=[ft,mt,n.style]}async ready(){this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents();let t=async l=>{let o=new X;o.visualizationHandler=this.visualizationHandler,o.visualizationShell=this.visualizationShell,o.serviceContainer=this.serviceContainer,o.instanceServiceContainer=this.instanceServiceContainer,o.bindableObjectsTarget="script",o.getTypeInfo=(m,h)=>_e(this.propertiesTypeInfo,m,h),o.showHead=!1,o.typeName="IScriptMultiplexValue",o.title='Complex for "'+l.propertyPath+'"',typeof l.value=="object"?o.selectedObject=l.value??{}:o.selectedObject={},o.bindingDoubleClicked=m=>{m.bindabletype=="property"?o.setPropertyValue("source","property"):m.bindabletype=="context"?o.setPropertyValue("source","context"):o.setPropertyValue("source","signal"),o.setPropertyValue("name",m.fullName),o.refresh()},await this.visualizationShell.openConfirmation(o,{x:100,y:100,width:400,height:500,parent:this})&&(this._propertygrid.setPropertyValue(l.propertyPath,o.selectedObject),this._propertygrid.refresh())},s=async l=>{let o=new ke;o.language="javascript",o.style.position="relative",o.code=l.value??"",await this.visualizationShell.openConfirmation(o,{title:"Edit formula",x:100,y:50,width:700,height:450,parent:this})&&(this._propertygrid.setPropertyValue(l.propertyPath,o.code),this._propertygrid.refresh())},e=["signal","property","elementProperty","signalInProperty","event","parameter","context","complexString","complexSignal","expression"],i=/^[A-Za-z_$][A-Za-z0-9_$]*$/,r=new Set(["break","case","catch","class","const","continue","debugger","default","delete","do","else","export","extends","finally","for","function","if","import","in","instanceof","new","return","super","switch","this","throw","try","typeof","var","void","while","with","yield","let","static","enum","await","implements","package","protected","interface","private","public","null","true","false","undefined","arguments","eval"]),c={signal:"read the value from a Signal",property:"read the value from a property of the customControl (not usable in screens)",elementProperty:"a property defined on the element raising the event",signalInProperty:"read the value from a Signal (wich name is in the Property)",event:"read the value of a property of the event object",parameter:"a parameter you hand over",context:"a value of the context",complexString:"a string with signals (contained in {})",complexSignal:"read the value from a signal wich name is build here (it can contain other signals in {})",expression:"js expression, 'ctx' is context object"},a=async l=>{let o=(l.value??[]).map(w=>({...w})),p=w=>{let S=(o[w].varName??"").trim();return S?i.test(S)?r.has(S)?`"${S}" is a reserved word and cannot be used as a variable name.`:o.some((_,k)=>k!==w&&(_.varName??"").trim()===S)?`"${S}" is used by more than one signal.`:null:`"${S}" is not a valid JavaScript variable name.`:null},m="height:22px; box-sizing:border-box; font-size:12px;",h=document.createElement("div");h.style.cssText="display:flex; flex-direction:column; gap:6px; padding:8px; height:100%; box-sizing:border-box; overflow-y:auto; font-size:12px;";let u=document.createElement("div");u.style.cssText="display:flex; align-items:center; gap:4px; font-weight:bold;";let d=document.createElement("span");d.textContent="Name",d.style.cssText="flex:0 0 120px;";let g=document.createElement("span");g.textContent="Typ",g.style.cssText="flex:0 0 130px;";let f=document.createElement("span");f.textContent="Signal",f.style.cssText="flex:1 1 auto;";let x=document.createElement("span");x.style.cssText="flex:0 0 22px;",u.append(d,g,f,x),h.appendChild(u);let T=document.createElement("div");T.style.cssText="display:flex; flex-direction:column; gap:4px;",h.appendChild(T);let $=document.createElement("div");$.style.cssText="flex:0 0 auto; margin-top:4px; padding-top:6px; border-top:1px solid #ccc; font-size:12px;";let ie=document.createElement("div");ie.style.cssText="font-weight:bold; margin-bottom:2px;";let ae=document.createElement("div");ae.style.cssText="color:#333; white-space:pre-line;",$.append(ie,ae);let ne=w=>{ie.textContent="Typ: "+w,ae.textContent=c[w]??""},oe=[],ge=()=>{o.forEach((w,S)=>{let _=oe[S];if(!_)return;let k=p(S);_.title=k??`Variable name used in the formula (defaults to __${S} if empty)`,_.style.borderColor=k?"#c0392b":"",_.style.backgroundColor=k?"#fdecea":""})},re=()=>{T.innerHTML="",oe.length=0,o.forEach((w,S)=>{let _=document.createElement("div");_.style.cssText="display:flex; align-items:center; gap:4px;";let k=document.createElement("input");k.value=w.varName??"",k.placeholder="__"+S,k.style.cssText=m+" flex:0 0 120px; min-width: 120px; font-family:monospace;",k.oninput=()=>{w.varName=k.value||void 0,ge()},oe.push(k),_.appendChild(k);let N=document.createElement("select");N.style.cssText=m+" flex:0 0 130px;";for(let ce of e){let Z=document.createElement("option");Z.value=ce,Z.textContent=ce,w.source===ce&&(Z.selected=!0),N.appendChild(Z)}N.onchange=()=>{w.source=N.value,ne(N.value)},N.onfocus=()=>ne(N.value),_.appendChild(N);let R=document.createElement("input");R.value=w.name??"",R.placeholder="e.g. srm.rbg{__tagRoot}.error",R.style.cssText=m+" flex:1 1 auto;",R.oninput=()=>{w.name=R.value},_.appendChild(R);let G=document.createElement("button");G.title="Remove signal",G.style.cssText=m+" flex:0 0 22px; width:22px; padding:0; display:flex; align-items:center; justify-content:center;";let le=document.createElement("img");le.src=pe+"icons/delete.svg",le.style.cssText="width:12px; height:12px;",G.appendChild(le),G.onclick=()=>{o.splice(S,1),re()},_.appendChild(G),T.appendChild(_)}),ge()};re();let Y=document.createElement("button");Y.textContent="+ Add signal",Y.style.cssText=m+" align-self:flex-start; padding:0 8px;",Y.onclick=()=>{o.push({source:"signal",name:""}),re()},h.appendChild(Y),ne(o[0]?.source??"signal"),h.appendChild($),await this.visualizationShell.openConfirmation(h,{title:"Edit signals",x:100,y:50,width:500,height:400,parent:this})&&(this._propertygrid.setPropertyValue(l.propertyPath,o),this._propertygrid.refresh())};this._propertygrid.visualizationHandler=this.visualizationHandler,this._propertygrid.visualizationShell=this.visualizationShell,this._propertygrid.serviceContainer=this.serviceContainer,this._propertygrid.instanceServiceContainer=this.instanceServiceContainer,this._propertygrid.bindableObjectsTarget="script",this._propertygrid.setNameColumnWidth(130),this._propertygrid.getTypeInfo=(l,o)=>{let p=_e(this.scriptCommandsTypeInfo,l,o);return p&&(o==="If"||l?.type==="If")&&(p.properties=p.properties.filter(m=>m.name!=="trueCommands"&&m.name!=="elseCommands")),p},this._propertygrid.getSpecialEditorForType=async(l,o,p,m,h)=>{if(!l.specialAllreadyAdded&&(l.specialAllreadyAdded=!0,l.format!=="collection"))if(l.format==="signalList"){let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.innerText="del",u.onclick=()=>{this._propertygrid.setPropertyValue(p,void 0),this._propertygrid.refresh()},m.nodeElem.insertAdjacentElement("afterbegin",u);let d=Array.isArray(o)?o:[],g=document.createElement("div");g.style.display="flex";let f=document.createElement("span");f.innerText=d.map((T,$)=>(T?.varName||"__"+$)+": "+(T?.source??"")+":"+(T?.name??"")).join(", "),f.style.overflow="hidden",f.style.whiteSpace="nowrap",f.style.textOverflow="ellipsis",f.style.flexGrow="1",f.title=JSON.stringify(d),g.appendChild(f);let x=document.createElement("button");return x.innerText="...",x.onclick=()=>{a({value:d,propertyPath:p})},g.appendChild(x),m.nodeElem.style.display="flex",g}else if(l.format==="formula"){let u=document.createElement("div");u.style.cssText="display:flex; width:100%; height:100%; align-items:stretch;";let d=new ke;d.language="javascript",d.singleRow=!0,d.style.cssText="flex:1 1 auto; min-width:0; height:100%; position:relative; overflow:hidden;",d.code=o??"",d.addEventListener("code-changed",()=>{this._propertygrid.setPropertyValue(p,d.code)}),u.appendChild(d);let g=document.createElement("button");return g.innerText="...",g.title="Open in larger editor",g.style.cssText="flex:0 0 28px; width:20px;",g.onclick=()=>s({value:d.code,propertyPath:p}),u.appendChild(g),m.nodeElem.style.display="flex",u}else if(typeof o=="object"&&o!==null||l.format==="complex"){let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.innerText="del",u.onclick=()=>{this._propertygrid.setPropertyValue(p,void 0),this._propertygrid.refresh()},m.nodeElem.insertAdjacentElement("afterbegin",u);let d=document.createElement("div");d.style.display="flex";let g=document.createElement("span");o?g.innerText=(o.source??"")+": "+(o.name??""):g.innerText="",g.style.overflow="hidden",g.style.whiteSpace="nowrap",g.style.textOverflow="ellipsis",g.style.flexGrow="1",g.title=JSON.stringify(o),d.appendChild(g);let f=document.createElement("button");return f.innerText="...",f.onclick=()=>{t({value:o,propertyPath:p})},d.appendChild(f),m.nodeElem.style.display="flex",d}else{let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.title="complex property value",u.style.opacity="0.2",u.innerText="...",u.onclick=()=>{t({value:o,propertyPath:p})},m.nodeElem.insertAdjacentElement("afterbegin",u),m.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(l=>{ut.show([{title:"edit complex value",action:async()=>{t(l)}},{title:"edit string",action:async()=>{let o=prompt("enter value:");o&&(this._propertygrid.setPropertyValue(l.propertyPath,o),this._propertygrid.refresh())}},{title:"remove complex value",action:async()=>{this._propertygrid.setPropertyValue(l.propertyPath,void 0),this._propertygrid.refresh()}}],l.event)})}helpClicked(){let t=document.createElement("iframe");t.srcdoc=we,t.style.cssText="width:100%; height:100%; border:none; display:block;",this.visualizationShell.openModal(t,{title:"Simple Script Editor Help",parent:this,x:-650,y:-100,width:620,height:620}),this.helpRequested.emit()}toggleCodeView(){if(!this._showingCode){let s=JSON.stringify({commands:this.getScriptCommands()},null,2);this._codeView.update(s),this._showCodeView(!0);return}let t=this._parseCodeViewScript();t&&(this._showCodeView(!1),this.loadScript(t))}_showCodeView(t){this._codeView.classList.toggle("visible",t),this._commandListDiv.classList.toggle("hidden",t),this._splitView.classList.toggle("code-mode",t),this._addCommandBtn.disabled=t,this._codeToggleBtn.innerText=t?"Visual":"Code",this._showingCode=t,t&&requestAnimationFrame(()=>this._codeView.activated())}_parseCodeViewScript(){let t;try{t=JSON.parse(this._codeView.getText())}catch(s){return alert(`Invalid JSON:
|
|
833
|
-
`+s.message),null}return Array.isArray(t?.commands)?t:(alert('The JSON must have a "commands" array.'),null)}loadScript(t){this._script=t,this._commandListFancyTree&&(this._commandListFancyTree.destroy(),this._commandListDiv=this._getDomElement("commandList"));let s=[];for(let e of this._script.commands)e=
|
|
1207
|
+
`;static is="node-projects-visualization-simple-script-editor";_title;get title(){return this._title}set title(t){this._title=t}serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;helpRequested=new dt;commandDescriptions={...ke};_script;_commandListDiv;_commandListFancyTree;_propertygrid;_splitView;_codeView;_codeToggleBtn;_addCommandBtn;_showingCode=!1;_dragFromHandle=!1;_draggedNode=null;constructor(){super(),this._restoreCachedInititalValues(),this._commandListDiv=this._getDomElement("commandList"),this._propertygrid=this._getDomElement("propertygrid"),this._splitView=this._getDomElement("splitView"),this._codeView=this._getDomElement("codeView"),this._codeToggleBtn=this._getDomElement("codeToggleBtn"),this._addCommandBtn=this._getDomElement("addCommandBtn");let t=this._getDomElement("listContent");t.addEventListener("mousedown",s=>{this._dragFromHandle=!!s.target?.closest(".drag-handle")}),document.addEventListener("dragend",()=>{this._draggedNode=null},!0),t.addEventListener("dragover",s=>{if(s.preventDefault(),s.dataTransfer){let e=s.dataTransfer.types.includes(j);s.dataTransfer.dropEffect=e?"move":"copy"}}),t.addEventListener("drop",s=>{if(s.preventDefault(),s.dataTransfer?.types.includes(j)&&this._draggedNode){let i=this._commandListFancyTree.root.children,n=i?.[i.length-1];n&&this._draggedNode.moveTo(n,"after"),this._draggedNode.setClass("wb-drag-source",!1)}else{let i=s.dataTransfer?.getData("text/plain");if(i){let n={type:i};this._commandListFancyTree.root.addChildren(this.createTreeItem(n))}}}),this.shadowRoot.adoptedStyleSheets=[vt,ft,l.style]}async ready(){this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents();let t=async c=>{let o=new q;o.visualizationHandler=this.visualizationHandler,o.visualizationShell=this.visualizationShell,o.serviceContainer=this.serviceContainer,o.instanceServiceContainer=this.instanceServiceContainer,o.bindableObjectsTarget="script",o.getTypeInfo=(h,m)=>Ce(this.propertiesTypeInfo,h,m),o.showHead=!1,o.typeName="IScriptMultiplexValue",o.title='Complex for "'+c.propertyPath+'"',typeof c.value=="object"?o.selectedObject=c.value??{}:o.selectedObject={},o.bindingDoubleClicked=h=>{h.bindabletype=="property"?o.setPropertyValue("source","property"):h.bindabletype=="context"?o.setPropertyValue("source","context"):o.setPropertyValue("source","signal"),o.setPropertyValue("name",h.fullName),o.refresh()},await this.visualizationShell.openConfirmation(o,{x:100,y:100,width:400,height:500,parent:this})&&(this._propertygrid.setPropertyValue(c.propertyPath,o.selectedObject),this._propertygrid.refresh())},s=async c=>{let o=new Te;o.language="javascript",o.style.position="relative",o.code=c.value??"",await this.visualizationShell.openConfirmation(o,{title:"Edit formula",x:100,y:50,width:700,height:450,parent:this})&&(this._propertygrid.setPropertyValue(c.propertyPath,o.code),this._propertygrid.refresh())},e=["signal","property","elementProperty","signalInProperty","event","parameter","context","complexString","complexSignal","expression"],i=/^[A-Za-z_$][A-Za-z0-9_$]*$/,n=new Set(["break","case","catch","class","const","continue","debugger","default","delete","do","else","export","extends","finally","for","function","if","import","in","instanceof","new","return","super","switch","this","throw","try","typeof","var","void","while","with","yield","let","static","enum","await","implements","package","protected","interface","private","public","null","true","false","undefined","arguments","eval"]),r={signal:"read the value from a Signal",property:"read the value from a property of the customControl (not usable in screens)",elementProperty:"a property defined on the element raising the event",signalInProperty:"read the value from a Signal (wich name is in the Property)",event:"read the value of a property of the event object",parameter:"a parameter you hand over",context:"a value of the context",complexString:"a string with signals (contained in {})",complexSignal:"read the value from a signal wich name is build here (it can contain other signals in {})",expression:"js expression, 'ctx' is context object"},a=async c=>{let o=(c.value??[]).map(w=>({...w})),p=w=>{let S=(o[w].varName??"").trim();return S?i.test(S)?n.has(S)?`"${S}" is a reserved word and cannot be used as a variable name.`:o.some((k,C)=>C!==w&&(k.varName??"").trim()===S)?`"${S}" is used by more than one signal.`:null:`"${S}" is not a valid JavaScript variable name.`:null},h="height:22px; box-sizing:border-box; font-size:12px;",m=document.createElement("div");m.style.cssText="display:flex; flex-direction:column; gap:6px; padding:8px; height:100%; box-sizing:border-box; overflow-y:auto; font-size:12px;";let u=document.createElement("div");u.style.cssText="display:flex; align-items:center; gap:4px; font-weight:bold;";let d=document.createElement("span");d.textContent="Name",d.style.cssText="flex:0 0 120px;";let g=document.createElement("span");g.textContent="Typ",g.style.cssText="flex:0 0 130px;";let f=document.createElement("span");f.textContent="Signal",f.style.cssText="flex:1 1 auto;";let b=document.createElement("span");b.style.cssText="flex:0 0 22px;",u.append(d,g,f,b),m.appendChild(u);let _=document.createElement("div");_.style.cssText="display:flex; flex-direction:column; gap:4px;",m.appendChild(_);let $=document.createElement("div");$.style.cssText="flex:0 0 auto; margin-top:4px; padding-top:6px; border-top:1px solid #ccc; font-size:12px;";let ae=document.createElement("div");ae.style.cssText="font-weight:bold; margin-bottom:2px;";let ne=document.createElement("div");ne.style.cssText="color:#333; white-space:pre-line;",$.append(ae,ne);let oe=w=>{ae.textContent="Typ: "+w,ne.textContent=r[w]??""},re=[],ye=()=>{o.forEach((w,S)=>{let k=re[S];if(!k)return;let C=p(S);k.title=C??`Variable name used in the formula (defaults to __${S} if empty)`,k.style.borderColor=C?"#c0392b":"",k.style.backgroundColor=C?"#fdecea":""})},le=()=>{_.innerHTML="",re.length=0,o.forEach((w,S)=>{let k=document.createElement("div");k.style.cssText="display:flex; align-items:center; gap:4px;";let C=document.createElement("input");C.value=w.varName??"",C.placeholder="__"+S,C.style.cssText=h+" flex:0 0 120px; min-width: 120px; font-family:monospace;",C.oninput=()=>{w.varName=C.value||void 0,ye()},re.push(C),k.appendChild(C);let N=document.createElement("select");N.style.cssText=h+" flex:0 0 130px;";for(let pe of e){let Z=document.createElement("option");Z.value=pe,Z.textContent=pe,w.source===pe&&(Z.selected=!0),N.appendChild(Z)}N.onchange=()=>{w.source=N.value,oe(N.value)},N.onfocus=()=>oe(N.value),k.appendChild(N);let R=document.createElement("input");R.value=w.name??"",R.placeholder="e.g. srm.rbg{__tagRoot}.error",R.style.cssText=h+" flex:1 1 auto;",R.oninput=()=>{w.name=R.value},k.appendChild(R);let G=document.createElement("button");G.title="Remove signal",G.style.cssText=h+" flex:0 0 22px; width:22px; padding:0; display:flex; align-items:center; justify-content:center;";let ce=document.createElement("img");ce.src=ue+"icons/delete.svg",ce.style.cssText="width:12px; height:12px;",G.appendChild(ce),G.onclick=()=>{o.splice(S,1),le()},k.appendChild(G),_.appendChild(k)}),ye()};le();let Y=document.createElement("button");Y.textContent="+ Add signal",Y.style.cssText=h+" align-self:flex-start; padding:0 8px;",Y.onclick=()=>{o.push({source:"signal",name:""}),le()},m.appendChild(Y),oe(o[0]?.source??"signal"),m.appendChild($),await this.visualizationShell.openConfirmation(m,{title:"Edit signals",x:100,y:50,width:500,height:400,parent:this})&&(this._propertygrid.setPropertyValue(c.propertyPath,o),this._propertygrid.refresh())};this._propertygrid.visualizationHandler=this.visualizationHandler,this._propertygrid.visualizationShell=this.visualizationShell,this._propertygrid.serviceContainer=this.serviceContainer,this._propertygrid.instanceServiceContainer=this.instanceServiceContainer,this._propertygrid.bindableObjectsTarget="script",this._propertygrid.setNameColumnWidth(130),this._propertygrid.getTypeInfo=(c,o)=>{let p=Ce(this.scriptCommandsTypeInfo,c,o);return p&&(o==="If"||c?.type==="If")&&(p.properties=p.properties.filter(h=>h.name!=="trueCommands"&&h.name!=="elseCommands")),p},this._propertygrid.getSpecialEditorForType=async(c,o,p,h,m)=>{if(!c.specialAllreadyAdded&&(c.specialAllreadyAdded=!0,c.format!=="collection"))if(c.format==="signalList"){let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.innerText="del",u.onclick=()=>{this._propertygrid.setPropertyValue(p,void 0),this._propertygrid.refresh()},h.nodeElem.insertAdjacentElement("afterbegin",u);let d=Array.isArray(o)?o:[],g=document.createElement("div");g.style.display="flex";let f=document.createElement("span");f.innerText=d.map((_,$)=>(_?.varName||"__"+$)+": "+(_?.source??"")+":"+(_?.name??"")).join(", "),f.style.overflow="hidden",f.style.whiteSpace="nowrap",f.style.textOverflow="ellipsis",f.style.flexGrow="1",f.title=JSON.stringify(d),g.appendChild(f);let b=document.createElement("button");return b.innerText="...",b.onclick=()=>{a({value:d,propertyPath:p})},g.appendChild(b),h.nodeElem.style.display="flex",g}else if(c.format==="formula"){let u=document.createElement("div");u.style.cssText="display:flex; width:100%; height:100%; align-items:stretch;";let d=new Te;d.language="javascript",d.singleRow=!0,d.style.cssText="flex:1 1 auto; min-width:0; height:100%; position:relative; overflow:hidden;",d.code=o??"",d.addEventListener("code-changed",()=>{this._propertygrid.setPropertyValue(p,d.code)}),u.appendChild(d);let g=document.createElement("button");return g.innerText="...",g.title="Open in larger editor",g.style.cssText="flex:0 0 28px; width:20px;",g.onclick=()=>s({value:d.code,propertyPath:p}),u.appendChild(g),h.nodeElem.style.display="flex",u}else if(typeof o=="object"&&o!==null||c.format==="complex"){let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.innerText="del",u.onclick=()=>{this._propertygrid.setPropertyValue(p,void 0),this._propertygrid.refresh()},h.nodeElem.insertAdjacentElement("afterbegin",u);let d=document.createElement("div");d.style.display="flex";let g=document.createElement("span");o?g.innerText=(o.source??"")+": "+(o.name??""):g.innerText="",g.style.overflow="hidden",g.style.whiteSpace="nowrap",g.style.textOverflow="ellipsis",g.style.flexGrow="1",g.title=JSON.stringify(o),d.appendChild(g);let f=document.createElement("button");return f.innerText="...",f.onclick=()=>{t({value:o,propertyPath:p})},d.appendChild(f),h.nodeElem.style.display="flex",d}else{let u=document.createElement("button");u.style.height="calc(100% - 6px)",u.style.position="relative",u.style.display="flex",u.style.justifyContent="center",u.style.width="20px",u.style.boxSizing="content-box",u.title="complex property value",u.style.opacity="0.2",u.innerText="...",u.onclick=()=>{t({value:o,propertyPath:p})},h.nodeElem.insertAdjacentElement("afterbegin",u),h.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(c=>{mt.show([{title:"edit complex value",action:async()=>{t(c)}},{title:"edit string",action:async()=>{let o=prompt("enter value:");o&&(this._propertygrid.setPropertyValue(c.propertyPath,o),this._propertygrid.refresh())}},{title:"remove complex value",action:async()=>{this._propertygrid.setPropertyValue(c.propertyPath,void 0),this._propertygrid.refresh()}}],c.event)})}helpClicked(){let t=document.createElement("iframe");t.srcdoc=Se,t.style.cssText="width:100%; height:100%; border:none; display:block;",this.visualizationShell.openModal(t,{title:"Simple Script Editor Help",parent:this,x:-650,y:-100,width:620,height:620}),this.helpRequested.emit()}toggleCodeView(){if(!this._showingCode){let s=JSON.stringify({commands:this.getScriptCommands()},null,2);this._codeView.update(s),this._showCodeView(!0);return}let t=this._parseCodeViewScript();t&&(this._showCodeView(!1),this.loadScript(t))}_showCodeView(t){this._codeView.classList.toggle("visible",t),this._commandListDiv.classList.toggle("hidden",t),this._splitView.classList.toggle("code-mode",t),this._addCommandBtn.disabled=t,this._codeToggleBtn.innerText=t?"Visual":"Code",this._showingCode=t,t&&requestAnimationFrame(()=>this._codeView.activated())}_parseCodeViewScript(){let t;try{t=JSON.parse(this._codeView.getText())}catch(s){return alert(`Invalid JSON:
|
|
1208
|
+
`+s.message),null}return Array.isArray(t?.commands)?t:(alert('The JSON must have a "commands" array.'),null)}loadScript(t){this._script=t,this._commandListFancyTree&&(this._commandListFancyTree.destroy(),this._commandListDiv=this._getDomElement("commandList"));let s=[];for(let e of this._script.commands)e=D.upgradeScriptCommand(e),s.push(this.createTreeItem(e));this._commandListFancyTree=new yt({...gt,element:this._commandListDiv,icon:!1,source:s,activate:e=>{this._propertygrid.selectedObject=e.node.data.data.item??null},render:e=>{let i=!!e.node.data.data?.branch;if(e.isNew){e.nodeElem.oncontextmenu=a=>(a.preventDefault(),!1);let r=document.createElement("span");if(r.style.cssText="display:inline-block; width:24px;",e.nodeElem.prepend(r),i)e.nodeElem._reservedRowWidth=r.offsetWidth;else{let a=document.createElement("div");a.className="drag-handle",a.title="Drag to reorder",a.innerHTML='<svg viewBox="0 0 24 24" width="14" height="14"><path d="M4 6h16M4 12h16M4 18h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>',e.nodeElem.prepend(a);let c=e.nodeElem.parentElement,o=document.createElement("span");o.style.cssText="display:inline-block; width:32px;",e.nodeElem.appendChild(o);let p=document.createElement("div");p.className="cmd";let h=document.createElement("img");h.src=ue+"icons/copy.svg",h.title="Duplicate",h.onclick=()=>{let u=structuredClone(e.node.data.data.item);e.node.parent.addChildren(this.createTreeItem(u)).moveTo(e.node,"after")};let m=document.createElement("img");m.src=ue+"icons/delete.svg",m.title="Remove",m.onclick=()=>e.node.remove(),p.append(h,m),c.appendChild(p),e.nodeElem._reservedRowWidth=r.offsetWidth+o.offsetWidth}}let n=e.nodeElem._reservedRowWidth??0;if(n){let r=e.nodeElem.querySelector("span.wb-title");if(r){let a=parseFloat(r.style.width);isNaN(a)||(r.style.width=Math.max(0,a-n)+"px")}}},dnd:{guessDropEffect:!0,preventRecursion:!0,preventVoidMoves:!1,serializeClipboardData:!1,dragStart:e=>this._dragFromHandle?(this._draggedNode=e.node,e.event.dataTransfer.effectAllowed="move",e.event.dataTransfer.dropEffect="move",e.event.dataTransfer.setData(j,"1"),!0):!1,dragEnd:()=>{this._draggedNode=null},dragEnter:e=>{let i=e.event.dataTransfer?.types.includes(j);return e.event.dataTransfer.dropEffect=i?"move":"copy",!!e.node.data.data?.branch?new Set(["over"]):new Set(["before","after"])},dragOver:e=>{let i=e.event.dataTransfer?.types.includes(j);e.event.dataTransfer.dropEffect=i?"move":"copy"},drop:async e=>{let i=e.event.dataTransfer?.types.includes(j);if(e.region==="over"){if(i&&this._draggedNode)this._draggedNode.moveTo(e.node,"appendChild"),this._draggedNode.setClass("wb-drag-source",!1);else{let r=e.event.dataTransfer?.getData("text/plain");r&&e.node.addChildren(this.createTreeItem({type:r}))}return}let n=e.region=="before"?"before":"after";if(i&&this._draggedNode)this._draggedNode.moveTo(e.node,n),this._draggedNode.setClass("wb-drag-source",!1);else{let r=e.event.dataTransfer?.getData("text/plain");if(r){let a={type:r},c=this.createTreeItem(a);e.node.parent.addChildren(c).moveTo(e.node,n)}}}}}),this._commandListFancyTree.root.children?.[0]?.setActive()}createTreeItem(t){if(t.type==="If"){let s=t;return s.trueCommands??=[],s.elseCommands??=[],{title:"If",expanded:!0,data:{item:t},children:[{title:"true",expanded:!0,data:{branch:"true"},children:s.trueCommands.map(e=>this.createTreeItem(e))},{title:"else",expanded:!0,data:{branch:"else"},children:s.elseCommands.map(e=>this.createTreeItem(e))}]}}return{title:t.type,data:{item:t}}}nodeToCommand(t){let s=t.data.data.item;if(s.type==="If"){let e=t.children?.find(n=>n.data.data?.branch==="true"),i=t.children?.find(n=>n.data.data?.branch==="else");s.trueCommands=(e?.children??[]).map(n=>this.nodeToCommand(n)),s.elseCommands=(i?.children??[]).map(n=>this.nodeToCommand(n))}return s}_getBranchContainerNode(t){let s=t;for(;s;){if(s.data?.data?.branch)return s;s=s.parent}return null}async addCommand(){let t=new L;t.loadCommands(this.scriptCommandsTypeInfo,this.commandDescriptions),t.title="Add Script Command",t.commandTypeChosen.on(()=>{if(t.selectedType){let e={type:t.selectedType},i=this.createTreeItem(e),n=this._getBranchContainerNode(this._commandListFancyTree.activeNode);n?n.addChildren(i):this._commandListFancyTree.addChildren(i)}});let s=new AbortController;t.closeRequested.on(()=>s.abort()),await this.visualizationShell.openModal(t,{title:"Add Script Command",x:300,y:50,width:620,height:400,parent:this,abortSignal:s.signal})}getScriptCommands(){if(this._showingCode){let s=this._parseCodeViewScript();s&&this.loadScript(s)}return this._commandListFancyTree.root.children.map(s=>this.nodeToCommand(s))}};customElements.define(W.is,W);import{BaseCustomWebComponentConstructorAppend as bt,css as xt,html as wt}from"@node-projects/base-custom-webcomponent";var M=class extends bt{static style=xt`
|
|
834
1209
|
:host {
|
|
835
1210
|
display: grid;
|
|
836
1211
|
grid-template-columns: 80px 80px 80px auto;
|
|
@@ -844,7 +1219,7 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
844
1219
|
|
|
845
1220
|
span {
|
|
846
1221
|
font-size: 10px;
|
|
847
|
-
}`;static template=
|
|
1222
|
+
}`;static template=wt`
|
|
848
1223
|
<span></span>
|
|
849
1224
|
<span>name</span>
|
|
850
1225
|
<span>type</span>
|
|
@@ -863,7 +1238,7 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
863
1238
|
<input hidden="[[item.type !== 'boolean']]" type="checkbox" checked="{{item.value}}">
|
|
864
1239
|
<div hidden="[[item.type !== 'null']]">-null-</div>
|
|
865
1240
|
</template>
|
|
866
|
-
<button @click="[[this._add()]]" style="width: 40px; height: 20px; align-self: center;">add</button>`;static is="node-projects-visualization-parameter-editor";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_parameterArray;setParametersObject(t){t!=null?this._parameterArray=Object.keys(t).map(s=>({key:s,type:typeof t[s]=="object"?"null":typeof t[s],value:t[s]})):this._parameterArray=[],this._bindingsRefresh()}getParametersObject(){let t=!1,s={};for(let e of this._parameterArray)if(e.key)switch(t=!0,s[e.key]=null,e.type){case"string":s[e.key]=e.value.toString();break;case"number":let i=parseFloat(e.value);s[e.key]=isNaN(i)?0:i;break;case"boolean":s[e.key]=!!e.value;break}return t?s:null}_remove(t){this._parameterArray.splice(t,1),this._bindingsRefresh()}_add(){this._parameterArray.push({type:"null"}),this._bindingsRefresh()}};customElements.define(M.is,M);import{BaseCustomWebComponentConstructorAppend as
|
|
1241
|
+
<button @click="[[this._add()]]" style="width: 40px; height: 20px; align-self: center;">add</button>`;static is="node-projects-visualization-parameter-editor";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_parameterArray;setParametersObject(t){t!=null?this._parameterArray=Object.keys(t).map(s=>({key:s,type:typeof t[s]=="object"?"null":typeof t[s],value:t[s]})):this._parameterArray=[],this._bindingsRefresh()}getParametersObject(){let t=!1,s={};for(let e of this._parameterArray)if(e.key)switch(t=!0,s[e.key]=null,e.type){case"string":s[e.key]=e.value.toString();break;case"number":let i=parseFloat(e.value);s[e.key]=isNaN(i)?0:i;break;case"boolean":s[e.key]=!!e.value;break}return t?s:null}_remove(t){this._parameterArray.splice(t,1),this._bindingsRefresh()}_add(){this._parameterArray.push({type:"null"}),this._bindingsRefresh()}};customElements.define(M.is,M);import{BaseCustomWebComponentConstructorAppend as _t,css as St,html as Ee}from"@node-projects/base-custom-webcomponent";import{ContextMenu as Ne,copyTextToClipboard as Be,getTextFromClipboard as Ie,PropertiesHelper as kt}from"@node-projects/web-component-designer";var ee=class l extends _t{static style=St`
|
|
867
1242
|
:host {
|
|
868
1243
|
display: grid;
|
|
869
1244
|
grid-template-columns: 20px 1fr auto;
|
|
@@ -897,22 +1272,22 @@ ${I('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
897
1272
|
}
|
|
898
1273
|
button {
|
|
899
1274
|
cursor: pointer;
|
|
900
|
-
}`;static template=
|
|
1275
|
+
}`;static template=Ee`
|
|
901
1276
|
<template repeat:item="[[this.events]]">
|
|
902
1277
|
<div @click="[[this._ctxMenu(event, item)]]" @contextmenu="[[this._ctxMenu(event, item)]]" class="rect" title="[[this._getScriptType(item)]]" css:background-color="[[this._getScriptTypeColor(item)]]"></div>
|
|
903
1278
|
<a @click="[[this._showContextMenuAssignScript(event, item, false)]]" @contextmenu="[[this._ctxMenu(event, item)]]" title="[[item.name]]">[[item.name]]</a>
|
|
904
1279
|
<div>[[this._createControlsForScript(item)]]</div>
|
|
905
1280
|
</template>
|
|
906
1281
|
<span style="grid-column: 1 / span 3; margin-top: 8px; margin-left: 3px;">add event:</span>
|
|
907
|
-
<input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=
|
|
1282
|
+
<input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=Ee`
|
|
908
1283
|
<div style="display: flex; justify-content: flex-end;">
|
|
909
1284
|
<input value="[[this._getScriptName(item)]]" @keypress="[[this._changeScriptName(event, item)]]" hidden="[[this._getScriptType(item) !== 'js']]" placeholder="name" title="name" style="min-width: 50px; flex-basis: 30px; flex-grow: 2;" class="mth" type="text">
|
|
910
1285
|
<input value="[[this._getRelativeSignalsPath(item)]]" @keypress="[[this._changeRelativeSignalsPath(event, item)]]" placeholder="relative signals path" title="relative signals path" style="min-width: 50px; flex-basis: 20px; flex-grow: 1;" class="mth" type="text">
|
|
911
1286
|
<button css:background="[[this._hasParameters(item) ? 'lime' : '']]" style="display: flex; padding: 0; flex-grow: 0;" title="parameter" @click="[[this._editParameter(event, item)]]">p</button>
|
|
912
|
-
</div>`;static scriptTypeColors={js:"purple",blockly:"yellow",script:"lightgreen",empty:"pink"};static is="node-projects-visualization-event-assignment";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_blocklyToolbox;_instanceServiceContainer;_selectionChangedHandler;_selectedItems;_visualizationHandler;_visualizationShell;_scriptCommandsTypeInfo;_propertiesTypeInfo;_commandDescriptions;events;initialize(t,s,e,i,r,c){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=r,this._commandDescriptions=c}set instanceServiceContainer(t){this._instanceServiceContainer=t,this._selectionChangedHandler?.dispose(),this._selectionChangedHandler=this._instanceServiceContainer.selectionService.onSelectionChanged.on(s=>{this.selectedItems=s.selectedElements}),this.selectedItems=this._instanceServiceContainer.selectionService.selectedElements}_createControlsForScript(t){switch(this._getScriptType(t)){case"none":return""}return this.constructor.editRowTemplate.content.cloneNode(!0)}_getScriptName(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"){if(s.includes("name"))return JSON.parse(s).name}else return s}return null}async _changeScriptName(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let r=JSON.parse(i);r.name=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}else this._selectedItems[0].setAttribute("@"+s.name,e)}}_getRelativeSignalsPath(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"&&s.includes("relativeSignalsPath"))return JSON.parse(s).relativeSignalsPath}return null}async _changeRelativeSignalsPath(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let r=JSON.parse(i);r.relativeSignalsPath=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}else{let r={name:i,relativeSignalsPath:e};this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(r))}}}_hasParameters(t){return this.selectedItems[0].hasAttribute("@"+t.name)?this.selectedItems[0].getAttribute("@"+t.name).includes("parameters"):!1}_getScriptTypeColor(t){let s=this._getScriptType(t);return n.scriptTypeColors[s]??"white"}_getScriptType(t){if(t.designItem.hasAttribute("@"+t.name)){let s=t.designItem.getAttribute("@"+t.name);if(s.startsWith("{")){let e=JSON.parse(s);return"blocks"in e?"blockly":"commands"in e?"script":"js"}else return s==""?"empty":"js"}return"none"}_getEventMethodname(t){return this.selectedItems.length?this.selectedItems[0].getAttribute("@"+t.name):""}_inputMthName(t,s){let e=t.target;this.selectedItems[0].setAttribute("@"+s.name,e.value)}_ctxMenu(t,s){t.preventDefault();let e=this._getScriptType(s);if(e=="empty")this._showContextMenuAssignScript(t,s,!0);else if(e!="none"){let i=[{title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}},{title:"-"},{title:"copy",action:()=>{Ee(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Ne()),this._bindingsRefresh()}}];Ce.show(i,t)}else this._showContextMenuAssignScript(t,s,!0)}async _addEvent(t){if(t.key=="Enter"){let s=this._getDomElement("addEventInput");this._selectedItems[0].setAttribute("@"+St.camelToDashCase(s.value.replaceAll(" ","-")),""),s.value="",this.scrollTop=0,this.refresh()}}_createAssignScriptContextMenu(t,s){let e=[{title:"Simple Script",action:()=>{this._editEvent("script",t,s)}},{title:"Javascript",action:()=>{let r=prompt("name of function ?");r&&(this._selectedItems[0].setAttribute("@"+s.name,r),this.refresh(),this._editEvent("js",null,s))}},{title:"Blockly",action:()=>{this._editBlockly(null,s)}}],i=this._getScriptType(s);return i!="none"&&(e.push({title:"-"}),e.push({title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}})),i!="empty"&&e.push({title:"-"},{title:"copy",action:()=>{Ee(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Ne()),this._bindingsRefresh()}}),e}async _showContextMenuAssignScript(t,s,e){t.preventDefault();let i=this._getScriptType(s);if(i!="none"&&i!="empty"&&!e)this._editEvent(i,t,s);else{let r=this._createAssignScriptContextMenu(t,s);Ce.show(r,t)}}async _editParameter(t,s){let e=new M,i={};e.title="ParameterEditor for '"+s.name+"' of '"+s.designItem.name+"'";let r=s.designItem.getAttribute("@"+s.name);if(r&&r[0]=="{")try{i=JSON.parse(r).parameters}catch{}if(e.setParametersObject(i),await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let a=e.getParametersObject(),l={name:r,parameters:a};r&&r[0]=="{"&&(l=JSON.parse(r),l.parameters=a),a==null&&delete l.parameters;let o=JSON.stringify(l);s.designItem.setAttribute("@"+s.name,o),this._bindingsRefresh()}}async _editBlockly(t,s){let e=new A(this._blocklyToolbox);e.title="Blockly Script for '"+s.name+"' of '"+s.designItem.name+"'";let i=s.designItem.getAttribute("@"+s.name),r=null,c=null;if(i){let l=JSON.parse(i);r=l.parameters,c=l.relativeSignalsPath,e.load(l)}if(await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let l=e.save();r&&(l.parameters=r),c&&(l.relativeSignalsPath=c),s.designItem.setAttribute("@"+s.name,JSON.stringify(l)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=s.designItem.getAttribute("@"+s.name);if(!e||e.startsWith("{")){let i={commands:[]},r=null,c=null;e&&(i=JSON.parse(e),r=i.parameters,c=i.relativeSignalsPath);let a=new W;if(a.serviceContainer=s.designItem.serviceContainer,a.instanceServiceContainer=s.designItem.instanceServiceContainer,a.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,a.propertiesTypeInfo=this._propertiesTypeInfo,a.visualizationShell=this._visualizationShell,a.visualizationHandler=this._visualizationHandler,this._commandDescriptions&&(a.commandDescriptions={...a.commandDescriptions,...this._commandDescriptions}),a.loadScript(i),a.title="Script '"+s.name+"' on "+s.designItem.name,await this._visualizationShell.openConfirmation(a,{title:a.title,width:600,height:500})){let o=a.getScriptCommands();if(o&&o.length){let p={commands:o};r&&(p.parameters=r),c&&(p.relativeSignalsPath=c);let m=JSON.stringify(p);s.designItem.setAttribute("@"+s.name,m),this._bindingsRefresh()}}}}async _editEvent(t,s,e){t=="js"?this._editJavascript(s,e):t=="blockly"?this._editBlockly(s,e):this._editSimpleScript(s,e)}refresh(){this._selectedItems!=null&&this._selectedItems.length?this.events=this._selectedItems[0].serviceContainer.getLastServiceWhere("eventsService",t=>t.isHandledElementFromEventsService(this._selectedItems[0])).getPossibleEvents(this._selectedItems[0]).map(t=>({...t,designItem:this._selectedItems[0]})):this.events=[],this._bindingsRefresh()}get selectedItems(){return this._selectedItems}set selectedItems(t){this._selectedItems!=t&&(this._selectedItems=t,this.refresh())}};customElements.define(Q.is,Q);import{TypedEvent as _t,cssFromString as kt}from"@node-projects/base-custom-webcomponent";import{BindingTarget as y}from"@node-projects/web-component-designer/dist/elements/item/BindingTarget.js";import{PropertiesHelper as v}from"@node-projects/web-component-designer/dist/elements/services/propertiesService/services/PropertiesHelper.js";var B="bind-prop:",P="bind-attr:",F="bind-class:",H="bind-css:",J="bind-cssvar:",C="bind-content:",de="bind-visible:",Tt="bind(",Ct="--tmpBinding_",Js=/{{(.*)}}/;function q(n){return n.constructor?.elementProperties!=null}function he(n){let t=[],s=[],e="";for(let i=0;i<n.length;i++)n[i]=="{"?(t.push(e),e=""):n[i]=="}"?(s.push(e),e=""):e+=n[i];return t.push(e),{parts:t,signals:s}}function ee(n,t){let s=t.split("."),e=n;for(let i of s){if(e==null||typeof e!="object")return;e=e[i]}return e}var ue=class{parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(t,s,e,i,r,c,a,l){this.visualizationHandler=s,this.valueChangedCb=i,this.element=r,this.relativeSignalPath=c,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let o=0;o<this.signals.length;o++){let p=this.signals[o];if(p[0]==="?"&&p[1]==="?"){let u=p.substring(2);if(u.includes(".")){let d=ee(a,u);this.handleValueChanged(d,o)}else{this.handleValueChanged(a[u],o);let d=()=>this.handleValueChanged(a[u],o),g=t.getChangedEventName(a,u);a.addEventListener(g,d),this.cleanupCalls.push(()=>a.removeEventListener(g,d))}continue}else if(p[0]==="#"&&p[1]==="#"){let u=p.substring(2);if(u.includes(".")){let d=ee(r,u);this.handleValueChanged(d,o)}else{this.handleValueChanged(r[u],o);let d=()=>this.handleValueChanged(r[u],o),g=t.getChangedEventName(r,u);r.addEventListener(g,d),this.cleanupCalls.push(()=>r.removeEventListener(g,d))}continue}else if(p[0]==="\xA7"){let u=p.substring(1),d=l.valueProvider(u,{element:r,relativeSignalPath:c,root:a});d instanceof Promise?d.then(f=>this.handleValueChanged(f,o)):this.handleValueChanged(d,o),l.valueChangedCallbacks||(l.valueChangedCallbacks=new Map);let g=l.valueChangedCallbacks.get(u);g==null&&(g=[],l.valueChangedCallbacks.set(u,g)),g.push(()=>{let f=l.valueProvider(u,{element:r,relativeSignalPath:c,root:a});f instanceof Promise?f.then(x=>this.handleValueChanged(x,o)):this.handleValueChanged(f,o)})}else(p[0]==="?"||p[0]==="#")&&(p.includes(".")?p=ee(a,p.substring(1)):p=a[p.substring(1)]);let m=(u,d)=>this.handleValueChanged(d.val,o),h=this.visualizationHandler.subscribeState(p,m);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[o],m,h))}}parseIndirectBinding(t){let{parts:s,signals:e}=he(t);this.parts=s,this.signals=e;for(let i=0;i<e.length;i++)e[i][0]=="."&&(e[i]=this.visualizationHandler.getNormalizedSignalName(e[i],this.relativeSignalPath,this.element))}handleValueChanged(t,s){this.values[s]=t;let e=this.parts[0];for(let i=0;i<this.parts.length-1;i++){let r=this.values[i];if(r==null)return;e+=r+this.parts[i+1]}if(e[0]=="."&&(e=this.visualizationHandler.getNormalizedSignalName(e,this.relativeSignalPath,this.element)),this.combinedName!=e&&(this.unsubscribeTargetValue&&this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),!this.disposed)){this.combinedName=e;let i=(r,c)=>this.valueChangedCb(c);this.unsubscribeTargetValue=[i,this.visualizationHandler.subscribeState(e,i)]}}dispose(){this.disposed=!0,this.unsubscribeTargetValue&&(this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),this.unsubscribeTargetValue=null);for(let t=0;t<this.signals.length;t++)this.cleanupCalls[t]()}setState(t){this.disposed||this.visualizationHandler.setState(this.combinedName,t)}},Ie=class n{_visualizationHandler;namedConverterCallback;constructor(t){this._visualizationHandler=t}getChangedEventName(t,s){let e=s.indexOf("::");return e>=0?s.substring(e+2):t instanceof HTMLInputElement||t instanceof HTMLSelectElement?"change":q(t)?v.camelToDashCase(s):v.camelToDashCase(s)+"-changed"}parseBinding(t,s,e,i,r){let c=s.substring(r.length);if(i===y.cssvar&&(c="--"+c),!e.startsWith("{")){let l={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),l.signal=e,e.includes("::")){let o=e.split("::");e=o[0],l.signal=e,l.events=o[1].split(",")}l.twoWay=!0,l.events||(t instanceof HTMLInputElement?l.events=[this.getChangedEventName(t,c)]:t instanceof HTMLSelectElement?l.events=[this.getChangedEventName(t,c)]:q(t)?l.events=[this.getChangedEventName(t,c)]:(l.events=[this.getChangedEventName(t,c)],l.maybeLitElement=!0,l.litEventNames=[this.getChangedEventName(t,c)]))}if(e[0]==="!"&&(l.signal=e.substring(1),l.inverted=!0),l.signal.includes(";")){let o=l.signal.split(";");l.expression=o.pop(),l.signal=o.join(";")}return i===y.cssvar||i===y.class?[n.dotToCamelCase(c),l]:i===y.attribute?[c,l]:[v.dashToCamelCase(c),l]}let a=JSON.parse(e);return a.target=i,a.twoWay&&(a.events==null||a.events.length==0)&&(t instanceof HTMLInputElement?a.events=["change"]:t instanceof HTMLSelectElement?a.events=["change"]:a.events=[this.getChangedEventName(t,c)]),i===y.cssvar||i===y.class?[n.dotToCamelCase(c),a]:i===y.attribute?[c,a]:[v.dashToCamelCase(c),a]}serializeBinding(t,s,e){let i={...e};delete i.type,e.twoWay?e.events!=null&&e.events.length==1&&(t instanceof HTMLInputElement&&e.events?.[0]=="change"||t instanceof HTMLSelectElement&&e.events?.[0]=="change"||q(t)&&e.events?.[0]==s||!q(t)&&e.events?.[0]==s+"-changed")&&delete i.events:(delete i.events,delete i.expressionTwoWay);let r=i.twoWay&&i.events?.length>0?"::"+i.events.join(","):"",c=!1;return(r&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(c=!0),e.signal.trim()[0]=="{"&&(c=!0),!c&&e.target==y.property&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[C+"text",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:s=="innerHTML"?[C+"html",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:[B+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+r]:!c&&e.target==y.property&&e.expression&&!e.expression.includes(`
|
|
913
|
-
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[
|
|
914
|
-
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[P+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+
|
|
915
|
-
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[F+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+
|
|
916
|
-
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[H+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+
|
|
917
|
-
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[J+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+r]:((e.inverted===null||e.inverted===!1)&&delete i.inverted,(e.expression===null||e.expression==="")&&delete i.expression,(e.expressionTwoWay===null||e.expressionTwoWay==="")&&delete i.expressionTwoWay,(e.twoWay===null||e.twoWay===!1)&&delete i.twoWay,delete i.target,e.historic||delete i.historic,e.target==y.content?[C+"html",JSON.stringify(i)]:e.target==y.attribute?[P+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.class?[F+n.camelToDotCase(s),JSON.stringify(i)]:e.target==y.css?[H+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.cssvar?[J+n.camelToDotCase(s.substring(2)),JSON.stringify(i)]:e.target==y.property&&s=="innerHTML"?[C+"html",JSON.stringify(i)]:e.target==y.property&&s=="textContent"?[C+"text",JSON.stringify(i)]:[B+v.camelToDashCase(s),JSON.stringify(i)])}getBindingAttributeName(t,s,e){return e==y.attribute?P+v.camelToDashCase(s):e==y.class?F+n.camelToDotCase(s):e==y.css?H+v.camelToDashCase(s):e==y.visible?de:e==y.cssvar?J+n.camelToDotCase(s):e==y.property&&s=="innerHTML"?C+"html":e==y.property&&s=="textContent"?C+"text":B+v.camelToDashCase(s)}*getBindings(t){if(t.attributes)for(let s of t.attributes)s.name.startsWith(B)?yield this.parseBinding(t,s.name,s.value,y.property,B):s.name.startsWith(C)?yield this.parseBinding(t,s.name==="bind-content:html"?"bind-prop:inner-h-t-m-l":"bind-prop:text-content",s.value,y.property,B):s.name.startsWith(P)?yield this.parseBinding(t,s.name,s.value,y.attribute,P):s.name.startsWith(F)?yield this.parseBinding(t,s.name,s.value,y.class,F):s.name.startsWith(H)?yield this.parseBinding(t,s.name,s.value,y.css,H):s.name.startsWith(J)?yield this.parseBinding(t,s.name,s.value,y.cssvar,J):s.name.startsWith(de)&&(yield this.parseBinding(t,s.name,s.value,y.visible,de))}applyAllBindings(t,s,e,i,r){let c=[],a=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),l;for(;l=a.nextNode();){let o=this.getBindings(l);for(let p of o)try{let m=this.applyBinding(l,p,s,e,i);if(c.push(m),p[1].maybeLitElement&&l.localName.includes("-")&&!customElements.get(l.localName)){let h=l,u=p;customElements.whenDefined(l.localName).then(()=>{q(h)&&(m(),u[1].events=u[1].litEventNames,c.push(this.applyBinding(h,u,s,e,i)))})}}catch(m){console.warn("error applying binding",l,p,m)}if(r&&r(l)){l=a.nextSibling();continue}}return c}static#e=0;async parseCssBindings(t,s,e,i){let r=await import("@node-projects/css-parser"),c=r.parse(t),a;for(let o of c.stylesheet.rules)if(o.type===r.CssTypes.rule){for(let p of o.declarations)if(p.type===r.CssTypes.declaration&&p.value.includes(Tt)){let m=this.parseCssBinding(p.value,s,e,i);p.value=m[0],a?a.push(...m[1]):a=m[1]}}let l=r.stringify(c,{indent:"",compress:!0});return[kt(l),a]}parseCssBinding(t,s,e,i,r){t=t.trim();let c="",a="",l=!1,o="",p=!1,m=null,h=[];for(let u=0;u<t.length;u++){let d=t[u];if(l)if(p)o+=d;else if(m&&d==="\\")p=!0;else if(d===m)m=null;else if(m===null&&d===")"){let g=n.#e++,f=Ct+g,x=[f,{signal:o,target:y.cssvar}];o.startsWith("{")&&(x=JSON.parse(o)),h.push(this.applyBinding(s,x,e,i,r)),c+="var("+f+")",l=!1,o=""}else o+=d;else d==="("?(a!=="bind"?(c+=a,c+=d):(l=!0,t[u+1]==="'"||t[u+1]==='"'?(u++,m=t[u]):m=null),a=""):d===" "||d===","||d==="("||d==="+"||d==="-"||d==="*"||d==="/"?(c+=a+d,a=""):a+=d}return[c+a,h]}applyBinding(t,s,e,i,r){let c=[],a,l=()=>{for(let h of c)this._visualizationHandler.unsubscribeState(h[0],h[1],h[2]);if(a)for(let h of a)h()},o=s[1].signal.split(";"),p=new Array(o.length);for(let h=0;h<o.length;h++){let u=o[h];if(p[h]="__"+h,u.includes(":")){let d=u.split(":");p[h]=d[0],u=d[1],o[h]=u}if(u[0]==="?"){if(i){let d=u.substring(1);if(d[0]=="?")o[h]=d;else{o[h]=i[d],d[0]==="$"&&(d=d.substring(1),o[h]="$"+i[d]);let g=()=>{l(),this.applyBinding(t,s,e,i,r)},f=this.getChangedEventName(i,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}}else if(u[0]==="#"){let d=u.substring(1);if(d[0]=="#")o[h]=d;else{o[h]=i[d],d[0]==="$"&&(d=d.substring(1),o[h]="$"+i[d]);let g=()=>{l(),this.applyBinding(t,s,e,i,r)},f=this.getChangedEventName(t,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}u[0]==="."&&(o[h]=this._visualizationHandler.getNormalizedSignalName(u,e,t))}let m=new Array(o.length);for(let h=0;h<o.length;h++){let u=o[h];if(u[0]==="?"){if(i){let d=u.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,i[d],m,h,p,!1,e),f=!1)};i.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>i.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,i[d],m,h,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&h==0&&this.addTwoWayBinding(s,t,f=>i[d]=f)}}else if(u[0]==="#"){let d=u.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,t[d],m,h,p,!1,e),f=!1)};t.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>t.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,t[d],m,h,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&h==0&&this.addTwoWayBinding(s,t,f=>t[d]=f)}else if(u[0]==="$"){let d=u.substring(1);d[0]==="."&&(d=this._visualizationHandler.getNormalizedSignalName(d,e,t)),this._visualizationHandler.getObject(d).then(g=>{this.handleValueChanged(t,i,s,g,m,h,p,!0,e)})}else if(u[0]==="\xA7"){let d=u.substring(1),g=r.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});g instanceof Promise?g.then(x=>this.handleValueChanged(t,i,s,x,m,h,p,!0,e)):this.handleValueChanged(t,i,s,g,m,h,p,!0,e),r.valueChangedCallbacks||(r.valueChangedCallbacks=new Map);let f=r.valueChangedCallbacks.get(d);f==null&&(f=[],r.valueChangedCallbacks.set(d,f)),f.push(()=>{let x=r.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});x instanceof Promise?x.then(T=>this.handleValueChanged(t,i,s,T,m,h,p,!0,e)):this.handleValueChanged(t,i,s,x,m,h,p,!0,e)})}else if(u.includes("{")){let d=new ue(this,this._visualizationHandler,u,g=>this.handleValueChanged(t,i,s,g.val,m,h,p,!1,e),t,e,i,r);a||(a=[]),a.push(()=>d.dispose()),s[1].twoWay&&h==0&&this.addTwoWayBinding(s,t,g=>d.setState(g))}else if(s[1].historic)if(s[1].historic.reloadInterval){let d={timerId:-1},g=async()=>{let f=await this._visualizationHandler.getHistoricData(u,s[1].historic);this.handleValueChanged(t,i,s,f?.values,m,h,p,!0,e),d.timerId!==null&&(d.timerId=setTimeout(g,s[1].historic.reloadInterval))};g(),a||(a=[]),a.push(()=>{d.timerId>0&&clearTimeout(d.timerId),d.timerId=null})}else this._visualizationHandler.getHistoricData(u,s[1].historic).then(d=>this.handleValueChanged(t,i,s,d?.values,m,h,p,!0,e));else{let d=(g,f)=>this.handleValueChanged(t,i,s,f.val,m,h,p,!1,e);c.push([u,d,this._visualizationHandler.subscribeState(u,d)]),this._visualizationHandler.getState(u).then(g=>this.handleValueChanged(t,i,s,g?.val,m,h,p,!1,e)),s[1].twoWay&&h==0&&this.addTwoWayBinding(s,t,g=>this._visualizationHandler.setState(u,g))}}return l}addTwoWayBinding(t,s,e){t[1].expressionTwoWay&&(t[1].compiledExpressionTwoWay||(t[1].expressionTwoWay.includes("return ")?t[1].compiledExpressionTwoWay=new Function(["value"],t[1].expressionTwoWay):t[1].compiledExpressionTwoWay=new Function(["value"],"return "+t[1].expressionTwoWay)));for(let i of t[1].events){let r=s[i];r instanceof _t?r.on(()=>{let c;t[1].target==y.attribute?c=s.getAttribute(t[0]):c=s[t[0]],c=n.parseValueWithType(c,t),t[1].compiledExpressionTwoWay&&(c=t[1].compiledExpressionTwoWay(c)),e(c)}):s.addEventListener(i,c=>{let a;t[1].target==y.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=n.parseValueWithType(a,t),t[1].compiledExpressionTwoWay&&(a=t[1].compiledExpressionTwoWay(a)),e(a)})}}static parseValueWithType(t,s){if(s[1].type)switch(s[1].type){case"number":return parseFloat(t);case"boolean":return t===!0||t==="true"||!!parseInt(t);case"string":return t?.toString();case"integer":return parseInt(t)}return t}handleValueChanged(t,s,e,i,r,c,a,l,o){let p=i;if(!l&&c==0&&(p=n.parseValueWithType(p,e)),r[c]=p,e[1].expression&&(e[1].compiledExpression||(a.push("__res"),a.push("__ctx"),e[1].expression.includes("return ")?e[1].compiledExpression=new Function(a,e[1].expression):e[1].compiledExpression=new Function(a,"return "+e[1].expression)),r[a.length-1]={element:t,root:s,boundNames:e[1].signal,boundTargetName:e[0],boundTargetType:e[1].target},p=e[1].compiledExpression(...r),r[a.length-1]=p),e[1].converter)if(typeof e[1].converter=="string")p=this.namedConverterCallback(e[1].converter,p,t,e);else{let m=p!=null?p.toString():p;if(m in e[1].converter){let h=e[1].converter[m];typeof h=="string"?p=new Function(a,"return `"+e[1].converter[m]+"`")(...r):p=h}else{let h=!1,u=parseFloat(p);for(let d in e[1].converter)if(d.length>2&&d[0]===">"&&d[1]==="="){let g=parseFloat(d.substring(2));if(u>=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=f,h=!0;break}}else if(d.length>2&&d[0]==="<"&&d[1]==="="){let g=parseFloat(d.substring(2));if(u<=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=f,h=!0;break}}else if(d.length>1&&d[0]===">"){let g=parseFloat(d.substring(1));if(u>g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=f,h=!0;break}}else if(d.length>1&&d[0]==="<"){let g=parseFloat(d.substring(1));if(u<g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=f,h=!0;break}}else{let g=d.split("-");if(g.length>1&&(g[0]===""||u>=parseFloat(g[0]))&&(g[1]===""||parseFloat(g[1])>=u)){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...r):p=f,h=!0;break}}!h&&e[1].converterDefault!==void 0&&(p=e[1].converterDefault)}}if(e[1].inverted&&(p=!p),e[1].writeBackSignal){let m=e[1].writeBackSignal;m[0]==="."&&(m=o+m),this._visualizationHandler.setState(m,p,!0)}e[1].target==y.property?t[e[0]]=p:e[1].target==y.attribute?typeof p=="boolean"?p?t.setAttribute(e[0],""):t.removeAttribute(e[0]):t.setAttribute(e[0],p):e[1].target==y.css?t.style[e[0]]=p:e[1].target==y.cssvar?t.style.setProperty(e[0],p):e[1].target==y.class?p?t.classList.add(e[0]):t.classList.remove(e[0]):e[1].target==y.visible&&(t.style.visibility=p?"":"collapse")}static camelToDotCase(t){return t.replace(/([A-Z])/g,s=>`.${s[0].toLowerCase()}`)}static dotToCamelCase(t){return t.replace(/\.([a-z])/g,s=>s[1].toUpperCase())}};var Be=class{name;relativeSignalsPath;commands;parameters};import{deepValue as O,setDeepValue as Oe,sleep as Et}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import U from"long";var te="cyclic",Nt={pointerdown:"pointerup",pointerenter:"pointerleave",mouseenter:"mouseleave",mouseover:"mouseout",focus:"blur",focusin:"focusout",keydown:"keyup"},Ve=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(n){this._visualizationHandler=n}async execute(n,t){let s=-1,e=!1,i=!1,r=t.event?.type,c=r?Nt[r]:null;if(c){let a=t.element;r=="pointerdown"&&(a=window),a.addEventListener(c,()=>{e=!0},{once:!0})}for(let a=0;a<n.length;a++){let l=n[a];if(l.type=="Exit"){i=!0;break}else if(l.type=="If"){let p=(await this.evaluateIfFormula(l,t)?l.trueCommands:l.elseCommands)??[];if(!await this.execute(p,t)){i=!0;break}}else if(l.type=="Goto"){let o=await this.getValue(l.label,t);if(a=n.findIndex(p=>p.type=="Label"&&p.label==o),a<0)break}else if(l.type=="Condition"){let o=await this.getValue(l.value1,t),p=await this.getValue(l.value2,t),m=await this.getValue(l.comparisonType,t),h=!1;switch(m){case"==null":h=o==null;break;case"!=null":h=o!=null;break;case"==true":h=o==!0;break;case"==false":h=o==!1;break;case"==":h=o==p;break;case"!=":h=o!=p;break;case">":h=o>p;break;case"<":h=o<p;break;case">=":h=o>=p;break;case"<=":h=o<=p;break;case"&&":h=o&&p;break;case"||":h=o||p;break}if(h){await this.runExternalScript(await this.getValue(l.trueScriptName,t),await this.getValue(l.trueScriptType,t));let u=await this.getValue(l.trueGotoLabel,t);if(u&&(a=n.findIndex(d=>d.type=="Label"&&d.label==u),a<0))break}else{await this.runExternalScript(await this.getValue(l.falseScriptName,t),await this.getValue(l.falseScriptType,t));let u=await this.getValue(l.falseGotoLabel,t);if(u&&(a=n.findIndex(d=>d.type=="Label"&&d.label==u),a<0))break}}else if(l.type=="Repeat"){let o=await this.getValue(l.label,t),p=await this.getValue(l.count,t);if(await this.getValue(l.mode,t)=="eventValid"&&e){e=!1;continue}if(p!=0&&s==-1&&(s=p-1),s==0||(s>0&&s--,a=-1,o&&(a=n.findIndex(h=>h.type=="Label"&&h.label==o),a<0)))continue}else if(!await this.runScriptCommand(l,t)){i=!0;break}}return!i}async getValueFromTarget(n,t,s){return n==="property"?O(s.root,t):n==="elementProperty"?O(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(n,t,s,e){n==="property"?Oe(s.root,t,e):n==="elementProperty"?Oe(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(n,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"If":case"Goto":case"Exit":case"Repeat":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let n=await this.getValue(command.value??500,context);await Et(n);break}case"Console":{let n=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[n](t);break}case"ToggleSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,n,context);await this._visualizationHandler.setState(this.getSignalName(n,context),!s);break}case"ToggleSignalValueThroughList":{let n=await this.getValue(command.valueList,context),t=await this.getValue(command.signal,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,t,context),i=n.indexOf(e)+1;i>=n.length&&(i=0);let r=n[i];await this._visualizationHandler.setState(this.getSignalName(t,context),r);break}case"SetSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,n,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,n,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,n,context,e);break}case"DecrementSignalValue":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,n,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,n,context,e);break}case"CalculateSignalValue":{let formula=await this.getValue(command.formula,context),target=await this.getValue(command.target,context),targetSignal=await this.getValue(command.targetSignal,context),nm=await this.parseStringWithValues(formula,context),result=eval(nm);await this.setValueOnTarget(target,targetSignal,context,result);break}case"SetBitInSignal":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,n,context),i=U.fromNumber(1).shiftLeft(t),r=U.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"ClearBitInSignal":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,n,context),i=U.fromNumber(1).shiftLeft(t);i.negate();let r=U.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"ToggleBitInSignal":{let n=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,n,context),i=U.fromNumber(1).shiftLeft(t),r=U.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,n,context,r);break}case"Javascript":{let n=await this.getValue(command.script,context),t=context;t.shadowRoot=context.element.getRootNode(),t.instance=context.shadowRoot.host,command.compiledScript||(command.compiledScript=new Function("context",n)),command.compiledScript(t);break}case"SetElementProperty":{command=L.upgradeSetElementProperty(command);let n=await this.getValue(command.name,context);n===""&&(n=null);let t=await this.getValue(command.value,context),s=await this.getValue(command.parentIndex??0,context),e=await this.getValue(command.target??"property",context),i=await this.getValue(command.targetSelectorTarget??"container",context),r=await this.getValue(command.targetSelector,context),c=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,r);for(let l of a)e=="attribute"?l.setAttribute(n,t):e=="property"?l[n]=t:e=="css"?l.style[n]=t:e=="class"&&(c==="toggle"?l.classList.toggle(n??t):c==="remove"?l.classList.remove(n??t):l.classList.add(n??t));break}case"SubscribeSignal":{let n=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(n,s,null)};this._visualizationHandler.subscribeState(n,s)}else this._visualizationHandler.subscribeState(n,this._subscriptionCallback);break}case"UnsubscribeSignal":{let n=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(n,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let n=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(n);break}case"ClearSignalsInGroup":{let n=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(n);break}case"RunScript":{let n=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(n,t);break}case"ShowMessageBox":{let n=null,t=await this.getValue(command.exitScriptOnCancel,context);if(await this.getValue(command.buttons,context)=="yesNo"){let i=await this.getValue(command.message,context);confirm(i)?n=1:n=2}else{let i=await this.getValue(command.message,context);alert(i),n=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,n),t&&n!=1)return!1;break}case"ShowPrompt":{let n=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(n,t),e=await this.getValue(command.resultSignal,context);e&&s&&this._visualizationHandler.setState(e,s);break}case"Login":case"Logout":case"CloseDialog":case"OpenDialog":case"OpenScreen":case"SwitchLanguage":case"CopySignalValuesFromFolder":case"ExportSignalValuesAsJson":case"ImportSignalValuesFromJson":{alert('command: "'+command.type+'" is not yet implemented');break}}return!0}getTarget(n,t,s){if(t==="container"){let e=n.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=n.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(n,t,s,e){let i=this.getTarget(n,t,s),r=[i];return e&&(t==="container"?r=i.shadowRoot.querySelectorAll(e):r=i.querySelectorAll(e)),r}async getValue(value,outerContext){if(value==null)return null;if(typeof value=="object")switch(value.source){case"property":return O(outerContext.root,value.name);case"elementProperty":return O(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let n=O(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(n,outerContext)))?.val}case"event":{let n=outerContext.event;return value.name&&(n=O(n,value.name)),n}case"parameter":return outerContext.parameters[value.name];case"context":return O(outerContext,value.name);case"complexString":{let n=value.name;return n!=null?await this.parseStringWithValues(n,outerContext):null}case"complexSignal":{let n=value.name;if(n!=null){let t=await this.parseStringWithValues(n,outerContext);return(await this._visualizationHandler.getState(this.getSignalName(t,outerContext)))?.val}return null}case"expression":{var ctx=outerContext;return eval(value.name)}}return value}async getStateOrFieldOrParameter(name,context){if(name[0]==="\xA7"){var ctx=context;return eval("ctx."+name.substring(1))}else{if(name[0]==="?"&&name[1]==="?")return context.root[name.substring(2)];if(name[0]==="?")return await this._visualizationHandler.getState(this.getSignalName(context.root[name.substring(1)],context))}return await this._visualizationHandler.getState(this.getSignalName(name,context))}async parseStringWithValues(n,t){let s=he(n),e=await Promise.all(s.signals.map(r=>this.getStateOrFieldOrParameter(this.getSignalName(r,t),t))),i=s.parts[0];for(let r=0;r<s.parts.length-1;r++){let c=e[r];typeof c=="object"&&(c=c.val),c==null&&(c=""),i+=c+s.parts[r+1]}return i}async evaluateIfFormula(n,t){let s=n.signals??[],e=s.map((c,a)=>c.varName?.trim()||"__"+a),i=await Promise.all(s.map(c=>this.getValue(c,t))),r=await this.getValue(n.formula,t);return(!n.compiledFormula||n._compiledFormulaSrc!==r)&&(n.compiledFormula=new Function(...e,"return ("+r+");"),n._compiledFormulaSrc=r),!!n.compiledFormula(...i)}getSignalName(n,t){return n[0]==="."?t.relativeSignalsPath+n:n}createScriptContext(n,t,s,e,i){return{root:n,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(n,t,s,e,i,r,c,a){r??=this.createScriptContext;let l=await this.loadAndInitJsObject(n,t,s,e,a);for(let o of s.querySelectorAll("*"))for(let p of o.attributes)if(p.name[0]==="@")try{let m=p.name.substring(1),h=p.value.trim(),u=m.startsWith(te),d=u?parseInt(m.substring(m.indexOf(":")+1)):null,g=await this.resolveHandler(h,l,o,s,e,i,r,c,m);g&&this.bindHandler(o,m,u,d,g)}catch{console.warn("error assigning script",o,p)}return l}async loadAndInitJsObject(n,t,s,e,i){if(!t)return null;try{let c=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"})));return i?i(c):c.init?.(e,s),c}catch(r){return console.error("error parsing javascript - "+n,r),null}}async resolveHandler(n,t,s,e,i,r,c,a,l){if(n[0]!=="{")return p=>{t?.[n]?t[n](p,s,e,i):console.warn(`javascript function named: "${n}" not found, maybe missing a "export" ?`)};let o=JSON.parse(n);if("commands"in o)return p=>this.execute(o.commands,c(i,p,s,o.parameters,o.relativeSignalsPath));if("blocks"in o){let p=null;return async m=>{p??=await fe(o),p(m,e,o.parameters,o.relativeSignalsPath??"",r,c(i,m,s,o.parameters,o.relativeSignalsPath))}}if("name"in o){if(a)return a(s,l,o),null;let p=o.name;return m=>{t?.[p]?t[p](m,s,e,i,o.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(n,t,s,e,i){if(!s){n.addEventListener(t,i);return}let r=setInterval(()=>{n.isConnected?i(null):clearInterval(r)},e)}};import{OverlayLayer as It,DesignItem as V,InsertAction as Bt,BindingTarget as E,PropertyType as se}from"@node-projects/web-component-designer";var Re=class{constructor(t,s){this._bindingsHelper=t,this._visualizationHandler=s}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(t,s,e){let i=V.GetDesignItem(e);if(i&&!i.isRootItem){let r=t.getNormalizedElementCoordinates(e);this.rect=t.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",r.x,r.y,r.width,r.height,"",null,It.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(e,this.rect)}}dragLeave(t,s,e){let i=V.GetDesignItem(e);if(i&&!i.isRootItem){let r=this.rectMap.get(e);t.overlayLayer.removeOverlay(r),this.rectMap.delete(e)}}dragOver(t,s,e){return"copy"}async drop(t,s,e,i){for(let l of this.rectMap.values())t.overlayLayer.removeOverlay(l);this.rectMap.clear();let r=V.GetDesignItem(i),c=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(c);if(r&&!r.isRootItem)if(i instanceof HTMLInputElement){let l={signal:e.fullName,target:E.property},o=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",l);r.setAttribute(o[0],o[1])}else{let l={signal:e.fullName,target:E.content},o=this._bindingsHelper.serializeBinding(i,null,l);r.setAttribute(o[0],o[1])}else{let l=t.getNormalizedEventCoordinates(s),o,p,m=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof m?.val=="string")if(m.val.endsWith("jpg")||m.val.endsWith("jpeg")||m.val.endsWith("png")||m.val.endsWith("gif")||m.val.endsWith("svg")){let h=document.createElement("img");o=V.createDesignItemFromInstance(h,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(h,"src",u);o.setAttribute(d[0],d[1]),o.element.src=m.val}else if(m.val.endsWith("mp4")){let h=document.createElement("video");o=V.createDesignItemFromInstance(h,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(h,"src",u);o.setAttribute(d[0],d[1]),o.element.src=m.val}else{let h=document.createElement("iframe");o=V.createDesignItemFromInstance(h,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(h,"src",u);o.setAttribute(d[0],d[1]),o.element.src=m.val}if(!o){let h=document.createElement("input");o=V.createDesignItemFromInstance(h,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u=a.writeable!==!1,d={signal:e.fullName,target:E.property,twoWay:u},g=this._bindingsHelper.serializeBinding(h,"value",d);a.type==="boolean"?(g=this._bindingsHelper.serializeBinding(h,"checked",d),o.setAttribute("type","checkbox")):a.role=="date"?(d.twoWay=u,g=this._bindingsHelper.serializeBinding(h,"value-as-number",d),o.setAttribute("type","date"),o.setAttribute("readonly","")):a.role=="datetime"&&(d.twoWay=u,g=this._bindingsHelper.serializeBinding(h,"value-as-number",d),o.setAttribute("type","datetime-local"),o.setAttribute("readonly","")),o.setAttribute(g[0],g[1])}o.setStyle("position","absolute"),o.setStyle("left",l.x+"px"),o.setStyle("top",l.y+"px"),t.instanceServiceContainer.undoService.execute(new Bt(t.rootDesignItem,t.rootDesignItem.childCount,o)),p.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([o]))}}dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){if(s.type=="signal"){s.service.setValue(i,s,e.fullName);return}let r={signal:e.fullName,target:E.property};s.propertyType==se.attribute&&(r.target=E.attribute),s.propertyType==se.cssValue&&(r.target=E.css),r.signal=e.fullName,r.twoWay=s.propertyType==se.property||s.propertyType==se.propertyAndAttribute;let c=i[0].openGroup("drop binding");for(let a of i){let l=this._bindingsHelper.serializeBinding(a.element,s.name,r);a.setAttribute(l[0],l[1])}c.commit()}};import{BindingMode as me,BindingTarget as Ae,PropertiesHelper as Ot}from"@node-projects/web-component-designer";var De=class n{constructor(t){this._bindingsHelper=t}_bindingsHelper;static type="visualization-binding";getBindings(t){return Array.from(this._bindingsHelper.getBindings(t.element)).map(e=>({targetName:e[1].target===Ae.css||e[1].target===Ae.attribute?Ot.camelToDashCase(e[0]):e[0],target:e[1].target,mode:e[1].twoWay?me.twoWay:me.oneWay,invert:e[1].inverted,bindableObjectNames:e[1].signal.split(";"),expression:e[1].expression,expressionTwoWay:e[1].expressionTwoWay,converter:e[1].converter,type:n.type,service:this,changedEvents:e[1].events,historic:e[1].historic,writeBackSignal:e[1].writeBackSignal}))}setBinding(t,s){let e={signal:s.bindableObjectNames.join(";"),target:s.target};e.inverted=s.invert,e.twoWay=s.mode==me.twoWay,e.expression=s.expression,e.expressionTwoWay=s.expressionTwoWay,e.historic=s.historic,e.type=s.type,e.converter=s.converters,e.target=s.target,e.events=s.changedEvents;let i=this._bindingsHelper.serializeBinding(t.element,s.targetName,e),r=t.openGroup("edit_binding");return t.setAttribute(i[0],i[1]),r.commit(),!0}clearBinding(t,s,e){let i=this._bindingsHelper.getBindingAttributeName(t.element,s,e);return t.removeAttribute(i),!0}};var ze=class{getRefactorings(t){let s=[];for(let e of t){let i=e.serviceContainer.bindingService.getBindings(e);if(i)for(let r of i)for(let c of r.bindableObjectNames){let a="signal",l="";if(c.includes(":")){let o=c.split(":")[0],p=c.substring(o.length+1);p.startsWith("?")&&(p=p.substring(1),l="?",a="property",p.startsWith("?")&&(p=p.substring(1),l="??")),s.push({service:this,name:p,itemType:a,designItem:e,type:"binding",sourceObject:r,display:r.target+"/"+r.targetName+" - "+o+":",shortName:o,prefix:l})}else c.startsWith("?")&&(c=c.substring(1),l="?",a="property",c.startsWith("?")&&(c=c.substring(1),l="??")),s.push({service:this,name:c,itemType:a,designItem:e,type:"binding",sourceObject:r,display:r.target+"/"+r.targetName,prefix:l})}}return s}refactor(t,s,e){let i=t.sourceObject;t.shortName?i.bindableObjectNames=i.bindableObjectNames.map(r=>r==t.shortName+":"+t.prefix+s?t.shortName+":"+t.prefix+e:r):i.bindableObjectNames=i.bindableObjectNames.map(r=>r==t.prefix+s?t.prefix+e:r),t.designItem.serviceContainer.bindingService.setBinding(t.designItem,i)}};var Le=class{dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){s.service.setValue(i,s,e.text)}};import{BindingTarget as b}from"@node-projects/web-component-designer";var je=class{getRefactorings(t){let s=[];for(let e of t)for(let i of e.attributes())if(i[0][0]=="@"){let r=i[1];if(r[0]=="{"){let c=JSON.parse(r);if("commands"in c)for(let a of c.commands){for(let l in a){let o=a[l];if(o!=null&&typeof o=="object"){let p=o;if(p.source==="signal")s.push({name:p.name,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:c,display:a.type+"/"+i[0].substring(1)+"/"+l+"[signal]",refactor:m=>p.name=m});else if(p.source==="property")s.push({name:p.name,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:c,display:a.type+"/"+i[0].substring(1)+"/"+l+"[property]",refactor:m=>p.name=m});else if(p.source==="complexString")for(let m of p.name.matchAll(/\{(.*?)\}/g)){let h=m[0],u=m[1];if(u[0]==="?"){let d="?";u=u.substring(1),u[0]==="?"&&(d="??",u=u.substring(1)),s.push({name:u,itemType:"property",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:c,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->property",refactor:g=>p.name=p.name.replace(h,"{"+d+g+"}")})}else s.push({name:u,itemType:"signal",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:c,display:a.type+"/"+i[0].substring(1)+"/"+l+"[complexString]->signal",refactor:d=>p.name=p.name.replace(h,"{"+d+"}")})}}}switch(a.type){case"SetSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"ToggleSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"IncrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"DecrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"SetBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"ClearBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"ToggleBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"OpenScreen":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.screen=l});break;case"OpenDialog":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.screen=l});break;case"CalculateSignalValue":a.targetSignal&&typeof a.targetSignal=="string"&&s.push({name:a.targetSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/targetSignal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.targetSignal=l});break;case"SubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"UnsubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.signal=l});break;case"ShowMessageBox":a.resultSignal&&typeof a.resultSignal=="string"&&s.push({name:a.resultSignal,itemType:"signal",target:b.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/resultSignal",service:this,designItem:e,type:"script",sourceObject:c,refactor:l=>a.resultSignal=l});break}}else"blocks"in c;if("parameters"in c)for(let a in c.parameters)typeof c.parameters[a]=="string"&&s.push({name:c.parameters[a],itemType:"parameter",target:b.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:c,display:i[0].substring(1)+"/parameters/"+a,refactor:l=>c.parameters[a]=l})}}return s}refactor(t,s,e){t.refactor(e);let i=JSON.stringify(t.sourceObject);t.designItem.setAttribute(t.targetName,i)}};import{BasePropertyEditor as Vt}from"@node-projects/web-component-designer";var We=class extends Vt{_ip;_container;constructor(t,s){super(t),this._container=document.createElement("div"),this._container.style.display="flex",this._ip=document.createElement("input"),this._ip.onchange=i=>this._valueChanged(this._ip.value),this._ip.onfocus=i=>{this._ip.selectionStart=0,this._ip.selectionEnd=this._ip.value?.length},this._container.appendChild(this._ip);let e=document.createElement("button");e.textContent="...",e.onclick=async()=>{let i=s.createBindableObjectBrowser();i.initialize(this.designItems[0].serviceContainer,this.designItems[0].instanceServiceContainer,"property"),i.title="select signal...";let r=new AbortController;i.objectDoubleclicked.on(()=>{r.abort(),this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value)}),await s.openConfirmation(i,{x:100,y:100,width:400,height:300,abortSignal:r.signal})&&(this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value))},this._container.appendChild(e),this.element=this._container}refreshValue(t,s){s==null?this._ip.value="":this._ip.value=s}};import{EventsService as Rt}from"@node-projects/web-component-designer";var Me=class n extends Rt{static _cyclicEvent=[{name:`${te}:100`,propertyName:void 0,eventObjectName:"Event",description:"this event will retrigger itself every 100 ms"}];getPossibleEvents(t){let s=super.getPossibleEvents(t);return s.push(...n._cyclicEvent),s}getEvent(t,s){return s.includes(te)?n._cyclicEvent.find(i=>i.name==s)??{name:s,propertyName:"on"+s,eventObjectName:"Event"}:super.getEvent(t,s)}};export{Re as BindableObjectDragDropService,K as BindingsEditor,D as BindingsEditorHistoric,Ie as BindingsHelper,A as BlocklyScriptEditor,Q as EventAssignment,M as ParameterEditor,Le as PropertyGridDragDropService,Be as Script,je as ScriptRefactorService,Ve as ScriptSystem,We as SignalPropertyEditor,z as SimpleScriptCommandPicker,W as SimpleScriptEditor,ze as VisualizationBindingsRefactorService,De as VisualizationBindingsService,Me as VisualizationEventsService,X as VisualizationPropertyGrid,P as bindingPrefixAttribute,F as bindingPrefixClass,C as bindingPrefixContent,H as bindingPrefixCss,J as bindingPrefixCssVar,Tt as bindingPrefixInsideCss,Ct as bindingPrefixInsideCssVarName,B as bindingPrefixProperty,de as bindingPrefixVisible,Js as bindingsInCssRegex,te as cyclicAttributeName,fe as generateEventCodeFromBlockly,ee as getNestedProperty,q as isLit,Se as nativeScriptCommandDescriptions,he as parseBindingString,we as simpleScriptEditorHelpHtml};
|
|
1287
|
+
</div>`;static scriptTypeColors={js:"purple",blockly:"yellow",script:"lightgreen",empty:"pink"};static is="node-projects-visualization-event-assignment";constructor(){super(),this._restoreCachedInititalValues()}ready(){this._bindingsParse()}_blocklyToolbox;_instanceServiceContainer;_selectionChangedHandler;_selectedItems;_visualizationHandler;_visualizationShell;_scriptCommandsTypeInfo;_propertiesTypeInfo;_commandDescriptions;events;initialize(t,s,e,i,n,r){this._visualizationHandler=t,this._visualizationShell=s,this._scriptCommandsTypeInfo=e,this._propertiesTypeInfo=i,this._blocklyToolbox=n,this._commandDescriptions=r}set instanceServiceContainer(t){this._instanceServiceContainer=t,this._selectionChangedHandler?.dispose(),this._selectionChangedHandler=this._instanceServiceContainer.selectionService.onSelectionChanged.on(s=>{this.selectedItems=s.selectedElements}),this.selectedItems=this._instanceServiceContainer.selectionService.selectedElements}_createControlsForScript(t){switch(this._getScriptType(t)){case"none":return""}return this.constructor.editRowTemplate.content.cloneNode(!0)}_getScriptName(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"){if(s.includes("name"))return JSON.parse(s).name}else return s}return null}async _changeScriptName(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.name=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else this._selectedItems[0].setAttribute("@"+s.name,e)}}_getRelativeSignalsPath(t){if(this.selectedItems[0].hasAttribute("@"+t.name)){let s=this.selectedItems[0].getAttribute("@"+t.name);if(s[0]==="{"&&s.includes("relativeSignalsPath"))return JSON.parse(s).relativeSignalsPath}return null}async _changeRelativeSignalsPath(t,s){if(t.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+s.name)){let e=t.target.value,i=this.selectedItems[0].getAttribute("@"+s.name);if(i.startsWith("{")){let n=JSON.parse(i);n.relativeSignalsPath=e,this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}else{let n={name:i,relativeSignalsPath:e};this._selectedItems[0].setAttribute("@"+s.name,JSON.stringify(n))}}}_hasParameters(t){return this.selectedItems[0].hasAttribute("@"+t.name)?this.selectedItems[0].getAttribute("@"+t.name).includes("parameters"):!1}_getScriptTypeColor(t){let s=this._getScriptType(t);return l.scriptTypeColors[s]??"white"}_getScriptType(t){if(t.designItem.hasAttribute("@"+t.name)){let s=t.designItem.getAttribute("@"+t.name);if(s.startsWith("{")){let e=JSON.parse(s);return"blocks"in e?"blockly":"commands"in e?"script":"js"}else return s==""?"empty":"js"}return"none"}_getEventMethodname(t){return this.selectedItems.length?this.selectedItems[0].getAttribute("@"+t.name):""}_inputMthName(t,s){let e=t.target;this.selectedItems[0].setAttribute("@"+s.name,e.value)}_ctxMenu(t,s){t.preventDefault();let e=this._getScriptType(s);if(e=="empty")this._showContextMenuAssignScript(t,s,!0);else if(e!="none"){let i=[{title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}},{title:"-"},{title:"copy",action:()=>{Be(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Ie()),this._bindingsRefresh()}}];Ne.show(i,t)}else this._showContextMenuAssignScript(t,s,!0)}async _addEvent(t){if(t.key=="Enter"){let s=this._getDomElement("addEventInput");this._selectedItems[0].setAttribute("@"+kt.camelToDashCase(s.value.replaceAll(" ","-")),""),s.value="",this.scrollTop=0,this.refresh()}}_createAssignScriptContextMenu(t,s){let e=[{title:"Simple Script",action:()=>{this._editEvent("script",t,s)}},{title:"Javascript",action:()=>{let n=prompt("name of function ?");n&&(this._selectedItems[0].setAttribute("@"+s.name,n),this.refresh(),this._editEvent("js",null,s))}},{title:"Blockly",action:()=>{this._editBlockly(null,s)}}],i=this._getScriptType(s);return i!="none"&&(e.push({title:"-"}),e.push({title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+s.name),this._bindingsRefresh()}})),i!="empty"&&e.push({title:"-"},{title:"copy",action:()=>{Be(this.selectedItems[0].getAttribute("@"+s.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+s.name,await Ie()),this._bindingsRefresh()}}),e}async _showContextMenuAssignScript(t,s,e){t.preventDefault();let i=this._getScriptType(s);if(i!="none"&&i!="empty"&&!e)this._editEvent(i,t,s);else{let n=this._createAssignScriptContextMenu(t,s);Ne.show(n,t)}}async _editParameter(t,s){let e=new M,i={};e.title="ParameterEditor for '"+s.name+"' of '"+s.designItem.name+"'";let n=s.designItem.getAttribute("@"+s.name);if(n&&n[0]=="{")try{i=JSON.parse(n).parameters}catch{}if(e.setParametersObject(i),await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let a=e.getParametersObject(),c={name:n,parameters:a};n&&n[0]=="{"&&(c=JSON.parse(n),c.parameters=a),a==null&&delete c.parameters;let o=JSON.stringify(c);s.designItem.setAttribute("@"+s.name,o),this._bindingsRefresh()}}async _editBlockly(t,s){let e=new A(this._blocklyToolbox);e.title="Blockly Script for '"+s.name+"' of '"+s.designItem.name+"'";let i=s.designItem.getAttribute("@"+s.name),n=null,r=null;if(i){let c=JSON.parse(i);n=c.parameters,r=c.relativeSignalsPath,e.load(c)}if(await this._visualizationShell.openConfirmation(e,{x:100,y:100,width:700,height:500})){let c=e.save();n&&(c.parameters=n),r&&(c.relativeSignalsPath=r),s.designItem.setAttribute("@"+s.name,JSON.stringify(c)),this._bindingsRefresh()}}async _editJavascript(t,s){}async _editSimpleScript(t,s){let e=s.designItem.getAttribute("@"+s.name);if(!e||e.startsWith("{")){let i={commands:[]},n=null,r=null;e&&(i=JSON.parse(e),n=i.parameters,r=i.relativeSignalsPath);let a=new W;if(a.serviceContainer=s.designItem.serviceContainer,a.instanceServiceContainer=s.designItem.instanceServiceContainer,a.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,a.propertiesTypeInfo=this._propertiesTypeInfo,a.visualizationShell=this._visualizationShell,a.visualizationHandler=this._visualizationHandler,this._commandDescriptions&&(a.commandDescriptions={...a.commandDescriptions,...this._commandDescriptions}),a.loadScript(i),a.title="Script '"+s.name+"' on "+s.designItem.name,await this._visualizationShell.openConfirmation(a,{title:a.title,width:600,height:500})){let o=a.getScriptCommands();if(o&&o.length){let p={commands:o};n&&(p.parameters=n),r&&(p.relativeSignalsPath=r);let h=JSON.stringify(p);s.designItem.setAttribute("@"+s.name,h),this._bindingsRefresh()}}}}async _editEvent(t,s,e){t=="js"?this._editJavascript(s,e):t=="blockly"?this._editBlockly(s,e):this._editSimpleScript(s,e)}refresh(){this._selectedItems!=null&&this._selectedItems.length?this.events=this._selectedItems[0].serviceContainer.getLastServiceWhere("eventsService",t=>t.isHandledElementFromEventsService(this._selectedItems[0])).getPossibleEvents(this._selectedItems[0]).map(t=>({...t,designItem:this._selectedItems[0]})):this.events=[],this._bindingsRefresh()}get selectedItems(){return this._selectedItems}set selectedItems(t){this._selectedItems!=t&&(this._selectedItems=t,this.refresh())}};customElements.define(ee.is,ee);import{TypedEvent as Ct,cssFromString as Tt}from"@node-projects/base-custom-webcomponent";import{BindingTarget as y}from"@node-projects/web-component-designer/dist/elements/item/BindingTarget.js";import{PropertiesHelper as v}from"@node-projects/web-component-designer/dist/elements/services/propertiesService/services/PropertiesHelper.js";var I="bind-prop:",P="bind-attr:",F="bind-class:",H="bind-css:",J="bind-cssvar:",T="bind-content:",he="bind-visible:",Et="bind(",Nt="--tmpBinding_",qs=/{{(.*)}}/;function X(l){return l.constructor?.elementProperties!=null}function ge(l){let t=[],s=[],e="";for(let i=0;i<l.length;i++)l[i]=="{"?(t.push(e),e=""):l[i]=="}"?(s.push(e),e=""):e+=l[i];return t.push(e),{parts:t,signals:s}}function te(l,t){let s=t.split("."),e=l;for(let i of s){if(e==null||typeof e!="object")return;e=e[i]}return e}var me=class{parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(t,s,e,i,n,r,a,c){this.visualizationHandler=s,this.valueChangedCb=i,this.element=n,this.relativeSignalPath=r,this.parseIndirectBinding(e),this.values=new Array(this.signals.length);for(let o=0;o<this.signals.length;o++){let p=this.signals[o];if(p[0]==="?"&&p[1]==="?"){let u=p.substring(2);if(u.includes(".")){let d=te(a,u);this.handleValueChanged(d,o)}else{this.handleValueChanged(a[u],o);let d=()=>this.handleValueChanged(a[u],o),g=t.getChangedEventName(a,u);a.addEventListener(g,d),this.cleanupCalls.push(()=>a.removeEventListener(g,d))}continue}else if(p[0]==="#"&&p[1]==="#"){let u=p.substring(2);if(u.includes(".")){let d=te(n,u);this.handleValueChanged(d,o)}else{this.handleValueChanged(n[u],o);let d=()=>this.handleValueChanged(n[u],o),g=t.getChangedEventName(n,u);n.addEventListener(g,d),this.cleanupCalls.push(()=>n.removeEventListener(g,d))}continue}else if(p[0]==="\xA7"){let u=p.substring(1),d=c.valueProvider(u,{element:n,relativeSignalPath:r,root:a});d instanceof Promise?d.then(f=>this.handleValueChanged(f,o)):this.handleValueChanged(d,o),c.valueChangedCallbacks||(c.valueChangedCallbacks=new Map);let g=c.valueChangedCallbacks.get(u);g==null&&(g=[],c.valueChangedCallbacks.set(u,g)),g.push(()=>{let f=c.valueProvider(u,{element:n,relativeSignalPath:r,root:a});f instanceof Promise?f.then(b=>this.handleValueChanged(b,o)):this.handleValueChanged(f,o)})}else(p[0]==="?"||p[0]==="#")&&(p.includes(".")?p=te(a,p.substring(1)):p=a[p.substring(1)]);let h=(u,d)=>this.handleValueChanged(d.val,o),m=this.visualizationHandler.subscribeState(p,h);this.cleanupCalls.push(()=>this.visualizationHandler.unsubscribeState(this.signals[o],h,m))}}parseIndirectBinding(t){let{parts:s,signals:e}=ge(t);this.parts=s,this.signals=e;for(let i=0;i<e.length;i++)e[i][0]=="."&&(e[i]=this.visualizationHandler.getNormalizedSignalName(e[i],this.relativeSignalPath,this.element))}handleValueChanged(t,s){this.values[s]=t;let e=this.parts[0];for(let i=0;i<this.parts.length-1;i++){let n=this.values[i];if(n==null)return;e+=n+this.parts[i+1]}if(e[0]=="."&&(e=this.visualizationHandler.getNormalizedSignalName(e,this.relativeSignalPath,this.element)),this.combinedName!=e&&(this.unsubscribeTargetValue&&this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),!this.disposed)){this.combinedName=e;let i=(n,r)=>this.valueChangedCb(r);this.unsubscribeTargetValue=[i,this.visualizationHandler.subscribeState(e,i)]}}dispose(){this.disposed=!0,this.unsubscribeTargetValue&&(this.visualizationHandler.unsubscribeState(this.combinedName,this.unsubscribeTargetValue[0],this.unsubscribeTargetValue[1]),this.unsubscribeTargetValue=null);for(let t=0;t<this.signals.length;t++)this.cleanupCalls[t]()}setState(t){this.disposed||this.visualizationHandler.setState(this.combinedName,t)}},Oe=class l{_visualizationHandler;namedConverterCallback;constructor(t){this._visualizationHandler=t}getChangedEventName(t,s){let e=s.indexOf("::");return e>=0?s.substring(e+2):t instanceof HTMLInputElement||t instanceof HTMLSelectElement?"change":X(t)?v.camelToDashCase(s):v.camelToDashCase(s)+"-changed"}parseBinding(t,s,e,i,n){let r=s.substring(n.length);if(i===y.cssvar&&(r="--"+r),!e.startsWith("{")){let c={signal:e,target:i};if(e[0]==="="){if(e=e.substring(1),c.signal=e,e.includes("::")){let o=e.split("::");e=o[0],c.signal=e,c.events=o[1].split(",")}c.twoWay=!0,c.events||(t instanceof HTMLInputElement?c.events=[this.getChangedEventName(t,r)]:t instanceof HTMLSelectElement?c.events=[this.getChangedEventName(t,r)]:X(t)?c.events=[this.getChangedEventName(t,r)]:(c.events=[this.getChangedEventName(t,r)],c.maybeLitElement=!0,c.litEventNames=[this.getChangedEventName(t,r)]))}if(e[0]==="!"&&(c.signal=e.substring(1),c.inverted=!0),c.signal.includes(";")){let o=c.signal.split(";");c.expression=o.pop(),c.signal=o.join(";")}return i===y.cssvar||i===y.class?[l.dotToCamelCase(r),c]:i===y.attribute?[r,c]:[v.dashToCamelCase(r),c]}let a=JSON.parse(e);return a.target=i,a.twoWay&&(a.events==null||a.events.length==0)&&(t instanceof HTMLInputElement?a.events=["change"]:t instanceof HTMLSelectElement?a.events=["change"]:a.events=[this.getChangedEventName(t,r)]),i===y.cssvar||i===y.class?[l.dotToCamelCase(r),a]:i===y.attribute?[r,a]:[v.dashToCamelCase(r),a]}serializeBinding(t,s,e){let i={...e};delete i.type,e.twoWay?e.events!=null&&e.events.length==1&&(t instanceof HTMLInputElement&&e.events?.[0]=="change"||t instanceof HTMLSelectElement&&e.events?.[0]=="change"||X(t)&&e.events?.[0]==s||!X(t)&&e.events?.[0]==s+"-changed")&&delete i.events:(delete i.events,delete i.expressionTwoWay);let n=i.twoWay&&i.events?.length>0?"::"+i.events.join(","):"",r=!1;return(n&&e.expression?.includes("::")||e.expressionTwoWay?.includes("::"))&&(r=!0),e.signal.trim()[0]=="{"&&(r=!0),!r&&e.target==y.property&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[T+"text",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:s=="innerHTML"?[T+"html",(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:[I+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.property&&e.expression&&!e.expression.includes(`
|
|
1288
|
+
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?s=="textContent"?[T+"text",(e.inverted?"!":"")+e.signal+";"+e.expression+n]:s=="innerHTML"?[T+"html",(e.inverted?"!":"")+e.signal+";"+e.expression+n]:[I+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.attribute&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[P+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.attribute&&e.expression&&!e.expression.includes(`
|
|
1289
|
+
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[P+v.camelToDashCase(s),(e.twoWay?"=":"")+(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.class&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[F+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.class&&e.expression&&!e.expression.includes(`
|
|
1290
|
+
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[F+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.css&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[H+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.css&&e.expression&&!e.expression.includes(`
|
|
1291
|
+
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[H+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:!r&&e.target==y.cssvar&&!e.expression&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[J+l.camelToDotCase(s.substring(2)),(e.inverted?"!":"")+e.signal+(!e.twoWay&&e.signal.includes(";")?";":"")+n]:!r&&e.target==y.cssvar&&e.expression&&!e.expression.includes(`
|
|
1292
|
+
`)&&!e.expression.includes(";")&&!e.expressionTwoWay&&e.converter==null&&!e.historic&&!e.writeBackSignal?[J+v.camelToDashCase(s),(e.inverted?"!":"")+e.signal+";"+e.expression+n]:((e.inverted===null||e.inverted===!1)&&delete i.inverted,(e.expression===null||e.expression==="")&&delete i.expression,(e.expressionTwoWay===null||e.expressionTwoWay==="")&&delete i.expressionTwoWay,(e.twoWay===null||e.twoWay===!1)&&delete i.twoWay,delete i.target,e.historic||delete i.historic,e.target==y.content?[T+"html",JSON.stringify(i)]:e.target==y.attribute?[P+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.class?[F+l.camelToDotCase(s),JSON.stringify(i)]:e.target==y.css?[H+v.camelToDashCase(s),JSON.stringify(i)]:e.target==y.cssvar?[J+l.camelToDotCase(s.substring(2)),JSON.stringify(i)]:e.target==y.property&&s=="innerHTML"?[T+"html",JSON.stringify(i)]:e.target==y.property&&s=="textContent"?[T+"text",JSON.stringify(i)]:[I+v.camelToDashCase(s),JSON.stringify(i)])}getBindingAttributeName(t,s,e){return e==y.attribute?P+v.camelToDashCase(s):e==y.class?F+l.camelToDotCase(s):e==y.css?H+v.camelToDashCase(s):e==y.visible?he:e==y.cssvar?J+l.camelToDotCase(s):e==y.property&&s=="innerHTML"?T+"html":e==y.property&&s=="textContent"?T+"text":I+v.camelToDashCase(s)}*getBindings(t){if(t.attributes)for(let s of t.attributes)s.name.startsWith(I)?yield this.parseBinding(t,s.name,s.value,y.property,I):s.name.startsWith(T)?yield this.parseBinding(t,s.name==="bind-content:html"?"bind-prop:inner-h-t-m-l":"bind-prop:text-content",s.value,y.property,I):s.name.startsWith(P)?yield this.parseBinding(t,s.name,s.value,y.attribute,P):s.name.startsWith(F)?yield this.parseBinding(t,s.name,s.value,y.class,F):s.name.startsWith(H)?yield this.parseBinding(t,s.name,s.value,y.css,H):s.name.startsWith(J)?yield this.parseBinding(t,s.name,s.value,y.cssvar,J):s.name.startsWith(he)&&(yield this.parseBinding(t,s.name,s.value,y.visible,he))}applyAllBindings(t,s,e,i,n){let r=[],a=document.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),c;for(;c=a.nextNode();){let o=this.getBindings(c);for(let p of o)try{let h=this.applyBinding(c,p,s,e,i);if(r.push(h),p[1].maybeLitElement&&c.localName.includes("-")&&!customElements.get(c.localName)){let m=c,u=p;customElements.whenDefined(c.localName).then(()=>{X(m)&&(h(),u[1].events=u[1].litEventNames,r.push(this.applyBinding(m,u,s,e,i)))})}}catch(h){console.warn("error applying binding",c,p,h)}if(n&&n(c)){c=a.nextSibling();continue}}return r}static#e=0;async parseCssBindings(t,s,e,i){let n=await import("@node-projects/css-parser"),r=n.parse(t),a;for(let o of r.stylesheet.rules)if(o.type===n.CssTypes.rule){for(let p of o.declarations)if(p.type===n.CssTypes.declaration&&p.value.includes(Et)){let h=this.parseCssBinding(p.value,s,e,i);p.value=h[0],a?a.push(...h[1]):a=h[1]}}let c=n.stringify(r,{indent:"",compress:!0});return[Tt(c),a]}parseCssBinding(t,s,e,i,n){t=t.trim();let r="",a="",c=!1,o="",p=!1,h=null,m=[];for(let u=0;u<t.length;u++){let d=t[u];if(c)if(p)o+=d;else if(h&&d==="\\")p=!0;else if(d===h)h=null;else if(h===null&&d===")"){let g=l.#e++,f=Nt+g,b=[f,{signal:o,target:y.cssvar}];o.startsWith("{")&&(b=JSON.parse(o)),m.push(this.applyBinding(s,b,e,i,n)),r+="var("+f+")",c=!1,o=""}else o+=d;else d==="("?(a!=="bind"?(r+=a,r+=d):(c=!0,t[u+1]==="'"||t[u+1]==='"'?(u++,h=t[u]):h=null),a=""):d===" "||d===","||d==="("||d==="+"||d==="-"||d==="*"||d==="/"?(r+=a+d,a=""):a+=d}return[r+a,m]}applyBinding(t,s,e,i,n){let r=[],a,c=()=>{for(let m of r)this._visualizationHandler.unsubscribeState(m[0],m[1],m[2]);if(a)for(let m of a)m()},o=s[1].signal.split(";"),p=new Array(o.length);for(let m=0;m<o.length;m++){let u=o[m];if(p[m]="__"+m,u.includes(":")){let d=u.split(":");p[m]=d[0],u=d[1],o[m]=u}if(u[0]==="?"){if(i){let d=u.substring(1);if(d[0]=="?")o[m]=d;else{o[m]=i[d],d[0]==="$"&&(d=d.substring(1),o[m]="$"+i[d]);let g=()=>{c(),this.applyBinding(t,s,e,i,n)},f=this.getChangedEventName(i,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}}else if(u[0]==="#"){let d=u.substring(1);if(d[0]=="#")o[m]=d;else{o[m]=i[d],d[0]==="$"&&(d=d.substring(1),o[m]="$"+i[d]);let g=()=>{c(),this.applyBinding(t,s,e,i,n)},f=this.getChangedEventName(t,d);i.addEventListener(f,g),a||(a=[]),a.push(()=>i.removeEventListener(f,g))}}u[0]==="."&&(o[m]=this._visualizationHandler.getNormalizedSignalName(u,e,t))}let h=new Array(o.length);for(let m=0;m<o.length;m++){let u=o[m];if(u[0]==="?"){if(i){let d=u.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,i[d],h,m,p,!1,e),f=!1)};i.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>i.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,i[d],h,m,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,f=>i[d]=f)}}else if(u[0]==="#"){let d=u.substring(1),g=()=>{let f=!1;f||(f=!0,this.handleValueChanged(t,i,s,t[d],h,m,p,!1,e),f=!1)};t.addEventListener(v.camelToDashCase(d)+"-changed",g),a||(a=[]),a.push(()=>t.removeEventListener(v.camelToDashCase(d)+"-changed",g));try{this.handleValueChanged(t,i,s,t[d],h,m,p,!1,e)}catch(f){console.error(f)}s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,f=>t[d]=f)}else if(u[0]==="$"){let d=u.substring(1);d[0]==="."&&(d=this._visualizationHandler.getNormalizedSignalName(d,e,t)),this._visualizationHandler.getObject(d).then(g=>{this.handleValueChanged(t,i,s,g,h,m,p,!0,e)})}else if(u[0]==="\xA7"){let d=u.substring(1),g=n.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});g instanceof Promise?g.then(b=>this.handleValueChanged(t,i,s,b,h,m,p,!0,e)):this.handleValueChanged(t,i,s,g,h,m,p,!0,e),n.valueChangedCallbacks||(n.valueChangedCallbacks=new Map);let f=n.valueChangedCallbacks.get(d);f==null&&(f=[],n.valueChangedCallbacks.set(d,f)),f.push(()=>{let b=n.valueProvider(d,{element:t,binding:s,relativeSignalPath:e,root:i});b instanceof Promise?b.then(_=>this.handleValueChanged(t,i,s,_,h,m,p,!0,e)):this.handleValueChanged(t,i,s,b,h,m,p,!0,e)})}else if(u.includes("{")){let d=new me(this,this._visualizationHandler,u,g=>this.handleValueChanged(t,i,s,g.val,h,m,p,!1,e),t,e,i,n);a||(a=[]),a.push(()=>d.dispose()),s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,g=>d.setState(g))}else if(s[1].historic)if(s[1].historic.reloadInterval){let d={timerId:-1},g=async()=>{let f=await this._visualizationHandler.getHistoricData(u,s[1].historic);this.handleValueChanged(t,i,s,f?.values,h,m,p,!0,e),d.timerId!==null&&(d.timerId=setTimeout(g,s[1].historic.reloadInterval))};g(),a||(a=[]),a.push(()=>{d.timerId>0&&clearTimeout(d.timerId),d.timerId=null})}else this._visualizationHandler.getHistoricData(u,s[1].historic).then(d=>this.handleValueChanged(t,i,s,d?.values,h,m,p,!0,e));else{let d=(g,f)=>this.handleValueChanged(t,i,s,f.val,h,m,p,!1,e);r.push([u,d,this._visualizationHandler.subscribeState(u,d)]),this._visualizationHandler.getState(u).then(g=>this.handleValueChanged(t,i,s,g?.val,h,m,p,!1,e)),s[1].twoWay&&m==0&&this.addTwoWayBinding(s,t,g=>this._visualizationHandler.setState(u,g))}}return c}addTwoWayBinding(t,s,e){t[1].expressionTwoWay&&(t[1].compiledExpressionTwoWay||(t[1].expressionTwoWay.includes("return ")?t[1].compiledExpressionTwoWay=new Function(["value"],t[1].expressionTwoWay):t[1].compiledExpressionTwoWay=new Function(["value"],"return "+t[1].expressionTwoWay)));for(let i of t[1].events){let n=s[i];n instanceof Ct?n.on(()=>{let r;t[1].target==y.attribute?r=s.getAttribute(t[0]):r=s[t[0]],r=l.parseValueWithType(r,t),t[1].compiledExpressionTwoWay&&(r=t[1].compiledExpressionTwoWay(r)),e(r)}):s.addEventListener(i,r=>{let a;t[1].target==y.attribute?a=s.getAttribute(t[0]):a=s[t[0]],a=l.parseValueWithType(a,t),t[1].compiledExpressionTwoWay&&(a=t[1].compiledExpressionTwoWay(a)),e(a)})}}static parseValueWithType(t,s){if(s[1].type)switch(s[1].type){case"number":return parseFloat(t);case"boolean":return t===!0||t==="true"||!!parseInt(t);case"string":return t?.toString();case"integer":return parseInt(t)}return t}handleValueChanged(t,s,e,i,n,r,a,c,o){let p=i;if(!c&&r==0&&(p=l.parseValueWithType(p,e)),n[r]=p,e[1].expression&&(e[1].compiledExpression||(a.push("__res"),a.push("__ctx"),e[1].expression.includes("return ")?e[1].compiledExpression=new Function(a,e[1].expression):e[1].compiledExpression=new Function(a,"return "+e[1].expression)),n[a.length-1]={element:t,root:s,boundNames:e[1].signal,boundTargetName:e[0],boundTargetType:e[1].target},p=e[1].compiledExpression(...n),n[a.length-1]=p),e[1].converter)if(typeof e[1].converter=="string")p=this.namedConverterCallback(e[1].converter,p,t,e);else{let h=p!=null?p.toString():p;if(h in e[1].converter){let m=e[1].converter[h];typeof m=="string"?p=new Function(a,"return `"+e[1].converter[h]+"`")(...n):p=m}else{let m=!1,u=parseFloat(p);for(let d in e[1].converter)if(d.length>2&&d[0]===">"&&d[1]==="="){let g=parseFloat(d.substring(2));if(u>=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>2&&d[0]==="<"&&d[1]==="="){let g=parseFloat(d.substring(2));if(u<=g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>1&&d[0]===">"){let g=parseFloat(d.substring(1));if(u>g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else if(d.length>1&&d[0]==="<"){let g=parseFloat(d.substring(1));if(u<g){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}else{let g=d.split("-");if(g.length>1&&(g[0]===""||u>=parseFloat(g[0]))&&(g[1]===""||parseFloat(g[1])>=u)){let f=e[1].converter[d];typeof f=="string"?p=new Function(a,"return `"+e[1].converter[d]+"`")(...n):p=f,m=!0;break}}!m&&e[1].converterDefault!==void 0&&(p=e[1].converterDefault)}}if(e[1].inverted&&(p=!p),e[1].writeBackSignal){let h=e[1].writeBackSignal;h[0]==="."&&(h=o+h),this._visualizationHandler.setState(h,p,!0)}e[1].target==y.property?t[e[0]]=p:e[1].target==y.attribute?typeof p=="boolean"?p?t.setAttribute(e[0],""):t.removeAttribute(e[0]):t.setAttribute(e[0],p):e[1].target==y.css?t.style[e[0]]=p:e[1].target==y.cssvar?t.style.setProperty(e[0],p):e[1].target==y.class?p?t.classList.add(e[0]):t.classList.remove(e[0]):e[1].target==y.visible&&(t.style.visibility=p?"":"collapse")}static camelToDotCase(t){return t.replace(/([A-Z])/g,s=>`.${s[0].toLowerCase()}`)}static dotToCamelCase(t){return t.replace(/\.([a-z])/g,s=>s[1].toUpperCase())}};var Ve=class{name;relativeSignalsPath;commands;parameters};import{deepValue as O,setDeepValue as Re,sleep as Bt}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import U from"long";var se="cyclic",It={pointerdown:"pointerup",pointerenter:"pointerleave",mouseenter:"mouseleave",mouseover:"mouseout",focus:"blur",focusin:"focusout",keydown:"keyup"},Ae=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(l){this._visualizationHandler=l}async execute(l,t){let s=-1,e=!1,i=!1,n=t.event?.type,r=n?It[n]:null;if(r){let a=t.element;n=="pointerdown"&&(a=window),a.addEventListener(r,()=>{e=!0},{once:!0})}for(let a=0;a<l.length;a++){let c=l[a];if(c.type=="Exit"){i=!0;break}else if(c.type=="If"){let p=(await this.evaluateIfFormula(c,t)?c.trueCommands:c.elseCommands)??[];if(!await this.execute(p,t)){i=!0;break}}else if(c.type=="Goto"){let o=await this.getValue(c.label,t);if(a=l.findIndex(p=>p.type=="Label"&&p.label==o),a<0)break}else if(c.type=="Condition"){let o=await this.getValue(c.value1,t),p=await this.getValue(c.value2,t),h=await this.getValue(c.comparisonType,t),m=!1;switch(h){case"==null":m=o==null;break;case"!=null":m=o!=null;break;case"==true":m=o==!0;break;case"==false":m=o==!1;break;case"==":m=o==p;break;case"!=":m=o!=p;break;case">":m=o>p;break;case"<":m=o<p;break;case">=":m=o>=p;break;case"<=":m=o<=p;break;case"&&":m=o&&p;break;case"||":m=o||p;break}if(m){await this.runExternalScript(await this.getValue(c.trueScriptName,t),await this.getValue(c.trueScriptType,t));let u=await this.getValue(c.trueGotoLabel,t);if(u&&(a=l.findIndex(d=>d.type=="Label"&&d.label==u),a<0))break}else{await this.runExternalScript(await this.getValue(c.falseScriptName,t),await this.getValue(c.falseScriptType,t));let u=await this.getValue(c.falseGotoLabel,t);if(u&&(a=l.findIndex(d=>d.type=="Label"&&d.label==u),a<0))break}}else if(c.type=="Repeat"){let o=await this.getValue(c.label,t),p=await this.getValue(c.count,t);if(await this.getValue(c.mode,t)=="eventValid"&&e){e=!1;continue}if(p!=0&&s==-1&&(s=p-1),s==0||(s>0&&s--,a=-1,o&&(a=l.findIndex(m=>m.type=="Label"&&m.label==o),a<0)))continue}else if(!await this.runScriptCommand(c,t)){i=!0;break}}return!i}async getValueFromTarget(l,t,s){return l==="property"?O(s.root,t):l==="elementProperty"?O(s.element,t):(await this._visualizationHandler.getState(this.getSignalName(t,s)))?.val}async setValueOnTarget(l,t,s,e){l==="property"?Re(s.root,t,e):l==="elementProperty"?Re(s.element,t,e):await this._visualizationHandler.setState(this.getSignalName(t,s),e)}async runExternalScript(l,t){}async runScriptCommand(command,context){switch(command.type){case"Comment":case"Label":case"Condition":case"If":case"Goto":case"Exit":case"Repeat":break;case"OpenUrl":{window.open(await this.getValue(command.url,context),command.target);break}case"Delay":{let l=await this.getValue(command.value??500,context);await Bt(l);break}case"Console":{let l=await this.getValue(command.target??"log",context),t=await this.getValue(command.message,context);console[l](t);break}case"ToggleSignalValue":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),s=await this.getValueFromTarget(t,l,context);await this._visualizationHandler.setState(this.getSignalName(l,context),!s);break}case"ToggleSignalValueThroughList":{let l=await this.getValue(command.valueList,context),t=await this.getValue(command.signal,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,t,context),i=l.indexOf(e)+1;i>=l.length&&(i=0);let n=l[i];await this._visualizationHandler.setState(this.getSignalName(t,context),n);break}case"SetSignalValue":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.target,context);await this.setValueOnTarget(t,l,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,l,context)+await this.getValue(command.value,context);await this.setValueOnTarget(t,l,context,e);break}case"DecrementSignalValue":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),e=await this.getValueFromTarget(t,l,context)-await this.getValue(command.value,context);await this.setValueOnTarget(t,l,context,e);break}case"CalculateSignalValue":{let formula=await this.getValue(command.formula,context),target=await this.getValue(command.target,context),targetSignal=await this.getValue(command.targetSignal,context),nm=await this.parseStringWithValues(formula,context),result=eval(nm);await this.setValueOnTarget(target,targetSignal,context,result);break}case"SetBitInSignal":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,l,context),i=U.fromNumber(1).shiftLeft(t),n=U.fromNumber(e).or(i).toNumber();await this.setValueOnTarget(s,l,context,n);break}case"ClearBitInSignal":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,l,context),i=U.fromNumber(1).shiftLeft(t);i.negate();let n=U.fromNumber(e).and(i).toNumber();await this.setValueOnTarget(s,l,context,n);break}case"ToggleBitInSignal":{let l=await this.getValue(command.signal,context),t=await this.getValue(command.bitNumber??0,context),s=await this.getValue(command.target,context),e=await this.getValueFromTarget(s,l,context),i=U.fromNumber(1).shiftLeft(t),n=U.fromNumber(e).xor(i).toNumber();await this.setValueOnTarget(s,l,context,n);break}case"Javascript":{let l=await this.getValue(command.script,context),t=context;t.shadowRoot=context.element.getRootNode(),t.instance=context.shadowRoot.host,command.compiledScript||(command.compiledScript=new Function("context",l)),command.compiledScript(t);break}case"SetElementProperty":{command=D.upgradeSetElementProperty(command);let l=await this.getValue(command.name,context);l===""&&(l=null);let t=await this.getValue(command.value,context),s=await this.getValue(command.parentIndex??0,context),e=await this.getValue(command.target??"property",context),i=await this.getValue(command.targetSelectorTarget??"container",context),n=await this.getValue(command.targetSelector,context),r=await this.getValue(command.mode??"toggle",context),a=this.getTargetFromTargetSelector(context,i,s,n);for(let c of a)e=="attribute"?c.setAttribute(l,t):e=="property"?c[l]=t:e=="css"?c.style[l]=t:e=="class"&&(r==="toggle"?c.classList.toggle(l??t):r==="remove"?c.classList.remove(l??t):c.classList.add(l??t));break}case"SubscribeSignal":{let l=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let s=()=>{this._visualizationHandler.unsubscribeState(l,s,null)};this._visualizationHandler.subscribeState(l,s)}else this._visualizationHandler.subscribeState(l,this._subscriptionCallback);break}case"UnsubscribeSignal":{let l=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(l,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let l=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(l);break}case"ClearSignalsInGroup":{let l=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(l);break}case"RunScript":{let l=await this.getValue(command.name,context),t=await this.getValue(command.scriptType,context);this.runExternalScript(l,t);break}case"ShowMessageBox":{let l=null,t=await this.getValue(command.exitScriptOnCancel,context);if(await this.getValue(command.buttons,context)=="yesNo"){let i=await this.getValue(command.message,context);confirm(i)?l=1:l=2}else{let i=await this.getValue(command.message,context);alert(i),l=1}let e=await this.getValue(command.resultSignal,context);if(e&&this._visualizationHandler.setState(e,l),t&&l!=1)return!1;break}case"ShowPrompt":{let l=await this.getValue(command.message,context),t=await this.getValue(command.default,context),s=prompt(l,t),e=await this.getValue(command.resultSignal,context);e&&s&&this._visualizationHandler.setState(e,s);break}case"Login":case"Logout":case"CloseDialog":case"OpenDialog":case"OpenScreen":case"SwitchLanguage":case"CopySignalValuesFromFolder":case"ExportSignalValuesAsJson":case"ImportSignalValuesFromJson":{alert('command: "'+command.type+'" is not yet implemented');break}}return!0}getTarget(l,t,s){if(t==="container"){let e=l.element.getRootNode().host;for(let i=0;i<(s??0);i++)e=e.getRootNode().host;return e}else if(t==="element"){let e=l.element;for(let i=0;i<(s??0);i++)e=e.parentElement;return e}return null}getTargetFromTargetSelector(l,t,s,e){let i=this.getTarget(l,t,s),n=[i];return e&&(t==="container"?n=i.shadowRoot.querySelectorAll(e):n=i.querySelectorAll(e)),n}async getValue(value,outerContext){if(value==null)return null;if(typeof value=="object")switch(value.source){case"property":return O(outerContext.root,value.name);case"elementProperty":return O(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let l=O(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(l,outerContext)))?.val}case"event":{let l=outerContext.event;return value.name&&(l=O(l,value.name)),l}case"parameter":return outerContext.parameters[value.name];case"context":return O(outerContext,value.name);case"complexString":{let l=value.name;return l!=null?await this.parseStringWithValues(l,outerContext):null}case"complexSignal":{let l=value.name;if(l!=null){let t=await this.parseStringWithValues(l,outerContext);return(await this._visualizationHandler.getState(this.getSignalName(t,outerContext)))?.val}return null}case"expression":{var ctx=outerContext;return eval(value.name)}}return value}async getStateOrFieldOrParameter(name,context){if(name[0]==="\xA7"){var ctx=context;return eval("ctx."+name.substring(1))}else{if(name[0]==="?"&&name[1]==="?")return context.root[name.substring(2)];if(name[0]==="?")return await this._visualizationHandler.getState(this.getSignalName(context.root[name.substring(1)],context))}return await this._visualizationHandler.getState(this.getSignalName(name,context))}async parseStringWithValues(l,t){let s=ge(l),e=await Promise.all(s.signals.map(n=>this.getStateOrFieldOrParameter(this.getSignalName(n,t),t))),i=s.parts[0];for(let n=0;n<s.parts.length-1;n++){let r=e[n];typeof r=="object"&&(r=r.val),r==null&&(r=""),i+=r+s.parts[n+1]}return i}async evaluateIfFormula(l,t){let s=l.signals??[],e=s.map((r,a)=>r.varName?.trim()||"__"+a),i=await Promise.all(s.map(r=>this.getValue(r,t))),n=await this.getValue(l.formula,t);return(!l.compiledFormula||l._compiledFormulaSrc!==n)&&(l.compiledFormula=new Function(...e,"return ("+n+");"),l._compiledFormulaSrc=n),!!l.compiledFormula(...i)}getSignalName(l,t){return l[0]==="."?t.relativeSignalsPath+l:l}createScriptContext(l,t,s,e,i){return{root:l,event:t,element:s,parameters:e,relativeSignalsPath:i}}async assignAllScripts(l,t,s,e,i,n,r,a){n??=this.createScriptContext;let c=await this.loadAndInitJsObject(l,t,s,e,a);for(let o of s.querySelectorAll("*"))for(let p of o.attributes)if(p.name[0]==="@")try{let h=p.name.substring(1),m=p.value.trim(),u=h.startsWith(se),d=u?parseInt(h.substring(h.indexOf(":")+1)):null,g=await this.resolveHandler(m,c,o,s,e,i,n,r,h);g&&this.bindHandler(o,h,u,d,g)}catch{console.warn("error assigning script",o,p)}return c}async loadAndInitJsObject(l,t,s,e,i){if(!t)return null;try{let r=await import(URL.createObjectURL(new Blob([t],{type:"application/javascript"})));return i?i(r):r.init?.(e,s),r}catch(n){return console.error("error parsing javascript - "+l,n),null}}async resolveHandler(l,t,s,e,i,n,r,a,c){if(l[0]!=="{")return p=>{t?.[l]?t[l](p,s,e,i):console.warn(`javascript function named: "${l}" not found, maybe missing a "export" ?`)};let o=JSON.parse(l);if("commands"in o)return p=>this.execute(o.commands,r(i,p,s,o.parameters,o.relativeSignalsPath));if("blocks"in o){let p=null;return async h=>{p??=await ve(o),p(h,e,o.parameters,o.relativeSignalsPath??"",n,r(i,h,s,o.parameters,o.relativeSignalsPath))}}if("name"in o){if(a)return a(s,c,o),null;let p=o.name;return h=>{t?.[p]?t[p](h,s,e,i,o.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(l,t,s,e,i){if(!s){l.addEventListener(t,i);return}let n=setInterval(()=>{l.isConnected?i(null):clearInterval(n)},e)}};import{OverlayLayer as Ot,DesignItem as V,InsertAction as Vt,BindingTarget as E,PropertyType as ie}from"@node-projects/web-component-designer";var ze=class{constructor(t,s){this._bindingsHelper=t,this._visualizationHandler=s}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(t,s,e){let i=V.GetDesignItem(e);if(i&&!i.isRootItem){let n=t.getNormalizedElementCoordinates(e);this.rect=t.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",n.x,n.y,n.width,n.height,"",null,Ot.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(e,this.rect)}}dragLeave(t,s,e){let i=V.GetDesignItem(e);if(i&&!i.isRootItem){let n=this.rectMap.get(e);t.overlayLayer.removeOverlay(n),this.rectMap.delete(e)}}dragOver(t,s,e){return"copy"}async drop(t,s,e,i){for(let c of this.rectMap.values())t.overlayLayer.removeOverlay(c);this.rectMap.clear();let n=V.GetDesignItem(i),r=await this._visualizationHandler.getObject(e.fullName),a=this._visualizationHandler.getSignalInformation(r);if(n&&!n.isRootItem)if(i instanceof HTMLInputElement){let c={signal:e.fullName,target:E.property},o=this._bindingsHelper.serializeBinding(i,i.type=="checkbox"?"checked":"value",c);n.setAttribute(o[0],o[1])}else{let c={signal:e.fullName,target:E.content},o=this._bindingsHelper.serializeBinding(i,null,c);n.setAttribute(o[0],o[1])}else{let c=t.getNormalizedEventCoordinates(s),o,p,h=await this._visualizationHandler.getState(e.fullName);if(a.role==="url"&&typeof h?.val=="string")if(h.val.endsWith("jpg")||h.val.endsWith("jpeg")||h.val.endsWith("png")||h.val.endsWith("gif")||h.val.endsWith("svg")){let m=document.createElement("img");o=V.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(m,"src",u);o.setAttribute(d[0],d[1]),o.element.src=h.val}else if(h.val.endsWith("mp4")){let m=document.createElement("video");o=V.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(m,"src",u);o.setAttribute(d[0],d[1]),o.element.src=h.val}else{let m=document.createElement("iframe");o=V.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u={signal:e.fullName,target:E.property},d=this._bindingsHelper.serializeBinding(m,"src",u);o.setAttribute(d[0],d[1]),o.element.src=h.val}if(!o){let m=document.createElement("input");o=V.createDesignItemFromInstance(m,t.serviceContainer,t.instanceServiceContainer),p=o.openGroup("Insert");let u=a.writeable!==!1,d={signal:e.fullName,target:E.property,twoWay:u},g=this._bindingsHelper.serializeBinding(m,"value",d);a.type==="boolean"?(g=this._bindingsHelper.serializeBinding(m,"checked",d),o.setAttribute("type","checkbox")):a.role=="date"?(d.twoWay=u,g=this._bindingsHelper.serializeBinding(m,"value-as-number",d),o.setAttribute("type","date"),o.setAttribute("readonly","")):a.role=="datetime"&&(d.twoWay=u,g=this._bindingsHelper.serializeBinding(m,"value-as-number",d),o.setAttribute("type","datetime-local"),o.setAttribute("readonly","")),o.setAttribute(g[0],g[1])}o.setStyle("position","absolute"),o.setStyle("left",c.x+"px"),o.setStyle("top",c.y+"px"),t.instanceServiceContainer.undoService.execute(new Vt(t.rootDesignItem,t.rootDesignItem.childCount,o)),p.commit(),requestAnimationFrame(()=>t.instanceServiceContainer.selectionService.setSelectedElements([o]))}}dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){if(s.type=="signal"){s.service.setValue(i,s,e.fullName);return}let n={signal:e.fullName,target:E.property};s.propertyType==ie.attribute&&(n.target=E.attribute),s.propertyType==ie.cssValue&&(n.target=E.css),n.signal=e.fullName,n.twoWay=s.propertyType==ie.property||s.propertyType==ie.propertyAndAttribute;let r=i[0].openGroup("drop binding");for(let a of i){let c=this._bindingsHelper.serializeBinding(a.element,s.name,n);a.setAttribute(c[0],c[1])}r.commit()}};import{BindingMode as fe,BindingTarget as Le,PropertiesHelper as Rt}from"@node-projects/web-component-designer";var De=class l{constructor(t){this._bindingsHelper=t}_bindingsHelper;static type="visualization-binding";getBindings(t){return Array.from(this._bindingsHelper.getBindings(t.element)).map(e=>({targetName:e[1].target===Le.css||e[1].target===Le.attribute?Rt.camelToDashCase(e[0]):e[0],target:e[1].target,mode:e[1].twoWay?fe.twoWay:fe.oneWay,invert:e[1].inverted,bindableObjectNames:e[1].signal.split(";"),expression:e[1].expression,expressionTwoWay:e[1].expressionTwoWay,converter:e[1].converter,type:l.type,service:this,changedEvents:e[1].events,historic:e[1].historic,writeBackSignal:e[1].writeBackSignal}))}setBinding(t,s){let e={signal:s.bindableObjectNames.join(";"),target:s.target};e.inverted=s.invert,e.twoWay=s.mode==fe.twoWay,e.expression=s.expression,e.expressionTwoWay=s.expressionTwoWay,e.historic=s.historic,e.type=s.type,typeof s.converters=="string"?e.converter=s.converters:Array.isArray(s.converters)&&s.converters.length>0?e.converter=Object.fromEntries(s.converters.map(r=>[r.key,r.value])):s.converters!=null&&(e.converter=s.converters),e.target=s.target,e.events=s.changedEvents;let i=this._bindingsHelper.serializeBinding(t.element,s.targetName,e),n=t.openGroup("edit_binding");return t.setAttribute(i[0],i[1]),n.commit(),!0}clearBinding(t,s,e){let i=this._bindingsHelper.getBindingAttributeName(t.element,s,e);return t.removeAttribute(i),!0}};var je=class{getRefactorings(t){let s=[];for(let e of t){let i=e.serviceContainer.bindingService.getBindings(e);if(i)for(let n of i)for(let r of n.bindableObjectNames){let a="signal",c="";if(r.includes(":")){let o=r.split(":")[0],p=r.substring(o.length+1);p.startsWith("?")&&(p=p.substring(1),c="?",a="property",p.startsWith("?")&&(p=p.substring(1),c="??")),s.push({service:this,name:p,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName+" - "+o+":",shortName:o,prefix:c})}else r.startsWith("?")&&(r=r.substring(1),c="?",a="property",r.startsWith("?")&&(r=r.substring(1),c="??")),s.push({service:this,name:r,itemType:a,designItem:e,type:"binding",sourceObject:n,display:n.target+"/"+n.targetName,prefix:c})}}return s}refactor(t,s,e){let i=t.sourceObject;t.shortName?i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.shortName+":"+t.prefix+s?t.shortName+":"+t.prefix+e:n):i.bindableObjectNames=i.bindableObjectNames.map(n=>n==t.prefix+s?t.prefix+e:n),t.designItem.serviceContainer.bindingService.setBinding(t.designItem,i)}};var We=class{dragOverOnProperty(t,s,e){return"copy"}dropOnProperty(t,s,e,i){s.service.setValue(i,s,e.text)}};import{BindingTarget as x}from"@node-projects/web-component-designer";var Me=class{getRefactorings(t){let s=[];for(let e of t)for(let i of e.attributes())if(i[0][0]=="@"){let n=i[1];if(n[0]=="{"){let r=JSON.parse(n);if("commands"in r)for(let a of r.commands){for(let c in a){let o=a[c];if(o!=null&&typeof o=="object"){let p=o;if(p.source==="signal")s.push({name:p.name,itemType:"signal",target:x.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+c+"[signal]",refactor:h=>p.name=h});else if(p.source==="property")s.push({name:p.name,itemType:"property",target:x.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+c+"[property]",refactor:h=>p.name=h});else if(p.source==="complexString")for(let h of p.name.matchAll(/\{(.*?)\}/g)){let m=h[0],u=h[1];if(u[0]==="?"){let d="?";u=u.substring(1),u[0]==="?"&&(d="??",u=u.substring(1)),s.push({name:u,itemType:"property",target:x.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+c+"[complexString]->property",refactor:g=>p.name=p.name.replace(m,"{"+d+g+"}")})}else s.push({name:u,itemType:"signal",target:x.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:a.type+"/"+i[0].substring(1)+"/"+c+"[complexString]->signal",refactor:d=>p.name=p.name.replace(m,"{"+d+"}")})}}}switch(a.type){case"SetSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"ToggleSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"IncrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"DecrementSignalValue":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"SetBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"ClearBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"ToggleBitInSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"OpenScreen":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.screen=c});break;case"OpenDialog":a.screen&&typeof a.screen=="string"&&s.push({name:a.screen,itemType:"screen",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/screen",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.screen=c});break;case"CalculateSignalValue":a.targetSignal&&typeof a.targetSignal=="string"&&s.push({name:a.targetSignal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/targetSignal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.targetSignal=c});break;case"SubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"UnsubscribeSignal":a.signal&&typeof a.signal=="string"&&s.push({name:a.signal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/signal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.signal=c});break;case"ShowMessageBox":a.resultSignal&&typeof a.resultSignal=="string"&&s.push({name:a.resultSignal,itemType:"signal",target:x.event,targetName:i[0],display:a.type+"/"+i[0].substring(1)+"/resultSignal",service:this,designItem:e,type:"script",sourceObject:r,refactor:c=>a.resultSignal=c});break}}else"blocks"in r;if("parameters"in r)for(let a in r.parameters)typeof r.parameters[a]=="string"&&s.push({name:r.parameters[a],itemType:"parameter",target:x.event,targetName:i[0],service:this,designItem:e,type:"script",sourceObject:r,display:i[0].substring(1)+"/parameters/"+a,refactor:c=>r.parameters[a]=c})}}return s}refactor(t,s,e){t.refactor(e);let i=JSON.stringify(t.sourceObject);t.designItem.setAttribute(t.targetName,i)}};import{BasePropertyEditor as At}from"@node-projects/web-component-designer";var Pe=class extends At{_ip;_container;constructor(t,s){super(t),this._container=document.createElement("div"),this._container.style.display="flex",this._ip=document.createElement("input"),this._ip.onchange=i=>this._valueChanged(this._ip.value),this._ip.onfocus=i=>{this._ip.selectionStart=0,this._ip.selectionEnd=this._ip.value?.length},this._container.appendChild(this._ip);let e=document.createElement("button");e.textContent="...",e.onclick=async()=>{let i=s.createBindableObjectBrowser();i.initialize(this.designItems[0].serviceContainer,this.designItems[0].instanceServiceContainer,"property"),i.title="select signal...";let n=new AbortController;i.objectDoubleclicked.on(()=>{n.abort(),this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value)}),await s.openConfirmation(i,{x:100,y:100,width:400,height:300,abortSignal:n.signal})&&(this._ip.value=i.selectedObject.fullName,this._valueChanged(this._ip.value))},this._container.appendChild(e),this.element=this._container}refreshValue(t,s){s==null?this._ip.value="":this._ip.value=s}};import{EventsService as zt}from"@node-projects/web-component-designer";var Fe=class l extends zt{static _cyclicEvent=[{name:`${se}:100`,propertyName:void 0,eventObjectName:"Event",description:"this event will retrigger itself every 100 ms"}];getPossibleEvents(t){let s=super.getPossibleEvents(t);return s.push(...l._cyclicEvent),s}getEvent(t,s){return s.includes(se)?l._cyclicEvent.find(i=>i.name==s)??{name:s,propertyName:"on"+s,eventObjectName:"Event"}:super.getEvent(t,s)}};export{ze as BindableObjectDragDropService,Q as BindingsEditor,z as BindingsEditorHistoric,Oe as BindingsHelper,A as BlocklyScriptEditor,ee as EventAssignment,M as ParameterEditor,We as PropertyGridDragDropService,Ve as Script,Me as ScriptRefactorService,Ae as ScriptSystem,Pe as SignalPropertyEditor,L as SimpleScriptCommandPicker,W as SimpleScriptEditor,je as VisualizationBindingsRefactorService,De as VisualizationBindingsService,Fe as VisualizationEventsService,q as VisualizationPropertyGrid,P as bindingPrefixAttribute,F as bindingPrefixClass,T as bindingPrefixContent,H as bindingPrefixCss,J as bindingPrefixCssVar,Et as bindingPrefixInsideCss,Nt as bindingPrefixInsideCssVarName,I as bindingPrefixProperty,he as bindingPrefixVisible,qs as bindingsInCssRegex,se as cyclicAttributeName,ve as generateEventCodeFromBlockly,te as getNestedProperty,X as isLit,ke as nativeScriptCommandDescriptions,ge as parseBindingString,Se as simpleScriptEditorHelpHtml};
|
|
918
1293
|
//!varname => inverted
|