Hi everyone,
I am currently working on an widget for the Viessmann-Binding, in principle i got it fully working.
But i stumpled upon this:
slots:
default:
- component: widget:wp_Tab2
config:
heatGroup: =props.groupItem
firstCircuit: =Number((@(props.groupItem+'_Circuits_enabled')).replace(/[\[\]\"]/g,'').split(',')[0])
lang: =(dayjs().format('dddd').includes('day'))
HeatColorScheme: =props.colorScheme
The widget is build from one Main Widget-Part and lots of functionality is realized in “Sub-Widgets”.
In the code piece above i pass firstCircuit which is the first heating circuit into a subwidget:
I thought that the expression gets evaluated before passing to the widget, but that seems not to be true.
The item is a JSON String that might look like [“0”], or [“1”] but also [“1“,”2”,”3”,”4”].
In the subwidget i need this variable to render the schedule, heating-items etc. and i need the value from the very start of the widget because the items to be used follow naming schemes for example like group+’_Heating_curve_Circuit_1_shift’. for the heating curve shift of circuit 1.
In the sub-widget (only the starting part):
component: f7-block
config:
class:
- margin-horizontal-half
- no-margin-vertical
- no-padding
key: =props.firstCircuit
slots:
default:
- component: oh-context
config:
functions:
circuitsCount: =(x)=>Number(JSON.parse(@(props.heatGroup+'_Circuits_enabled')).length)
variables:
selectedCircuit: =props.firstCircuit
slots:
default:
- component: f7-block
config:
class:
- no-padding
- text-align-center
style:
display: grid
font-size: 11px
font-weight: 700
gap: 5px
grid-template-columns: 35px 5fr repeat(3, 4fr)
line-height: 12px
margin: 2px 0px 2px 0px
key: =@(props.heatGroup+"_Heating_schedule_Circuit_"+vars.selectedCircuit)
slots:
default:
- component: Label
config:
text: =!props.lang?'Heizk.':'Circuit'
- component: Label
config:
text: =!props.lang?'Betriebsart':'OperatingMode'
- component: Label
config:
text: =!props.lang?'Reduziert':'Reduced'
- component: Label
config:
text: =!props.lang?'Normal':'Normal'
- component: Label
config:
text: =!props.lang?'Komfort':'Comfort'
- component: oh-button
config:
action: variable
actionVariable: selectedCircuit
actionVariableValue: =((vars.selectedCircuit || 0) >= fn.circuitsCount() - 1)?
props.firstCircuit:((vars.selectedCircuit || 0) + 1)
outline: true
small: true
style:
background-color: lightgray
border-radius: 4px
borderColor: =props.HeatColorScheme
color: black
display: flex
font-size: 11px
padding-left: 3px
padding-right: 3px
text-transform: uppercase
text: =(vars.selectedCircuit).toString()
I do assign the value to a variable in an oh-context block. Unfortunatly this isn’t working as expected and selectedCircuit throws ‘NaN’.
To solve this problem i added selectedCircuit in the parentBlock as key.
So when the evaluation is finished the widget gets updated and is rendered correctly.
So my question is this intended that the expression is passed as string to the sub-widget or should the evaluated value be passed to widget.
Another observation i made with my widget is that generally JSON.parse results do generally need a serious amount of time.
The widget-code is truncated, but can be seen here :
https://github.com/SePHTaN/semanticHomeMenu/tree/main/heatpump