document.addEventListener("DOMContentLoaded", function () {
  // Get reference to the popup element
  const popup = document.getElementById('popup');
  const facebookShareLink = document.getElementById('facebook-share');
  const twitterShareLink = document.getElementById('twitter-share');
  
  // Function to check if selection intersects with any <p> tag
  function isSelectionInParagraph(selection) {
      const range = selection.getRangeAt(0);  // Get the selected range
      const paragraphs = document.querySelectorAll('p');  // Get all <p> elements

      for (let p of paragraphs) {
          // Check if the selected range intersects with this <p> tag
          const pRect = p.getBoundingClientRect();
          const rangeRect = range.getBoundingClientRect();

          // Check if the range and the <p> element's bounding boxes overlap
          if (rangeRect.top < pRect.bottom && rangeRect.bottom > pRect.top && 
              rangeRect.left < pRect.right && rangeRect.right > pRect.left) {
              return true;  // Selection intersects with this <p> tag
          }
      }

      return false;  // No intersection with any <p> tag
  }

  // Function to show the popup near the selected text
  function showPopup(e) {
      const selection = window.getSelection();
      
      // Check if any text is selected and if it is inside or intersects with a <p> tag
      if (selection.toString().length > 0 && isSelectionInParagraph(selection)) {
          // Get the bounding rectangle of the selected text
          const range = selection.getRangeAt(0);
          const rect = range.getBoundingClientRect();
          
          // Position the popup above the selection (adjust for spacing)
          popup.style.left = `${rect.left + window.scrollX}px`;
          popup.style.top = `${rect.top + window.scrollY - popup.offsetHeight - 5}px`;
          
          // Show the popup
          popup.style.display = 'block';

          // Set up share links with the selected text and page URL
          const selectedText = selection.toString();
          const pageUrl = window.location.href;

          // Facebook share link
          facebookShareLink.setAttribute('href', `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(pageUrl)}&quote=${encodeURIComponent(selectedText)}`);
          
          // Twitter/X share link
          twitterShareLink.setAttribute('href', `https://twitter.com/intent/tweet?text=${encodeURIComponent(selectedText)}&url=${encodeURIComponent(pageUrl)}`);
      } else {
          // Hide the popup if no text is selected or it's not inside or overlapping a <p> tag
          popup.style.display = 'none';
      }
  }

  // Listen for mouse-up event (when selection ends)
  document.addEventListener('mouseup', showPopup);

  // Optionally, listen for touchend event for mobile devices
  document.addEventListener('touchend', showPopup);

  // Hide the popup if user clicks anywhere else
  document.addEventListener('click', function(event) {
    if (!popup.contains(event.target) && !window.getSelection().toString()) {
      popup.style.display = 'none';
    }
  });
});