Unable to chain conditions.

[maxi1134]

Hi there!

I discovered this and so glad I am having a blast using this tool for an interactive floorplan.

Although, I am now encountering an issue where my code doesn't work if my lights are off (Since the hs_color and rgb_color attributes are invalid when the light is off).

This is the code that I have currently working (with the lights on)

variables: null
entities:
  - light.bedroom_lights
  - light.dungeon
  - light.entrance_in
  - light.livingroom_lights
  - light.bathroom
  - light.kitchen_lights
  - light.server
  - light.hotbox_wall
  - light.hotbox_down
  - light.thierry
  - switch.patio_lights
card:
  type: picture-elements
  image: /local/images/floorplan_wip/off_all.png
  elements:
    - type: image
      entity: light.bedroom_lights
      state_image:
        'off': /local/images/floorplan_wip/off_bedroom.png
        'on': /local/images/floorplan_wip/on_bedroom.png
      filter: >-
        $(states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' ) }
      style:
        left: 79%
        top: 50%
        transform: 'translate(-1%,-34%)'
        opacity: '${states[''light.bedroom_lights''].attributes.brightness / 255}'
      tap_action:
        action: call-service
        service: light.toggle
        service_data:
          entity_id: light.bedroom_lights

How could I add a pre-condition to my conditions? So that the

        $(states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' ) }

blob is ignored when the light is off?

Thanks for reading!

[maxi1134]

I did try the following with no success:

        ${ {% if is_state("light.bedroom_lights", "on")%}
        states['light.bedroom_lights'].state === "on" &&
        states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)'  {%
        endif%} }

        ${ states['light.bedroom_lights'].state === "on" ?
        states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' }

        ${ states['light.bedroom_lights'].state === "on" ||
        states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' }

[iantrich]

This is JavaScript templating, not Jinja2. Before checking a attribute (property) you should check if it exists first.

$(states['light.bedroom_lights'].attributes.rgb_color && 
states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' ) }

[maxi1134]

Amazing! Thanks!

It doesn't crash anymore, although the color doesn't change anymore as before.

Is it possible that the "states['light.bedroom_lights'].attributes.rgb_color" is returning false? How could I check that?

[maxi1134]

After further investigation, It seems like you're missing a "{" in your code

$(states['light.bedroom_lights'].attributes.rgb_color && 
states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' ) }

I've added the curly bracket

        ${(states['light.bedroom_lights'].attributes.rgb_color && 
        states['light.bedroom_lights'].attributes.rgb_color[0] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[1] > 250 &&
        states['light.bedroom_lights'].attributes.rgb_color[2] > 250 ?
        'hue-rotate(0deg)' :  'hue-rotate(' +
        states['light.bedroom_lights'].attributes.hs_color[0] + 'deg)' ) }

And the problem comes back.