From bbf483bbacbcb112f5fe42ff4c89ade0ef104c23 Mon Sep 17 00:00:00 2001
From: nholtman <NHoltman@a-vision.nu>
Date: Tue, 23 Apr 2024 12:28:21 +0200
Subject: [PATCH] Fix an issue where the initial button press does not work on
 a touch device (tested with chromebook in touch mode), due to the fact that
 the mouseenter event gets triggered when you click the button, causing both
 mouseevent and click event to trigger right after each other, making the
 click cancel out the touchenter event. It fixes it by keeping track of when
 the last displayType (hide / show) happened, and rejecting it when the time
 between the last one and the current one is less than 16 milliseconds ago.

---
 src/quality/quality.js | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/quality/quality.js b/src/quality/quality.js
index 97b5cd5..7e92438 100644
--- a/src/quality/quality.js
+++ b/src/quality/quality.js
@@ -194,7 +194,15 @@ Object.assign(MediaElementPlayer.prototype, {
 			labels = player.qualitiesContainer.querySelectorAll(`.${t.options.classPrefix}qualities-selector-label`)
 		;
 
+		let lastShowChange = Date.now();
 		function hideSelector() {
+			const now = Date.now();
+			const diff = now - lastShowChange;
+			if(diff < 16) {
+				return;
+			}
+			lastShowChange = now;
+			
 			mejs.Utils.addClass(qualitiesSelector, `${t.options.classPrefix}offscreen`);
 			qualityButton.setAttribute('aria-expanded', 'false');
 			qualityButton.focus();
@@ -202,6 +210,13 @@ Object.assign(MediaElementPlayer.prototype, {
 		}
 
 		function showSelector() {
+			const now = Date.now();
+			const diff = now - lastShowChange;
+			if(diff < 16) {
+				return;
+			}
+			lastShowChange = now;
+			
 			mejs.Utils.removeClass(qualitiesSelector, `${t.options.classPrefix}offscreen`);
 			qualitiesSelector.style.height = `${qualitiesSelector.querySelector('ul').offsetHeight}px`;
 			qualitiesSelector.style.top = `${(-1 * parseFloat(qualitiesSelector.offsetHeight))}px`;