Commit Graph

296 Commits

Author SHA1 Message Date
Lyubo Marinov 70d064cfa2 [RN] Fix React warnings 2017-11-07 17:28:28 -06:00
Lyubo Marinov 2b8a770163 [RN] Consistent margins for Filmstrip and Toolbox
With the introduction of wide and narrow layouts the margins of the
Filmstrip and the Toolbox became inconsistent. For example, the
Filmstrip's top in the wide layout was nearer to the top than the
secondary Toolbar.
2017-11-07 17:27:58 -06:00
Lyubo Marinov d0c079dba5 Coding style 2017-11-07 17:27:58 -06:00
Lyubo Marinov bce2a9fba9 [RN] Fix eslint & flow errors 2017-11-07 17:27:58 -06:00
paweldomas 3e9d26b525 ref(Toolbox.native): extract _renderToolbars 2017-11-07 08:28:18 -06:00
paweldomas 320cfe4745 ref(base/react/Container): return null for not visible
Now that we no longer hide the filmstrip it is fine to return null
instead of trying to hide with some tricks.
2017-11-07 08:28:18 -06:00
paweldomas c0a7d6144a feat: display filmstrip on the short side
Adds the ability to detect app area's aspect ratio on react-native
through the features/base/aspect-ratio.

Makes conference, filmstrip and toolbox react to the aspect ratio
changes and display filmstrip on the shorter side of the screen.
2017-11-07 08:28:18 -06:00
paweldomas b74bede0e7 feat(web/RN): update React to v16 and React Native to 0.49 2017-11-02 14:32:35 +01:00
Leonard Kim 92dbdade39 fix(filmstrip-only): set width for toolbar popovers
The popovers in filmstrip only are displaying thinly.
As a quick workaround, set a width on them. There
should only be one anyway, which shows up when
talking while muted.
2017-10-31 14:42:16 -05:00
yanas e09949be9f feat(dark-theme): Applies dark theme on inline-dialogs, tooltips, flags and more 2017-10-20 15:29:16 -05:00
hristoterezov 0b50578de9 style(analytics): sendEvent -> sendAnalyticsEvent 2017-10-17 19:33:32 -05:00
hristoterezov 0eddef4d62 feat(mute): Add analytics and console logs for audio/video mutes 2017-10-13 09:50:48 -05:00
hristoterezov df1437f018 ref(analytics): Use analytics from features/analytics 2017-10-13 09:50:48 -05:00
paweldomas 122be9e0e0 ref: move 'jwt' feature to 'base' 2017-10-12 14:43:09 -05:00
yanas dfe4e5e3a1 fix(defaultToolbarButtons): Fixes mute popup warning
Fixes exception when trying to unmute in the scenario, where someone else is sharing a video with you.
2017-10-06 17:13:49 -05:00
Lyubo Marinov c2ca345dec [RN] Fix TypeError that getDefaultButtons is not a function 2017-10-03 17:26:13 -05:00
Lyubo Marinov 5561a9c031 Partially prepare for eslint-plugin-flowtype 2.37.0 2017-10-03 14:41:54 -05:00
yanas 86fcfcc535 WiP(invite-ui): Initial move of invite UI to invite button (#1950)
* WiP(invite-ui): Initial move of invite UI to invite button

* Adjusts styling to fit both horizontal and vertical filmstrip

* Removes comment and functions not needed

* [squash] Addressing various review comments

* [squash] Move invite options to a separate config

* [squash] Adjust invite button styles until we fix the whole UI theme

* [squash] Fix the remote videos scroll

* [squash]:Do not show popup menu when 1 option is available

* [squash]: Disable the invite button in filmstrip mode

* feat(connection-indicator): implement automatic hiding on good connection (#2009)

* ref(connection-stats): use PropTypes package

* feat(connection-stats): display a summary of the connection quality

* feat(connection-indicator): show empty bars for interrupted connection

* feat(connection-indicator): change background color based on status

* feat(connection-indicator): implement automatic hiding on good connection

* fix(connection-indicator): explicitly set font size

Currently non-react code will set an icon size on ConnectionIndicator.
This doesn't work on initial call join in vertical filmstrip after
some changes to support hiding the indicator. The chosen fix is
passing in the icon size to mirror what would happe with full
filmstrip reactification.

* ref(connection-stats): rename statuses

* feat(connection-indicator): make hiding behavior configurable

The original implementation made the auto hiding of the indicator
configured in interfaceConfig.

* fix(connection-indicator): readd class expected by torture tests

* fix(connection-indicator): change connection quality display styling

Bold the connection summary in the stats popover so it stands out.
Change the summaries so there are only three--strong, nonoptimal,
poor.

* fix(connection-indicator): gray background on lost connection

* feat(icons): add new gsm bars icon

* feat(connection-indicator): use new 3-bar icon

* ref(icons): remove icon-connection and icon-connection-lost

Both have been replaced by icon-gsm-bars so they are not
being referenced anymore. Mobile looks to have connect-lost
as a separate icon in font-icons/jitsi.json.

* fix(defaultToolbarButtons): Fixes unresolved InfoDialogButton component problem

* [squash]: Makes invite button fit the container

* [squash]:Addressing invite truncate, remote menu position and comment

* [squash]:Fix z-index in horizontal mode, z-index in lonely call

* [squash]: Fix filmstripOnly property, remove important from css
2017-10-03 11:30:42 -05:00
Lyubo Marinov dfebd692f3 eslint 4.8.0
ESLint 4.8.0 discovers a lot of error related to formatting. While I
tried to fix as many of them as possible, a portion of them actually go
against our coding style. In such a case, I've disabled the indent rule
which effectively leaves it as it was before ESLint 4.8.0.

Additionally, remove jshint because it's becoming a nuisance with its
lack of understanding of ES2015+.
2017-10-02 18:12:38 -05:00
Lyubo Marinov 4bf19d73fd [RN] Fix documentation comments
* Javadoc introduced @code as a replacement of <code> and <tt> which is
  better aligned with other javadoc tags such as @link. Use it in the
  Java source code. If we switch to Kotlin, then we'll definitely use
  Markdown.

* There are more uses of @code in the JavaScript source code than <tt>
  so use @code for the sake of consistency. Eventually, I'd rather we
  switch to Markdown because it's easier on my eyes.

* Xcode is plain confused by @code and @link. The Internet says that
  Xcode supports the backquote character to denote the beginning and end
  of a string of characters which should be formatted for display as
  code but it doesn't work for me. <tt> is not rendered at all. So use
  the backquote which is rendered itself. Hopefully, if we switch to
  Markdown, then it'll be common between JavaScript and Objective-C
  source code.
2017-10-01 01:35:19 -05:00
virtuacoplenny cfe4564ab3 feat(info): automatically show the info dialog (#2018)
* ref(info): be able to open dialog through store

* feat(info): automatically show the info dialog

Conditions:
- Lonely call
- Has not opened the info dialog yet

* squash: change to show on start, hide later

* squash: update naming and comment
2017-09-29 15:27:23 -05:00
Lyubo Marinov 2e2129fa44 Import PropTypes from prop-types
Prepare for React 16.
2017-09-27 16:24:53 -05:00
Leonard Kim eae3bead87 fix(toolbar): fix proptype warning
The implementation of ToolbarButtonWithDialog expects a
constructor function for now, not the object returned
from calling a constructor function.
2017-09-26 11:56:43 -05:00
Leonard Kim 46b75e5178 ref(info): new component for showing meeting info 2017-09-25 08:42:00 -05:00
hristoterezov 66da77bcf5 fix(profile_button): unclickable 2017-09-24 21:50:30 -05:00
Lyubo Marinov 9049f52402 [RN] Allow share-room ToolbarButton to not be rendered 2017-09-07 12:49:35 -05:00
Lyubo Marinov d818436645 [RN] Fix import breakage caused by Web 2017-09-06 14:39:34 -05:00
Leonard Kim 31729d7949 feat(contact-list): convert to react
- Remove references to the model ContactList.
- Replace ContactListView with an empty element for attaching
  the React Component ContactListPanel, which has the same
  features as the old ContactListView.
- Create new selector for getting non-fake participants for
  ContactListPanel's props.
- Create a ParticipantCounter component to place in the contact
  list button. Previously ContactListView updated that but now
  it's a react component hooked into the participant state.
- Remove pub/sub that was used only by ContactListView.
2017-09-06 12:11:33 -05:00
Leonard Kim 05f8c69fe6 ref(toolbar): add wrapper around buttons for torture tests
The torture tests were looking for the anchor tag within each
button. However, that anchor could get blown away from a react
re-render. So instead, expose a way for the torture tests
to find the root node of the button.
2017-08-30 11:31:15 -05:00
Leonard Kim 7063f144ef feat(tooltips): add for video quality label and feedback button 2017-08-30 11:10:28 -05:00
Saúl Ibarra Corretgé 3102ea6818 [RN] Try to create local tracks when unmuting, if track is missing
This is only desired when the unmuting action took place due to a manual user
intervention or the audio-only mode being disengaged.
2017-08-22 07:28:19 -05:00
Leonard Kim 28b4595561 ref(tooltips): remove old tooltips 2017-08-21 15:16:09 -05:00
Leonard Kim e3361e2f3b feat(tooltips): convert popup tooltips to InlineDialog 2017-08-21 15:16:09 -05:00
Leonard Kim c3a4a38414 feat(toolbar): use AtlasKit tooltip 2017-08-21 15:16:09 -05:00
hristoterezov 5ef914602f fix(remotecontrol): Handle screen sharing cancel 2017-08-21 10:41:24 +01:00
Lyubo Marinov 90e7804834 Coding style 2017-08-18 14:47:15 -05:00
Paweł Domas 99ce46cfa8 feat(conference, toolbox, API) get rid of {audio,video}Muted' flags
* ref: video muted state

Get rid of 'videoMuted' flag in conference.js

* ref: audio muted state

Get rid of 'audioMuted' flag in conference.js

* fix(conference.js|API): early audio/video muted updates

* ref(conference.js): rename isVideoMuted

Rename isVideoMuted to isLocalVideoMuted to be consistent with
isLocalAudioMuted.

* doc|style(conference.js): comments and space after if

* ref: move 'setTrackMuted' to functions

* fix(tracks/middleware): no-lonely-if

* ref(features/toolbox): get rid of last argument

* ref(defaultToolbarButtons): rename var
2017-08-18 13:30:30 +02:00
Lyubo Marinov c1fbbc4571 Reduce duplication 2017-08-16 16:28:39 -05:00
yanas 3d397a28e6 Updates default avatar image 2017-08-16 14:42:41 -05:00
Saúl Ibarra Corretgé 2e3a5b1c35 [RN] Fix jsdocs 2017-08-14 12:23:46 +02:00
hristoterezov 1782030936 feat(alwaysontop): Toolbar. 2017-08-11 17:07:24 -07:00
hristoterezov b81dc4e59b ref(toolbar): Implement stateless toolbar 2017-08-11 17:07:24 -07:00
hristoterezov 53f675fbe0 ref(ToolbarButton): Remove unnecessary check. 2017-08-11 17:07:24 -07:00
hristoterezov f18b42b286 fix(ToolbarButton): Don't register shortcut if APP is not defined. 2017-08-11 17:07:24 -07:00
hristoterezov 91e75bf7b9 ref(UIUtil): Move all tooltip functions into another file 2017-08-11 17:07:24 -07:00
hristoterezov fe59084979 ref(isButtonEnable): UIUtil -> toolbox 2017-08-11 17:07:24 -07:00
hristoterezov 025f7204d5 ref(ToolbarButton): Remove dispatch 2017-08-11 17:07:24 -07:00
virtuacoplenny d8cd3e75b4 feat(quality-slider): initial implementation (#1817)
* feat(quality-slider): initial implementation

- Add new menu button with an Inline Dialog slider for
  selecting received video quality.
- Place P2P status in redux store for the Inline Dialog
  to display a warning about not respecting video quality
  selection.
- Respond to data channel open events by setting receive
  video quality. This is for lonely call cases where a
  setting is set before the data channel is open.
- Remove dropdown menu from video status label and clean
  up related js and css.

* first pass at addressing feedback

- Move VideoStatusLabel to video-quality directory.
- Rename VideoStatusLabel to VideoQualityLabel.
- Open VideoQualitydialog from VideoQualityLabel.
- New CSS for making VideoQualityLabel display properly.
- Do not render VideoQualityLabel in filmstrip only instead of hiding with css.
- Remove tooltip from VideoQualityLabel.
- Show LD, SD, HD labels in VideoQualityLabel.
- Remove action SET_LARGE_VIDEO_HD_STATUS from conference.
- Create new action UPDATE_KNOWN_LARGE_VIDEO_RESOLUTION in large-video.
- Move VideoQualityButton into video-quality directory.
- General renaming (medium -> standard, menu -> dialog).
- Render P2P message between title and slider.
- Add padding to slider for displacement caused by P2P message's new placement.
- Fix display issue with VideoQualityButton displaying out of line in the
  primary toolbar.

* second pass at addressing feedback

- Fix p2p inline message color
- Force labels to break on words
- Resolve rebase issues, including only dispatching quality
  update on change. Before there was double calling of dispatch
  produced by an IE11 workaround. This breaks now when setting
  audio only mode to true twice.
- Rename some instances of quality to definition

* rename to data channel opened

* do not show p2p in audio only

* stop toggle audio only icon automatically

* remove fixme about toolbar button

* find closest resolution for label

* toggle dialog on button click

* redo last commit for both button and label
2017-08-09 14:40:03 -05:00
virtuacoplenny ff442853a2 feat(feedback): convert to react and redux (#1833)
* feat(feedback): convert to react and redux

- For styles, remove "aui-dialog2" nesting so existing styles
  can be reused.
- Remove Feedback.js and replace with calls to redux for state
  storing and accessing.
- Add dispatching to FeedbackButton instead of relying on jquery
  clicking handling so the button can be hooked into redux.

* address feedback

* remove calling to not show feedback for recorder and filmstrip
2017-08-07 11:20:44 -05:00
Lyubo Marinov 85a168d51b [RN] base/media is intent, base/tracks is reality 2017-08-04 16:07:48 -05:00
paweldomas 68f4a4ae9f ref: enable/disable microphone button
Make toolbar's microphone button enabled whenever there are any
'audioinput' devices available and allow to add audio during
the conference even if microphone permissions were denied on startup.
2017-07-28 12:06:42 -05:00
yanas b0ffe2e63f Remove primary toolbar splitter (#1811) 2017-07-21 14:21:39 -07:00
Lyubo Marinov 0b5431b795 [RN] Bind event handler once per instance, not per render 2017-07-19 16:33:57 -05:00
Lyubo Marinov e7fc4739c4 Fixes jsdocs 2017-07-19 16:25:06 -05:00
Saúl Ibarra Corretgé f72932d125 [RN] Fix audio / video mute buttons when permissions are not granted 2017-07-19 14:38:38 +02:00
Saúl Ibarra Corretgé ffc12ccc0e [RN] Disable camera switch button when video is muted 2017-07-19 14:30:36 +02:00
Saúl Ibarra Corretgé 03da40b56a [RN] Disable video mute and camera switch buttons when in audio only mode 2017-07-19 11:58:08 +02:00
Saúl Ibarra Corretgé 055df1c12e [RN] Add ability to disable a ToolbarButton 2017-07-19 11:50:24 +02:00
Lyubo Marinov 72691eb2dc misc: fix dispatching actions twice when mapDispatchToProps is used 2017-07-17 13:59:04 -05:00
Saúl Ibarra Corretgé 0bf9a78e4c misc: fix dispatching actions twice when mapDispatchToProps is used
The functions need not return anything, or it will be dispatched as another
action.
2017-07-17 13:51:35 -05:00
Lyubo Marinov 7f041170f7 Consistent formatting 2017-07-16 03:44:07 -05:00
paweldomas b84e910086 feat: add option to disable desktop sharing
config.disableDesktopSharing - when set to false will disable desktop
sharing

interfaceConfig.DESKTOP_SHARING_BUTTON_DISABLED_TOOLTIP - when value is
assigned, will not hide the desktop sharing button completely, but show
as disabled with this value used as the tooltip text.
2017-07-14 10:14:00 -05:00
paweldomas 2281b1acd2 ref: enable/disable video button
Dynamically enables/disables the toolbar video button. Prior to that
commit if we would start with no video there would be no way to enable
it later on.
2017-07-12 10:29:18 -07:00
yanas f5d443d194 User Picker Implementation 2017-07-10 09:56:38 -07:00
Saúl Ibarra Corretgé f878f54b4d [RN] Toggle audio-only icon based on state 2017-07-06 17:18:49 -05:00
Saúl Ibarra Corretgé 46a87e42ce [RN] Update audio-only icon
Match the one on the web.
2017-07-06 17:14:00 -05:00
virtuacoplenny 84ae7df8f1 fix(filmstrip-only): vertically align center the toolbar (#1700)
* 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
2017-07-05 21:07:00 -05:00
Lyubo Marinov ca94563c51 [RN] Coding style
The files styles.js are used (pretty much) on React Native only and each
of them exports 1 name. Export it as default to cut down on source code.
2017-06-10 18:07:51 -05:00
Saúl Ibarra Corretgé f6ccacb7df [RN] Fix regression handling ToolbarButton onPress
Introduced in
96e83989a5
as part of a refactor + feature.
2017-06-08 09:36:58 -05:00
hristoterezov 96e83989a5 feat(device_selection): Implement popup 2017-06-07 09:23:40 -05:00
Lyubo Marinov d437f3db03 [React] Call/ring overlay
Rewrite the non-React RingOverlay into the React Component CallOverlay
in a way which makes it easier to port to React Native.
2017-06-06 00:11:39 -05:00
yanas a59e691ba8 Removes redux compose utility function 2017-06-05 13:31:38 -05:00
Lyubo Marinov 87b488a12b Comply w/ coding style 2017-06-01 21:04:31 -05:00
Lyubo Marinov 4dc658c270 Fix 'Missing JSDoc comment  require-jsdoc' 2017-06-01 21:01:50 -05:00
yanas 1d34a50d2f Fix raise hand toggled state 2017-05-31 15:31:06 -05:00
yanas d1737745c2 Fix raise hand toggled state 2017-05-31 07:50:18 -05:00
Saúl Ibarra Corretgé 5304660e14 [RN] Polyfill Symbol 2017-05-26 16:37:22 -05:00
yanas 2855ea1500 Adds dial-out UI. 2017-05-23 09:00:40 -05:00
Leonard Kim a1476c68f1 fix(audio-only): remove button from toolbar and set label cursor
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.
2017-05-22 14:46:05 -05:00
Lyubo Marinov 3c31a60b32 Fix TypeError: Cannot read property 'isGuest' of undefined 2017-05-18 11:53:45 -05:00
Leonard Kim 816eef1702 fix(toolbox): Defensively check classNames when mapping button attributes 2017-05-11 14:35:33 -07:00
Ilya Daynatovich ab5c2e9ded Add jwt module to react 2017-05-09 00:21:14 -05:00
damencho 32ea2161eb Hides sip dialout button if configured to show it for non guest users. 2017-05-08 15:34:32 -05:00
Saúl Ibarra Corretgé 9ba3a1c4ff feat(conference): add audio only mode
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.
2017-05-05 09:27:59 -07:00
Leonard Kim 48626ee71b fix(toolbox): move default toolbox buttons logic to web only
toolbox/functions has functions that are specific only to web,
specifically defaultToolbarButtons. This has caused the native
build to attempt to bring in a web dependency which leads to a
build error. The fix for now is splitting web functions from
native functions to resolve the build error.
2017-05-02 12:01:54 -05:00
Leonard Kim 44b81b20e3 feat: convert invite dialog to react and redux
Converting the invite modal includes the following:
- Creating new react components to display InviteDialog. The
  main parent components are ShareLink and PasswordOverview,
  the later handles displaying lock state and password editing.
  These components do not make use of atlaskit as the component
  for input does not yet support readonly, so for consistency
  within the modal content no atlaskit was used.
- Using redux for keeping and accessing lock state instead of
  RoomLocker.
- Publicly exposing the redux action lockStateChanged for direct
  calling on lock events experienced on the web client.
- Removing Invite, InviteDialogView, and RoomLocker and references
  to them.
- Handling errors that occur when setting a password to preserve
  existing web funtionality.
2017-04-19 20:41:23 -05:00
Lyubo Marinov ae06a6ce41 Fix Recording regression caused by 'React Toolbar'
Saúl Ibarra Corretgé reported that Recording shows an error dialog
stating "There was an error connecting to your camera". Hristo Terezov
and Yana Stamcheva traced that the problem originates in
da4425b5c0
and, more specifically, is caused by a different order of execution due
to the move of the invocation of the function Recording.init.

The solution is to bring back the execution location of Recording.init.
2017-04-12 14:10:00 -05:00
Lyubo Marinov 1ec06f4bf0 React (Native) optimizations/performance
Remove toolbar button and icon style literals from the render method of
Toolbox.native.js.

Additionally, comply w/ coding style.
2017-04-11 12:00:41 -05:00
Saúl Ibarra Corretgé 849f93375c [RN] Use a handset icon for audio-only mode button 2017-04-11 16:15:33 +02:00
yanas 2ffef3bdda Fixes toolbar tooltip positioning 2017-04-10 09:37:10 -05:00
yanas 77b789e26a Implements a filmstrip-only mode for the toolbox 2017-04-10 09:36:25 -05:00
Saúl Ibarra Corretgé 54bb5f1879 [RN] Add ability to share the URL for a conference 2017-04-06 00:24:26 -05:00
Saúl Ibarra Corretgé 8fe3dce649 [RN] Add audio only mode for conferences
The behavior can be triggered with the toggleAudioOnly action, which is
currently fired with a button.

The following aspects of the conference will change when in audio only mode:

- local video is muted
- last N is set to 0 (effectively muting remote video)
- full-screen mode is exited
- audio mode is set to "audio chat" (default output is the earpiece)
- the wake lock is disengaged

One aspect not handled in this patch is disabling the video mute button while in
audio only mode. The user should not be able to turn back video on in that case.
2017-04-05 15:07:34 -05:00
Saúl Ibarra Corretgé f5973e0eee [RN] Fix toggling camera
When a new local video track is created an associated video capturer is created
for it. The cause for the freezes seems to be creating mutliple tracks (which
come with a video capturer each). Fix this by first disposing of the previous
video track before creating the new one.

Ref:
https://github.com/oney/react-native-webrtc/issues/209#issuecomment-281482869
2017-04-05 00:20:17 -05:00
Ilya Daynatovich bcbdaaa6ea Fix interface_config.js/interfaceConfig overriding
It got broken while rewriting the Web toolbar in React Toolbox. There is
a problem with the toolbars and how we construct the intialState of the
buttons. The _getInitialState() in the toolbox reducer gets the list of
buttons from interfaceConfig, but in fact interfaceConfig is meant to be
overriden in several very important cases. One of the cases being the
external API, which we use in several projects in production.
2017-04-04 17:00:39 -05:00
Lyubo Marinov 1e2d88cd5d React Toolbox 2017-04-03 13:29:33 -05:00