mstoeck3/fscalc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update mouse ponter position

Browse Source
This commit is contained in:
overcuriousity 2025-10-21 20:50:09 +02:00
parent 17df1e80cc
commit 8cf8900784
1 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
webroot/js/utils.js
View File

@ -99,24 +99,23 @@ export function createTooltip() {
} }
} }
export function showTooltip(element, text) { export function showTooltipAt(x, y, text) {
createTooltip(); createTooltip();
tooltip.innerHTML = text; tooltip.innerHTML = text;
tooltip.style.display = 'block'; tooltip.style.display = 'block';
const rect = element.getBoundingClientRect();
const tooltipRect = tooltip.getBoundingClientRect(); const tooltipRect = tooltip.getBoundingClientRect();
let left = x + 12; // offset from mouse pointer
let top = y + 12;
let left = rect.left + (rect.width / 2) - (tooltipRect.width / 2);
let top = rect.top - tooltipRect.height - 8;
if (left < 10) left = 10;
if (left + tooltipRect.width > window.innerWidth - 10) { if (left + tooltipRect.width > window.innerWidth - 10) {
left = window.innerWidth - tooltipRect.width - 10; left = window.innerWidth - tooltipRect.width - 10;
} }
if (top < 10) { if (top + tooltipRect.height > window.innerHeight - 10) {
top = rect.bottom + 8; top = y - tooltipRect.height - 12;
} }
if (left < 10) left = 10;
if (top < 10) top = 10;
tooltip.style.left = left + 'px'; tooltip.style.left = left + 'px';
tooltip.style.top = top + 'px'; tooltip.style.top = top + 'px';
@ -130,17 +129,19 @@ export function hideTooltip() {
// Setup tooltip event listeners // Setup tooltip event listeners
export function setupTooltips() { export function setupTooltips() {
document.addEventListener('mouseover', function (e) { document.addEventListener('mousemove', function (e) {
if (e.target.classList.contains('result-label')) { if (e.target.classList.contains('result-label')) {
const formula = e.target.getAttribute('data-formula'); const formula = e.target.getAttribute('data-formula');
if (formula) { if (formula) {
showTooltip(e.target, `Formel: ${formula}`); showTooltipAt(e.clientX, e.clientY, `Formel: ${formula}`);
} }
} else if (e.target.classList.contains('result-value')) { } else if (e.target.classList.contains('result-value')) {
const formula = e.target.getAttribute('data-result-formula'); const formula = e.target.getAttribute('data-result-formula');
if (formula && formula !== '') { if (formula && formula !== '') {
showTooltip(e.target, `Berechnung: ${formula}`); showTooltipAt(e.clientX, e.clientY, `Berechnung: ${formula}`);
} }
} else {
hideTooltip();
} }
}); });