Widget | what am I doing wrong

Setup, Configuration and Use Items & Sitemaps
,
1

I copied and modified widget code from the demo site, but it doesn’t do what I want.

When the switch item is ON I want to change the background color and the text active in the footer

I probably made a typo, but I don’t see what’s wrong

uid: Scene_button
tags: []
props:
  parameters:
    - description: Scene name
      label: Scene name
      name: SceneName
      required: false
      type: TEXT
    - description: Name of the Icon (see https://framework7.io/icons/ for available icons)
      label: F7 Icon
      name: icon
      required: true
      type: TEXT
    - description: Color scheme for icons and toggles (see https://framework7.io/docs/color-themes.html for available color schemes)
      label: Color
      name: color
      required: true
      type: TEXT
    - context: item
      description: Scene switch item
      label: Item
      name: SceneSwitch
      required: false
      type: TEXT
  parameterGroups: []
timestamp: May 16, 2021, 8:25:52 PM
component: oh-cell
config:
  header: Activate scene
  title: =props.SceneName
  footer: "=props.SceneSwitch.state == ON ? 'Active' : ''"
  icon: =props.icon
  on: true
  background-color: =props.SceneSwitch.state == ON ? 'blue' :'gray'
  action: command
  actionItem: =props.SceneSwitch
  actionCommand: ON
2

try

='(props.SceneSwitch.state == ON) ? "blue" :"gray"'

i believe the logic expression needs to be in parentheses.
I have a similar logic and it looks like:

background-color: '=(items[props.item].state === "ON") ? "white" : "#ffffff73"'

and that is working

3

props.SceneName is just a string of the item name so it doesn’t have a state property. In both those cases you’ll need to use the items dict that takes item name string as a key and returns the state (or display state if you want):

items[props.SceneName].state

Also, in the background-color line you’ll need to put quotes around the expression again or the : will confuse the parser.

1 Like
4

Thanks for the example

5

Thank you for explaining the syntax.

footer: ‘=(items[props.SceneSwitch].state === “ON”) ? “Active” : “”’ is working

The backgound part is not jet working
background-color: '=(items[props.SceneSwitch].state === “ON”) ? “blue” : “red”'

I will look at it tomorrow

6

Should be:

background-color: '=items[props.SceneSwitch].state == "ON" ? “blue” : “red”'

Though you could keep the brackets if you like, it’s just the excess ‘=’ that you need to get rid of

7

that additional “=” came from my post and is working in my setup
Some users use “==” and some “===”, see

Reading the linked thread, I think both work.

8

=== checks for equality of value and type. == checks for equality of value making some sensible type changes as required. So, in scripting in OH item.state === "ON" will not work because ON, the state returned from the item itself, is one of the OH state types and "ON" is a string. On the other hand, item.state == "ON" will work because toString() can be called on OH state types to cast them to strings.

In the case of widgets, however, both work. The state values in the items dict are not state types but have already been retrieved from the api as strings so items[props.SceneSwitch].state === "ON" is comparing a string type to a string type.

1 Like
9

Ok weird… Then sorry for this “hint” but I think this was never working for me :man_shrugging:

10

Thanks Justin! Another mystery solved :grinning:

11

Thanks Justin.

The strange thing for me is that de next line is working.

footer: '=(items[props.SceneSwitch].state === "ON") ? "Active" : ""'

and the lines below are not.

background-color: '=(items[props.SceneSwitch].state === "ON") ? "blue" : "red"'

or

background-color: '=items[props.SceneSwitch].state == "ON" ? "blue" : "red"'

same principle, only now it is not text that displays “active” but a background color that needs to change

12

The expressions are correct, but in an oh-cell the property you want to set is color not background-color.

1 Like
13

I knew I was missing something.

You are the best Justin

Thank you