gsadmin/pulse
1
0
Fork 0
mirror of https://github.com/rcourtman/Pulse.git synced 2026-09-10 10:35:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: resolve stuck tooltip issue with improved event handling

Browse Source 
- Fixed handleMouseOut to properly detect when leaving tooltip triggers
- Added document mouseleave handler to hide tooltips when mouse leaves viewport
- Added scroll event handler to prevent tooltips getting stuck during scrolling
- Improved event handling to prevent premature tooltip hiding from child element bubbling

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
courtmanr@gmail.com
2025-05-31 22:04:40 +01:00
parent 938947bd00
commit 2b2b2680e8
1 changed files with 22 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/public/js/tooltips.js
+22 -9
View File
@@ -22,6 +22,12 @@ PulseApp.tooltips = (() => {
document.body.addEventListener('mouseout', handleMouseOut);
document.body.addEventListener('mousemove', handleMouseMove);
// Hide tooltip when mouse leaves the document
document.addEventListener('mouseleave', hideTooltip);
// Hide tooltip on scroll to prevent stuck tooltips
window.addEventListener('scroll', hideTooltip, true);
document.addEventListener('mouseup', hideSliderTooltip);
document.addEventListener('touchend', hideSliderTooltip);
}
@@ -51,21 +57,28 @@ PulseApp.tooltips = (() => {
}
function handleMouseOut(event) {
const target = event.target.closest('.metric-tooltip-trigger, .storage-tooltip-trigger');
if (target && tooltipElement) {
const target = event.target.closest('[data-tooltip], .metric-tooltip-trigger, .storage-tooltip-trigger, .truncate');
if (!target) return;
// Check if we're actually leaving the tooltip trigger element
const relatedTarget = event.relatedTarget;
if (relatedTarget && target.contains(relatedTarget)) {
return; // We're still within the same tooltip trigger
}
if (tooltipElement) {
tooltipElement.classList.add('hidden', 'opacity-0');
tooltipElement.classList.remove('opacity-100');
}
}
function handleMouseMove(event) {
const target = event.target.closest('.metric-tooltip-trigger, .storage-tooltip-trigger');
if (tooltipElement && !tooltipElement.classList.contains('hidden') && target) {
positionTooltip(event);
} else if (tooltipElement && !tooltipElement.classList.contains('hidden') && !target) {
// Optional: Hide if moving away from a trigger element while tooltip is still visible
// tooltipElement.classList.add('hidden', 'opacity-0');
// tooltipElement.classList.remove('opacity-100');
if (tooltipElement && !tooltipElement.classList.contains('hidden')) {
const target = event.target.closest('[data-tooltip], .metric-tooltip-trigger, .storage-tooltip-trigger, .truncate');
if (target) {
positionTooltip(event);
}
// Don't hide on mousemove - let mouseout handle it properly
}
}