Keep track of the connection and conference objects so we can leave and / or
disconnect early, before the connection is established or the conference joined.
React (pun intended) to prop changes, that is, load the new specified URL.
In addition, fix a hidden bug in loading the initial URL from the linking
module: we prefer a prop to the URL the app was launched with, in case somehow
both are specified. We (the Jitsi Meet app) are not going to run into this
corner case, but let's be defensive just in case.
* fix(filmstrip-only): vertically align center the toolbar
Use top 50% to position the toolbar's top at the vertical center
of the iframe. Then use transform 50% to move the toolbar itself
up 50% so its middle matches the middle of the iframe.
* squash: toolbox should center with filmstrip
Apparently iOS doesn't like dangling background tasks very much, so update the
background timers plugin with a version which fixes this.
https://github.com/ocetnik/react-native-background-timer/pull/38
Also accomodate for the API changes upstream.
Credits to @lyubomir for finding the needle in the haystack.
* feat(display-name): convert to React
- Create a new React Component for displaying and updating display
names on small videos
- The updating of the Component is defined in the parent class
SmallVideo, which children will get access to through prototype
copying
- Create a new actionType and middleware so name changes that occur
in DisplayName can be propogated to outside redux
- Update the local video's DisplayName when a conference is joined
or else the component may keep an undefined user id
* squash: query for the container, not the el owned by react
- Create a new ConnectionIndicator component for displaying an
icon for connection quality and for triggering a popover. The
popover handling has been left in ConnectionIndicator for now,
which follows the existing implementation.
- Remove the unused method "connectionIndicatorShowMore"
- Change the implementation of existing methods that update the
connection indicator to call the same method which will rerender
the indicator completely.
- Add tracks to the redux store by intercepting where the
tracks actually get used via conference.replaceTrack
- While the replace call is unique to web, the _dispose and
_addTracks calls use existing native code implementations
- Between _dispose and addTracks is a call to update mute state.
Without it, when changing devices or videoType while muted,
the user will stay muted (whereas existing web behavior
causes unmute). This is due to middelware calling
_syncTrackMutedState to make the track mute if the user is
currently muted.
- Move the rest of ConferenceEvents.TRACK_MUTE_CHANGED into
middleware so the event is no longer used
- Note: This change does not guarantee the track state in the
redux store will be 100% accurate, specifically the attribute
videoStarted. Muted and videoType should be accurate.
- Use actions trackAdded and trackRemoved to add and remove remote
tracks from the redux store
- Emit out to non-react components on track added and removed in
the track middleware
- Emit out to existing non-react components on track mute and
video type changes
Move all logic related to displaying a table of connection stats to a React
Component. The actual parsing logic was modified as little as possible as the
focus is moving display to React.
- Create new React Components for RemoteVideoMenu and its
buttons
- Remove existing menu creation from RemoteVideo
- Refactor RemoteVideo so all function binding happens once in
the constructor, removing the need to rebind when updating
the RemoteVideoMenu
- Allow popover to append and remove React Components from itself
- Refactor popover so post-popover creation calls are broken out and
popover removal behavior is all done in one function.
When entering audio-only mode, VideoBridge is instructed to stop sending
remote videos. However, if the instruction fails because DataChannels do
not work, for example, then the app continues to display the remote
videos. Even though they're received in the case of such a failure, no
videos are to be displayed in audio-only mode.
The value of inviteURL is derived from locationURL by removing the hash
and query/search params in order to make it fit for display and/or
public purposes. The Jitsi Meet SDK consumers do not fall into that
category and our intention is to provide them with the URL they used
with JitsiMeetView.openURL(URL) anyway.
Also rewrites to remove repetition. I'm not saying the new source code
is better really but at least I got to examine it and comment on some of
its weaknesses.
The current implementation doesn't use the API and Transport modules. This is
due to the fact that they are too tied to APP at the moment, which is web only.
Once API is refactored and moved into the Redux store this will be adjusted,
though it's unlikely that the lowest level React Native module (ExternalAPI)
changes drastically.
This commit also introduces a stopgap limitation of only allowing a single
instance for JitsiMeetView objects on both Android and iOS. React Native doesn't
really play well with having multiple instances of the same modules on the same
bridge, since they behave a bit like singletons. Even if we were to use multiple
bridges, some features depend on system-level global state, such as the
AVAudioSession mode or Android's immersive mode. Further attempts will be made
at lifting this limitation in the future, though.
Introduce certain React Components which may be used to write
cross-platform source code such as Audio like Web's audio, Container
like Web's div, Text like Web's p, etc.
The counterpart of the external API in the Jitsi Meet Web app uses the
search URL param jwt to heuristically detect that the Web app is very
likely embedded (as an iframe) and, consequently, needs to forcefully
enable itself. It was looking at whether there was a JSON Web Token
(JWT) but that logic got broken when the JWT support was rewritten
because the check started happening before the search URL param jwt was
parsed.
We've had Filmstrip & LargeVideo React Components on mobile/React Native
from the start. We didn't have them on Web (because the rewrite in React
is not complete yet). However, that led to differences in the React
Component Conference on Web and mobile. In an effort to get closer to
merging the React Component Conference on Web and mobile, introduce the
React Components Filmstrip & LargeVideo on Web even if a minimal
render-only form at this time.
* fix(vertical-filmstrip): different label animations for filmstrip states
Instead of one timing for sliding the video status label left and right,
have different timings depending on the filmstrip state. To facilitate
triggering the different animations, add more classes to the labels
that need to move that specify the filmstrip state.
- Faster transition if focusing on self-view with videos present so
the label does not overlap videos transitioning from 0 opacity.
- Transition delay when de-focusing on self-view with videos present
so videos have time to go away before the label moves over them.
- Maintain no movement if there are no videos, regardless of
filmstrip toggle state.
- Different delays for when the filmstrip is being toggled visible
and hidden if there are remote videos visible.
* SQUASH: remove remote videos count
* SQUASH: add docs to scss
The video status labels, which include recording and hd status,
have been moved back to the top left while in vertical filmstrip
mode. The following had to be done:
- Remove styling to move the labels to the bottom left
- For VideoStatusLabel, move filmstrip remote video count, toggle
state, and 1:1 state into redux.
- Use middleware to emit out to the Recording label when the
filmstrip changes.
- Create an empty Filmstrip file for web and identify the existing
Filmstrip component as native.
The 1:1 call UI and vertical filmstrip act on remote videos
while leaving local video alone. To facilitate acting only on
remote videos, place remote videos into their own container element.
Audio only mode will be toggleable only from the VideoStatusLabel,
so remove AudioOnlyButton from the toolbar and delete the component
itself. As a result of the button being removed, a truthy check in
VideoStatusLabel was also removed to ensure it will display as it
is now the only way to toggle audio only mode. Also set the cursor
on VideoStatusLabel to always be default, so it can never show the
text cursor.
Add a menu that displays when hovering over VideoStatusLabel. The menu's
display is controlled by CSS. As the existing AudioOnlyLabel no longer needs
needs its own tooltip, it has been removed and label display logic has been
moved into VideoStatusLabel.
DialInNumbersForm has been modified to display a conference id to be used for
dialing into the conference. The changes include:
- Requesting the conference id and adding the conference id to the redux store
- Displaying the conference id in DialInNumbersForm
- Modifying the copy behavior to support copying the new message to clipboard
- DialInNumbersForm does not display until all ajax requests have completed
successfully. This eliminates the need for the REQUESTING state.
In its current implementation, the VideoStatusLabel shows HD based on peer
connection stats. These stats will be available on temasys browsers soon but
will remain unavailable on Firefox, which does not collect height/width stats.
To support VideoStatusLabel showing cross-browser, move the high-definition
detection out of stat sniffing and instead check the video element itself using
an interval in LargeVideoManager. (An interval was used because the temasys
video object does not support the onresize event.) Also, add a cleanup path from
conference.web to LargeVideoManager to remove the interval.
There were getDomain, setDomain, SET_DOMAIN, setRoomURL, SET_ROOM_URL
which together were repeating one and the same information and in the
case of the 'room URL' abstraction was not 100% accurate because it
would exist even when there was no room. Replace them all with a
'location URL' abstraction which exists with or without a room.
Then the 'room URL' abstraction was not used in (mobile) feature
share-room. Use the 'location URL' there now.
Finally, removes source code duplication in supporting the Web
application context root.
Device selection has live previews that reuse the current local
audio and video tracks for the sake of internet explorer. This
means when the local video was muted, device selection would
show a muted message. It is preferred to show a live preview
even when muted.
The changes include:
- Passing device ids into DeviceSelectionDialog, not tracks.
- Setting default selected devices to use for live previews.
- Removing all checks in DeviceSelectionDialog involving local tracks.
- Catching and displaying errors when creating a live video preview.
Move the HD label into the newly renamed VideoStatusLabel
component. That way it cannot be possible for the audio only
label and the HD label to display simultaneously.
Audio only mode can be used to save bandwidth. In this mode local video is muted
and last N is set to 0, thus disabling all remote video.
When this mode is enabled avatars are shown.
yanas
hristoterezov
Saúl Ibarra Corretgé
Lyubo Marinov
virtuacoplenny
George Politis
Saúl Ibarra Corretgé
Ilya Daynatovich
paweldomas
damencho