Conditional f7-icon

Setup, Configuration and Use Widgets
1

Hello,
I try to load an icon by a condition but I really fail with the syntax

here is my syntax try, would be nice if someone can help me :slight_smile:

- component: f7-icon
            config:
              f7: "= (items.number_openhaboperatingmodus_dayphase.state === '0') ?  'sunrise' 
                       :  (items.number_openhaboperatingmodus_dayphase.state === '1') ? 'sunrise'
                       :  (items.number_openhaboperatingmodus_dayphase.state === '2') ? 'sunrise'
                       : ''"
              size: 18
              style:
                margin-right: 10px
              visible: "=props.icon ? true : false"
2

When building expressions like these, use the developer sidebar expression tester to gradually build it up over.

image
image522Ă—930 40.6 KB

Also, see Creating Personal Widgets | openHAB. Using a Object for this would make it easier to write and read.

f7: =({'0':'sunrise','1':'sunrise','2':'sunrise'})[@@number_openhaboperatingmodus_dayphase] || ''

See Building Pages - Components & Widgets | openHAB for reference for @@.

Finally, I don’t know if expressions are supported everywhere in widgets, particularly when used with raw f7 components.

1 Like
3

At this point, there are very few places where expressions are not supported. The stylesheet property remains one, and a few of the chart properties, if I recall. All the f7 components should support expressions for all of their configurations.

Rich’s suggestion for the object syntax is probably the best way to go here.

On a related note, you can also improve

visible: "=props.icon ? true : false"

You don’t need the true and false here. This statement says “if props.icon returns true then return true if it returns false then return false”. You can see how that is redundant. Because visible only requires a true/false value, you just need the test (in this case the value of props.icon) because that, returns a true or false (well, falsy) value already.

visible: =props.icon
1 Like
4

and in the text i added

text: =({'0':'Sunrise','1':'Morning','2':'Day','3':'Sunset','4':'Evening','5':'Night'})[@@number_openhaboperatingmodus_dayphase] || 'Not Set'

But result is always

Not Set
5

That most likely means that @@number_openhaboperatingmodus_dayphase is just not returning the data you are expecting. This is where the expression tester is so important. Put =@@number_openhaboperatingmodus_dayphase into the tester and see what it shows you is the actual output.

6

it says

undefined

but in the rest api i see

{
  "link": "http://smarthome.fritz.box:8080/rest/items/number_openhaboperatingmodus_dayphase",
  "state": "4",
  "stateDescription": {
    "pattern": "%d %unit%",
    "readOnly": false,
    "options": []
  },
  "unitSymbol": "one",
  "metadata": {
    "semantics": {
      "value": "Point_Status",
      "config": {
        "isPointOf": "group_smarthomedevice"
      }
    },
    "stateDescription": {
      "value": " ",
      "config": {
        "pattern": "%d %unit%"
      }
    }
  },
  "editable": false,
  "type": "Number:Dimensionless",
  "name": "number_openhaboperatingmodus_dayphase",
  "label": "Operating Modus",
  "tags": [
    "Status"
  ],
  "groupNames": [
    "group_smarthomedevice"
  ]
}

and

=items.number_openhaboperatingmodus_dayphase.state

shows

4

text: =({'0':'Sunrise','1':'Morning','2':'Day','3':'Sunset','4':'Evening','5':'Night'})[items.number_openhaboperatingmodus_dayphase.state]

is also fine

7

What version of OH are you on. If it’s not at least 4.1 you can’t use @ and @@ IIRC. they weren’t added until later.

8

I am running oh4.2 m2

1 Like
9

Sorry, I missed it the first time. When using @ or @@ you need quotes around the item name:

=@@'number_openhaboperatingmodus_dayphase'

Edit: without the quotes it’s treating number_openhaboperatingmodus_dayphase as a variable (which you obviously haven’t defined).

1 Like
10

thats fine now