feat(toolbar): add 'always-visibile' config option

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.

config.js

 
     // List of undocumented settings used in jitsi-meet
     /**
-     alwaysVisibleToolbar
      autoRecord
      autoRecordToken
      debug

interface_config.js

     DESKTOP_SHARING_BUTTON_DISABLED_TOOLTIP: null,
     INITIAL_TOOLBAR_TIMEOUT: 20000,
     TOOLBAR_TIMEOUT: 4000,
+    TOOLBAR_ALWAYS_VISIBLE: false,
     DEFAULT_REMOTE_DISPLAY_NAME: 'Fellow Jitster',
     DEFAULT_LOCAL_DISPLAY_NAME: 'me',
     SHOW_JITSI_WATERMARK: true,

react/features/base/config/functions.js

     '_peerConnStatusOutOfLastNTimeout',
     '_peerConnStatusRtcMuteTimeout',
     'abTesting',
-    'alwaysVisibleToolbar',
     'autoRecord',
     'autoRecordToken',
     'avgRtpStatsN',

react/features/conference/components/Conference.native.js

      *
      * @private
      */
-    _toolboxVisible: boolean
+    _toolboxVisible: boolean,
+
+    /**
+     * The indicator which determines whether the Toolbox is always visible.
+     *
+     * @private
+     */
+    _toolboxAlwaysVisible: boolean
 };
 
 /**
      * @returns {void}
      */
     _onClick() {
+        if (this.props._toolboxAlwaysVisible) {
+            return;
+        }
+
         const toolboxVisible = !this.props._toolboxVisible;
 
         this.props._setToolboxVisible(toolboxVisible);
  *     _connecting: boolean,
  *     _participantCount: number,
  *     _reducedUI: boolean,
- *     _toolboxVisible: boolean
+ *     _toolboxVisible: boolean,
+ *     _toolboxAlwaysVisible: boolean
  * }}
  */
 function _mapStateToProps(state) {
     const { connecting, connection } = state['features/base/connection'];
     const { conference, joining, leaving } = state['features/base/conference'];
     const { reducedUI } = state['features/base/responsive-ui'];
+    const { alwaysVisible, visible } = state['features/toolbox'];
 
     // XXX There is a window of time between the successful establishment of the
     // XMPP connection and the subsequent commencement of joining the MUC during
          * @private
          * @type {boolean}
          */
-        _toolboxVisible: state['features/toolbox'].visible
+        _toolboxVisible: visible,
+
+        /**
+         * The indicator which determines whether the Toolbox is always visible.
+         *
+         * @private
+         * @type {boolean}
+         */
+        _toolboxAlwaysVisible: alwaysVisible
     };
 }
 

react/features/conference/components/Conference.web.js

  */
 type Props = {
 
-    /**
-     * Whether the toolbar should stay visible or be able to autohide.
-     */
-    _alwaysVisibleToolbar: boolean,
-
     /**
      * Whether the local participant is recording the conference.
      */
         FULL_SCREEN_EVENTS.forEach(name =>
             document.addEventListener(name, this._onFullScreenChange));
 
-        const { _alwaysVisibleToolbar, dispatch, t } = this.props;
+        const { dispatch, t } = this.props;
 
         dispatch(connect());
+
         maybeShowSuboptimalExperienceNotification(dispatch, t);
 
-        dispatch(setToolboxAlwaysVisible(
-            _alwaysVisibleToolbar || interfaceConfig.filmStripOnly));
+        interfaceConfig.filmStripOnly
+            && dispatch(setToolboxAlwaysVisible(true));
     }
 
     /**
  * @param {Object} state - The Redux state.
  * @private
  * @returns {{
- *     _alwaysVisibleToolbar: boolean,
  *     _iAmRecorder: boolean
  * }}
  */
 function _mapStateToProps(state) {
-    const {
-        alwaysVisibleToolbar,
-        iAmRecorder
-    } = state['features/base/config'];
+    const { iAmRecorder } = state['features/base/config'];
 
     return {
-        /**
-         * Whether the toolbar should stay visible or be able to autohide.
-         *
-         * @private
-         */
-        _alwaysVisibleToolbar: alwaysVisibleToolbar,
-
         /**
          * Whether the local participant is recording the conference.
          *

react/features/toolbox/components/native/Toolbox.js

  * }}
  */
 function _mapStateToProps(state: Object): Object {
-    const { enabled, visible } = state['features/toolbox'];
+    const { alwaysVisible, enabled, visible } = state['features/toolbox'];
 
     return {
-        _visible: enabled && visible
+        _visible: enabled && (alwaysVisible || visible)
     };
 }
 

react/features/toolbox/reducer.js

  * }}
  */
 function _getInitialState() {
+    // Does the toolbar eventually fade out, or is it always visible?
+    let alwaysVisible = false;
+
+    // Toolbar (initial) visibility.
+    let visible = false;
+
     // Default toolbox timeout for mobile app.
     let timeoutMS = 5000;
 
-    if (typeof interfaceConfig !== 'undefined'
-            && interfaceConfig.INITIAL_TOOLBAR_TIMEOUT) {
-        timeoutMS = interfaceConfig.INITIAL_TOOLBAR_TIMEOUT;
+    if (typeof interfaceConfig !== 'undefined') {
+        if (interfaceConfig.INITIAL_TOOLBAR_TIMEOUT) {
+            timeoutMS = interfaceConfig.INITIAL_TOOLBAR_TIMEOUT;
+        }
+        if (typeof interfaceConfig.TOOLBAR_ALWAYS_VISIBLE !== 'undefined') {
+            alwaysVisible = interfaceConfig.TOOLBAR_ALWAYS_VISIBLE;
+        }
+    }
+
+    // When the toolbar is always visible, it must initially be visible too.
+    if (alwaysVisible === true) {
+        visible = true;
     }
 
     return {
         /**
          * The indicator which determines whether the Toolbox should always be
-         * visible.
+         * visible. When false, the toolbar will fade out after timeoutMS.
          *
          * @type {boolean}
          */
-        alwaysVisible: false,
+        alwaysVisible,
 
         /**
          * The indicator which determines whether the Toolbox is enabled.
          *
          * @type {boolean}
          */
-        visible: false
+        visible
     };
 }
 
         case SET_TOOLBOX_ALWAYS_VISIBLE:
             return {
                 ...state,
-                alwaysVisible: action.alwaysVisible
+                alwaysVisible: action.alwaysVisible,
+                visible: action.alwaysVisible === true ? true : state.visible
             };
 
         case SET_TOOLBOX_ENABLED: