Up until now we relied on implicit loading of middlewares and reducers, through
having imports in each feature's index.js.
This leads to many complex import cycles which result in (sometimes) hard to fix
bugs in addition to (often) breaking mobile because a web-only feature gets
imported on mobile too, thanks to the implicit loading.
This PR changes that to make the process explicit. Both middlewares and reducers
are imported in a single place, the app entrypoint. They have been divided into
3 categories: any, web and native, which represent each of the platforms
respectively.
Ideally no feature should have an index.js exporting actions, action types and
components, but that's a larger ordeal, so this is just the first step in
getting there. In order to both set example and avoid large cycles the app
feature has been refactored to not have an idex.js itself.
Use a dimensions detecting root component. The Dimensions module does not
measure the app's view size, but the Window, which may not be the same, for
example on iOS when PiP is used.
Also refactor the aspect ratio wrap component since it can be taken directly
from the store.
Last, remove the use of DimensionsDetector on LargeVideo and TileView since they
occupy the full-screen anyway.
Fixes PiP mode on iOS.
They never worked on mobile and pose an impediment for makinf config.js more
future proof. Specially if we want to move to a non-executable form of
configuration.
React Native doesn't define __filename nor __dirname so do it artisanally. In
addition, this helps with centralizing the configuration passed to loggers.
When in a conference, try to enter PiP when pressing the back button. If this is
not possible (because it's unsupported, not enabled, etc.) fall back to the
previous behavior of simply hanging up.
This PR changes the logic for connecting / disconnecting conferences. Instead of
doing it in mount / unmount events from the Conference component, it moves the
logic to the appNavigatee action.
This fixes a regression introduced in 774c5ecd when trying to make sure the
conference terminated event is always sent.
By moving the logic to appNavigate we no longer depend on side-effects for
connecting / disconnecting, and the code should be more maintainable moving
forward.
An improvement to this is the concept of sessions, which, while not tackled
here, was taken into consideration.
Dear reader, I'm not proud at all of what you are about to read, but sometimes
life just gives you lemons, so enjoy some lemonade!
Joining a conference implies first creating the XMPP connection and then joining
the MUC. It's very possible the XMPP connection was made but there was no chance
for the conference to be created.
This patch fixes this case by artificially genrating a conference terminated
event in such case. In order to have all the necessary knowledge for this event
to be sent the connection now keeps track of the conference that runs it.
In addition, there is an even more obscure corner case: it's not impossible to
try to disconnect when there is not even a connection. This was fixed by
creating a fake disconnect event. Alas the location URL is lost at this point,
but it's better than nothing I guess.
Provide a default and builtin default implementation which finishes the
Activity, same as before.
What this PR removes is the ability to provide a custom default handler because
applications can already take this decision when calling `onBackPressed`. In
addition, make `onBackPressed` return `void` because it's virtually impossible
for it to return `false` (that would mean that there is no
`ReactInstanceManager`, which means there is no app to begin with).
In addition, remove the use of `BackAndroid` since `BackHandler` contains an iOS
shim now.
- Reset some state on the singletons conference
and VideoLayout.
- Add a way for LocalVideo to clean itself up
by sharing logic with the other SmallVideos.
- Add clearing of chat messages so they don't
linger.
- Remove some UI event listeners.
- 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).
* feat(tile-view): initial implementation for mobile
- Create a tile view component for displaying thumbnails in a
two-dimensional grid.
- Update the existing TileViewButton so it shows a label in the
overflow menu.
- Modify conference so it can display TileView while hiding
Filmstrip.
- Modify Thumbnail so its width/height can be set and to prevent
pinning while in tile view mode.
* use style array for thumbnail styles
* change ternary to math.min for expressiveness
* use dimensiondetector
* pass explicit disableTint prop
* use makeAspectRatioAware instead of aspectRatio prop
* update docs
* fix docs again (fix laziest copy/paste job I've ever done)
* large-video: rename onPress prop to onClick
* change forEach to for...of
* use truthy check fallthrough logic instead of explicit if
* put tile view button second to last in menu
* move spacer to a constant
* the magical incantation to make flow shut up
* 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): 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
* Get back the Notice class
* Add Notice component in the Conference web view
* Notice is not exported in index.js. Only used internally by
Conference.
* noticeMessage value obtained from features/base/config
* using mapStateToProps
* value is stored in the internal _message property
* Notice component, orignal in `toolbox` is moved from
`toolbox/components` to `conference/components`
* Notice component only implemented and renderable in web views
* Dummy `conference/components/Notice.naive.js`
This patch is partially based in the removed logic included
originally in:
commit 59a74153dc
(tag: jitsi-meet_1886, tag: jitsi-meet_1885, tag: 1797, tag: 1796)
Author: Ilya Daynatovich <shupuercha@gmail.com>
Date: Mon Mar 20 11:04:54 2017 -0500
Toolbar notice as React Component
In reply to: Saúl Ibarra Corretgé @saghul> comments
Signed-off-by: Pablo Saavedra <psaavedra@igalia.com>
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
The visibility of the toolbar can be toggled by interacting with the main screen.
This change allows the toolbar to be configured to be 'always visible'. This voids
the 'toggle' functionality.
As part of the work on fixing the problem with the multiplying
thumbnails, we've associated remote participant w/ JitsiConference.
However, there are periods of time when multiple JitsiConferences are in
the redux state (and that period is going to be shorted by
StateListenerRegistry). In order to give more control to the feature
base/participants, reduce the occurrences of direct access to the
features/base/participants redux state and utilize the feature's
existing read access functions. Which will allow us in the future to
enhance these functions to access participants which are relevant to the
current conference of interest to the user only.
- add 10px of padding on the sizes of the toolbar
- make the button margin smaller (from 10 to 7)
- increate the secondary button factor to 85%, thus rising the maximum secondary
button size to 50 (from the previous 48)
Since the main conference container is no longer "clickable" there must
be a way for clicking on the "large video". A clickable TestHint nested
in ParticipantView makes it easier for dealing with the fact that the
click handler is not always on the same component (required for the
pinch and zoom feature to work correctly).
Be explciit about the appearance we desire, since each mounted StaturBar
component will override the existing values. In this case, the problem was
caused because the default on iOS is dark, whereas it's light on Android.
Set it to light so it works consistently across both, which is what we want.
* feat(Deeplinking): Implement for web.
* ref(unsupported_browser): Move the mobile version to deeplinking feature
* feat(deeplinking_mobile): Redesign.
* fix(deeplinking): Use interface.NATIVE_APP_NAME.
* feat(dial_in_summary): Add the PIN to the number link.
* fix(deep_linking): Handle use case when there isn't deep linking image.
* fix(deep_linking): css
* fix(deep_linking): deeplink -> "deep linking"
* fix(deeplinking_css): Remove position: fixed
* docs(deeplinking): Add comment for the openWebApp action.
Adds TestConnectionInfo component which exposes some internal app state
to the jitsi-meet-torture through the UI accessibility layer. This
component will render only if config.testing.testMode is set to true.
TouchableWithoutFeedback and TouchableHighlight interfere with the
implementation of 'pinch to zoom' to come. We prepare for it by driving
the onClick/onPress handler(s) out of Conference, through LargeVideo and
ParticipantView into Video itself where the bulk of 'pinch to zoom' will
be implemented.
Saúl Ibarra Corretgé
damencho
Adam Wan
Bettenbuk Zoltan
Hristo Terezov
Mihai Uscat
Vlad Piersec
bgrozev
Ruben Kerkhof
theunafraid
Matthias Herzog
paweldomas
Saúl Ibarra Corretgé
Leonard Kim
Pratik Shah
virtuacoplenny
Lyubo Marinov
Pablo Saavedra
Guus der Kinderen