#49 working better position calculation

This commit is contained in:
Serraniel 2020-11-15 21:54:21 +01:00
parent 35ed51d3b2
commit 3a537d7500
Signed by: Serraniel
GPG key ID: 3690B4E7364525D3

View file

@ -23,11 +23,28 @@ export function init() {
} }
function changeTooltipDirection(tooltip) { 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') { // getting bounding rect
tooltip.setAttribute(DIRECTION_ATTRIBUTE, 'right'); 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('---------')
} }
} }