const bindScrollEvent = function (panel) {
    if (!scrollContainer) {
      const reposition = repositionHandler(true);
      const uiContainer = UiContainer.getUiContainer(panel);

      scrollContainer = editor.selection.getScrollContainer() || editor.getWin();
      DOM.bind(scrollContainer, 'scroll', reposition);
      DOM.bind(uiContainer, 'scroll', reposition);

      editor.on('remove', function () {
        DOM.unbind(scrollContainer, 'scroll', reposition);
        DOM.unbind(uiContainer, 'scroll', reposition);
      });
    }
  };

function calculateRelativePosition(ctrl, targetElm, rel) {
  let ctrlElm, pos, x, y, selfW, selfH, targetW, targetH, viewport, size;

  viewport = getWindowViewPort();

  // Get pos of target
  pos = DomUtils.getPos(targetElm, UiContainer.getUiContainer(ctrl));
  x = pos.x;
  y = pos.y;

  if (isFixed(ctrl) && isStatic(document.body)) {
    x -= viewport.x;
    y -= viewport.y;
  }

  // Get size of self
  ctrlElm = ctrl.getEl();
  size = DomUtils.getSize(ctrlElm);
  selfW = size.width;
  selfH = size.height;

  // Get size of target
  size = DomUtils.getSize(targetElm);
  targetW = size.width;
  targetH = size.height;

  // Parse align string
  rel = (rel || '').split('');

  // Target corners
  if (rel[0] === 'b') {
    y += targetH;
  }

  if (rel[1] === 'r') {
    x += targetW;
  }

  if (rel[0] === 'c') {
    y += Math.round(targetH / 2);
  }

  if (rel[1] === 'c') {
    x += Math.round(targetW / 2);
  }

  // Self corners
  if (rel[3] === 'b') {
    y -= selfH;
  }

  if (rel[4] === 'r') {
    x -= selfW;
  }

  if (rel[3] === 'c') {
    y -= Math.round(selfH / 2);
  }

  if (rel[4] === 'c') {
    x -= Math.round(selfW / 2);
  }

  return {
    x,
    y,
    w: selfW,
    h: selfH
  };
}

const getViewPortRect = (ctrl) => {
  const customUiContainer = UiContainer.getUiContainer(ctrl);
  return customUiContainer && !isFixed(ctrl) ? getUiContainerViewPort(customUiContainer) : getWindowViewPort();
};

        value = max - size;
        return value < 0 ? 0 : value;
      }

      return value;
    }

    if (self.settings.constrainToViewport) {
      const viewPortRect = getViewPortRect(this);
      const layoutRect = self.layoutRect();

      x = constrain(x, viewPortRect.w + viewPortRect.x, layoutRect.w);
      y = constrain(y, viewPortRect.h + viewPortRect.y, layoutRect.h);
    }

    const uiContainer = UiContainer.getUiContainer(self);
    if (uiContainer && isStatic(uiContainer) && !isFixed(self)) {
      x -= uiContainer.scrollLeft;
      y -= uiContainer.scrollTop;
    }

    // We need to transpose by 1x1 on all browsers when using a ui container for some odd reason
    if (uiContainer) {
      x += 1;
      y += 1;
    }

    if (self.state.get('rendered')) {
      self.layoutRect({ x, y }).repaint();
    } else {
      self.settings.x = x;

    if (settings.hidden) {
      self.hide();
    }
  },

  // Will generate getter/setter methods for these properties
  Properties: 'parent,name',

  /**
   * Returns the root element to render controls into.
   *
   * @method getContainerElm
   * @return {Element} HTML DOM element to render into.
   */
  getContainerElm () {
    const uiContainer = UiContainer.getUiContainer(this);
    return uiContainer ? uiContainer : DomUtils.getContainer();
  },

  /**
   * Returns a control instance for the current DOM element.
   *
   * @method getParentCtrl
   * @param {Element} elm HTML dom element to get parent control from.
   * @return {tinymce.ui.Control} Control instance or undefined.
   */
  getParentCtrl (elm) {
    let ctrl;
    const lookup = this.getRoot().controlIdLookup;

    while (elm && lookup) {