From f77502f526c9cf8f86d09a416653e3cf5e98767a Mon Sep 17 00:00:00 2001
From: WMDE-Fisch <christoph.jauera@wikimedia.de>
Date: Wed, 6 Sep 2023 09:09:26 +0200
Subject: [PATCH] Move tooltip events to the tooltip creation

Change-Id: I0de2aa4fabde1d4a063373de26336ccf6c8bda5e
---
 .../ext.RevisionSlider.RevisionListView.js    | 38 ++++++++-----------
 1 file changed, 15 insertions(+), 23 deletions(-)

diff --git a/modules/ext.RevisionSlider.RevisionListView.js b/modules/ext.RevisionSlider.RevisionListView.js
index 46c97c05..d952698e 100644
--- a/modules/ext.RevisionSlider.RevisionListView.js
+++ b/modules/ext.RevisionSlider.RevisionListView.js
@@ -130,7 +130,6 @@ $.extend( RevisionListView.prototype, {
 				);
 		}
 
-		this.keepTooltipsOnHover();
 		this.closeTooltipsOnClick();
 
 		return this.$html;
@@ -233,18 +232,25 @@ $.extend( RevisionListView.prototype, {
 	 * Clears the current revision focus and removes highlights and tooltip
 	 */
 	removeCurrentRevisionFocus: function () {
-		window.clearTimeout( this.tooltipTimeout );
+		this.clearRevisionFocusDelay();
 		this.removeCurrentRevisionFocusHighlight();
 		$( '.mw-revslider-revision-tooltip' ).remove();
 	},
 
 	/**
-	 * Removes the current revision focus after 500ms
+	 * Removes the current revision focus after 750ms
 	 *
 	 * @private
 	 */
 	removeCurrentRevisionFocusWithDelay: function () {
-		this.tooltipTimeout = window.setTimeout( this.removeCurrentRevisionFocus.bind( this ), 500 );
+		this.tooltipTimeout = window.setTimeout( this.removeCurrentRevisionFocus.bind( this ), 750 );
+	},
+
+	/**
+	 * @private
+	 */
+	clearRevisionFocusDelay: function () {
+		window.clearTimeout( this.tooltipTimeout );
 	},
 
 	removeCurrentRevisionFocusHighlight: function () {
@@ -259,7 +265,7 @@ $.extend( RevisionListView.prototype, {
 	 */
 	setRevisionFocus: function ( $revisionWrapper ) {
 		if ( $revisionWrapper.hasClass( 'mw-revslider-revision-wrapper-hovered' ) ) {
-			window.clearTimeout( this.tooltipTimeout );
+			this.clearRevisionFocusDelay();
 			return;
 		}
 		this.removeCurrentRevisionFocus();
@@ -297,7 +303,10 @@ $.extend( RevisionListView.prototype, {
 		// eslint-disable-next-line mediawiki/class-doc
 		tooltip.$element
 			.addClass( 'mw-revslider-revision-tooltip-' + pos )
-			.on( 'focusout', this.onFocusBlur.bind( this ) );
+			.on( 'focusout', this.onFocusBlur.bind( this ) )
+			// Set event handlers so that tooltips do not disappear immediately when hover is gone
+			.on( 'mouseleave', this.removeCurrentRevisionFocusWithDelay.bind( this ) )
+			.on( 'mouseenter', this.clearRevisionFocusDelay.bind( this ) );
 
 		const $focusedRevisionPointer = $( '.mw-revslider-pointer[data-pos="' + pos + '"]' );
 		if ( $focusedRevisionPointer.length ) {
@@ -310,23 +319,6 @@ $.extend( RevisionListView.prototype, {
 		tooltip.toggle( true );
 	},
 
-	/**
-	 * Sets event handlers on tooltips so they do not disappear when hovering over them
-	 *
-	 * @private
-	 */
-	keepTooltipsOnHover: function () {
-		const self = this;
-
-		$( document )
-			.on( 'mouseenter', '.mw-revslider-revision-tooltip', function () {
-				window.clearTimeout( self.tooltipTimeout );
-			} )
-			.on( 'mouseleave', '.mw-revslider-revision-tooltip', function () {
-				self.removeCurrentRevisionFocusWithDelay();
-			} );
-	},
-
 	/**
 	 * Sets an event handler to close tooltips when clicking somewhere outside
 	 *