element-hq / element-web

A glossy Matrix collaboration client for the web.

Home Page:https://element.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Element Call video room PIP (always on top) avatars are not round

HarHarLinks opened this issue · comments

Steps to reproduce

  1. join an element call video room
  2. another call member has an avatar that is rectangular (height > width), which usually isn't visible as they're cropped to circles
  3. click on another room, watch the call become a PIP floaty that's always on top
  4. notice the kinder surprise shaped avatar in the PIP (screenshot)

Outcome

What did you expect?

avatars are always perfect circles

What happened instead?

image

<div class="_avatar_w2fgr_17 _avatar_7m54n_80" style="background-color: rgb(45, 194, 197); width: 110px; height: 110px; border-radius: 110px; font-size: 55px;">
<img src="https://matrix.example.org/_matrix/media/r0/thumbnail/example.org/abcdef1234567890?width=110&amp;height=110&amp;method=scale" >
</div>

Operating system

arch

Application version

Element Nightly version: 2023021901 Olm version: 3.2.12

How did you install the app?

aur

Homeserver

synapse 1.77.0"

Will you send logs?

No

I tried to recreate the issue is this what you are talking about!?
This is my first time in open source and I really want to help and want to contribute in this community,
Sorry if my approach or my way to talk to you was wrong!
Please check the below attachment and please reply back :)
Screenshot 2023-02-23 at 3 52 41 PM

I can't tell from the screenshot if you're using both video rooms (is sad09jiohui a video room?) and element call. Both must be enabled in labs settings:
image
image

The other person in your call (pink-purple circle labeled S) does not have an avatar set which is a requirement (see step 2 in OP)


I have not tested if the behaviour is the same in "New group call experience" (i.e. Element calls which are not video rooms but only meetings).

No sir "sad09jiohui" is a New Room, I just gave a random name to that room just for checking

And I tried enabling those settings from the settings menu and then I created a Video Room(Beta) and then I tried to recreate the issue and go this :

Screenshot 2023-02-24 at 3 02 21 PM

This is what i got after enabling that Beta setting from the labs menu :
Screenshot 2023-02-24 at 3 04 25 PM

you're missing the step where another user with an avatar as described in the OP needs to also be in the video room :)

Pls help me out ,the avatar does not seems to be getting rectangular to me even after following all the steps :(

image

pls reply.....

i try to reproduce the issue and i did not find rectangular avatar but i found it very small you i think you can close this issue

I believe that if the code provided by you is not working correctly to create a circular avatar, then changing the "border-radius:50%" will help.

Can I work on this issue? I think We need to change the border radius to 100% for a circular avatar

Hey. I want to work on this issue. It would be great if I can be assigned to it. Thank You

Thank you for your interest in this issue @debasis9658 . We will normally not assign the issue to an external contributor until they have provided at least a draft PR which is taking the right direction. For further details, see our guidance on assigning issues.

If you have any technical questions about this issue, you can ask for help in #element-dev:matrix.org