Browse Source

fix(Toolbox): Fix toolbox display when accessing it via keyboard

master
Mihai-Andrei Uscat 4 years ago
parent
commit
8aae2065dc
No account linked to committer's email address
1 changed files with 17 additions and 1 deletions
  1. 17
    1
      react/features/toolbox/components/web/Toolbox.js

+ 17
- 1
react/features/toolbox/components/web/Toolbox.js View File

73
 import {
73
 import {
74
     setFullScreen,
74
     setFullScreen,
75
     setOverflowMenuVisible,
75
     setOverflowMenuVisible,
76
-    setToolbarHovered
76
+    setToolbarHovered,
77
+    setToolboxVisible
77
 } from '../../actions';
78
 } from '../../actions';
78
 import { isToolboxVisible } from '../../functions';
79
 import { isToolboxVisible } from '../../functions';
79
 import DownloadButton from '../DownloadButton';
80
 import DownloadButton from '../DownloadButton';
238
         this._onMouseOver = this._onMouseOver.bind(this);
239
         this._onMouseOver = this._onMouseOver.bind(this);
239
         this._onResize = this._onResize.bind(this);
240
         this._onResize = this._onResize.bind(this);
240
         this._onSetOverflowVisible = this._onSetOverflowVisible.bind(this);
241
         this._onSetOverflowVisible = this._onSetOverflowVisible.bind(this);
242
+        this._onTabIn = this._onTabIn.bind(this);
241
 
243
 
242
         this._onShortcutToggleChat = this._onShortcutToggleChat.bind(this);
244
         this._onShortcutToggleChat = this._onShortcutToggleChat.bind(this);
243
         this._onShortcutToggleFullScreen = this._onShortcutToggleFullScreen.bind(this);
245
         this._onShortcutToggleFullScreen = this._onShortcutToggleFullScreen.bind(this);
368
             <div
370
             <div
369
                 className = { rootClassNames }
371
                 className = { rootClassNames }
370
                 id = 'new-toolbox'
372
                 id = 'new-toolbox'
373
+                onFocus = { this._onTabIn }
371
                 onMouseOut = { this._onMouseOut }
374
                 onMouseOut = { this._onMouseOut }
372
                 onMouseOver = { this._onMouseOver }>
375
                 onMouseOver = { this._onMouseOver }>
373
                 <div className = 'toolbox-background' />
376
                 <div className = 'toolbox-background' />
698
         this._doToggleScreenshare();
701
         this._doToggleScreenshare();
699
     }
702
     }
700
 
703
 
704
+    _onTabIn: () => void;
705
+
706
+    /**
707
+     * Toggle the toolbar visibility when tabbing into it.
708
+     *
709
+     * @returns {void}
710
+     */
711
+    _onTabIn() {
712
+        if (!this.props._visible) {
713
+            this.props.dispatch(setToolboxVisible(true));
714
+        }
715
+    }
716
+
701
     _onToolbarOpenFeedback: () => void;
717
     _onToolbarOpenFeedback: () => void;
702
 
718
 
703
     /**
719
     /**

Loading…
Cancel
Save