@node-projects/web-component-designer-visualization-addons 0.1.151 → 0.3.0
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/components/BindingsEditor.js +2 -2
- package/dist/components/BindingsEditorHelp.d.ts +1 -1
- package/dist/components/BindingsEditorHelp.js +8 -4
- package/dist/components/EventAssignment.d.ts +1 -0
- package/dist/components/EventAssignment.js +5 -2
- package/dist/helpers/BindingsHelper.d.ts +25 -13
- package/dist/helpers/BindingsHelper.js +602 -605
- package/dist/index-min.js +56 -56
- package/dist/services/VisualizationBindingsRefactorService.js +20 -23
- package/package.json +1 -1
- package/tests/BindingsHelper.test.ts +527 -0
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
|
-
`:
|
|
6
|
-
`:
|
|
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(o,e){var t=o.getFieldValue("LEVEL");let i=Blockly.JavaScript.valueToCode(o,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`console['${t.toLowerCase()}'](${i});
|
|
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(o){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(o){return"await delay("+Blockly.JavaScript.valueToCode(o,"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(o,e){return[`context.parameters[${Blockly.JavaScript.valueToCode(o,"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(o,e){let t=Blockly.JavaScript.valueToCode(o,"OID",Blockly.JavaScript.ORDER_ATOMIC);return[`(await visualizationHandler.getState((${t}[0] === '.' ? relativeSignalsPath : '') + ${t})).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(o,e){let t=Blockly.JavaScript.valueToCode(o,"OBJECT",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(o,"PROPERTYPATH",Blockly.JavaScript.ORDER_ATOMIC);return[`extractPart(${t}, ${i})`,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(o){let e=Blockly.JavaScript.valueToCode(o,"SCREEN",Blockly.JavaScript.ORDER_ATOMIC),t=Blockly.JavaScript.valueToCode(o,"RELATIVESIGNALSPATH",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(o,"NOHISTORY",Blockly.JavaScript.ORDER_ATOMIC);return`RUNTIME.openScreen({screen: ${e}, relativeSignalsPath: ${t}, noHistory: ${i}})`};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(o,e){var t=o.getFieldValue("SOURCE");let i=Blockly.JavaScript.valueToCode(o,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),s;return t==="CURRENTSCREEN"?s=`shadowRoot.querySelector(${i})`:t==="PARENTSCREEN"&&(s=`shadowRoot.host.getRootNode().querySelector(${i})`),[s,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(o,e){var t=o.getFieldValue("SOURCE");let i=Blockly.JavaScript.valueToCode(o,"SELECTOR",Blockly.JavaScript.ORDER_ATOMIC),s;return t==="CURRENTSCREEN"?s=`shadowRoot.querySelectorall(${i})`:t==="PARENTSCREEN"&&(s=`shadowRoot.querySelectorall(${i})`),[s,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(o){var e=o.getFieldValue("TARGET");let t=Blockly.JavaScript.valueToCode(o,"ELEMENT",Blockly.JavaScript.ORDER_ATOMIC),i=Blockly.JavaScript.valueToCode(o,"NAME",Blockly.JavaScript.ORDER_ATOMIC),s=Blockly.JavaScript.valueToCode(o,"VALUE",Blockly.JavaScript.ORDER_ATOMIC),l="";return e==="PROPERTY"?l+=t+"["+i+"] = "+s+`;
|
|
5
|
+
`:e==="ATTRIBUTE"?l+=t+".setAttribute("+i+", "+s+`);
|
|
6
|
+
`:e==="STYLE"&&(l+=t+".style["+i+"] = "+s+`;
|
|
7
|
+
`),l};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(o){let e=Blockly.JavaScript.valueToCode(o,"OID",Blockly.JavaScript.ORDER_ATOMIC),t=Blockly.JavaScript.valueToCode(o,"VALUE",Blockly.JavaScript.ORDER_ATOMIC);return`await visualizationHandler.setState((${e}[0] === '.' ? relativeSignalsPath : '') + ${e}, ${t});
|
|
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(o){return Blockly.JavaScript.getVariableName(o.getField("EVENTVAR").variable.name)+` = eventData;
|
|
9
|
+
`};var tt=`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
|
+
`,it="}";async function ke(o){let e=new Blockly.Workspace;Blockly.serialization.workspaces.load(o,e),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 t=Blockly.JavaScript.workspaceToCode(e);return(await import(URL.createObjectURL(new Blob([tt+t+it],{type:"application/javascript"})))).run}import{BaseCustomWebComponentConstructorAppend as st,html as nt,css as at}from"@node-projects/base-custom-webcomponent";var Y=class extends st{static template=nt`
|
|
25
25
|
<div id="blocklyDiv" style="position: absolute; width: 100%; height: 100%;"></div>
|
|
26
|
-
`;static style=
|
|
26
|
+
`;static style=at`
|
|
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;resizeObserver;_toolbox;constructor(
|
|
33
|
+
}`;static is="node-projects-blockly-script-editor";blocklyDiv;workspace;resizeObserver;_toolbox;constructor(e){super(),super._restoreCachedInititalValues(),this._toolbox=e,this.blocklyDiv=this._getDomElement("blocklyDiv"),this._assignEvents(),this.createBlockly()}createBlockly(){let e="zelos",i=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:i,toolbox:this._toolbox,renderer:e,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(e=>{Blockly.svgResize(this.workspace)}),this.resizeObserver.observe(this)}save(){return Blockly.serialization.workspaces.save(this.workspace)}load(e){Blockly.serialization.workspaces.load(e,this.workspace)}};customElements.define(Y.is,Y);import{BaseCustomWebComponentConstructorAppend as ct,html as pt,css as dt}from"@node-projects/base-custom-webcomponent";import{BindingMode as ut,BindingTarget as Te,assetsPath as ue}from"@node-projects/web-component-designer";import{BaseCustomWebComponentConstructorAppend as ot,html as rt,css as lt}from"@node-projects/base-custom-webcomponent";var K=class extends ot{static template=rt`
|
|
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,10 +97,10 @@ 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=lt`
|
|
101
101
|
:host {
|
|
102
102
|
box-sizing: border-box;
|
|
103
|
-
}`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(
|
|
103
|
+
}`;static is="node-projects-visualization-bindings-editor-historic";historic;static properties={historic:Object};constructor(e){super(),this._restoreCachedInititalValues(),this.historic=e??{reloadInterval:2e3}}ready(){this._bindingsParse()}#e=!1;refresh(){this.#e||(this.#e=!0,this._bindingsRefresh(null,!0),this.#e=!1)}};customElements.define(K.is,K);var be=`<!DOCTYPE html>
|
|
104
104
|
<html>
|
|
105
105
|
<head>
|
|
106
106
|
<meta charset="UTF-8">
|
|
@@ -268,11 +268,15 @@ code {
|
|
|
268
268
|
<tr><th>Prefix / Pattern</th><th>What it accesses</th></tr>
|
|
269
269
|
<tr><td>(none)</td><td>The signal's current value directly</td></tr>
|
|
270
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
|
|
272
|
-
<tr><td>??name</td><td>The value of a property
|
|
273
|
-
<tr><td
|
|
271
|
+
<tr><td>?name</td><td>A signal in a screen property</td></tr>
|
|
272
|
+
<tr><td>??name</td><td>The current value of a screen property</td></tr>
|
|
273
|
+
<tr><td>?$name</td><td>The signal object stored in a screen property</td></tr>
|
|
274
|
+
<tr><td>?@name</td><td>The current value of a screen attribute</td></tr>
|
|
275
|
+
<tr><td>#name</td><td>A signal in a property of the bound target element</td></tr>
|
|
274
276
|
<tr><td>##name</td><td>The current value of a property of the bound target element</td></tr>
|
|
275
|
-
<tr><td
|
|
277
|
+
<tr><td>#$name</td><td>The signal object stored in a property of the bound target element</td></tr>
|
|
278
|
+
<tr><td>#@name</td><td>The current value of an attribute of the bound target element</td></tr>
|
|
279
|
+
<tr><td>$objectId</td><td>The entire signal object</td></tr>
|
|
276
280
|
<tr><td>\xA7name</td><td>A special framework-provided value (if supported)</td></tr>
|
|
277
281
|
<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
282
|
</table>
|
|
@@ -327,13 +331,13 @@ __res <span style="color:#6a737d;font-style:italic">// the res
|
|
|
327
331
|
|
|
328
332
|
</div>
|
|
329
333
|
</body>
|
|
330
|
-
</html>`;var
|
|
334
|
+
</html>`;var he=class o extends ct{static template=pt`
|
|
331
335
|
<div id="root">
|
|
332
336
|
<div class="vertical-grid">
|
|
333
337
|
<div id="full-width-col">
|
|
334
338
|
<div id="signals-area">
|
|
335
339
|
<div class="row">
|
|
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
|
|
340
|
+
<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 names in properties via ?propertyName and #propertyName, property values via ??propertyName and ##propertyName, and signal objects stored in properties via ?$propertyName and #$propertyName.
Access screen attributes via ?@attributeName and target attributes via #@attributeName.
Resolve a named signal object 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
341
|
<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>
|
|
338
342
|
</div>
|
|
339
343
|
<div class="bordered-section">
|
|
@@ -391,7 +395,7 @@ __res <span style="color:#6a737d;font-style:italic">// the res
|
|
|
391
395
|
<div id="converterListContainer"></div>
|
|
392
396
|
<button class="add-signal-btn" @click="[[this._addConverter()]]">+ Add entry</button>
|
|
393
397
|
</div>
|
|
394
|
-
</div>`;static style=
|
|
398
|
+
</div>`;static style=dt`
|
|
395
399
|
:host {
|
|
396
400
|
box-sizing: border-box;
|
|
397
401
|
}
|
|
@@ -629,13 +633,13 @@ __res <span style="color:#6a737d;font-style:italic">// the res
|
|
|
629
633
|
.info-btn:hover {
|
|
630
634
|
background: #eee;
|
|
631
635
|
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(
|
|
633
|
-
`)>=0&&(
|
|
634
|
-
`)>=0&&(
|
|
635
|
-
</body>`,
|
|
636
|
-
</body>`):
|
|
636
|
+
}`;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(e=>[e.key,e.value]))}_property;_binding;_bindingTarget;_serviceContainer;_instanceServiceContainer;_shell;_signals=[];_signalListContainer;_converterListContainer;constructor(e,t,i,s,l,r,n={}){super(),super._restoreCachedInititalValues(),this._property=e,this._binding=t,this._bindingTarget=i,this._serviceContainer=s,this._instanceServiceContainer=l,this._shell=r,n?.namedConverters===!1&&(this._getDomElement("namedConverterRow").style.display="none");let a=this._getDomElement("historicBtn");n?.showHistoric===!1?a.style.display="none":n?.historicLabel&&(a.textContent=n.historicLabel)}ready(){if(this._parseAttributesToProperties(),this._assignEvents(),this._signalListContainer=this._getDomElement("signalListContainer"),this._converterListContainer=this._getDomElement("converterListContainer"),this._getDomElement("helpBtn").onclick=()=>this._showHelp(),o.namedConverters.length===0&&(this._getDomElement("namedConverterBrowse").style.display="none"),this.twoWayPossible=!1,(this._bindingTarget==Te.property||this._bindingTarget==Te.attribute)&&(this.twoWayPossible=!0),this._binding){if(this.twoWay=this._binding.mode==ut.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 e in this._binding.converter)this.converters.push({key:e,value:this._binding.converter[e]});this._binding.changedEvents&&this._binding.changedEvents.length&&(this.events=this._binding.changedEvents.join(";"))}if(this.expression){let e=this._getDomElement("expression");this.expression.indexOf(`
|
|
637
|
+
`)>=0&&(e.style.height="51px")}if(this.expressionTwoWay){let e=this._getDomElement("expression2way");this.expressionTwoWay.indexOf(`
|
|
638
|
+
`)>=0&&(e.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(e){return e?e.split(";").filter(t=>t.length>0).map(t=>{let i=t.indexOf(":");return i>0?{name:t.slice(0,i),signal:t.slice(i+1)}:{name:"",signal:t}}):[]}_signalsToObjectNames(){return this._signals.map(e=>e.name?e.name+":"+e.signal:e.signal).join(";")}_renderSignalList(){let e=this._signalListContainer;e.innerHTML="",this._signals.forEach((t,i)=>{let s=document.createElement("div");s.className="signal-row";let l=document.createElement("input");l.className="signal-name-input",l.placeholder=`__${i}`,l.value=t.name,l.title="variable name used in the formula (defaults to __"+i+" if empty)",l.oninput=()=>{this._signals[i].name=l.value,this._syncSignals()};let r=document.createElement("input");r.className="signal-path-input",r.value=t.signal,r.placeholder="signal path",r.title="signal path (prefix: ? = signal name in screen property, ?? = screen property value, ?$ = signal object in screen property, ?@ = screen attribute, # = signal name in target property, ## = target property value, #$ = signal object in target property, #@ = target attribute)",r.oninput=()=>{this._signals[i].signal=r.value,this._syncSignals()};let n=document.createElement("button");n.className="signal-icon-btn",n.title="Duplicate";let a=document.createElement("img");a.src=ue+"icons/copy.svg",a.style.cssText="width:12px; height:12px;",n.appendChild(a),n.onclick=()=>{this._signals.splice(i+1,0,{...this._signals[i]}),this._syncSignals(),this._renderSignalList()};let c=document.createElement("button");c.className="signal-select-btn",c.textContent="...",c.title="Browse signal",c.onclick=()=>this._selectForRow(i,r);let p=document.createElement("button");p.className="signal-icon-btn",p.title="Remove";let d=document.createElement("img");d.src=ue+"icons/delete.svg",d.style.cssText="width:12px; height:12px;",p.appendChild(d),p.onclick=()=>{this._signals.splice(i,1),this._syncSignals(),this._renderSignalList()},s.appendChild(l),s.appendChild(r),s.appendChild(c),s.appendChild(n),s.appendChild(p),e.appendChild(s)})}_syncSignals(){this.objectNames=this._signalsToObjectNames(),this._bindingsRefresh()}_addSignal(){this._signals.push({name:"",signal:""}),this._renderSignalList()}async _selectForRow(e,t){let i=this._shell.createBindableObjectBrowser();i.initialize(this._serviceContainer,this._instanceServiceContainer,"binding"),i.title="select signal...";let s=new AbortController;if(i.objectDoubleclicked.on(()=>{s.abort();let r="";i.selectedObject.specialType=="signalProperty"?r="?":i.selectedObject.bindabletype==="property"&&(r="??"),this._signals[e].signal=r+i.selectedObject.fullName,t.value=this._signals[e].signal,this._syncSignals()}),await this._shell.openConfirmation(i,{x:100,y:100,width:400,height:300,parent:this,abortSignal:s.signal})){let r="";i.selectedObject.specialType=="signalProperty"?r="?":i.selectedObject.bindabletype==="property"&&(r="??"),this._signals[e].signal=r+i.selectedObject.fullName,t.value=this._signals[e].signal,this._syncSignals()}}_renderConverterList(){let e=this._converterListContainer;e.innerHTML="";let t=this._property?.type==="color"?"color":"text";this.converters.forEach((i,s)=>{let l=document.createElement("div");l.className="signal-row";let r=document.createElement("input");r.style.cssText="flex:1 1 auto; height:22px; box-sizing:border-box;",r.value=i.key,r.placeholder="condition",r.oninput=()=>{this.converters[s].key=r.value};let n=document.createElement("input");n.type=t,n.style.cssText="flex:1 1 auto; height:22px; box-sizing:border-box;",n.value=i.value,n.placeholder="value",n.oninput=()=>{this.converters[s].value=n.value};let a=document.createElement("button");a.className="signal-icon-btn",a.title="Duplicate";let c=document.createElement("img");c.src=ue+"icons/copy.svg",c.style.cssText="width:12px; height:12px;",a.appendChild(c),a.onclick=()=>{this.converters.splice(s+1,0,{...this.converters[s]}),this._renderConverterList()};let p=document.createElement("button");p.className="signal-icon-btn",p.title="Remove";let d=document.createElement("img");d.src=ue+"icons/delete.svg",d.style.cssText="width:12px; height:12px;",p.appendChild(d),p.onclick=()=>{this.converters.splice(s,1),this._renderConverterList()},l.appendChild(r),l.appendChild(n),l.appendChild(a),l.appendChild(p),e.appendChild(l)})}_addConverter(){this.converters.push({key:"",value:""}),this._renderConverterList()}async _selectNamedConverter(){let e=o.namedConverters;if(e.length===0)return;let t="",i=null,s=document.createElement("div");s.style.cssText="display:flex; flex-direction:column; height:100%; box-sizing:border-box; font-size:12px;";let l=document.createElement("div");l.style.cssText="padding:6px 8px 4px; color:#666; font-size:11px; border-bottom:1px solid #e0e0e0; flex-shrink:0;",l.textContent="Select a converter and confirm with OK.",s.appendChild(l);let r=document.createElement("div");r.style.cssText="flex:1; overflow-y:auto; padding:4px;",s.appendChild(r);let n=p=>{p.style.background="",p.style.borderLeftColor="transparent"},a=(p,d)=>{i&&n(i),i=p,p.style.background="#e8f4fd",p.style.borderLeftColor="#0078d7",t=d};for(let p of e){let d=document.createElement("div");d.style.cssText="padding:5px 6px 5px 9px; cursor:pointer; border-radius:3px; border-left:3px solid transparent; margin-bottom:2px;";let g=document.createElement("div");if(g.style.cssText="font-family:monospace; font-weight:bold; color:#111;",g.textContent=p.name,d.appendChild(g),p.description){let u=document.createElement("div");u.style.cssText="color:#555; font-size:11px; margin-top:2px;",u.textContent=p.description,d.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[m,y]of Object.entries(p.converter)){let _=document.createElement("span");_.style.cssText="color:#555; text-align:right;",_.textContent=m;let w=document.createElement("span");w.style.cssText="color:#aaa;",w.textContent="\u2192";let C=document.createElement("span");C.style.cssText="color:#0078d7; font-weight:bold;",C.textContent=String(y),u.appendChild(_),u.appendChild(w),u.appendChild(C)}d.appendChild(u)}d.onmouseenter=()=>{d!==i&&(d.style.background="#f5f5f5")},d.onmouseleave=()=>{d!==i&&(d.style.background="")},d.onclick=()=>a(d,p.name),r.appendChild(d)}await this._shell.openConfirmation(s,{x:100,y:100,width:320,height:300,parent:this})&&t&&(this.convertersString=t,this._getDomElement("namedConverterInput").value=t,this._bindingsRefresh())}_refresh(){requestAnimationFrame(()=>{this._bindingsRefresh()})}async showHistoric(){let e=new K(this.historic),t=new AbortController;e.title="Edit historic binding to: "+this._property.name,await this._shell.openConfirmation(e,{x:100,y:100,width:420,height:510,parent:this,abortSignal:t.signal,disableResize:!0,cancelText:"Remove"})?this.historic=e.historic:this.historic=null,this._bindingsRefresh()}_showHelp(){let e=document.createElement("iframe");e.srcdoc=o.helpSections.length>0?be.replace(`</div>
|
|
639
|
+
</body>`,o.helpSections.join("")+`</div>
|
|
640
|
+
</body>`):be,e.style.cssText="width:100%; height:100%; border:none; display:block;",this._shell.openModal(e,{title:"Bindings Editor Help",parent:this,x:-660,y:-80,width:630,height:580})}};customElements.define(he.is,he);import{BaseCustomWebComponentConstructorAppend as _t,TypedEvent as St,css as kt,html as Tt}from"@node-projects/base-custom-webcomponent";import{ContextMenu as Ct,assetsPath as ve}from"@node-projects/web-component-designer";import{typeInfoFromJsonSchema as Be}from"@node-projects/propertygrid.webcomponent";import{defaultOptions as Et,defaultStyle as Nt}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as Ot}from"wunderbaum";import It from"wunderbaum/dist/wunderbaum.css"with{type:"css"};import{PropertyGrid as ht}from"@node-projects/propertygrid.webcomponent";import{CodeViewMonaco as Ce}from"@node-projects/web-component-designer-codeview-monaco";var re=class extends ht{serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;bindableObjectsTarget="property";constructor(){super()}bindingDoubleClicked;setNameColumnWidth(e){let t=this._tree?.columns?.[0];t&&(t.width=e+"px",this._tree.update("colStructure"))}async getEditorForType(e,t,i,s,l){if(this.getSpecialEditorForType){let r=await this.getSpecialEditorForType(e,t,i,s,l);if(r)return r}switch(e.format){case"screen":{let r=document.createElement("select");r.style.width="100%";let n=document.createElement("option");n.value=t??"",n.innerText=t??"",r.appendChild(n);for(let a of await this.visualizationHandler.getAllNames("screen")){if(a==t)continue;let c=document.createElement("option");c.value=a,c.innerText=a,r.appendChild(c)}return r.onchange=()=>{this.setPropertyValue(i,r.value)},r.value=t,r}case"signal":{let r=document.createElement("div");r.style.display="flex";let n=document.createElement("input");n.value=t??"",n.style.flexGrow="1",n.style.width="0",n.onchange=c=>this.setPropertyValue(i,n.value),n.onfocus=c=>{n.selectionStart=0,n.selectionEnd=n.value?.length},r.appendChild(n);let a=document.createElement("button");return a.textContent="...",a.onclick=async()=>{let c=this.visualizationShell.createBindableObjectBrowser();c.initialize(this.serviceContainer,this.instanceServiceContainer,this.bindableObjectsTarget),c.title="select signal...";let p=new AbortController;c.objectDoubleclicked.on(()=>{this.bindingDoubleClicked&&this.bindingDoubleClicked(c.selectedObject),p.abort(),n.value=c.selectedObject.fullName,this.setPropertyValue(i,n.value)}),await this.visualizationShell.openConfirmation(c,{x:100,y:100,width:400,height:300,parent:this,abortSignal:p.signal})&&(n.value=c.selectedObject.fullName,this.setPropertyValue(i,n.value))},r.appendChild(a),r}case"html":case"script":{let r=document.createElement("div");r.style.boxSizing="border-box",r.style.width="100%",r.style.display="flex";let n=document.createElement("textarea");n.style.boxSizing="border-box",n.value=t??"",n.style.width="100%",n.onblur=c=>{this.setPropertyValue(i,n.value)},r.appendChild(n);let a=document.createElement("button");return a.innerHTML="...",a.style.boxSizing="border-box",a.onclick=async()=>{let c=new Ce,p=await Ce.getMonacoLib();if(e.format=="html")c.language="html";else{let g={content:`declare global {
|
|
637
641
|
var context: { event: Event, element: Element };
|
|
638
|
-
}`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([
|
|
642
|
+
}`,filePath:"global.d.ts"};p.languages.typescript.typescriptDefaults.setExtraLibs([g]),c.language="javascript"}c.code=n.value,c.style.position="relative",await this.visualizationShell.openConfirmation(c,{x:200,y:200,width:600,height:400,parent:this})&&(n.value=c.getText(),this.setPropertyValue(i,n.value))},r.appendChild(a),r}}return super.getEditorForType(e,t,i,s,l)}};customElements.define("node-projects-visualization-property-grid",re);import{CodeViewMonaco as Ve}from"@node-projects/web-component-designer-codeview-monaco";import{BaseCustomWebComponentConstructorAppend as gt,TypedEvent as Ee,css as ft,html as yt}from"@node-projects/base-custom-webcomponent";import{defaultOptions as bt,defaultStyle as vt}from"@node-projects/web-component-designer-widgets-wunderbaum";import{Wunderbaum as xt}from"wunderbaum";import wt from"wunderbaum/dist/wunderbaum.css"with{type:"css"};function mt(o){return o.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">")}function H(o){return mt(o).replace(/("(?:\\.|[^"\\])*")(\s*:)?|\b(true|false|null)\b|\b(-?\d+(?:\.\d+)?)\b/g,(t,i,s,l,r)=>i?`<span class="${s?"cs-key":"cs-str"}">${i}</span>${s??""}`:l?`<span class="cs-bool">${l}</span>`:r?`<span class="cs-num">${r}</span>`:t)}var Z=class o extends gt{static style=ft`
|
|
639
643
|
:host {
|
|
640
644
|
display: block;
|
|
641
645
|
background: white;
|
|
@@ -780,7 +784,7 @@ __res <span style="color:#6a737d;font-style:italic">// the res
|
|
|
780
784
|
font-style: italic;
|
|
781
785
|
color: #666;
|
|
782
786
|
}
|
|
783
|
-
`;static template=
|
|
787
|
+
`;static template=yt`
|
|
784
788
|
<div class="root">
|
|
785
789
|
<input id="filter" placeholder="Filter..." autocomplete="off">
|
|
786
790
|
<div class="content">
|
|
@@ -794,14 +798,14 @@ __res <span style="color:#6a737d;font-style:italic">// the res
|
|
|
794
798
|
<button id="closeBtn" @click="[[this.closeClicked()]]">Close</button>
|
|
795
799
|
</div>
|
|
796
800
|
</div>
|
|
797
|
-
`;static is="node-projects-visualization-simple-script-command-picker";_title;get title(){return this._title}set title(
|
|
798
|
-
<div class="cmd-title">${
|
|
799
|
-
<pre class="snippet">${
|
|
800
|
-
${
|
|
801
|
-
`;return}let
|
|
802
|
-
<div class="cmd-title">${
|
|
803
|
-
${
|
|
804
|
-
`}loadCommands(t
|
|
801
|
+
`;static is="node-projects-visualization-simple-script-command-picker";_title;get title(){return this._title}set title(e){this._title=e}selectedType;commandTypeChosen=new Ee;closeRequested=new Ee;_tree;_filter;_descriptionDiv;_addBtn;_typeInfo;_descriptions;constructor(){super(),this._restoreCachedInititalValues(),this.shadowRoot.adoptedStyleSheets=[wt,vt,o.style],this._descriptionDiv=this._getDomElement("description"),this._addBtn=this._getDomElement("addBtn"),this._filter=this._getDomElement("filter"),this._filter.onkeyup=()=>{let e=this._filter.value;this._tree.filterNodes(t=>new RegExp(e,"i").test(t.title),{})},this._tree=new xt({...bt,element:this._getDomElement("commandList"),icon:!1,filter:{autoExpand:!0,mode:"hide",highlight:!0},activate:e=>{this.selectedType=e.node.title,this._addBtn.disabled=!1,this._renderDescription(e.node.title)},dblclick:e=>(this.selectedType=e.node.title,this.commandTypeChosen.emit(),!1),render:e=>{e.isNew&&(e.nodeElem.oncontextmenu=t=>(t.preventDefault(),!1))},dnd:{guessDropEffect:!1,serializeClipboardData:!0,dragStart:e=>(e.event.dataTransfer.effectAllowed="copy",e.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(e){let t=this._descriptions?.[e];if(t){this._descriptionDiv.innerHTML=`
|
|
802
|
+
<div class="cmd-title">${e}<span class="hint">${t.description}</span></div>
|
|
803
|
+
<pre class="snippet">${H(t.example)}</pre>
|
|
804
|
+
${t.note?`<div class="note">${t.note}</div>`:""}
|
|
805
|
+
`;return}let i=this._typeInfo?.definitions?.[e]?.description;this._descriptionDiv.innerHTML=`
|
|
806
|
+
<div class="cmd-title">${e}</div>
|
|
807
|
+
${i?`<div class="note">${i}</div>`:""}
|
|
808
|
+
`}loadCommands(e,t){this._typeInfo=e,this._descriptions=t??{};let i=Object.keys(e.definitions).filter(s=>e.definitions[s].type==="object"&&s!=="ScriptCommands");this._tree.root.addChildren(i.map(s=>({title:s})))}};customElements.define(Z.is,Z);function Ne(o,e){return`<span class="cs-attr">${o}</span>='${H(e)}'`}var Oe=`<!DOCTYPE html>
|
|
805
809
|
<html>
|
|
806
810
|
<head>
|
|
807
811
|
<meta charset="UTF-8">
|
|
@@ -922,7 +926,7 @@ html, body {
|
|
|
922
926
|
|
|
923
927
|
<div class="content-section">
|
|
924
928
|
<div class="section-title"><span class="section-num">1</span> Basic structure <span class="section-hint">commands array, sequential execution</span></div>
|
|
925
|
-
<pre class="snippet">${
|
|
929
|
+
<pre class="snippet">${Ne("@click",`{"commands":[
|
|
926
930
|
{ "type": "SetSignalValue", "signal": ".Some.Signal", "value": true },
|
|
927
931
|
{ "type": "SetSignalValue", "signal": ".Some.Other", "value": false }
|
|
928
932
|
]}`)}</pre>
|
|
@@ -932,22 +936,22 @@ html, body {
|
|
|
932
936
|
<div class="content-section">
|
|
933
937
|
<div class="section-title"><span class="section-num">2</span> Dynamic / indirect values <span class="section-hint">IScriptMultiplexValue</span></div>
|
|
934
938
|
<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>
|
|
935
|
-
<pre class="snippet">${
|
|
936
|
-
${
|
|
937
|
-
${
|
|
939
|
+
<pre class="snippet">${H('{ "source": "expression", "name": "ctx.event.srcElement.value" }')} <span class="cs-comment">// js expression, 'ctx' is the context object</span>
|
|
940
|
+
${H('{ "source": "complexString", "name": "prefix-{.Some.Signal}-suffix" }')} <span class="cs-comment">// signal names in {}</span>
|
|
941
|
+
${H('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">// a parameter handed into the script</span></pre>
|
|
938
942
|
<div class="note">Other sources: signal, property, signalInProperty, event, complexSignal, context, elementProperty. The property grid's "..." button opens an editor for these.</div>
|
|
939
943
|
</div>
|
|
940
944
|
|
|
941
945
|
<div class="content-section">
|
|
942
946
|
<div class="section-title"><span class="section-num">3</span> Cyclic events <span class="section-hint">re-triggering timer event</span></div>
|
|
943
|
-
<pre class="snippet">${
|
|
947
|
+
<pre class="snippet">${Ne("@cyclic:100",`{"commands":[
|
|
944
948
|
{ "type": "SetSignalValue", "signal": ".Local.Tick", "value": true }
|
|
945
949
|
]}`)}</pre>
|
|
946
950
|
<div class="note">A <code>@cyclic:<ms></code> event retriggers itself automatically every <ms> milliseconds.</div>
|
|
947
951
|
</div>
|
|
948
952
|
</div>
|
|
949
953
|
</body>
|
|
950
|
-
</html>`;var
|
|
954
|
+
</html>`;var Ie={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",
|
|
951
955
|
"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?",
|
|
952
956
|
"messageType": "warning", "buttons": "yesNo", "resultSignal": ".Local.Result",
|
|
953
957
|
"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",
|
|
@@ -956,7 +960,7 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
956
960
|
"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,
|
|
957
961
|
"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",
|
|
958
962
|
"signals": [{"source":"signal","name":".Is.On"}, {"varName":"ready","source":"signal","name":".Is.Ready"}],
|
|
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
|
|
963
|
+
"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 Q=class o{static upgradeScriptCommand(e){return e.type==="SetElementProperty"?o.upgradeSetElementProperty(e):(e.type==="If"&&(e.trueCommands=(e.trueCommands??[]).map(t=>o.upgradeScriptCommand(t)),e.elseCommands=(e.elseCommands??[]).map(t=>o.upgradeScriptCommand(t))),e)}static upgradeSetElementProperty(e){return e.targetSelectorTarget==="currentScreen"?e.targetSelectorTarget="container":e.targetSelectorTarget==="parentScreen"?(e.targetSelectorTarget="container",e.parentIndex=1):e.targetSelectorTarget==="currentElement"?e.targetSelectorTarget="element":e.targetSelectorTarget==="parentElement"&&(e.targetSelectorTarget="element",e.parentIndex=1),e}};var ee="application/x-simple-script-move",te=class o extends _t{static style=kt`
|
|
960
964
|
:host {
|
|
961
965
|
background: white;
|
|
962
966
|
}
|
|
@@ -1154,7 +1158,7 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
1154
1158
|
height: 12px;
|
|
1155
1159
|
cursor: pointer;
|
|
1156
1160
|
}
|
|
1157
|
-
`;static template=
|
|
1161
|
+
`;static template=Tt`
|
|
1158
1162
|
<div class="root">
|
|
1159
1163
|
<div class="content">
|
|
1160
1164
|
<node-projects-split-view
|
|
@@ -1204,8 +1208,8 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
1204
1208
|
</node-projects-split-view>
|
|
1205
1209
|
</div>
|
|
1206
1210
|
</div>
|
|
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
|
-
`+
|
|
1211
|
+
`;static is="node-projects-visualization-simple-script-editor";_title;get title(){return this._title}set title(e){this._title=e}serviceContainer;instanceServiceContainer;visualizationHandler;visualizationShell;scriptCommandsTypeInfo;propertiesTypeInfo;helpRequested=new St;commandDescriptions={...Ie};_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 e=this._getDomElement("listContent");e.addEventListener("mousedown",t=>{this._dragFromHandle=!!t.target?.closest(".drag-handle")}),document.addEventListener("dragend",()=>{this._draggedNode=null},!0),e.addEventListener("dragover",t=>{if(t.preventDefault(),t.dataTransfer){let i=t.dataTransfer.types.includes(ee);t.dataTransfer.dropEffect=i?"move":"copy"}}),e.addEventListener("drop",t=>{if(t.preventDefault(),t.dataTransfer?.types.includes(ee)&&this._draggedNode){let s=this._commandListFancyTree.root.children,l=s?.[s.length-1];l&&this._draggedNode.moveTo(l,"after"),this._draggedNode.setClass("wb-drag-source",!1)}else{let s=t.dataTransfer?.getData("text/plain");if(s){let l={type:s};this._commandListFancyTree.root.addChildren(this.createTreeItem(l))}}}),this.shadowRoot.adoptedStyleSheets=[It,Nt,o.style]}async ready(){this._parseAttributesToProperties(),this._bindingsParse(null,!0),this._assignEvents();let e=async a=>{let c=new re;c.visualizationHandler=this.visualizationHandler,c.visualizationShell=this.visualizationShell,c.serviceContainer=this.serviceContainer,c.instanceServiceContainer=this.instanceServiceContainer,c.bindableObjectsTarget="script",c.getTypeInfo=(d,g)=>Be(this.propertiesTypeInfo,d,g),c.showHead=!1,c.typeName="IScriptMultiplexValue",c.title='Complex for "'+a.propertyPath+'"',typeof a.value=="object"?c.selectedObject=a.value??{}:c.selectedObject={},c.bindingDoubleClicked=d=>{d.bindabletype=="property"?c.setPropertyValue("source","property"):d.bindabletype=="context"?c.setPropertyValue("source","context"):c.setPropertyValue("source","signal"),c.setPropertyValue("name",d.fullName),c.refresh()},await this.visualizationShell.openConfirmation(c,{x:100,y:100,width:400,height:500,parent:this})&&(this._propertygrid.setPropertyValue(a.propertyPath,c.selectedObject),this._propertygrid.refresh())},t=async a=>{let c=new Ve;c.language="javascript",c.style.position="relative",c.code=a.value??"",await this.visualizationShell.openConfirmation(c,{title:"Edit formula",x:100,y:50,width:700,height:450,parent:this})&&(this._propertygrid.setPropertyValue(a.propertyPath,c.code),this._propertygrid.refresh())},i=["signal","property","elementProperty","signalInProperty","event","parameter","context","complexString","complexSignal","expression"],s=/^[A-Za-z_$][A-Za-z0-9_$]*$/,l=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"},n=async a=>{let c=(a.value??[]).map(k=>({...k})),p=k=>{let N=(c[k].varName??"").trim();return N?s.test(N)?l.has(N)?`"${N}" is a reserved word and cannot be used as a variable name.`:c.some((E,O)=>O!==k&&(E.varName??"").trim()===N)?`"${N}" is used by more than one signal.`:null:`"${N}" is not a valid JavaScript variable name.`:null},d="height:22px; box-sizing:border-box; font-size:12px;",g=document.createElement("div");g.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 m=document.createElement("span");m.textContent="Name",m.style.cssText="flex:0 0 120px;";let y=document.createElement("span");y.textContent="Typ",y.style.cssText="flex:0 0 130px;";let _=document.createElement("span");_.textContent="Signal",_.style.cssText="flex:1 1 auto;";let w=document.createElement("span");w.style.cssText="flex:0 0 22px;",u.append(m,y,_,w),g.appendChild(u);let C=document.createElement("div");C.style.cssText="display:flex; flex-direction:column; gap:4px;",g.appendChild(C);let z=document.createElement("div");z.style.cssText="flex:0 0 auto; margin-top:4px; padding-top:6px; border-top:1px solid #ccc; font-size:12px;";let P=document.createElement("div");P.style.cssText="font-weight:bold; margin-bottom:2px;";let G=document.createElement("div");G.style.cssText="color:#333; white-space:pre-line;",z.append(P,G);let q=k=>{P.textContent="Typ: "+k,G.textContent=r[k]??""},M=[],X=()=>{c.forEach((k,N)=>{let E=M[N];if(!E)return;let O=p(N);E.title=O??`Variable name used in the formula (defaults to __${N} if empty)`,E.style.borderColor=O?"#c0392b":"",E.style.backgroundColor=O?"#fdecea":""})},B=()=>{C.innerHTML="",M.length=0,c.forEach((k,N)=>{let E=document.createElement("div");E.style.cssText="display:flex; align-items:center; gap:4px;";let O=document.createElement("input");O.value=k.varName??"",O.placeholder="__"+N,O.style.cssText=d+" flex:0 0 120px; min-width: 120px; font-family:monospace;",O.oninput=()=>{k.varName=O.value||void 0,X()},M.push(O),E.appendChild(O);let h=document.createElement("select");h.style.cssText=d+" flex:0 0 130px;";for(let A of i){let S=document.createElement("option");S.value=A,S.textContent=A,k.source===A&&(S.selected=!0),h.appendChild(S)}h.onchange=()=>{k.source=h.value,q(h.value)},h.onfocus=()=>q(h.value),E.appendChild(h);let b=document.createElement("input");b.value=k.name??"",b.placeholder="e.g. srm.rbg{__tagRoot}.error",b.style.cssText=d+" flex:1 1 auto;",b.oninput=()=>{k.name=b.value},E.appendChild(b);let v=document.createElement("button");v.title="Remove signal",v.style.cssText=d+" flex:0 0 22px; width:22px; padding:0; display:flex; align-items:center; justify-content:center;";let V=document.createElement("img");V.src=ve+"icons/delete.svg",V.style.cssText="width:12px; height:12px;",v.appendChild(V),v.onclick=()=>{c.splice(N,1),B()},E.appendChild(v),C.appendChild(E)}),X()};B();let L=document.createElement("button");L.textContent="+ Add signal",L.style.cssText=d+" align-self:flex-start; padding:0 8px;",L.onclick=()=>{c.push({source:"signal",name:""}),B()},g.appendChild(L),q(c[0]?.source??"signal"),g.appendChild(z),await this.visualizationShell.openConfirmation(g,{title:"Edit signals",x:100,y:50,width:500,height:400,parent:this})&&(this._propertygrid.setPropertyValue(a.propertyPath,c),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=(a,c)=>{let p=Be(this.scriptCommandsTypeInfo,a,c);return p&&(c==="If"||a?.type==="If")&&(p.properties=p.properties.filter(d=>d.name!=="trueCommands"&&d.name!=="elseCommands")),p},this._propertygrid.getSpecialEditorForType=async(a,c,p,d,g)=>{if(!a.specialAllreadyAdded&&(a.specialAllreadyAdded=!0,a.format!=="collection"))if(a.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()},d.nodeElem.insertAdjacentElement("afterbegin",u);let m=Array.isArray(c)?c:[],y=document.createElement("div");y.style.display="flex";let _=document.createElement("span");_.innerText=m.map((C,z)=>(C?.varName||"__"+z)+": "+(C?.source??"")+":"+(C?.name??"")).join(", "),_.style.overflow="hidden",_.style.whiteSpace="nowrap",_.style.textOverflow="ellipsis",_.style.flexGrow="1",_.title=JSON.stringify(m),y.appendChild(_);let w=document.createElement("button");return w.innerText="...",w.onclick=()=>{n({value:m,propertyPath:p})},y.appendChild(w),d.nodeElem.style.display="flex",y}else if(a.format==="formula"){let u=document.createElement("div");u.style.cssText="display:flex; width:100%; height:100%; align-items:stretch;";let m=new Ve;m.language="javascript",m.singleRow=!0,m.style.cssText="flex:1 1 auto; min-width:0; height:100%; position:relative; overflow:hidden;",m.code=c??"",m.addEventListener("code-changed",()=>{this._propertygrid.setPropertyValue(p,m.code)}),u.appendChild(m);let y=document.createElement("button");return y.innerText="...",y.title="Open in larger editor",y.style.cssText="flex:0 0 28px; width:20px;",y.onclick=()=>t({value:m.code,propertyPath:p}),u.appendChild(y),d.nodeElem.style.display="flex",u}else if(typeof c=="object"&&c!==null||a.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()},d.nodeElem.insertAdjacentElement("afterbegin",u);let m=document.createElement("div");m.style.display="flex";let y=document.createElement("span");c?y.innerText=(c.source??"")+": "+(c.name??""):y.innerText="",y.style.overflow="hidden",y.style.whiteSpace="nowrap",y.style.textOverflow="ellipsis",y.style.flexGrow="1",y.title=JSON.stringify(c),m.appendChild(y);let _=document.createElement("button");return _.innerText="...",_.onclick=()=>{e({value:c,propertyPath:p})},m.appendChild(_),d.nodeElem.style.display="flex",m}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=()=>{e({value:c,propertyPath:p})},d.nodeElem.insertAdjacentElement("afterbegin",u),d.nodeElem.style.display="flex"}return null},this._propertygrid.propertyNodeContextMenu.on(a=>{Ct.show([{title:"edit complex value",action:async()=>{e(a)}},{title:"edit string",action:async()=>{let c=prompt("enter value:");c&&(this._propertygrid.setPropertyValue(a.propertyPath,c),this._propertygrid.refresh())}},{title:"remove complex value",action:async()=>{this._propertygrid.setPropertyValue(a.propertyPath,void 0),this._propertygrid.refresh()}}],a.event)})}helpClicked(){let e=document.createElement("iframe");e.srcdoc=Oe,e.style.cssText="width:100%; height:100%; border:none; display:block;",this.visualizationShell.openModal(e,{title:"Simple Script Editor Help",parent:this,x:-650,y:-100,width:620,height:620}),this.helpRequested.emit()}toggleCodeView(){if(!this._showingCode){let t=JSON.stringify({commands:this.getScriptCommands()},null,2);this._codeView.update(t),this._showCodeView(!0);return}let e=this._parseCodeViewScript();e&&(this._showCodeView(!1),this.loadScript(e))}_showCodeView(e){this._codeView.classList.toggle("visible",e),this._commandListDiv.classList.toggle("hidden",e),this._splitView.classList.toggle("code-mode",e),this._addCommandBtn.disabled=e,this._codeToggleBtn.innerText=e?"Visual":"Code",this._showingCode=e,e&&requestAnimationFrame(()=>this._codeView.activated())}_parseCodeViewScript(){let e;try{e=JSON.parse(this._codeView.getText())}catch(t){return alert(`Invalid JSON:
|
|
1212
|
+
`+t.message),null}return Array.isArray(e?.commands)?e:(alert('The JSON must have a "commands" array.'),null)}loadScript(e){this._script=e,this._commandListFancyTree&&(this._commandListFancyTree.destroy(),this._commandListDiv=this._getDomElement("commandList"));let t=[];for(let i of this._script.commands)i=Q.upgradeScriptCommand(i),t.push(this.createTreeItem(i));this._commandListFancyTree=new Ot({...Et,element:this._commandListDiv,icon:!1,source:t,activate:i=>{this._propertygrid.selectedObject=i.node.data.data.item??null},render:i=>{let s=!!i.node.data.data?.branch;if(i.isNew){i.nodeElem.oncontextmenu=n=>(n.preventDefault(),!1);let r=document.createElement("span");if(r.style.cssText="display:inline-block; width:24px;",i.nodeElem.prepend(r),s)i.nodeElem._reservedRowWidth=r.offsetWidth;else{let n=document.createElement("div");n.className="drag-handle",n.title="Drag to reorder",n.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>',i.nodeElem.prepend(n);let a=i.nodeElem.parentElement,c=document.createElement("span");c.style.cssText="display:inline-block; width:32px;",i.nodeElem.appendChild(c);let p=document.createElement("div");p.className="cmd";let d=document.createElement("img");d.src=ve+"icons/copy.svg",d.title="Duplicate",d.onclick=()=>{let u=structuredClone(i.node.data.data.item);i.node.parent.addChildren(this.createTreeItem(u)).moveTo(i.node,"after")};let g=document.createElement("img");g.src=ve+"icons/delete.svg",g.title="Remove",g.onclick=()=>i.node.remove(),p.append(d,g),a.appendChild(p),i.nodeElem._reservedRowWidth=r.offsetWidth+c.offsetWidth}}let l=i.nodeElem._reservedRowWidth??0;if(l){let r=i.nodeElem.querySelector("span.wb-title");if(r){let n=parseFloat(r.style.width);isNaN(n)||(r.style.width=Math.max(0,n-l)+"px")}}},dnd:{guessDropEffect:!0,preventRecursion:!0,preventVoidMoves:!1,serializeClipboardData:!1,dragStart:i=>this._dragFromHandle?(this._draggedNode=i.node,i.event.dataTransfer.effectAllowed="move",i.event.dataTransfer.dropEffect="move",i.event.dataTransfer.setData(ee,"1"),!0):!1,dragEnd:()=>{this._draggedNode=null},dragEnter:i=>{let s=i.event.dataTransfer?.types.includes(ee);return i.event.dataTransfer.dropEffect=s?"move":"copy",!!i.node.data.data?.branch?new Set(["over"]):new Set(["before","after"])},dragOver:i=>{let s=i.event.dataTransfer?.types.includes(ee);i.event.dataTransfer.dropEffect=s?"move":"copy"},drop:async i=>{let s=i.event.dataTransfer?.types.includes(ee);if(i.region==="over"){if(s&&this._draggedNode)this._draggedNode.moveTo(i.node,"appendChild"),this._draggedNode.setClass("wb-drag-source",!1);else{let r=i.event.dataTransfer?.getData("text/plain");r&&i.node.addChildren(this.createTreeItem({type:r}))}return}let l=i.region=="before"?"before":"after";if(s&&this._draggedNode)this._draggedNode.moveTo(i.node,l),this._draggedNode.setClass("wb-drag-source",!1);else{let r=i.event.dataTransfer?.getData("text/plain");if(r){let n={type:r},a=this.createTreeItem(n);i.node.parent.addChildren(a).moveTo(i.node,l)}}}}}),this._commandListFancyTree.root.children?.[0]?.setActive()}createTreeItem(e){if(e.type==="If"){let t=e;return t.trueCommands??=[],t.elseCommands??=[],{title:"If",expanded:!0,data:{item:e},children:[{title:"true",expanded:!0,data:{branch:"true"},children:t.trueCommands.map(i=>this.createTreeItem(i))},{title:"else",expanded:!0,data:{branch:"else"},children:t.elseCommands.map(i=>this.createTreeItem(i))}]}}return{title:e.type,data:{item:e}}}nodeToCommand(e){let t=e.data.data.item;if(t.type==="If"){let i=e.children?.find(l=>l.data.data?.branch==="true"),s=e.children?.find(l=>l.data.data?.branch==="else");t.trueCommands=(i?.children??[]).map(l=>this.nodeToCommand(l)),t.elseCommands=(s?.children??[]).map(l=>this.nodeToCommand(l))}return t}_getBranchContainerNode(e){let t=e;for(;t;){if(t.data?.data?.branch)return t;t=t.parent}return null}async addCommand(){let e=new Z;e.loadCommands(this.scriptCommandsTypeInfo,this.commandDescriptions),e.title="Add Script Command",e.commandTypeChosen.on(()=>{if(e.selectedType){let i={type:e.selectedType},s=this.createTreeItem(i),l=this._getBranchContainerNode(this._commandListFancyTree.activeNode);l?l.addChildren(s):this._commandListFancyTree.addChildren(s)}});let t=new AbortController;e.closeRequested.on(()=>t.abort()),await this.visualizationShell.openModal(e,{title:"Add Script Command",x:300,y:50,width:620,height:400,parent:this,abortSignal:t.signal})}getScriptCommands(){if(this._showingCode){let t=this._parseCodeViewScript();t&&this.loadScript(t)}return this._commandListFancyTree.root.children.map(t=>this.nodeToCommand(t))}};customElements.define(te.is,te);import{BaseCustomWebComponentConstructorAppend as Bt,css as Vt,html as Rt}from"@node-projects/base-custom-webcomponent";var ie=class extends Bt{static style=Vt`
|
|
1209
1213
|
:host {
|
|
1210
1214
|
display: grid;
|
|
1211
1215
|
grid-template-columns: 80px 80px 80px auto;
|
|
@@ -1219,7 +1223,7 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
1219
1223
|
|
|
1220
1224
|
span {
|
|
1221
1225
|
font-size: 10px;
|
|
1222
|
-
}`;static template=
|
|
1226
|
+
}`;static template=Rt`
|
|
1223
1227
|
<span></span>
|
|
1224
1228
|
<span>name</span>
|
|
1225
1229
|
<span>type</span>
|
|
@@ -1238,7 +1242,7 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
1238
1242
|
<input hidden="[[item.type !== 'boolean']]" type="checkbox" checked="{{item.value}}">
|
|
1239
1243
|
<div hidden="[[item.type !== 'null']]">-null-</div>
|
|
1240
1244
|
</template>
|
|
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(
|
|
1245
|
+
<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(e){e!=null?this._parameterArray=Object.keys(e).map(t=>({key:t,type:typeof e[t]=="object"?"null":typeof e[t],value:e[t]})):this._parameterArray=[],this._bindingsRefresh()}getParametersObject(){let e=!1,t={};for(let i of this._parameterArray)if(i.key)switch(e=!0,t[i.key]=null,i.type){case"string":t[i.key]=i.value.toString();break;case"number":let s=parseFloat(i.value);t[i.key]=isNaN(s)?0:s;break;case"boolean":t[i.key]=!!i.value;break}return e?t:null}_remove(e){this._parameterArray.splice(e,1),this._bindingsRefresh()}_add(){this._parameterArray.push({type:"null"}),this._bindingsRefresh()}};customElements.define(ie.is,ie);import{BaseCustomWebComponentConstructorAppend as At,css as zt,html as Re}from"@node-projects/base-custom-webcomponent";import{ContextMenu as Ae,copyTextToClipboard as ze,getTextFromClipboard as De,PropertiesHelper as Dt}from"@node-projects/web-component-designer";var me=class o extends At{static style=zt`
|
|
1242
1246
|
:host {
|
|
1243
1247
|
display: grid;
|
|
1244
1248
|
grid-template-columns: 20px 1fr auto;
|
|
@@ -1272,22 +1276,18 @@ ${B('{ "source": "parameter", "name": "myParam" }')} <span class="cs-comment">/
|
|
|
1272
1276
|
}
|
|
1273
1277
|
button {
|
|
1274
1278
|
cursor: pointer;
|
|
1275
|
-
}`;static template=
|
|
1279
|
+
}`;static template=Re`
|
|
1276
1280
|
<template repeat:item="[[this.events]]">
|
|
1277
1281
|
<div @click="[[this._ctxMenu(event, item)]]" @contextmenu="[[this._ctxMenu(event, item)]]" class="rect" title="[[this._getScriptType(item)]]" css:background-color="[[this._getScriptTypeColor(item)]]"></div>
|
|
1278
1282
|
<a @click="[[this._showContextMenuAssignScript(event, item, false)]]" @contextmenu="[[this._ctxMenu(event, item)]]" title="[[item.name]]">[[item.name]]</a>
|
|
1279
1283
|
<div>[[this._createControlsForScript(item)]]</div>
|
|
1280
1284
|
</template>
|
|
1281
1285
|
<span style="grid-column: 1 / span 3; margin-top: 8px; margin-left: 3px;">add event:</span>
|
|
1282
|
-
<input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=
|
|
1286
|
+
<input id="addEventInput" style="grid-column: 1 / span 3; margin: 5px;" @keypress="[[this._addEvent(event)]]" type="text">`;static editRowTemplate=Re`
|
|
1283
1287
|
<div style="display: flex; justify-content: flex-end;">
|
|
1284
1288
|
<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">
|
|
1285
1289
|
<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">
|
|
1286
1290
|
<button css:background="[[this._hasParameters(item) ? 'lime' : '']]" style="display: flex; padding: 0; flex-grow: 0;" title="parameter" @click="[[this._editParameter(event, item)]]">p</button>
|
|
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=a.nextNode();for(;c;){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)){let p=a.nextSibling();for(;!p&&c;)c=a.parentNode(),p=a.nextSibling();c=p}else c=a.nextNode()}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};
|
|
1291
|
+
</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(e,t,i,s,l,r){this._visualizationHandler=e,this._visualizationShell=t,this._scriptCommandsTypeInfo=i,this._propertiesTypeInfo=s,this._blocklyToolbox=l,this._commandDescriptions=r}set instanceServiceContainer(e){this._instanceServiceContainer=e,this._selectionChangedHandler?.dispose(),this._selectionChangedHandler=this._instanceServiceContainer?.selectionService.onSelectionChanged.on(t=>{this.selectedItems=t.selectedElements}),this.selectedItems=this._instanceServiceContainer?.selectionService.selectedElements??[]}dispose(){this.instanceServiceContainer=null}_createControlsForScript(e){switch(this._getScriptType(e)){case"none":return""}return this.constructor.editRowTemplate.content.cloneNode(!0)}_getScriptName(e){if(this.selectedItems[0].hasAttribute("@"+e.name)){let t=this.selectedItems[0].getAttribute("@"+e.name);if(t[0]==="{"){if(t.includes("name"))return JSON.parse(t).name}else return t}return null}async _changeScriptName(e,t){if(e.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+t.name)){let i=e.target.value,s=this.selectedItems[0].getAttribute("@"+t.name);if(s.startsWith("{")){let l=JSON.parse(s);l.name=i,this._selectedItems[0].setAttribute("@"+t.name,JSON.stringify(l))}else this._selectedItems[0].setAttribute("@"+t.name,i)}}_getRelativeSignalsPath(e){if(this.selectedItems[0].hasAttribute("@"+e.name)){let t=this.selectedItems[0].getAttribute("@"+e.name);if(t[0]==="{"&&t.includes("relativeSignalsPath"))return JSON.parse(t).relativeSignalsPath}return null}async _changeRelativeSignalsPath(e,t){if(e.key=="Enter"&&this.selectedItems&&this.selectedItems.length&&this.selectedItems[0].hasAttribute("@"+t.name)){let i=e.target.value,s=this.selectedItems[0].getAttribute("@"+t.name);if(s.startsWith("{")){let l=JSON.parse(s);l.relativeSignalsPath=i,this._selectedItems[0].setAttribute("@"+t.name,JSON.stringify(l))}else{let l={name:s,relativeSignalsPath:i};this._selectedItems[0].setAttribute("@"+t.name,JSON.stringify(l))}}}_hasParameters(e){return this.selectedItems[0].hasAttribute("@"+e.name)?this.selectedItems[0].getAttribute("@"+e.name).includes("parameters"):!1}_getScriptTypeColor(e){let t=this._getScriptType(e);return o.scriptTypeColors[t]??"white"}_getScriptType(e){if(e.designItem.hasAttribute("@"+e.name)){let t=e.designItem.getAttribute("@"+e.name);if(t.startsWith("{")){let i=JSON.parse(t);return"blocks"in i?"blockly":"commands"in i?"script":"js"}else return t==""?"empty":"js"}return"none"}_getEventMethodname(e){return this.selectedItems.length?this.selectedItems[0].getAttribute("@"+e.name):""}_inputMthName(e,t){let i=e.target;this.selectedItems[0].setAttribute("@"+t.name,i.value)}_ctxMenu(e,t){e.preventDefault();let i=this._getScriptType(t);if(i=="empty")this._showContextMenuAssignScript(e,t,!0);else if(i!="none"){let s=[{title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+t.name),this._bindingsRefresh()}},{title:"-"},{title:"copy",action:()=>{ze(this.selectedItems[0].getAttribute("@"+t.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+t.name,await De()),this._bindingsRefresh()}}];Ae.show(s,e)}else this._showContextMenuAssignScript(e,t,!0)}async _addEvent(e){if(e.key=="Enter"){let t=this._getDomElement("addEventInput");this._selectedItems[0].setAttribute("@"+Dt.camelToDashCase(t.value.replaceAll(" ","-")),""),t.value="",this.scrollTop=0,this.refresh()}}_createAssignScriptContextMenu(e,t){let i=[{title:"Simple Script",action:()=>{this._editEvent("script",e,t)}},{title:"Javascript",action:()=>{let l=prompt("name of function ?");l&&(this._selectedItems[0].setAttribute("@"+t.name,l),this.refresh(),this._editEvent("js",null,t))}},{title:"Blockly",action:()=>{this._editBlockly(null,t)}}],s=this._getScriptType(t);return s!="none"&&(i.push({title:"-"}),i.push({title:"remove",action:()=>{this.selectedItems[0].removeAttribute("@"+t.name),this._bindingsRefresh()}})),s!="empty"&&i.push({title:"-"},{title:"copy",action:()=>{ze(this.selectedItems[0].getAttribute("@"+t.name))}},{title:"paste",action:async()=>{this.selectedItems[0].setAttribute("@"+t.name,await De()),this._bindingsRefresh()}}),i}async _showContextMenuAssignScript(e,t,i){e.preventDefault();let s=this._getScriptType(t);if(s!="none"&&s!="empty"&&!i)this._editEvent(s,e,t);else{let l=this._createAssignScriptContextMenu(e,t);Ae.show(l,e)}}async _editParameter(e,t){let i=new ie,s={};i.title="ParameterEditor for '"+t.name+"' of '"+t.designItem.name+"'";let l=t.designItem.getAttribute("@"+t.name);if(l&&l[0]=="{")try{s=JSON.parse(l).parameters}catch{}if(i.setParametersObject(s),await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let n=i.getParametersObject(),a={name:l,parameters:n};l&&l[0]=="{"&&(a=JSON.parse(l),a.parameters=n),n==null&&delete a.parameters;let c=JSON.stringify(a);t.designItem.setAttribute("@"+t.name,c),this._bindingsRefresh()}}async _editBlockly(e,t){let i=new Y(this._blocklyToolbox);i.title="Blockly Script for '"+t.name+"' of '"+t.designItem.name+"'";let s=t.designItem.getAttribute("@"+t.name),l=null,r=null;if(s){let a=JSON.parse(s);l=a.parameters,r=a.relativeSignalsPath,i.load(a)}if(await this._visualizationShell.openConfirmation(i,{x:100,y:100,width:700,height:500})){let a=i.save();l&&(a.parameters=l),r&&(a.relativeSignalsPath=r),t.designItem.setAttribute("@"+t.name,JSON.stringify(a)),this._bindingsRefresh()}}async _editJavascript(e,t){}async _editSimpleScript(e,t){let i=t.designItem.getAttribute("@"+t.name);if(!i||i.startsWith("{")){let s={commands:[]},l=null,r=null;i&&(s=JSON.parse(i),l=s.parameters,r=s.relativeSignalsPath);let n=new te;if(n.serviceContainer=t.designItem.serviceContainer,n.instanceServiceContainer=t.designItem.instanceServiceContainer,n.scriptCommandsTypeInfo=this._scriptCommandsTypeInfo,n.propertiesTypeInfo=this._propertiesTypeInfo,n.visualizationShell=this._visualizationShell,n.visualizationHandler=this._visualizationHandler,this._commandDescriptions&&(n.commandDescriptions={...n.commandDescriptions,...this._commandDescriptions}),n.loadScript(s),n.title="Script '"+t.name+"' on "+t.designItem.name,await this._visualizationShell.openConfirmation(n,{title:n.title,width:600,height:500})){let c=n.getScriptCommands();if(c&&c.length){let p={commands:c};l&&(p.parameters=l),r&&(p.relativeSignalsPath=r);let d=JSON.stringify(p);t.designItem.setAttribute("@"+t.name,d),this._bindingsRefresh()}}}}async _editEvent(e,t,i){e=="js"?this._editJavascript(t,i):e=="blockly"?this._editBlockly(t,i):this._editSimpleScript(t,i)}refresh(){this._selectedItems!=null&&this._selectedItems.length?this.events=this._selectedItems[0].serviceContainer.getLastServiceWhere("eventsService",e=>e.isHandledElementFromEventsService(this._selectedItems[0])).getPossibleEvents(this._selectedItems[0]).map(e=>({...e,designItem:this._selectedItems[0]})):this.events=[],this._bindingsRefresh()}get selectedItems(){return this._selectedItems}set selectedItems(e){this._selectedItems!=e&&(this._selectedItems=e,this.refresh())}};customElements.define(me.is,me);import{TypedEvent as Lt,cssFromString as Le}from"@node-projects/base-custom-webcomponent";import{BindingTarget as f}from"@node-projects/web-component-designer/dist/elements/item/BindingTarget.js";import{PropertiesHelper as I}from"@node-projects/web-component-designer/dist/elements/services/propertiesService/services/PropertiesHelper.js";var se="bind-prop:",le="bind-attr:",ce="bind-class:",pe="bind-css:",ne="bind-cssvar:",J="bind-content:",xe="bind-visible:",je="bind(",jt="--tmpBinding_",as=/{{(.*)}}/;function de(o){return o.constructor?.elementProperties!=null}function _e(o){let e=[],t=[],i=0;for(let s=0;s<o.length;s++)o[s]=="{"?(e.push(o.substring(i,s)),i=s+1):o[s]=="}"&&(t.push(o.substring(i,s)),i=s+1);return e.push(o.substring(i)),{parts:e,signals:t}}function Me(o,e,t,i){let s=!0,l=0,r=()=>{let a=++l,c=o.valueProvider(e,t);c instanceof Promise?c.then(p=>s&&a===l&&i(p)):s&&i(c)};r(),o.valueChangedCallbacks||(o.valueChangedCallbacks=new Map);let n=o.valueChangedCallbacks.get(e);return n||(n=[],o.valueChangedCallbacks.set(e,n)),n.push(r),()=>{s=!1;let a=n.indexOf(r);a>=0&&n.splice(a,1),n.length===0&&o.valueChangedCallbacks.get(e)===n&&o.valueChangedCallbacks.delete(e)}}function Pt(o,e){let t=e.split("."),i=o;for(let s of t){if(i==null||typeof i!="object")return;i=i[s]}return i}function ge(o,e,t,i,s=!1){let l=s&&t.includes("."),r=l?()=>Pt(e,t):()=>e[t];if(i(r()),l)return()=>{};let n=()=>i(r()),a=o.getChangedEventName(e,t);return e.addEventListener(a,n),()=>e.removeEventListener(a,n)}function We(o,e,t){t(o.getAttribute(e));let i=new MutationObserver(()=>t(o.getAttribute(e)));return i.observe(o,{attributes:!0,attributeFilter:[e]}),()=>i.disconnect()}var we=class{bindingsHelper;parts;signals;values;unsubscribeTargetValue;cleanupCalls=[];combinedName;disposed=!1;valueChangedCb;visualizationHandler;element;relativeSignalPath;constructor(e,t,i,s,l,r,n,a){this.bindingsHelper=e,this.visualizationHandler=t,this.valueChangedCb=s,this.element=l,this.relativeSignalPath=r,this.parseIndirectBinding(i),this.values=new Array(this.signals.length);let c=(p,d,g)=>{let u,m=()=>{},y=_=>{let w=_;if(typeof w=="string"&&w[0]==="."&&(w=t.getNormalizedSignalName(w,r,l)),w!==u)if(m(),u=w,typeof w=="string"){let C=(z,P)=>this.handleValueChanged(P.val,g);m=e.subscribeToState(w,C)}else m=()=>{}};this.cleanupCalls.push(ge(e,p,d,y,!0)),this.cleanupCalls.push(()=>m())};try{for(let p=0;p<this.signals.length;p++){let d=this.signals[p];if(d.startsWith("?@")||d.startsWith("#@")){let g=d[0]==="?"?n:l;this.cleanupCalls.push(We(g,d.substring(2),u=>this.handleValueChanged(u,p)))}else if(d.startsWith("??")||d.startsWith("##")||d.startsWith("?$")||d.startsWith("#$")){let g=d[0]==="?"?n:l;this.cleanupCalls.push(ge(e,g,d.substring(2),u=>this.handleValueChanged(u,p),!0))}else if(d[0]==="\xA7"){let g=d.substring(1);if(!a)throw new Error(`No special value handler registered for "${d}"`);this.cleanupCalls.push(Me(a,g,{element:l,relativeSignalPath:r,root:n},u=>this.handleValueChanged(u,p)))}else if(d[0]==="?"||d[0]==="#")c(d[0]==="?"?n:l,d.substring(1),p);else{let g=(u,m)=>this.handleValueChanged(m.val,p);this.cleanupCalls.push(e.subscribeToState(d,g))}}}catch(p){throw this.dispose(),p}}parseIndirectBinding(e){let{parts:t,signals:i}=_e(e);this.parts=t,this.signals=i;for(let s=0;s<i.length;s++)i[s][0]=="."&&(i[s]=this.visualizationHandler.getNormalizedSignalName(i[s],this.relativeSignalPath,this.element))}handleValueChanged(e,t){if(this.disposed)return;this.values[t]=e;let i=this.parts[0];for(let s=0;s<this.parts.length-1;s++){let l=this.values[s];if(l==null)return;i+=l+this.parts[s+1]}if(i[0]=="."&&(i=this.visualizationHandler.getNormalizedSignalName(i,this.relativeSignalPath,this.element)),this.combinedName!=i&&(this.unsubscribeTargetValue&&this.unsubscribeTargetValue(),!this.disposed)){this.combinedName=i;let s=(l,r)=>this.valueChangedCb(r);this.unsubscribeTargetValue=this.bindingsHelper.subscribeToState(i,s)}}dispose(){this.disposed=!0,this.unsubscribeTargetValue&&(this.unsubscribeTargetValue(),this.unsubscribeTargetValue=null);for(let e of this.cleanupCalls)e();this.cleanupCalls.length=0}setState(e){!this.disposed&&this.combinedName&&this.visualizationHandler.setState(this.combinedName,e)}},Pe=class o{_visualizationHandler;namedConverterCallback;_stateSubscriptions=new Map;_scheduledUpdates=new Set;_updateFlushScheduled=!1;_compiledConverters=new WeakMap;constructor(e){this._visualizationHandler=e}scheduleUpdate(e){this._scheduledUpdates.add(e),!this._updateFlushScheduled&&(this._updateFlushScheduled=!0,queueMicrotask(()=>{this._updateFlushScheduled=!1;let t=[...this._scheduledUpdates];this._scheduledUpdates.clear();for(let i of t)i()}))}getChangedEventName(e,t){let i=t.indexOf("::");if(i>=0)return t.substring(i+2);if(e instanceof HTMLInputElement||e instanceof HTMLSelectElement)return"change";let s=I.camelToDashCase(t);return de(e)?s:s+"-changed"}getParsedTargetName(e,t){return t===f.cssvar||t===f.class?o.dotToCamelCase(e):t===f.attribute?e:I.dashToCamelCase(e)}parseBinding(e,t,i,s,l){let r=t.substring(l.length);if(s===f.cssvar&&(r="--"+r),!i.startsWith("{")){let a={signal:i,target:s};if(i[0]==="="){if(i=i.substring(1),a.signal=i,i.includes("::")){let c=i.split("::");i=c[0],a.signal=i,a.events=c[1].split(",")}a.twoWay=!0,a.events||(a.events=[this.getChangedEventName(e,r)],!(e instanceof HTMLInputElement)&&!(e instanceof HTMLSelectElement)&&!de(e)&&(a.maybeLitElement=!0,a.litEventNames=a.events))}if(i[0]==="!"&&(a.signal=i.substring(1),a.inverted=!0),a.signal.includes(";")){let c=a.signal.split(";");a.expression=c.pop(),a.signal=c.join(";")}return[this.getParsedTargetName(r,s),a]}let n=JSON.parse(i);return n.target=s,n.twoWay&&(n.events==null||n.events.length==0)&&(n.events=[this.getChangedEventName(e,r)]),[this.getParsedTargetName(r,s),n]}serializeBinding(e,t,i){let s={...i};delete s.type,i.twoWay?i.events!=null&&i.events.length==1&&((e instanceof HTMLInputElement||e instanceof HTMLSelectElement)&&i.events?.[0]=="change"||de(e)&&i.events?.[0]==t||!de(e)&&i.events?.[0]==t+"-changed")&&delete s.events:(delete s.events,delete s.expressionTwoWay);let l=s.twoWay&&s.events?.length>0?"::"+s.events.join(","):"",r=l!==""&&!!i.expression?.includes("::")||!!i.expressionTwoWay?.includes("::")||i.signal.trim()[0]=="{",n=i.target==f.property||i.target==f.attribute||i.target==f.class||i.target==f.css||i.target==f.cssvar,a=!r&&n&&!i.expressionTwoWay&&i.converter==null&&!i.historic&&!i.writeBackSignal;if(a&&!i.expression){let c=this.getShortBindingAttributeName(t,i.target,!1),d=((i.target==f.property||i.target==f.attribute)&&i.twoWay?"=":"")+(i.inverted?"!":"")+i.signal+(!i.twoWay&&i.signal.includes(";")?";":"")+l;return[c,d]}if(a&&i.expression&&!i.expression.includes(`
|
|
1292
|
+
`)&&!i.expression.includes(";")){let c=this.getShortBindingAttributeName(t,i.target,!0),d=((i.target==f.attribute||i.target==f.property&&t!="textContent"&&t!="innerHTML")&&i.twoWay?"=":"")+(i.inverted?"!":"")+i.signal+";"+i.expression+l;return[c,d]}return(i.inverted===null||i.inverted===!1)&&delete s.inverted,(i.expression===null||i.expression==="")&&delete s.expression,(i.expressionTwoWay===null||i.expressionTwoWay==="")&&delete s.expressionTwoWay,(i.twoWay===null||i.twoWay===!1)&&delete s.twoWay,delete s.target,i.historic||delete s.historic,[this.getJsonBindingAttributeName(t,i.target),JSON.stringify(s)]}getShortBindingAttributeName(e,t,i){return t==f.property&&e=="textContent"?J+"text":t==f.property&&e=="innerHTML"?J+"html":t==f.attribute?le+I.camelToDashCase(e):t==f.class?ce+I.camelToDashCase(e):t==f.css?pe+I.camelToDashCase(e):t==f.cssvar?i?ne+I.camelToDashCase(e):ne+o.camelToDotCase(e.substring(2)):se+I.camelToDashCase(e)}getJsonBindingAttributeName(e,t){return t==f.content||t==f.property&&e=="innerHTML"?J+"html":t==f.property&&e=="textContent"?J+"text":t==f.attribute?le+I.camelToDashCase(e):t==f.class?ce+o.camelToDotCase(e):t==f.css?pe+I.camelToDashCase(e):t==f.cssvar?ne+o.camelToDotCase(e.substring(2)):se+I.camelToDashCase(e)}getBindingAttributeName(e,t,i){return i==f.attribute?le+I.camelToDashCase(t):i==f.class?ce+o.camelToDotCase(t):i==f.css?pe+I.camelToDashCase(t):i==f.visible?xe:i==f.cssvar?ne+o.camelToDotCase(t):i==f.property&&t=="innerHTML"?J+"html":i==f.property&&t=="textContent"?J+"text":se+I.camelToDashCase(t)}*getBindings(e){if(e.attributes)for(let t of e.attributes)t.name.startsWith(se)?yield this.parseBinding(e,t.name,t.value,f.property,se):t.name.startsWith(J)?yield this.parseBinding(e,t.name==="bind-content:html"?"bind-prop:inner-h-t-m-l":"bind-prop:text-content",t.value,f.property,se):t.name.startsWith(le)?yield this.parseBinding(e,t.name,t.value,f.attribute,le):t.name.startsWith(ce)?yield this.parseBinding(e,t.name,t.value,f.class,ce):t.name.startsWith(pe)?yield this.parseBinding(e,t.name,t.value,f.css,pe):t.name.startsWith(ne)?yield this.parseBinding(e,t.name,t.value,f.cssvar,ne):t.name.startsWith(xe)&&(yield this.parseBinding(e,t.name,t.value,f.visible,xe))}applyAllBindings(e,t,i,s,l){let r=[],n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT),a=n.nextNode();for(;a;){let c=this.getBindings(a);for(let p of c)try{let d=this.applyBinding(a,p,t,i,s),g=!1,u=()=>{g||(g=!0,d())};if(r.push(u),p[1].maybeLitElement&&a.localName.includes("-")&&!customElements.get(a.localName)){let m=a,y=p;customElements.whenDefined(a.localName).then(()=>{!g&&de(m)&&(g=!0,d(),y[1].events=y[1].litEventNames,r.push(this.applyBinding(m,y,t,i,s)))})}}catch(d){console.warn("error applying binding",a,p,d)}if(l&&l(a)){let p=n.nextSibling();for(;!p&&a;)a=n.parentNode(),p=n.nextSibling();a=p}else a=n.nextNode()}return r}static#e=0;async parseCssBindings(e,t,i,s){if(!e.includes(je))return[Le(e),[]];let l=await import("@node-projects/css-parser"),r=l.parse(e),n=[];for(let c of r.stylesheet.rules)if(c.type===l.CssTypes.rule){for(let p of c.declarations)if(p.type===l.CssTypes.declaration&&p.value.includes(je)){let d=this.parseCssBinding(p.value,t,i,s);p.value=d[0],n.push(...d[1])}}let a=l.stringify(r,{indent:"",compress:!0});return[Le(a),n]}parseCssBinding(e,t,i,s,l){e=e.trim();let r="",n="",a=!1,c="",p=!1,d=null,g=[];for(let u=0;u<e.length;u++){let m=e[u];if(a)if(p)c+=m,p=!1;else if(d&&m==="\\")p=!0;else if(m===d)d=null;else if(d===null&&m===")"){let y=o.#e++,_=jt+y,w=[_,{signal:c,target:f.cssvar}];c.startsWith("{")&&(w=JSON.parse(c)),g.push(this.applyBinding(t,w,i,s,l)),r+="var("+_+")",a=!1,c=""}else c+=m;else m==="("?(n!=="bind"?(r+=n,r+=m):(a=!0,e[u+1]==="'"||e[u+1]==='"'?(u++,d=e[u]):d=null),n=""):m===" "||m===","||m==="("||m==="+"||m==="-"||m==="*"||m==="/"?(r+=n+m,n=""):n+=m}return[r+n,g]}subscribeToState(e,t){let i=this._stateSubscriptions.get(e);if(i){if(i.callbacks.add(t),i.hasValue){let l=i.value;queueMicrotask(()=>i.callbacks.has(t)&&t(e,l))}}else{i={callbacks:new Set([t]),callback:null,subscriptionResult:null,revision:0,hasValue:!1},i.callback=(l,r)=>{i.revision++,i.hasValue=!0,i.value=r;for(let n of i.callbacks)n(l,r)},this._stateSubscriptions.set(e,i);try{i.subscriptionResult=this._visualizationHandler.subscribeState(e,i.callback);let l=i.revision;this._visualizationHandler.getState(e).then(r=>{this._stateSubscriptions.get(e)===i&&i.revision===l&&i.callback(e,r)})}catch(l){throw this._stateSubscriptions.delete(e),i.subscriptionResult!=null&&this._visualizationHandler.unsubscribeState(e,i.callback,i.subscriptionResult),l}}let s=!0;return()=>{s&&(s=!1,i.callbacks.delete(t),i.callbacks.size===0&&this._stateSubscriptions.get(e)===i&&(this._stateSubscriptions.delete(e),this._visualizationHandler.unsubscribeState(e,i.callback,i.subscriptionResult)))}}applyBinding(e,t,i,s,l){let r=[],n=!0,a=()=>{if(n){n=!1,this._scheduledUpdates.delete(X);for(let h=r.length-1;h>=0;h--)r[h]();r.length=0}},c=h=>r.push(h),p=t[1].signal.split(";"),d=new Array(p.length);for(let h=0;h<p.length;h++){let b=p[h];d[h]="__"+h;let v=b.indexOf(":");v>=0&&(d[h]=b.substring(0,v),b=b.substring(v+1),p[h]=b)}let g=new Array(p.length),u=[...d,"__res","__ctx"];t[1].expression&&!t[1].compiledExpression&&(t[1].compiledExpression=t[1].expression.includes("return ")?new Function(u,t[1].expression):new Function(u,"return "+t[1].expression));let m=this.getCompiledConverter(t[1],u),y={element:e,root:s,boundNames:t[1].signal,boundTargetName:t[0],boundTargetType:t[1].target},_=this.createTargetWriter(e,t),w=t[1].writeBackSignal;w?.[0]==="."&&(w=i+w);let C,z,P,G=!1,q=!1,M=!1,X=()=>{if(M=!1,!n)return;let h=C;t[1].compiledExpression&&(h=t[1].compiledExpression(...g,z,y),z=h),t[1].converter&&(typeof t[1].converter=="string"?h=this.namedConverterCallback(t[1].converter,h,e,t):h=this.applyCompiledConverter(h,m,g,z,y,t[1].converterDefault)),t[1].inverted&&(h=!h),q=!0,!(G&&(h===null||typeof h!="object")&&Object.is(P,h))&&(G=!0,P=h,w&&this._visualizationHandler.setState(w,h,!0),_(h))},B=(h,b,v)=>{n&&(!v&&b===0&&(h=o.parseValueWithType(h,t)),g[b]=h,C=h,!q&&p.length===1?X():M||(M=!0,this.scheduleUpdate(X)))},L=new Array(p.length),oe=(h,b)=>(L[h]=b,()=>{L[h]===b&&(L[h]=null)}),k=(h,b,v)=>{let V=oe(v,S=>h[b]=S),A=ge(this,h,b,S=>B(S,v,!1));return()=>{A(),V()}},N=(h,b,v)=>{let V=oe(v,S=>S==null?h.removeAttribute(b):h.setAttribute(b,S)),A=We(h,b,S=>B(S,v,!1));return()=>{A(),V()}},E=(h,b)=>{if(h.startsWith("?@")||h.startsWith("#@")){let x=h[0]==="?"?s:e;return x?N(x,h.substring(2),b):()=>{}}if(h.startsWith("?$")||h.startsWith("#$")){let x=h[0]==="?"?s:e;return x?k(x,h.substring(2),b):()=>{}}if(h[0]==="?"||h[0]==="#"){let x=h[0]==="?"?s:e;return x?k(x,h.substring(1),b):()=>{}}if(h[0]==="$"){let x=h.substring(1);x[0]==="."&&(x=this._visualizationHandler.getNormalizedSignalName(x,i,e));let D=!0;return this._visualizationHandler.getObject(x).then(R=>{D&&B(R,b,!0)}),()=>D=!1}if(h[0]==="\xA7"){if(!l)throw new Error(`No special value handler registered for "${h}"`);return Me(l,h.substring(1),{element:e,binding:t,relativeSignalPath:i,root:s},x=>B(x,b,!0))}if(h.includes("{")){let x=new we(this,this._visualizationHandler,h,R=>B(R.val,b,!1),e,i,s,l),D=oe(b,R=>x.setState(R));return()=>{x.dispose(),D()}}let v=h;if(v[0]==="."&&(v=this._visualizationHandler.getNormalizedSignalName(v,i,e)),t[1].historic){let x=t[1].historic;if(x.reloadInterval){let R=!0,W=null,F=async()=>{let et=await this._visualizationHandler.getHistoricData(v,x);!n||!R||(B(et?.values,b,!0),W=setTimeout(F,x.reloadInterval))};return F(),()=>{R=!1,W!==null&&clearTimeout(W),W=null}}let D=!0;return this._visualizationHandler.getHistoricData(v,x).then(R=>{D&&B(R?.values,b,!0)}),()=>D=!1}let V=(x,D)=>B(D?.val,b,!1),A=this.subscribeToState(v,V),S=oe(b,x=>this._visualizationHandler.setState(v,x));return()=>{A(),S()}},O=(h,b)=>{if(h.startsWith("?@")||h.startsWith("#@")||h.startsWith("?$")||h.startsWith("#$"))return E(h,b);let v=h[0];if(v!=="?"&&v!=="#"||h[1]===v)return E(h[1]===v?h.substring(1):h,b);let V=v==="?"?s:e;if(!V)return()=>{};let A=h.substring(1),S=()=>{},x,R=ge(this,V,A,W=>{let F=typeof W=="string"?W:null;F!==x&&(S(),x=F,S=F?E(F,b):()=>{})});return()=>{R(),S()}};try{t[1].twoWay&&c(this.addTwoWayBinding(t,e,h=>L[0]?.(h)));for(let h=0;h<p.length;h++)typeof p[h]=="string"&&c(O(p[h],h))}catch(h){throw a(),h}return a}addTwoWayBinding(e,t,i){e[1].expressionTwoWay&&!e[1].compiledExpressionTwoWay&&(e[1].compiledExpressionTwoWay=e[1].expressionTwoWay.includes("return ")?new Function(["value"],e[1].expressionTwoWay):new Function(["value"],"return "+e[1].expressionTwoWay));let s=[],l=()=>{let r=e[1].target==f.attribute?t.getAttribute(e[0]):t[e[0]];r=o.parseValueWithType(r,e),e[1].compiledExpressionTwoWay&&(r=e[1].compiledExpressionTwoWay(r)),i(r)};for(let r of e[1].events??[]){let n=t[r];if(n instanceof Lt){let a=n.on(l);s.push(()=>a.dispose())}else t.addEventListener(r,l),s.push(()=>t.removeEventListener(r,l))}return()=>{for(let r of s)r();s.length=0}}static parseValueWithType(e,t){if(t[1].type)switch(t[1].type){case"number":return parseFloat(e);case"boolean":return e===!0||e==="true"||!!parseInt(e);case"string":return e?.toString();case"integer":return parseInt(e)}return e}compileConverter(e,t){let i=new Map,s=[],l=r=>{if(typeof r!="string")return{value:r};let n=new Function(t,"return `"+r+"`");return{value:r,evaluate:(a,c,p)=>n(...a,c,p)}};for(let r in e){let n=l(e[r]);if(i.set(r,n),r.startsWith(">=")){let a=parseFloat(r.substring(2));s.push({matches:c=>c>=a,value:n})}else if(r.startsWith("<=")){let a=parseFloat(r.substring(2));s.push({matches:c=>c<=a,value:n})}else if(r[0]===">"){let a=parseFloat(r.substring(1));s.push({matches:c=>c>a,value:n})}else if(r[0]==="<"){let a=parseFloat(r.substring(1));s.push({matches:c=>c<a,value:n})}else{let a=r.split("-");if(a.length>1){let c=a[0]===""?null:parseFloat(a[0]),p=a[1]===""?null:parseFloat(a[1]);s.push({matches:d=>(c===null||d>=c)&&(p===null||p>=d),value:n})}}}return{exactValues:i,conditions:s}}getCompiledConverter(e,t){if(!e.converter||typeof e.converter!="object")return null;let i=t.join("\0"),s=this._compiledConverters.get(e);if(s?.converter===e.converter&&s.argumentsKey===i)return s.compiled;let l=this.compileConverter(e.converter,t);return this._compiledConverters.set(e,{converter:e.converter,argumentsKey:i,compiled:l}),l}applyCompiledConverter(e,t,i,s,l,r){let n=String(e),a=t.exactValues.get(n),c=t.exactValues.has(n);if(!c){let p=parseFloat(e);for(let d of t.conditions)if(d.matches(p)){a=d.value,c=!0;break}}return c?a.evaluate?a.evaluate(i,s,l):a.value:r!==void 0?r:e}createTargetWriter(e,t){let i=t[0];switch(t[1].target){case f.property:return s=>e[i]=s;case f.attribute:return s=>{typeof s=="boolean"?s?e.setAttribute(i,""):e.removeAttribute(i):e.setAttribute(i,s)};case f.css:return s=>e.style[i]=s;case f.cssvar:return s=>e.style.setProperty(i,s);case f.class:return s=>e.classList.toggle(i,!!s);case f.visible:return s=>e.style.visibility=s?"":"collapse";default:return()=>{}}}static camelToDotCase(e){return e.replace(/([A-Z])/g,t=>`.${t[0].toLowerCase()}`)}static dotToCamelCase(e){return e.replace(/\.([a-z])/g,t=>t[1].toUpperCase())}};var Fe=class{name;relativeSignalsPath;commands;parameters};import{deepValue as U,setDeepValue as He,sleep as Mt}from"@node-projects/web-component-designer/dist/elements/helper/Helper.js";import ae from"long";var fe="cyclic",Wt={pointerdown:"pointerup",pointerenter:"pointerleave",mouseenter:"mouseleave",mouseover:"mouseout",focus:"blur",focusin:"focusout",keydown:"keyup"},Je=class{_visualizationHandler;_subscriptionCallback=()=>{};constructor(o){this._visualizationHandler=o}async execute(o,e){let t=-1,i=!1,s=!1,l=e.event?.type,r=l?Wt[l]:null;if(r){let n=e.element;l=="pointerdown"&&(n=window),n.addEventListener(r,()=>{i=!0},{once:!0})}for(let n=0;n<o.length;n++){let a=o[n];if(a.type=="Exit"){s=!0;break}else if(a.type=="If"){let p=(await this.evaluateIfFormula(a,e)?a.trueCommands:a.elseCommands)??[];if(!await this.execute(p,e)){s=!0;break}}else if(a.type=="Goto"){let c=await this.getValue(a.label,e);if(n=o.findIndex(p=>p.type=="Label"&&p.label==c),n<0)break}else if(a.type=="Condition"){let c=await this.getValue(a.value1,e),p=await this.getValue(a.value2,e),d=await this.getValue(a.comparisonType,e),g=!1;switch(d){case"==null":g=c==null;break;case"!=null":g=c!=null;break;case"==true":g=c==!0;break;case"==false":g=c==!1;break;case"==":g=c==p;break;case"!=":g=c!=p;break;case">":g=c>p;break;case"<":g=c<p;break;case">=":g=c>=p;break;case"<=":g=c<=p;break;case"&&":g=c&&p;break;case"||":g=c||p;break}if(g){await this.runExternalScript(await this.getValue(a.trueScriptName,e),await this.getValue(a.trueScriptType,e));let u=await this.getValue(a.trueGotoLabel,e);if(u&&(n=o.findIndex(m=>m.type=="Label"&&m.label==u),n<0))break}else{await this.runExternalScript(await this.getValue(a.falseScriptName,e),await this.getValue(a.falseScriptType,e));let u=await this.getValue(a.falseGotoLabel,e);if(u&&(n=o.findIndex(m=>m.type=="Label"&&m.label==u),n<0))break}}else if(a.type=="Repeat"){let c=await this.getValue(a.label,e),p=await this.getValue(a.count,e);if(await this.getValue(a.mode,e)=="eventValid"&&i){i=!1;continue}if(p!=0&&t==-1&&(t=p-1),t==0||(t>0&&t--,n=-1,c&&(n=o.findIndex(g=>g.type=="Label"&&g.label==c),n<0)))continue}else if(!await this.runScriptCommand(a,e)){s=!0;break}}return!s}async getValueFromTarget(o,e,t){return o==="property"?U(t.root,e):o==="elementProperty"?U(t.element,e):(await this._visualizationHandler.getState(this.getSignalName(e,t)))?.val}async setValueOnTarget(o,e,t,i){o==="property"?He(t.root,e,i):o==="elementProperty"?He(t.element,e,i):await this._visualizationHandler.setState(this.getSignalName(e,t),i)}async runExternalScript(o,e){}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 o=await this.getValue(command.value??500,context);await Mt(o);break}case"Console":{let o=await this.getValue(command.target??"log",context),e=await this.getValue(command.message,context);console[o](e);break}case"ToggleSignalValue":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.target,context),t=await this.getValueFromTarget(e,o,context);await this._visualizationHandler.setState(this.getSignalName(o,context),!t);break}case"ToggleSignalValueThroughList":{let o=await this.getValue(command.valueList,context),e=await this.getValue(command.signal,context),t=await this.getValue(command.target,context),i=await this.getValueFromTarget(t,e,context),s=o.indexOf(i)+1;s>=o.length&&(s=0);let l=o[s];await this._visualizationHandler.setState(this.getSignalName(e,context),l);break}case"SetSignalValue":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.target,context);await this.setValueOnTarget(e,o,context,await this.getValue(command.value,context));break}case"IncrementSignalValue":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.target,context),i=await this.getValueFromTarget(e,o,context)+await this.getValue(command.value,context);await this.setValueOnTarget(e,o,context,i);break}case"DecrementSignalValue":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.target,context),i=await this.getValueFromTarget(e,o,context)-await this.getValue(command.value,context);await this.setValueOnTarget(e,o,context,i);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 o=await this.getValue(command.signal,context),e=await this.getValue(command.bitNumber??0,context),t=await this.getValue(command.target,context),i=await this.getValueFromTarget(t,o,context),s=ae.fromNumber(1).shiftLeft(e),l=ae.fromNumber(i).or(s).toNumber();await this.setValueOnTarget(t,o,context,l);break}case"ClearBitInSignal":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.bitNumber??0,context),t=await this.getValue(command.target,context),i=await this.getValueFromTarget(t,o,context),s=ae.fromNumber(1).shiftLeft(e);s.negate();let l=ae.fromNumber(i).and(s).toNumber();await this.setValueOnTarget(t,o,context,l);break}case"ToggleBitInSignal":{let o=await this.getValue(command.signal,context),e=await this.getValue(command.bitNumber??0,context),t=await this.getValue(command.target,context),i=await this.getValueFromTarget(t,o,context),s=ae.fromNumber(1).shiftLeft(e),l=ae.fromNumber(i).xor(s).toNumber();await this.setValueOnTarget(t,o,context,l);break}case"Javascript":{let o=await this.getValue(command.script,context),e=context;e.shadowRoot=context.element.getRootNode(),e.instance=context.shadowRoot.host,command.compiledScript||(command.compiledScript=new Function("context",o)),command.compiledScript(e);break}case"SetElementProperty":{command=Q.upgradeSetElementProperty(command);let o=await this.getValue(command.name,context);o===""&&(o=null);let e=await this.getValue(command.value,context),t=await this.getValue(command.parentIndex??0,context),i=await this.getValue(command.target??"property",context),s=await this.getValue(command.targetSelectorTarget??"container",context),l=await this.getValue(command.targetSelector,context),r=await this.getValue(command.mode??"toggle",context),n=this.getTargetFromTargetSelector(context,s,t,l);for(let a of n)i=="attribute"?a.setAttribute(o,e):i=="property"?a[o]=e:i=="css"?a.style[o]=e:i=="class"&&(r==="toggle"?a.classList.toggle(o??e):r==="remove"?a.classList.remove(o??e):a.classList.add(o??e));break}case"SubscribeSignal":{let o=await this.getValue(command.signal,context);if(await this.getValue(command.oneTime,context)){let t=()=>{this._visualizationHandler.unsubscribeState(o,t,null)};this._visualizationHandler.subscribeState(o,t)}else this._visualizationHandler.subscribeState(o,this._subscriptionCallback);break}case"UnsubscribeSignal":{let o=await this.getValue(command.signal,context);this._visualizationHandler.unsubscribeState(o,this._subscriptionCallback,null);break}case"WriteSignalsInGroup":{let o=await this.getValue(command.group,context);this._visualizationHandler.writeSignalsInGroup(o);break}case"ClearSignalsInGroup":{let o=await this.getValue(command.group,context);this._visualizationHandler.clearSignalsInGroup(o);break}case"RunScript":{let o=await this.getValue(command.name,context),e=await this.getValue(command.scriptType,context);this.runExternalScript(o,e);break}case"ShowMessageBox":{let o=null,e=await this.getValue(command.exitScriptOnCancel,context);if(await this.getValue(command.buttons,context)=="yesNo"){let s=await this.getValue(command.message,context);confirm(s)?o=1:o=2}else{let s=await this.getValue(command.message,context);alert(s),o=1}let i=await this.getValue(command.resultSignal,context);if(i&&this._visualizationHandler.setState(i,o),e&&o!=1)return!1;break}case"ShowPrompt":{let o=await this.getValue(command.message,context),e=await this.getValue(command.default,context),t=prompt(o,e),i=await this.getValue(command.resultSignal,context);i&&t&&this._visualizationHandler.setState(i,t);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(o,e,t){if(e==="container"){let i=o.element.getRootNode().host;for(let s=0;s<(t??0);s++)i=i.getRootNode().host;return i}else if(e==="element"){let i=o.element;for(let s=0;s<(t??0);s++)i=i.parentElement;return i}return null}getTargetFromTargetSelector(o,e,t,i){let s=this.getTarget(o,e,t),l=[s];return i&&(e==="container"?l=s.shadowRoot.querySelectorAll(i):l=s.querySelectorAll(i)),l}async getValue(value,outerContext){if(value==null)return null;if(typeof value=="object")switch(value.source){case"property":return U(outerContext.root,value.name);case"elementProperty":return U(outerContext.element,value.name);case"signal":return(await this._visualizationHandler.getState(this.getSignalName(value.name,outerContext)))?.val;case"signalInProperty":{let o=U(outerContext.root,value.name);return(await this._visualizationHandler.getState(this.getSignalName(o,outerContext)))?.val}case"event":{let o=outerContext.event;return value.name&&(o=U(o,value.name)),o}case"parameter":return outerContext.parameters[value.name];case"context":return U(outerContext,value.name);case"complexString":{let o=value.name;return o!=null?await this.parseStringWithValues(o,outerContext):null}case"complexSignal":{let o=value.name;if(o!=null){let e=await this.parseStringWithValues(o,outerContext);return(await this._visualizationHandler.getState(this.getSignalName(e,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(o,e){let t=_e(o),i=await Promise.all(t.signals.map(l=>this.getStateOrFieldOrParameter(this.getSignalName(l,e),e))),s=t.parts[0];for(let l=0;l<t.parts.length-1;l++){let r=i[l];typeof r=="object"&&(r=r.val),r==null&&(r=""),s+=r+t.parts[l+1]}return s}async evaluateIfFormula(o,e){let t=o.signals??[],i=t.map((r,n)=>r.varName?.trim()||"__"+n),s=await Promise.all(t.map(r=>this.getValue(r,e))),l=await this.getValue(o.formula,e);return(!o.compiledFormula||o._compiledFormulaSrc!==l)&&(o.compiledFormula=new Function(...i,"return ("+l+");"),o._compiledFormulaSrc=l),!!o.compiledFormula(...s)}getSignalName(o,e){return o[0]==="."?e.relativeSignalsPath+o:o}createScriptContext(o,e,t,i,s){return{root:o,event:e,element:t,parameters:i,relativeSignalsPath:s}}async assignAllScripts(o,e,t,i,s,l,r,n){l??=this.createScriptContext;let a=await this.loadAndInitJsObject(o,e,t,i,n);for(let c of t.querySelectorAll("*"))for(let p of c.attributes)if(p.name[0]==="@")try{let d=p.name.substring(1),g=p.value.trim(),u=d.startsWith(fe),m=u?parseInt(d.substring(d.indexOf(":")+1)):null,y=await this.resolveHandler(g,a,c,t,i,s,l,r,d);y&&this.bindHandler(c,d,u,m,y)}catch{console.warn("error assigning script",c,p)}return a}async loadAndInitJsObject(o,e,t,i,s){if(!e)return null;try{let r=await import(URL.createObjectURL(new Blob([e],{type:"application/javascript"})));return s?s(r):r.init?.(i,t),r}catch(l){return console.error("error parsing javascript - "+o,l),null}}async resolveHandler(o,e,t,i,s,l,r,n,a){if(o[0]!=="{")return p=>{e?.[o]?e[o](p,t,i,s):console.warn(`javascript function named: "${o}" not found, maybe missing a "export" ?`)};let c=JSON.parse(o);if("commands"in c)return p=>this.execute(c.commands,r(s,p,t,c.parameters,c.relativeSignalsPath));if("blocks"in c){let p=null;return async d=>{p??=await ke(c),p(d,i,c.parameters,c.relativeSignalsPath??"",l,r(s,d,t,c.parameters,c.relativeSignalsPath))}}if("name"in c){if(n)return n(t,a,c),null;let p=c.name;return d=>{e?.[p]?e[p](d,t,i,s,c.parameters):console.warn(`javascript function named: "${p}" not found, maybe missing a "export" ?`)}}return null}bindHandler(o,e,t,i,s){if(!t){o.addEventListener(e,s);return}let l=setInterval(()=>{o.isConnected?s(null):clearInterval(l)},i)}};import{OverlayLayer as Ft,DesignItem as $,InsertAction as Ht,BindingTarget as j,PropertyType as ye}from"@node-projects/web-component-designer";var Ue=class{constructor(e,t){this._bindingsHelper=e,this._visualizationHandler=t}_bindingsHelper;_visualizationHandler;rectMap=new Map;rect;dragEnter(e,t,i){let s=$.GetDesignItem(i);if(s&&!s.isRootItem){let l=e.getNormalizedElementCoordinates(i);this.rect=e.overlayLayer.drawRect("IobrokerWebuiBindableObjectDragDropService",l.x,l.y,l.width,l.height,"",null,Ft.Background),this.rect.style.fill="#ff0000",this.rect.style.opacity="0.3",this.rectMap.set(i,this.rect)}}dragLeave(e,t,i){let s=$.GetDesignItem(i);if(s&&!s.isRootItem){let l=this.rectMap.get(i);e.overlayLayer.removeOverlay(l),this.rectMap.delete(i)}}dragOver(e,t,i){return"copy"}async drop(e,t,i,s){for(let a of this.rectMap.values())e.overlayLayer.removeOverlay(a);this.rectMap.clear();let l=$.GetDesignItem(s),r=await this._visualizationHandler.getObject(i.fullName),n=this._visualizationHandler.getSignalInformation(r);if(l&&!l.isRootItem)if(s instanceof HTMLInputElement){let a={signal:i.fullName,target:j.property},c=this._bindingsHelper.serializeBinding(s,s.type=="checkbox"?"checked":"value",a);l.setAttribute(c[0],c[1])}else{let a={signal:i.fullName,target:j.content},c=this._bindingsHelper.serializeBinding(s,null,a);l.setAttribute(c[0],c[1])}else{let a=e.getNormalizedEventCoordinates(t),c,p,d=await this._visualizationHandler.getState(i.fullName);if(n.role==="url"&&typeof d?.val=="string")if(d.val.endsWith("jpg")||d.val.endsWith("jpeg")||d.val.endsWith("png")||d.val.endsWith("gif")||d.val.endsWith("svg")){let g=document.createElement("img");c=$.createDesignItemFromInstance(g,e.serviceContainer,e.instanceServiceContainer),p=c.openGroup("Insert");let u={signal:i.fullName,target:j.property},m=this._bindingsHelper.serializeBinding(g,"src",u);c.setAttribute(m[0],m[1]),c.element.src=d.val}else if(d.val.endsWith("mp4")){let g=document.createElement("video");c=$.createDesignItemFromInstance(g,e.serviceContainer,e.instanceServiceContainer),p=c.openGroup("Insert");let u={signal:i.fullName,target:j.property},m=this._bindingsHelper.serializeBinding(g,"src",u);c.setAttribute(m[0],m[1]),c.element.src=d.val}else{let g=document.createElement("iframe");c=$.createDesignItemFromInstance(g,e.serviceContainer,e.instanceServiceContainer),p=c.openGroup("Insert");let u={signal:i.fullName,target:j.property},m=this._bindingsHelper.serializeBinding(g,"src",u);c.setAttribute(m[0],m[1]),c.element.src=d.val}if(!c){let g=document.createElement("input");c=$.createDesignItemFromInstance(g,e.serviceContainer,e.instanceServiceContainer),p=c.openGroup("Insert");let u=n.writeable!==!1,m={signal:i.fullName,target:j.property,twoWay:u},y=this._bindingsHelper.serializeBinding(g,"value",m);n.type==="boolean"?(y=this._bindingsHelper.serializeBinding(g,"checked",m),c.setAttribute("type","checkbox")):n.role=="date"?(m.twoWay=u,y=this._bindingsHelper.serializeBinding(g,"value-as-number",m),c.setAttribute("type","date"),c.setAttribute("readonly","")):n.role=="datetime"&&(m.twoWay=u,y=this._bindingsHelper.serializeBinding(g,"value-as-number",m),c.setAttribute("type","datetime-local"),c.setAttribute("readonly","")),c.setAttribute(y[0],y[1])}c.setStyle("position","absolute"),c.setStyle("left",a.x+"px"),c.setStyle("top",a.y+"px"),e.instanceServiceContainer.undoService.execute(new Ht(e.rootDesignItem,e.rootDesignItem.childCount,c)),p.commit(),requestAnimationFrame(()=>e.instanceServiceContainer.selectionService.setSelectedElements([c]))}}dragOverOnProperty(e,t,i){return"copy"}dropOnProperty(e,t,i,s){if(t.type=="signal"){t.service.setValue(s,t,i.fullName);return}let l={signal:i.fullName,target:j.property};t.propertyType==ye.attribute&&(l.target=j.attribute),t.propertyType==ye.cssValue&&(l.target=j.css),l.signal=i.fullName,l.twoWay=t.propertyType==ye.property||t.propertyType==ye.propertyAndAttribute;let r=s[0].openGroup("drop binding");for(let n of s){let a=this._bindingsHelper.serializeBinding(n.element,t.name,l);n.setAttribute(a[0],a[1])}r.commit()}};import{BindingMode as Se,BindingTarget as $e,PropertiesHelper as Jt}from"@node-projects/web-component-designer";var Ge=class o{constructor(e){this._bindingsHelper=e}_bindingsHelper;static type="visualization-binding";getBindings(e){return Array.from(this._bindingsHelper.getBindings(e.element)).map(i=>({targetName:i[1].target===$e.css||i[1].target===$e.attribute?Jt.camelToDashCase(i[0]):i[0],target:i[1].target,mode:i[1].twoWay?Se.twoWay:Se.oneWay,invert:i[1].inverted,bindableObjectNames:i[1].signal.split(";"),expression:i[1].expression,expressionTwoWay:i[1].expressionTwoWay,converter:i[1].converter,type:o.type,service:this,changedEvents:i[1].events,historic:i[1].historic,writeBackSignal:i[1].writeBackSignal}))}setBinding(e,t){let i={signal:t.bindableObjectNames.join(";"),target:t.target};i.inverted=t.invert,i.twoWay=t.mode==Se.twoWay,i.expression=t.expression,i.expressionTwoWay=t.expressionTwoWay,i.historic=t.historic,i.type=t.type,typeof t.converters=="string"?i.converter=t.converters:Array.isArray(t.converters)&&t.converters.length>0?i.converter=Object.fromEntries(t.converters.map(r=>[r.key,r.value])):t.converters!=null&&(i.converter=t.converters),i.target=t.target,i.events=t.changedEvents;let s=this._bindingsHelper.serializeBinding(e.element,t.targetName,i),l=e.openGroup("edit_binding");return e.setAttribute(s[0],s[1]),l.commit(),!0}clearBinding(e,t,i){let s=this._bindingsHelper.getBindingAttributeName(e.element,t,i);return e.removeAttribute(s),!0}};var Ut=[{prefix:"?@",itemType:"attribute"},{prefix:"#@",itemType:"attribute"},{prefix:"?$",itemType:"signalObject"},{prefix:"#$",itemType:"signalObject"},{prefix:"??",itemType:"property"},{prefix:"##",itemType:"property"},{prefix:"?",itemType:"property"},{prefix:"#",itemType:"property"}];function qe(o){let e=Ut.find(t=>o.startsWith(t.prefix));return e?{name:o.substring(e.prefix.length),...e}:{name:o,prefix:"",itemType:"signal"}}var Xe=class{getRefactorings(e){let t=[];for(let i of e){let s=i.serviceContainer.bindingService.getBindings(i);if(s)for(let l of s)for(let r of l.bindableObjectNames)if(r.includes(":")){let n=r.split(":")[0],a=qe(r.substring(n.length+1));t.push({service:this,name:a.name,itemType:a.itemType,designItem:i,type:"binding",sourceObject:l,display:l.target+"/"+l.targetName+" - "+n+":",shortName:n,prefix:a.prefix})}else{let n=qe(r);t.push({service:this,name:n.name,itemType:n.itemType,designItem:i,type:"binding",sourceObject:l,display:l.target+"/"+l.targetName,prefix:n.prefix})}}return t}refactor(e,t,i){let s=e.sourceObject;e.shortName?s.bindableObjectNames=s.bindableObjectNames.map(l=>l==e.shortName+":"+e.prefix+t?e.shortName+":"+e.prefix+i:l):s.bindableObjectNames=s.bindableObjectNames.map(l=>l==e.prefix+t?e.prefix+i:l),e.designItem.serviceContainer.bindingService.setBinding(e.designItem,s)}};var Ye=class{dragOverOnProperty(e,t,i){return"copy"}dropOnProperty(e,t,i,s){t.service.setValue(s,t,i.text)}};import{BindingTarget as T}from"@node-projects/web-component-designer";var Ke=class{getRefactorings(e){let t=[];for(let i of e)for(let s of i.attributes())if(s[0][0]=="@"){let l=s[1];if(l[0]=="{"){let r=JSON.parse(l);if("commands"in r)for(let n of r.commands){for(let a in n){let c=n[a];if(c!=null&&typeof c=="object"){let p=c;if(p.source==="signal")t.push({name:p.name,itemType:"signal",target:T.event,targetName:s[0],service:this,designItem:i,type:"script",sourceObject:r,display:n.type+"/"+s[0].substring(1)+"/"+a+"[signal]",refactor:d=>p.name=d});else if(p.source==="property")t.push({name:p.name,itemType:"property",target:T.event,targetName:s[0],service:this,designItem:i,type:"script",sourceObject:r,display:n.type+"/"+s[0].substring(1)+"/"+a+"[property]",refactor:d=>p.name=d});else if(p.source==="complexString")for(let d of p.name.matchAll(/\{(.*?)\}/g)){let g=d[0],u=d[1];if(u[0]==="?"){let m="?";u=u.substring(1),u[0]==="?"&&(m="??",u=u.substring(1)),t.push({name:u,itemType:"property",target:T.event,targetName:s[0],service:this,designItem:i,type:"script",sourceObject:r,display:n.type+"/"+s[0].substring(1)+"/"+a+"[complexString]->property",refactor:y=>p.name=p.name.replace(g,"{"+m+y+"}")})}else t.push({name:u,itemType:"signal",target:T.event,targetName:s[0],service:this,designItem:i,type:"script",sourceObject:r,display:n.type+"/"+s[0].substring(1)+"/"+a+"[complexString]->signal",refactor:m=>p.name=p.name.replace(g,"{"+m+"}")})}}}switch(n.type){case"SetSignalValue":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"ToggleSignalValue":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"IncrementSignalValue":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"DecrementSignalValue":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"SetBitInSignal":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"ClearBitInSignal":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"ToggleBitInSignal":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"OpenScreen":n.screen&&typeof n.screen=="string"&&t.push({name:n.screen,itemType:"screen",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/screen",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.screen=a});break;case"OpenDialog":n.screen&&typeof n.screen=="string"&&t.push({name:n.screen,itemType:"screen",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/screen",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.screen=a});break;case"CalculateSignalValue":n.targetSignal&&typeof n.targetSignal=="string"&&t.push({name:n.targetSignal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/targetSignal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.targetSignal=a});break;case"SubscribeSignal":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"UnsubscribeSignal":n.signal&&typeof n.signal=="string"&&t.push({name:n.signal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/signal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.signal=a});break;case"ShowMessageBox":n.resultSignal&&typeof n.resultSignal=="string"&&t.push({name:n.resultSignal,itemType:"signal",target:T.event,targetName:s[0],display:n.type+"/"+s[0].substring(1)+"/resultSignal",service:this,designItem:i,type:"script",sourceObject:r,refactor:a=>n.resultSignal=a});break}}else"blocks"in r;if("parameters"in r)for(let n in r.parameters)typeof r.parameters[n]=="string"&&t.push({name:r.parameters[n],itemType:"parameter",target:T.event,targetName:s[0],service:this,designItem:i,type:"script",sourceObject:r,display:s[0].substring(1)+"/parameters/"+n,refactor:a=>r.parameters[n]=a})}}return t}refactor(e,t,i){e.refactor(i);let s=JSON.stringify(e.sourceObject);e.designItem.setAttribute(e.targetName,s)}};import{BasePropertyEditor as $t}from"@node-projects/web-component-designer";var Ze=class extends $t{_ip;_container;constructor(e,t){super(e),this._container=document.createElement("div"),this._container.style.display="flex",this._ip=document.createElement("input"),this._ip.onchange=s=>this._valueChanged(this._ip.value),this._ip.onfocus=s=>{this._ip.selectionStart=0,this._ip.selectionEnd=this._ip.value?.length},this._container.appendChild(this._ip);let i=document.createElement("button");i.textContent="...",i.onclick=async()=>{let s=t.createBindableObjectBrowser();s.initialize(this.designItems[0].serviceContainer,this.designItems[0].instanceServiceContainer,"property"),s.title="select signal...";let l=new AbortController;s.objectDoubleclicked.on(()=>{l.abort(),this._ip.value=s.selectedObject.fullName,this._valueChanged(this._ip.value)}),await t.openConfirmation(s,{x:100,y:100,width:400,height:300,abortSignal:l.signal})&&(this._ip.value=s.selectedObject.fullName,this._valueChanged(this._ip.value))},this._container.appendChild(i),this.element=this._container}refreshValue(e,t){t==null?this._ip.value="":this._ip.value=t}};import{EventsService as Gt}from"@node-projects/web-component-designer";var Qe=class o extends Gt{static _cyclicEvent=[{name:`${fe}:100`,propertyName:void 0,eventObjectName:"Event",description:"this event will retrigger itself every 100 ms"}];getPossibleEvents(e){let t=super.getPossibleEvents(e);return t.push(...o._cyclicEvent),t}getEvent(e,t){return t.includes(fe)?o._cyclicEvent.find(s=>s.name==t)??{name:t,propertyName:"on"+t,eventObjectName:"Event"}:super.getEvent(e,t)}};export{Ue as BindableObjectDragDropService,he as BindingsEditor,K as BindingsEditorHistoric,Pe as BindingsHelper,Y as BlocklyScriptEditor,me as EventAssignment,ie as ParameterEditor,Ye as PropertyGridDragDropService,Fe as Script,Ke as ScriptRefactorService,Je as ScriptSystem,Ze as SignalPropertyEditor,Z as SimpleScriptCommandPicker,te as SimpleScriptEditor,Xe as VisualizationBindingsRefactorService,Ge as VisualizationBindingsService,Qe as VisualizationEventsService,re as VisualizationPropertyGrid,le as bindingPrefixAttribute,ce as bindingPrefixClass,J as bindingPrefixContent,pe as bindingPrefixCss,ne as bindingPrefixCssVar,je as bindingPrefixInsideCss,jt as bindingPrefixInsideCssVarName,se as bindingPrefixProperty,xe as bindingPrefixVisible,as as bindingsInCssRegex,fe as cyclicAttributeName,ke as generateEventCodeFromBlockly,Pt as getNestedProperty,de as isLit,Ie as nativeScriptCommandDescriptions,_e as parseBindingString,Oe as simpleScriptEditorHelpHtml};
|
|
1293
1293
|
//!varname => inverted
|