From 3a537d7500f51ace7f327fae299a27d3105deec5 Mon Sep 17 00:00:00 2001 From: Serraniel Date: Sun, 15 Nov 2020 21:54:21 +0100 Subject: [PATCH] #49 working better position calculation --- .../enhancements/settingsOptimization.js | 25 ++++++++++++++++--- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/src/javascript/enhancements/settingsOptimization.js b/src/javascript/enhancements/settingsOptimization.js index 2e2d4ef..509e877 100644 --- a/src/javascript/enhancements/settingsOptimization.js +++ b/src/javascript/enhancements/settingsOptimization.js @@ -23,11 +23,28 @@ export function init() { } function changeTooltipDirection(tooltip) { - const DIRECTION_ATTRIBUTE = 'md-direction'; + // setting direction to right and changing classes to right don´t fix the position so we have to set it manually to the fix values: - let directionStr = tooltip.getAttribute(DIRECTION_ATTRIBUTE); + // find div which belongs to the tooltip: + let div = document.querySelector(`[aria-label="${tooltip.innerText}"]`); + if (helper.assigned(div)) { + // for completness change the attributes and classes at first + tooltip.setAttribute('md-direction', 'right'); + tooltip.classList.replace('md-origin-top', 'md-origin-right') - if (directionStr === 'top') { - tooltip.setAttribute(DIRECTION_ATTRIBUTE, 'right'); + // getting bounding rect + let divBounds = div.getBoundingClientRect(); + + console.debug(divBounds) // you´ll need this if they unluckily change their css or anything + // set new position + tooltip.style.left = `${divBounds.right + 0}px`; + tooltip.style.top = `${divBounds.top + 18}px`; // don´t ask why but aligning it to the divs top will place it above the div and 18px seem to be a working offset... + + + // they also will help debugging if they change something unlucky + console.debug(tooltip); + console.debug(tooltip.style.left); + console.debug(tooltip.style.top); + console.debug('---------') } } \ No newline at end of file