mirrors/breakout71
1
0
Fork 0
mirror of https://gitlab.com/lecarore/breakout71.git synced 2025-06-15 18:54:47 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Build 29058459

Browse source
This commit is contained in:
Renan LE CARO 2025-04-01 13:39:09 +02:00
parent b19cc5c0b4
commit de99dd9ba8
17 changed files with 160 additions and 147 deletions
Download patch file Download diff file Expand all files Collapse all files

78
src/tooltip.ts
View file

@ -1,39 +1,49 @@
import {isOptionOn} from "./options";
import { isOptionOn } from "./options";
export function setupTooltips() {
const tooltip = document.getElementById('tooltip') as HTMLDivElement
if (isOptionOn('mobile-mode')) {
tooltip.style.display = 'none';
return
}
const tooltip = document.getElementById("tooltip") as HTMLDivElement;
if (isOptionOn("mobile-mode")) {
tooltip.style.display = "none";
return;
}
function updateTooltipPosition(e:MouseEvent){
tooltip.style.transform=`translate(${e.clientX}px,${e.clientY + 20}px) `+(e.clientX > window.innerWidth / 2 ? ' translate(-100%,0)':'')
}
document.body.addEventListener('mouseenter', (e:MouseEvent) => {
let parent: HTMLElement | null = e.target as HTMLElement
while (parent && !parent.hasAttribute('data-tooltip')) {
parent = parent.parentElement
}
if (parent?.hasAttribute('data-tooltip')) {
tooltip.innerHTML = parent?.getAttribute('data-tooltip')
tooltip.style.display = '';
updateTooltipPosition(e)
}else{
tooltip.style.display = 'none';
}
}, true)
document.body.addEventListener('mousemove', e => {
if (!tooltip.style.display) {
updateTooltipPosition(e)
}
}, true)
document.body.addEventListener('mouseleave', e => {
// tooltip.style.display = 'none';
}, true)
function updateTooltipPosition(e: MouseEvent) {
tooltip.style.transform =
`translate(${e.clientX}px,${e.clientY + 20}px) ` +
(e.clientX > window.innerWidth / 2 ? " translate(-100%,0)" : "");
}
document.body.addEventListener(
"mouseenter",
(e: MouseEvent) => {
let parent: HTMLElement | null = e.target as HTMLElement;
while (parent && !parent.hasAttribute("data-tooltip")) {
parent = parent.parentElement;
}
if (parent?.hasAttribute("data-tooltip")) {
tooltip.innerHTML = parent?.getAttribute("data-tooltip");
tooltip.style.display = "";
updateTooltipPosition(e);
} else {
tooltip.style.display = "none";
}
},
true,
);
document.body.addEventListener(
"mousemove",
(e) => {
if (!tooltip.style.display) {
updateTooltipPosition(e);
}
},
true,
);
document.body.addEventListener(
"mouseleave",
(e) => {
// tooltip.style.display = 'none';
},
true,
);
}