Commit Graph

113 Commits

Author SHA1 Message Date
Leonard Kim 0fca0f392d feat(filmstrip): reactify the filmstrip toggle button 2018-09-14 14:40:41 -05:00
virtuacoplenny c25d6eb9a8 [RN] Implement tile view
* 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
2018-09-13 17:20:22 +02:00
virtuacoplenny e63cd8c81b feat(tile-view): exit tile view on pin (#3430)
* feat(tile-view): exit tile view on pin

* Try out this other ux impl
2018-09-11 13:09:07 -05:00
virtuacoplenny fe7652ec90 feat(tile-view): persist setting in local storage (#3379)
* feat(tile-view): persist setting in local storage

* comment
2018-08-31 10:36:01 -05:00
virtuacoplenny c353e9377f feat(tile-view): initial implementation for tile view (#3317)
* 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
2018-08-08 13:48:23 -05:00
virtuacoplenny 9a06d2bf52 ref(video-layout): consolidate connection status update handling (#3185)
- 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.
2018-06-25 10:44:12 -07:00
virtuacoplenny 2bd0f77671 Move a couple calls to update VideoLayout into the redux update flow (#3173)
* ref(video-layout): move middleware for TRACK_ADDED

* ref(video-layout): call mucJoined when redux knowns of conference join
2018-06-21 21:33:33 -07:00
Leonard Kim 91323ebfec ref(video-layout): add thumbnails on participant join action 2018-06-01 10:42:57 -07:00
Leonard Kim 1e3dc20b44 ref(video-layout): video layout controls own updating after user leave 2018-06-01 10:42:57 -07:00
Leonard Kim ec0439cbb1 ref(video-layout): updates connection status when redux updates 2018-06-01 10:42:57 -07:00
Leonard Kim 05801711a7 ref(video-layout): get pinned ID directly from redux 2018-06-01 10:42:57 -07:00
Leonard Kim 57f7abc6dd ref(video-layout): get dominant speaker state from redux
Instead of keeping dominant speaker locally, get it from redux and be
updated when the dominant speaker changes. This is in an attempt to mimic
the video layout being reactified and connected to redux.
2018-06-01 10:42:57 -07:00
Leonard Kim c4b31435fb ref(video-layout): create middleware to update video layout
The goal will be to make video layout stateless and instead
get all state from redux.
2018-06-01 10:42:57 -07:00