Commit Graph

587 Commits

Author SHA1 Message Date
Leonard Kim e3612929f8 fix(avatar): dynamically size avatar in dynamically sizable filmstrip 2019-05-24 12:00:35 -07:00
Leonard Kim a9d76a2577 fix(large-video): vertically align center screenshare
Stop using special case logic for aligning screenshare videos.
It may be possible to have positioning all done using CSS but that
seems to be a more significant refactoring.
2019-05-10 08:09:56 -07:00
Bettenbuk Zoltan 2b4ace75ae [RN] Add connection indicator 2019-04-16 17:33:23 +02:00
virtuacoplenny c6e5adbe0e
fix(large-video): respect update in progress when queuing update (#4078)
When a fade in/out animation is in progress, another large
video update can be queued but can try to force itself onto
large video. For example a pin can be in progress and while
the fade in/out animation plays, local video can change its
video type during the animation and forcing an update of
large video. This results in local video getting forcible
updated onto large video while the pinned video is left on
small video only.
2019-04-10 08:16:02 -07:00
Bettenbuk Zoltan 50d7c1521f Remove legacy web raise hand code 2019-04-01 21:03:36 +02:00
Bettenbuk Zoltan e65918564b [RN] Add UI for raised hand feature 2019-04-01 21:03:36 +02:00
virtuacoplenny d7e112aaf0
fix(display-name): do not default name to placeholder name (#4027)
* ref(display-name): do not pass in display name

The component gets the state itself from redux.

* fix(display-name): do not default name to placeholder name

The web display name component supports inline editing of
the name. Problems can occur when the displayed name
differs from the actual saved name, because participants
without a display name, including the local user, have
a different, default display name displayed. So when
editing starts, the input field is populated with the
default name. To workaround such while supporting fetching
the display name using mapStateToProps, pass in both the
name which should be shown and the name value saved in
settings.

* ref(display-name): rename methods
2019-03-26 09:34:02 -07:00
virtuacoplenny b7133f5717
fix(large-video): do not show avatar if no url (#3871)
* fix(large-video): do not show avatar if no url

By default the large video dominant speaker avatar
has an empty src, which will result in a broken
image displaying. There is also disconnect with
non-react code trying to set an undefined src.
To prevent such until local avatar generation
work is done in the future, just don't show the
avatar.

* fix(conference): set the room instance earlier

Set the room instance on APP.conference before triggering
a redux update of the conference being set,, because
middleware can then fire and call methods on APP.conference
that depend on the room being set.

* get local participant directly from store instead of from global
2019-02-06 19:19:02 -08:00
Leonard Kim 14cc4ea54a ref(hangup): clean up some UI state on hangup
- 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.
2019-01-02 09:54:05 -08:00
Leonard Kim ebcde745ef feat(tile-view): double click to pin 2019-01-02 09:43:20 +01:00
Leonard Kim 001e8fe0a7 fix(tile-view): prevent local participant being selected on pin exit
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.
2018-12-19 15:35:25 +01:00
Leonard Kim a1ef845663 fix(tile-view): thumbnail videos should cover entire thumbnail
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.
2018-11-28 13:36:12 -08:00
Saúl Ibarra Corretgé 2101f70a09 cleanup: remove no longer used code 🔥🔥🔥
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.
2018-09-19 15:12:31 +00:00
Leonard Kim 0fca0f392d feat(filmstrip): reactify the filmstrip toggle button 2018-09-14 14:40:41 -05: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
Leonard Kim dafcde5060 ref(video-layout): remove instance variable for gating show/hide
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.
2018-09-04 09:39:02 -07: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
Leonard Kim aaaa3e05d1 ref(thumbnail): pass in position of remote menu popover 2018-07-30 11:48:52 -05:00
virtuacoplenny 590ad90cd1
ref(video-layout): resize thumbnails first when resizing video area (#3308) 2018-07-26 11:45:04 -07:00
virtuacoplenny 34d1eb6768 ref(filmstrip): create an empty container for local filmstrip move (#3303)
* 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
2018-07-26 12:51:15 -05:00
virtuacoplenny afd2aea79c ref(large-video): combine selectParticipant logic from web (#3266)
* 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
2018-07-20 13:19:26 -05:00
hristoterezov bd449be20d fix(VideoLayout): JS error if updateLargeVideo is called too early. 2018-07-09 20:22:43 -05:00
hristoterezov 9331b0870b fix(presence-label):styles 2018-07-09 20:22:43 -05:00
hristoterezov 769e782c6f feat(callee-info): Redesign. 2018-07-09 20:22:43 -05:00
virtuacoplenny afe7c4470d
feat(small-video): add flag to hide connection indicators (#3225) 2018-07-06 08:24:38 -07:00
Leonard Kim 5dc2aca081 fix(video-layout): handle undefined video type for large video update
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.
2018-07-02 21:54:16 -05:00
Saúl Ibarra Corretgé 87fa8de815 feat(sanity): axe IE and Temasys plugin support 🔥🔥🔥 2018-06-28 13:55:12 +02: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
damencho 682169e44c Renames isBot -> isFakeParticipant. 2018-06-22 18:23:17 -05:00
Leonard Kim c65ccb0af5 fix(filmstrip): do not show video for large video speaker in audio only
When in audio only, the video should not be shown and instead the
avatar should display.
2018-06-22 17:03:25 -05:00
virtuacoplenny 4ab8d98cd1 ref(large-video): permanently enable canvas based background (#3084)
* ref(large-video): permanently enable canvas based background

* squash: leave flag for disabling background
2018-06-15 16:41:37 -05:00
Leonard Kim 91323ebfec ref(video-layout): add thumbnails on participant join action 2018-06-01 10:42:57 -07:00
Leonard Kim 60c68b624e ref(video-layout): local video does not call video layout directly on stream end 2018-06-01 10:42:57 -07:00
Leonard Kim 92414a346a ref(video-layout): remote thumbnail should not update large video directly 2018-06-01 10:42:57 -07:00
Leonard Kim 6f962be322 ref(video-layout): remove unused param in addParticipantContainer 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 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 7de8b96a07 feat(filmstrip): participant on stage displays with transparent video, not hidden 2018-05-29 14:27:07 -05:00
virtuacoplenny d4d5ef202a
ref(small-video): use css to set component visibility (#3039) 2018-05-25 13:19:51 -07:00
Leonard Kim 12d7ab9026 ref(layout): use css to make video layout containers fit window
Instead of using JS, just use CSS 100% width and height. This
also resolves a jitter that occurs on edge when a modal's
container appends to the body.
2018-05-18 15:34:40 -05:00
hristoterezov c344a83376 Outgoing call ringtones (#2949)
* fix(PresenceLabel): Use translated strings for the presence label.

* feat(sounds): Implements loop and stop functionality.

* feat(invite): Add ringtones.

* fix(invite): Code style issues.
2018-05-16 11:03:10 -04:00
virtuacoplenny ee74f11c3d
feat(recording): frontend logic can support live streaming and recording (#2952)
* feat(recording): frontend logic can support live streaming and recording

Instead of either live streaming or recording, now both can live together. The
changes to facilitate such include the following:
- Killing the state storing in Recording.js. Instead state is stored in the lib
  and updated in redux for labels to display the necessary state updates.
- Creating a new container, Labels, for recording labels. Previously labels were
  manually created and positioned. The container can create a reasonable number
  of labels and only the container itself needs to be positioned with CSS. The
  VideoQualityLabel has been shoved into the container as well because it moves
  along with the recording labels.
- The action for updating recording state has been modified to enable updating
  an array of recording sessions to support having multiple sessions.
- Confirmation dialogs for stopping and starting a file recording session have
  been created, as they previously were jquery modals opened by Recording.js.
- Toolbox.web displays live streaming and recording buttons based on
  configuration instead of recording availability.
- VideoQualityLabel and RecordingLabel have been simplified to remove any
  positioning logic, as the Labels container handles such.
- Previous recording state update logic has been moved into the RecordingLabel
  component. Each RecordingLabel is in charge of displaying state for a
  recording session. The display UX has been left alone.
- Sipgw availability is no longer broadcast so remove logic depending on its
  state. Some moving around of code was necessary to get around linting errors
  about the existing code being too deeply nested (even though I didn't touch
  it).

* work around lib-jitsi-meet circular dependency issues

* refactor labels to use html base

* pass in translation keys to video quality label

* add video quality classnames for torture tests

* break up, rearrange recorder session update listener

* add comment about disabling startup resize animation

* rename session to sessionData

* chore(deps): update to latest lib for recording changes
2018-05-16 07:00:16 -07:00
zbettenbuk 959db3a665 Make web use the redux settings/profile 2018-05-09 15:20:22 +02:00
Leonard Kim f015f4edc3 feat(large-video): background blur through canvas and feature flag
To reduce the amount of motion that has to be blurred, use a canvas
to essentially set the FPS of the video background. This canvas
component is behind a temporary feature flag, as well as being able
to disable the blur, so it can be played around with on deployed
environments.
2018-05-01 17:11:25 -05:00
virtuacoplenny 907cb013a8 fix(hangup): ensure large video exists before getting displayed id (#2799)
On hangup while audio only, audio only is set to false on
conference leave to reset redux state on mobile. Large video will
update itself on conference leave, but large video has been cleaned
up by that time so trying to directly access the user ID on large
video will fail. Be defensive about this check, because its
callers are already defensive about its return value.
2018-04-12 14:23:03 -07:00
Leonard Kim 2ce3c2d459 ref(filmstirp): remove animate flag from resizeThumbnails
The flag is always false.
2018-04-10 16:18:45 -05:00
Leonard Kim 8363f3cfeb ref(toolbar): remove all jquery filmstrip animations
The animate flag is always being passed in as false, so
essentially the animation isn't needed, unless a setTimeout 0
behavior is for some reason required...
2018-04-10 16:18:45 -05:00
Leonard Kim f8537dde6b fix(filmstrip): set SmallVideo styles instead of using animate
jquery animate during animations sets an element's overflow to
hidden and then back to the overflow declared before the start
of the animation. If multiple animations are fired, then the
overflow could be set to hidden permanently. No calls
to Filmstrip#resizeThumbnails have animate set to true, so the
animate call is not even needed.
2018-04-10 16:18:45 -05:00
Leonard Kim 1eee20dd5a ref(toolbar): remove contact list 2018-04-10 09:34:52 +02:00