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.

css/_videolayout_default.scss

@@ -496,7 +496,6 @@
 }
 
 .audio-only-label {
-    cursor: default;
     display: flex;
     height: auto;
     justify-content: center;
@@ -507,6 +506,7 @@
 .video-state-indicator {
     background: $videoStateIndicatorBackground;
     color: $videoStateIndicatorColor;
+    cursor: default;
     font-size: 13px;
     height: 40px;
     line-height: 20px;

interface_config.js

@@ -38,7 +38,7 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
         //main toolbar
         'microphone', 'camera', 'desktop', 'invite', 'fullscreen', 'hangup',
         //extended toolbar
-        'profile', 'contacts', 'chat', 'audioonly', 'recording', 'etherpad', 'sharedvideo', 'sip', 'settings', 'raisehand', 'filmstrip'], // jshint ignore:line
+        'profile', 'contacts', 'chat', 'recording', 'etherpad', 'sharedvideo', 'sip', 'settings', 'raisehand', 'filmstrip'], // jshint ignore:line
     /**
      * Main Toolbar Buttons
      * All of them should be in TOOLBAR_BUTTONS

react/features/toolbox/components/AudioOnlyButton.js

@@ -1,103 +0,0 @@
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-
-import { toggleAudioOnly } from '../../base/conference';
-
-import ToolbarButton from './ToolbarButton';
-
-/**
- * React {@code Component} for toggling audio only mode.
- *
- * @extends Component
- */
-class AudioOnlyButton extends Component {
-    /**
-     * {@code AudioOnlyButton}'s property types.
-     *
-     * @static
-     */
-    static propTypes = {
-        /**
-         * Whether or not audio only mode is enabled.
-         */
-        _audioOnly: React.PropTypes.bool,
-
-        /**
-         * Invoked to toggle audio only mode.
-         */
-        dispatch: React.PropTypes.func,
-
-        /**
-         * From which side the button tooltip should appear.
-         */
-        tooltipPosition: React.PropTypes.string
-    }
-
-    /**
-     * Initializes a new {@code AudioOnlyButton} instance.
-     *
-     * @param {Object} props - The read-only properties with which the new
-     * instance is to be initialized.
-     */
-    constructor(props) {
-        super(props);
-
-        // Bind event handlers so they are only bound once for every instance.
-        this._onClick = this._onClick.bind(this);
-    }
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        const buttonConfiguration = {
-            buttonName: 'audioonly',
-            classNames: [ 'button', 'icon-visibility' ],
-            enabled: true,
-            id: 'toolbar_button_audioonly',
-            tooltipKey: 'toolbar.audioonly'
-        };
-
-        if (this.props._audioOnly) {
-            buttonConfiguration.classNames.push('toggled button-active');
-        }
-
-        return (
-            <ToolbarButton
-                button = { buttonConfiguration }
-                onClick = { this._onClick }
-                tooltipPosition = { this.props.tooltipPosition } />
-        );
-    }
-
-    /**
-     * Dispatches an action to toggle audio only mode.
-     *
-     * @private
-     * @returns {void}
-     */
-    _onClick() {
-        this.props.dispatch(toggleAudioOnly());
-    }
-}
-
-/**
- * Maps (parts of) the Redux state to the associated {@code AudioOnlyButton}'s
- * props.
- *
- * @param {Object} state - The Redux state.
- * @private
- * @returns {{
- *     _audioOnly: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        _audioOnly: state['features/base/conference'].audioOnly
-    };
-}
-
-export default connect(_mapStateToProps)(AudioOnlyButton);

react/features/toolbox/components/index.js

@@ -1,2 +1 @@
-export { default as AudioOnlyButton } from './AudioOnlyButton';
 export { default as Toolbox } from './Toolbox';

react/features/toolbox/defaultToolbarButtons.js

@@ -6,8 +6,6 @@ import UIEvents from '../../../service/UI/UIEvents';
 
 import { openInviteDialog } from '../invite';
 
-import { AudioOnlyButton } from './components';
-
 declare var APP: Object;
 declare var config: Object;
 declare var JitsiMeetJS: Object;
@@ -44,14 +42,6 @@ function _showSIPNumberInput() {
  * All toolbar buttons' descriptors.
  */
 export default {
-    /**
-     * The descriptor of the audio only toolbar button. Defers actual
-     * descriptor implementation to the {@code AudioOnlyButton} component.
-     */
-    audioonly: {
-        component: AudioOnlyButton
-    },
-
     /**
      * The descriptor of the camera toolbar button.
      */

react/features/video-status-label/components/VideoStatusLabel.js

@@ -66,14 +66,10 @@ export class VideoStatusLabel extends Component {
     render() {
         const { _audioOnly, _conferenceStarted, _largeVideoHD, t } = this.props;
 
-        // FIXME These truthy checks should not be necessary. The
-        // _conferenceStarted check is used to be defensive against toggling
-        // audio only mode while there is no conference and hides the need for
-        // error handling around audio only mode toggling. The _largeVideoHD
-        // check is used to prevent the label from displaying while the video
-        // resolution status is unknown but ties this component to the
-        // LargeVideoManager.
-        if (!_conferenceStarted || _largeVideoHD === undefined) {
+        // FIXME The _conferenceStarted check is used to be defensive against
+        // toggling audio only mode while there is no conference and hides the
+        // need for error handling around audio only mode toggling.
+        if (!_conferenceStarted) {
             return null;
         }