[SOLVED ]Habpanel background color number item comparison

Apps & Services HABPanel
1

The if statement for the background color does not really work.
If the item “Husqvarna_DistanceFromHomeAlertDist” is 1, 10 or 100 then the background color is “#223344’”
On all other states (e.g. 2,3,49,99 and greater than 100) the background color switches to “#ff0000”.
Item “Husqvarna_DistanceFromHomeAlert” is set to 100

states:

openhab> smarthome:status Husqvarna_DistanceFromHomeAlertDist
2
openhab> smarthome:status Husqvarna_DistanceFromHomeAlert
100

items:

Number          Husqvarna_DistanceFromHomeAlert     "Maximale Distanz [%d m]"                                   <location>          (gPersist)
Number          Husqvarna_DistanceFromHomeAlertDist "Distanz"                                                   <location>          (gPersist)

Habpanel widget code:

<div 
  ng-style="{
  'background-color': itemValue('Husqvarna_DistanceFromHomeAlertDist') > itemValue('Husqvarna_DistanceFromHomeAlert') ? '#ff0000' : '#223344'
  }"
  class="template-container"
  style="top:0;bottom:0;left:0;right:0;position:absolute">
  <div class="template-contents">
		<div class="row">
			<div class="col-xs-12"><span style="color: #FFFFFF; font-size: 10pt; text-align:center">Entfernung Basisstation</span></div>
		</div>
		<div class="col-xs-12"><span style="color: #00ccff; font-size: 24pt; text-align:center">{{itemValue('Husqvarna_DistanceFromHome')}}</span></div>
	</div>
</div>
2

Looks like you do a string comparison. Try to convert itemValue(...) to an integer (or float) before the comparison.

3

I don’t know how I can do that in the widget.

But have now managed it in another way.

  • created a new Item (Husqvarna_DistanceFromHomeAlertColor)
  • update the item via rule (set the value to #ff0000 or #223344)

and changed the widget code from:

'background-color': itemValue('Husqvarna_DistanceFromHomeAlertDist') > itemValue('Husqvarna_DistanceFromHomeAlert') ? '#ff0000' : '#223344'

to

'background-color': itemValue('Husqvarna_DistanceFromHomeAlertColor')

rule snippet:

    val PointType homeLocation = new PointType("" + Husqvarna_PositionParkedString.state + "")
    val PointType newLocation = new PointType("" + Husqvarna_Position.state + "")
    var Number m = newLocation.distanceFrom(homeLocation)

    // Habpanel color
    switch m {
        case m < Husqvarna_DistanceFromHomeAlert.state : Husqvarna_DistanceFromHomeAlertColor.postUpdate("#223344")
        case m >= Husqvarna_DistanceFromHomeAlert.state : Husqvarna_DistanceFromHomeAlertColor.postUpdate("#ff0000")
    }