export default function SchemaBulletPointsInit() {
  const focusBulletPoints = document.querySelectorAll('.homegrade-blocks-focus-point-bullet');
  if (!focusBulletPoints) return;

  focusBulletPoints.forEach((focusPoint) => {
    const focusPointsContainer = focusPoint.parentElement;

    focusPoint.addEventListener('mouseover', (event) => {
      const aleradyHoveredFocusPoint = document.querySelector('[data-hovered]');
      console.log(aleradyHoveredFocusPoint);

      const focusTitle = focusPoint.getAttribute('data-focus-bullet-title');

      const focusPointPopupContainer = document.createElement('div');
      focusPointPopupContainer.className = 'focus-point-popup-container';

      const focusPointPopupTitle = document.createElement('h4');
      focusPointPopupTitle.textContent = focusTitle;
      focusPointPopupTitle.className = 'focus-point-popup-container__title';

      focusPointPopupContainer.appendChild(focusPointPopupTitle);
      focusPoint.appendChild(focusPointPopupContainer);
      focusPoint.setAttribute('data-hovered', '');
    });

    focusPoint.addEventListener('mouseout', function () {
      const focusPointPopupContainer = focusPoint.querySelector('.focus-point-popup-container');
      focusPointPopupContainer.remove();
    });
  });
}