From fbc0bbfb6f7e80639c9d5288df632ead62938244 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 11 Feb 2019 16:17:15 +0100 Subject: [PATCH] clear hover flag after 1000ms of not moving the mouse as a fix for #8184 --- src/components/views/rooms/RoomList.js | 30 +++++++++++++++++++++++--- 1 file changed, 27 insertions(+), 3 deletions(-) diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 56eb4b713d..1d207835bc 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -17,6 +17,7 @@ limitations under the License. 'use strict'; import SettingsStore from "../../../settings/SettingsStore"; +import Timer from "../../../utils/Timer"; const React = require("react"); const ReactDOM = require("react-dom"); @@ -41,6 +42,7 @@ import {Resizer} from '../../../resizer'; import {Layout, Distributor} from '../../../resizer/distributors/roomsublist2'; const HIDE_CONFERENCE_CHANS = true; const STANDARD_TAGS_REGEX = /^(m\.(favourite|lowpriority|server_notice)|im\.vector\.fake\.(invite|recent|direct|archived))$/; +const HOVER_MOVE_TIMEOUT = 1000; function labelForTagName(tagName) { if (tagName.startsWith('u.')) return tagName.slice(2); @@ -73,6 +75,7 @@ module.exports = React.createClass({ getInitialState: function() { + this._hoverClearTimer = null; this._subListRefs = { // key => RoomSubList ref }; @@ -357,11 +360,32 @@ module.exports = React.createClass({ this.forceUpdate(); }, - onMouseEnter: function(ev) { - this.setState({hover: true}); + onMouseMove: async function(ev) { + if (!this._hoverClearTimer) { + this.setState({hover: true}); + this._hoverClearTimer = new Timer(HOVER_MOVE_TIMEOUT); + this._hoverClearTimer.start(); + let finished = true; + try { + await this._hoverClearTimer.finished(); + } catch (err) { + finished = false; + } + this._hoverClearTimer = null; + if (finished) { + this.setState({hover: false}); + this._delayedRefreshRoomList(); + } + } else { + this._hoverClearTimer.restart(); + } }, onMouseLeave: function(ev) { + if (this._hoverClearTimer) { + this._hoverClearTimer.abort(); + this._hoverClearTimer = null; + } this.setState({hover: false}); // Refresh the room list just in case the user missed something. @@ -774,7 +798,7 @@ module.exports = React.createClass({ return (
+ onMouseMove={this.onMouseMove} onMouseLeave={this.onMouseLeave}> { subListComponents }
);