lucid-ui/lib/util/dom-helpers.js

A UI component library from AppNexus.

import _times from "lodash/times";
import _get from "lodash/get";
import _assign from "lodash/assign";
export function getAbsoluteBoundingClientRect(domNode) {
  if (!domNode) {
    throw new Error('getAbsoluteBoundingClientRect called without a domNode');
  }

  var elementRect = domNode && domNode.getBoundingClientRect();
  return {
    bottom: elementRect.bottom + window.pageYOffset,
    top: elementRect.top + window.pageYOffset,
    left: elementRect.left + window.pageXOffset,
    right: elementRect.right + window.pageXOffset,
    height: elementRect.height,
    width: elementRect.width
  };
}
export function scrollParentTo(domNode) {
  var additionalOffset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;

  if (domNode) {
    var parentElement = domNode.parentElement;

    if (parentElement) {
      if (parentElement.scrollTop > domNode.offsetTop - additionalOffset) {
        // if the top of the node is above the scroll line,
        // align to top
        parentElement.scrollTop = domNode.offsetTop - additionalOffset;
      } else if (parentElement.scrollTop + parentElement.clientHeight < domNode.offsetTop + domNode.offsetHeight) {
        // else if the bottom of the node is below the fold,
        // align to bottom
        parentElement.scrollTop = domNode.offsetHeight - (parentElement.clientHeight - domNode.offsetTop);
      } // else don't need to align anything

    }
  }
}
export function dispatchDOMEvent(node, eventName, assignedEventProps) {
  var event = document.createEvent('Event');
  event.initEvent(eventName, true, true);
  node.dispatchEvent(_assign(event, assignedEventProps));
  return event;
}
/**
 * sharesAncestor
 *
 * Recursively looks at `node` and its parents for `nodeName` and makes
 * sure it contains `siblingNode`.
 *
 * @param {Node} node - dom node to check if any of its ancestors are a `<label>`
 * @param {Node} siblingNode - dom node to see if it shares an ancestor
 * @param {string} nodeName - dom node name, should be uppercased, e.g. `LABEL` or `SPAN`
 * @returns {boolean}
 */

export function sharesAncestor(node, siblingNode, nodeName) {
  var currentNodeName = _get(node, 'nodeName');

  var parentElement = _get(node, 'parentElement');

  if (currentNodeName === nodeName) {
    return node.contains(siblingNode);
  }

  if (parentElement) {
    return sharesAncestor(parentElement, siblingNode, nodeName);
  }

  return false;
}
export function shiftChildren(parent) {
  var n = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;

  if (n < 0) {
    _times(Math.abs(n), function () {
      parent.appendChild(parent.children[0]);
    });
  } else if (n > 0) {
    _times(n, function () {
      parent.insertBefore(parent.children[parent.children.length - 1], parent.children[0]);
    });
  }
}