Hi There
I am new to this forum, as well as in OpenHab and especially in Coding…
Good news first: It works. This widget interacts with my Z-Wave Radiator. I can change the temperature via slider, I see the actual temperature and the battery state. Yay! (Sorry, I did steal all the code line from anywhere…)
- I tried to do a background icon as in the standard slider widget. I tried so much, but didn’t manage it.
- the last line is … “uneven”. How can I have it all in one line?
- I had to make 3 different config.names ( for Th_Current, Th_Target, Th_Battery ). Is it possible to have only one config to choose the item and having all the channels of this item automatically? ( sorry, I hope, you can understand me )
- Maybe the most important question: When I search for solutions, what do I search for? css, html, js, bootsrap? There seem to be many similar ways but not all work with widgets (?)
Thank you very much in advance for all of your time.
Kind reagrds, Martin
<div class="template-contents"> <div style="color: white; font-size: 20pt">{{config.name}}</div>
<span><widget-icon iconset="'eclipse-smarthome-classic'" icon="'radiator'" size="150"/></span>
<div style="height: 100%" ng-init='YamahaAVRVolume={name: "volume", item: config.th_temp,
"value": itemValue(config.th_temp),
"floor" : 4,
"ceil": 28,
"step": 0.5,
"hidelabel" : "true",
"hidelimits": "true",
}'>
<widget-slider ng-model="YamahaAVRVolume"/>
<rzslider rz-slider-model="slider.value" rz-slider-options="slider.options" ng-click="sendCmd(config.th_temp, slider.value)">
</rzslider>
</div>
</div>
<div class="row">
<div class="col-xs-1"><span><widget-icon iconset="'eclipse-smarthome-classic'" icon="'BatteryLevel'" /></span></div>
<div class="col-xs-2"><span style="color: white; font-size: 18">{{itemValue(config.th_batt)}}%</span></div>
<div class="col-xs-10"><span style="color: white; font-size: 18">{{itemValue(config.th_temp_cur)}} °C momentan</span></div>
</div>