last year I developed a Jitsi bookmarklet which users can use to sort their videotiles alphabetically or however they want, thus somewhat solving the issue that participants see the video tiles in different order. Here’s the link: https://github.com/kaiyazeera/jitsi-bookmarklets
However, since 2022, the bookmarklet is not working anymore.
My questions are:
How has the CSS changed lately regarding the order of video tiles?
How are Jitsi video tiles currently sorted?
My 2021-version used the order- attribute of display: flex. I already manually played around with the CSS a lot, removed position: absolute, top: n px` and so on, I do seem to (still) work on the correct elements, but I cannot purposefully influence their order anymore in a controlled fashion.
Please note, that I am not a web-frontend-developer, even though I am accustomed with the web basics.
Anyone here that can point me in the right direction?
Here’s the DOM tree, the elements I am manipulating in the script (see link above) are marked red. Prior to 2022, adding order to them was enough (even though, their position in the tree has changed lately, but unluckily, I did not document the old DOM tree)
Hello, we have a very similar problem. The main problem is unfortunately not to overwrite the positioning in css, but that not all tiles are in the DOM tree at all, but only those of which jitsi believes to be visible due to its position calculations.
Your sorting function therefore no longer sorts over all tiles but only over the visible ones (+N).
Unfortunately, this also very easily kills the possibility of correct scrolling in order to reload tiles at all.
Hello Salocin, thanks for reporting!
Damn, you’re correct, while it seems to work with maximum screen size and/or few participants there are some issues when I join with 26 participants and reduce the browser window size, the whole thing becomes buggy.
In 2021, all tiles were in the DOM tree (as far as I know, at least I never experienced any problems), but now that seems to have changed. I will check back on that some time later (though if anyone likes to contribute, feel free).
I am also considering modifying server-side, but have not yet found the time to sufficiently review the code.
Not everything is in the DOM this was an optimization done to be able to accommodate large meetings, and this is client change. Anyway CSS modification on top of meet is not something that will work for long. We are working on some more UI changes which will break anything that maybe working today.
Can I ask, what of the current sorting doesn’t work for you?