picture-glance card issues got worse with 2022.9.0b5

[alexruffell]

Checklist

• [X] I have updated to the latest available Home Assistant version.
• [X] I have cleared the cache of my browser.
• [X] I have tried a different browser to see if it is related to my browser.

Describe the issue you are experiencing

I implemented a privacy filter for my camera feeds displayed on the dashboard so I can hide them before showing/sharing the dashboard. The first issue, which is not new to 2022.9.0b5 is that once I add the boolean toggle to the picture-glance card to turn the privacy on/off, I can no longer click the card anywhere to view a larger image as all I get is a useless history window of the boolean. This is the YAML for the card:

type: picture-glance
title: Driveway - East
entities:
  - entity: input_boolean.driveway_east_camera_privacy
  - entity: camera.driveway_east_camera
camera_image: camera.driveway_east_camera
aspect_ratio: '16:9'
camera_view: live
state_filter:
  'on': brightness(40%) blur(10px) saturate(0.0)
  'off': brightness(100%)
entity: input_boolean.driveway_east_camera_privacy

Clicking on the image now produces this (of no use):

To get around this issue I added a camera entity I can click to open a larger view. This worked fine until 2022.9.0b5.

Notice in the image below that now I get INFO / SETTINGS / RELATED tabs on the top which make the window too big to fit therefore pushing part of the feed off screen.

Describe the behavior you expected

1. Clicking anywhere on picture-glance card showing a camera should show a larger version of the camera feed even when entities are added.
2. When a larger view opens, it needs to fit the screen, and I don't believe the tabs should be there, not unless you are adding a separate customizable preview option to display camera feeds.

Steps to reproduce the issue

1. As per YAML included above, add state filter with boolean to turn on/off to card
2. Add boolean to card so you can turn filter on/off clicking on the icon in the card
3. Click anywhere in the picture-glance card expecting to have larger view results in getting history window for boolean
4. Add camera entity to as a workaround
5. Click on camera entity to open larger view
6. It opens but is oversized due to new tabs that IMO should not be there in a preview anyway.

...

What version of Home Assistant Core has the issue?

core-2022.9.0b5

What was the last working version of Home Assistant Core?

core-2022.8.7

In which browser are you experiencing the issue with?

Chrome, Edge, FF - all latest revisions

Which operating system are you using to run this browser?

Windows 11

State of relevant entities

No response

Problem-relevant frontend configuration

No response

Javascript errors shown in your browser console/inspector

No response

Additional information

No response

[xbmcnut]

I too have this issue with 2022.9.x. I have a dev unit still running 2022.8.6 and this is the image produced from clicking the picture entity.

And here is the same image rendered in 2022.9.5 which is unusable. Can we please have the old entity screen restored at least for camera entities? Ironically, if you right click and save each image, they are exactly the same size at 800 x 600 so it just seems to be a front-end display issue.

For reference, I'm using W11 too and Firefox.

[alexruffell]

As of one of the latest 2022.11 betas we went from one bad extreme to the other... I now have a 4k stream in a tiny box.

[FalconUK]

Seeing the same issue with two Android IP Webcam Picture Glance Cards.

[alexruffell]

someone told me that clicking on the window title expands it to the size if should actually open up to... I really don't understand the logic of this silly small window they went with now even though there is a workaround.

[FalconUK]

To confirm, clicking the title text (specifically the text, not the banner) does cause the larger view to load, but I don't see why the behaviour needs to change.

[alexruffell]

@FalconUK I agree with you. I am guessing devs will say that they are following Material design guidelines which to me appear to be focused on mobile platforms so all those using large screens, especially if 4K (both my monitors are 4K) are SOL.

[saper-2]

Hi,

I've got same problem with steam from my OctoPrint camera too - live view get oversized ("zoomed") to the dialog - and there show up the scrollbar.

My camera stream have resolution 640x480px...

I figured out disabling one style should fix the problem, but I do not know how to do it permanently. (disabling this style fix this - they force "min-width" so the dialog got "streched to 90% and the stream get stretched too while keeping aspect ratio this ends with scrollbars 😞 )

  @media (min-width: 600px) and (min-height: 501px)
:host([large]) ha-dialog, ha-dialog[data-domain="camera"] {
  --mdc-dialog-max-width: 90vw;
  /* --mdc-dialog-min-width: 90vw; - DISABLE THIS */
}

FIY: I've 1920x1200 monitors , FF & Win10 so this is not related to OS or web browser (on chrome same problem).

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.