Add entity for screen.orientation to Mobile_app

Requesting an entity in the mobile_app integration that has the current screen orientation and that it updates when the screen is rotated

currently, we have no such entity, and as templates update on state changes, we can only resort to brute force reloading the view and have Frontend adjust their settings templates accordingly.

example:

  available: >
     [[[ return screen.width < 400 && screen.orientation.type == 'portrait-primary'
         ? 25 : 36; ]]]

both of these screen properties remain unchanged when rotating the screen as it stands, using the iOS mobile app

above template example is for a custom:button-card to be used in a animation and control the length of a string in display

more detail on that particular card can be inspected here

Interesting idea! :slight_smile:

Haven’t thought about such a use case, but seems reasonable. :+1:

Voted :smiley:

to illustrate why this dedicated entity would be helpful: we can do this with current conditional card:

cards:

  - type: conditional
    conditions:
      - condition: screen
        media_query: "(min-width:400px)"
    card: !include /config/dashboard/includes/button/button_marquee_alerts_css_wide.yaml
  - type: conditional
    conditions:
      - condition: screen
        media_query: "(max-width:399px)"
      - condition: screen
        media_query: "(orientation:portrait)"
    card: !include /config/dashboard/includes/button/button_marquee_alerts_css_narrow.yaml

and then completely duplicate the entire card, except for the available option I set in the button.

I believe it would be a considered alternative approach ;-), however, it quickly grows out of control if we have to add other screen widths around, like a tablet, which for the sake of this FR I left out of the equation just yet…

I read the other topic, it makes sense. :slight_smile:

I’m not that deep in things like these, I try to keep it simple for various reasons, and this would be way above that. Other members of my household won’t be impressed, if I’d use such “complicated” things in my dashboards. :laughing:

have been going at this in js for the button-card and extensively documented in How to make scroll-time/speed and TranslateX string length dependent in css animation - #11 by Mariusthvdb

it cant be done, and we need to either have a duplicate button-card with conditionals/visibility set on the media_query, as documented there.

Or:…

have the here FR’d new entity update the card … there is no other way.
Fr holds !