/**
 * Function to get element positioning.
 * @param el HTMLElement to the offset for.
 * @returns A object with the distance of element from the top, left and bottom edge of the screen.
 */
const getOffset = (el: HTMLElement) => {
  const rect = el.getBoundingClientRect();
  return {
    left: rect.left + window.scrollX,
    top: rect.top + window.scrollY,
    bottom: window.innerHeight - rect.bottom,
  };
};

/**
 * Function to determine wheter a element is overflowing compared to its parent.
 * We must compare it to the parent element, since the `element.scrollWidth`-property does not behave the same in all browsers. 
 * @param child Children to check if it's overflowing.
 * @param parent Parent that contains child.
 * @returns Wheter the child element is bigger than the parent and therefore overflowing.
 */
const elementIsOverflowing = (child: HTMLElement, parent: HTMLElement): boolean => {
  const TOLERANCE = 2;
  return child.offsetWidth - TOLERANCE > parent.offsetWidth;
};
export { getOffset, elementIsOverflowing };
