On tile view enter/exit, local video is moved in the DOM (an effect
of not being reactified and moving being easier) and play is called
on its video element. The race condition setup is such: in tile
view with other participants and local video is on large (not
visible in the UI but visible in the app state and pip popout).
The race is such: pin a remote video, large video update is queued,
tile view is exited, local video is moved, play is called,,
onVideoPlaying callback executed, middleware fires mute update,
which checks if local is on large (it is), previous large video
update is cleared, and local is placed on large.
The fix is ensuring the redux representation of local video is
passed in, which holds the boolean videoStarted, which prevents
the onVideoPlaying callback from firing on subsequent plays.
Video elements may have problems scaling to cover pixel fractions,
so there could be a 1px black border line displaying in the
thumbnail. It's most visible in tile view. Flooring the sizing
calculations hides the border.
- Change "features/chat" to support listening for new chat messages
and storing them, removing that logic from conference.js.
- Combine chat.scss and side_toolbar_container.css, and remove unused
scss files. Chat is the only side panel so the two concepts have
been merged.
- Remove direct access to the chat feature from non-react and non-redux
flows.
- Modify the i18n translate function to take in an options object.
By default the option "wait" is set to true, but that causes
components to mount after the parent has been notified of
an update, which means autoscrolling down to the latest rendered
messages does not work. With "wait" set to false, the children
will mount and then the parent will trigger componentDidUpdate.
- Create react components for chat. Chat is the side panel
plus the entiren chat feature. ChatInput is a child of Chat and
is used for composing messages. ChatMessage displays one message
and extends PureComponent to limit re-renders.
- Fix a bug where the toolbar was not showing automatically when
chat is closed and a new message is received.
- Import react-transition-group to time the animation of the
side panel showing/hiding and unmounting the Chat component.
This gets around the issue of having to control autofocus if the
component were always mounted and visibility toggled, but
introduces not being able to store previous scroll state
(without additional work or re-work).
The code for handling device availability has been disabled for a long time,
plus it's ill named since it represents 2 abstractions: lack of permissions and
lack of devices.
Time for it to rest in the git graveyard.
The process for doing a replaceLocalTrack is async. Is it
possible to trigger replaceLocalTrack multiple times before
each call is finished. This leads to situations where
replaceLocalTrack is called multiple times with oldTrack being
null and a new track. In this scenario, each new track will be
added, causing UI issues such as the local participant's
large video not displaying for remote participants.
The action replaceLocalTrack is used when unmuting audio or
video, when creating new tracks on device switch, and when
toggling screensharing. These actions can collide with each
other. One way to fix this would be to queue replaceLocalTrack.
The instance variable is not accurate. By default isVisible is
set to false but nothing sets the video container to actually
not be visible. As such it is possible for the video element
itself to autoplay, thereby making video visible, while the
isVisible boolean is still false. The fix chosen is to remove
instance variable and always respect calls to show/hide so
that the video container can be set to hidden.
* feat(tile-view): initial implementation for tile view
- Modify the classname on the app root so layout can adjust
depending on the desired layout mode--vertical filmstrip,
horizontal filmstrip, and tile view.
- Create a button for toggling tile view.
- Add a StateListenerRegistry to automatically update the
selected participant and max receiver frame height on tile
view toggle.
- Rezise thumbnails when switching in and out of tile view.
- Move the local video when switching in and out of tile view.
- Update reactified pieces of thumbnails when switching in and
out of tile view.
- Cap the max receiver video quality in tile view based on tile
size.
- Use CSS to hide UI components that should not display in tile
view.
- Signal follow me changes.
* change local video id for tests
* change approach: leverage more css
* squash: fix some formatting
* squash: prevent pinning, hide pin border in tile view
* squash: change logic for maxReceiverQuality due to sidestepping resizing logic
* squash: fix typo, columns configurable, remove unused constants
* squash: resize with js again
* squash: use yana's math for calculating tile size
* ref(filmstrip): create an empty container for local filmstrip move
This might be necessary for tile view. To support making the
local video display at the end of remote videos while in tile
view, but separateed from scrollable remote videos, moving
the local video might be necessary. By creating an empty
container, there is a target for local video to move to.
* squash: rename id
* ref(filmstrip): apply filmstrip class to Conference root
Instead of apply the layout class to the body, it can be
applied to Conference. This will allow easier switching
between tile filmstrip and horizontal/vertical filmstrip.
* squash: fix typo filstrip
* ref(large-video): combine selectParticipant logic from web
Currently native/middleware/redux has its own logic for selecting a participant
on the bridge. To have the logic web respect that logic, a few changes are
needed.
- Web no longer has its own call to selectParticipant.
- To keep in line with web logic selectParticipant action should act even when
there is no track. This makes it so that when a participant does get a track
that the bridge will send high quality. The bridge can already handle when the
selected participant does not have a video track.
- The timing of web is such that on joining an existing conference, a
participant joins and the participant's tracks get updated and then the
conference is joined. The result is selectParticipant does not get fired
because it no-ops when there is no conference. To avoid having to make
uncertain changes (to be lazy), update the selected participant on conference
join as well.
* squash: update comment, pass message to error handler
* ref(device-selection): do not override var that is not reference again
* ref(device-selection): do not override var that is not reference again
* ref(device-selection): always update known devices on device list update
* ref(device-selection): replace call to get devices from legacy to redux
* ref(device-selection): remove unused device list state from mediaDeviceHelper
* ref(device-selection): update store before updating UI
Unfortunately, as the Jitsi Meet development evolved the routing mechanism
became more complex and thre logic ended up spread across multiple parts of the
codebase, which made it hard to follow and extend.
This change aims to fix that by rewriting the routing logic and centralizing it
in (pretty much) a single place, with no implicit inter-dependencies.
In order to arrive there, however, some extra changes were needed, which were
not caught early enough and are thus part of this change:
- JitsiMeetJS initialization is now synchronous: there is nothing async about
it, and the only async requirement (Temasys support) was lifted. See [0].
- WebRTC support can be detected early: building on top of the above, WebRTC
support can now be detected immediately, so take advantage of this to simplify
how we handle unsupported browsers. See [0].
The new router takes decissions based on the Redux state at the time of
invocation. A route can be represented by either a component or a URl reference,
with the latter taking precedence. On mobile, obviously, there is no concept of
URL reference so routing is based solely on components.
[0]: https://github.com/jitsi/lib-jitsi-meet/pull/779
When replace track is called in JitsiConference, there is no
guarantee a videoType update will come in presence before
the track added event. This can lead to the situation in
LargeVideoManager where an update is called with a track
with an undefined videoType.
- Instead of having 4 listeners for local connection status
updates and 1 for remote, remove two of the redundant listeners.
- Instead of calling into 4 separate VideoLayout methods to update a
participant's connection status, expose one handler.
* feat(settings): setting dialog
- Move device selection, profile edit, language select, moderator
options, and server auth into one modal with tabs.
- Remove side panel profile and settings and logic used to update
them.
- Pipe server auth status into redux to display in the settings
dialog.
- Change filmstrip only device selection popup to use the new
stateless settings dialog component.
* squash: do not show profile tab if not guest
* squash: profile button not clickable if no profile to show
* squash: nits
* ref: Settings dialog.
* ref(toolbar): show recording features based on explicit configs
* squash: bring back button configs, use final config names
* squash: update interfaceConfig comment, remove unused config whitelist
* squash: change order of button enabled checks to reduce diff
* squash: fileRecording -> fileRecordings