local-content-pro/script.js

document.addEventListener('DOMContentLoaded', function() {



// Select all elements with the class .lcpOpenLoginPopup
const openLoginButtons = document.querySelectorAll('.lcpOpenLoginPopup');
    
// Loop through all the elements with the .lcpOpenLoginPopup class
openLoginButtons.forEach(function(button) {
    button.addEventListener('click', function() {
        // Add the .open class to the #lcp-login-form when clicked
        const loginForm = document.getElementById('lcp-login-form');
        console.log("login form");
        if (loginForm) {
            loginForm.classList.add('open');
        }
    });
});

    // Get references to the DOM elements once
    const header = document.getElementById('lcp-header-container');
    const sideContent = document.getElementById('lcp-sidecontent');
    const mainContent = document.getElementById('lcp-main-content');
    const adminBarHeight = getAdminBarHeight(); // Get admin bar height

    // Ensure elements exist before applying logic
    if (!header || !sideContent || !mainContent) return;

    // Update position of side content and adjust margin of main content based on header lcp-sticky class
    updateSideContentPosition(header, sideContent, adminBarHeight);
    adjustMainContentMargin(header, mainContent, adminBarHeight);

    // Ensure the header and side content are properly positioned on page load
    handleInitialPageLoad(header, sideContent, adminBarHeight);

    // Debounce the scroll handler to limit the frequency of the function calls
    const debouncedScroll = debounce(() => handleScroll(header, sideContent, adminBarHeight), 10); // 10ms debounce delay
    
    // Add the scroll event listener
    window.addEventListener('scroll', debouncedScroll);

    // Add the resize event listener
    window.addEventListener('resize', debounce(function() {
        updateSideContentPosition(header, sideContent, adminBarHeight);
        adjustMainContentMargin(header, mainContent, adminBarHeight);
    }, 0)); // 0ms debounce delay



    // Optional: Popup auto-open after a delay (e.g., 2 seconds)
    setTimeout(function() {
        var popups = document.querySelectorAll('.lcp-popup');
        popups.forEach(function(popup) {
            // Uncomment the line below if you want the popup to auto-open
            // popup.classList.add('open');
        });
    }, 2000); // 2 seconds delay

});

// Function to get the height of the admin bar if it's visible
function getAdminBarHeight() {
    const adminBar = document.getElementById('wpadminbar');
    return adminBar ? adminBar.offsetHeight : 0; // Returns 32px if admin bar is present, 0 if not
}

// Function to update the position of side content
function updateSideContentPosition(header, sideContent, adminBarHeight) {
    const headerHeight = header.offsetHeight;
    // If the header has the 'lcp-sticky' or 'lcp-sticky-on-scroll' class, position side content below it, considering the admin bar height
    if (header.classList.contains('lcp-sticky') || header.classList.contains('lcp-sticky-on-scroll')) {
        sideContent.style.top = (headerHeight + adminBarHeight) + 'px'; // Update side content position
    }
}

// Function to adjust margin-top of the main content
function adjustMainContentMargin(header, mainContent, adminBarHeight) {
    if (header.classList.contains('lcp-sticky')) {
        const headerHeight = header.offsetHeight;
        mainContent.style.marginTop = (headerHeight + adminBarHeight) + 'px'; // Set margin-top to header + admin bar height
    }
}

// Debounce function to limit the frequency of function calls
function debounce(func, delay) {
    let timeout;
    return function (...args) {
        clearTimeout(timeout);
        timeout = setTimeout(() => {
            func.apply(this, args);
        }, delay);
    };
}

// Scroll handler function to update the 'scrolled' variable and toggle the lcp-sticky class
function handleScroll(header, sideContent, adminBarHeight) {
    const scrolled = window.scrollY || document.documentElement.scrollTop;
    const headerHeight = header.offsetHeight;

    // Add 'lcp-fixed' class to side content if scrolled beyond the header height + admin bar height
    if (scrolled > (headerHeight + adminBarHeight)) {
        sideContent.classList.add('lcp-fixed');
    } else {
        sideContent.classList.remove('lcp-fixed');
    }

    // Check if the header has the 'lcp-sticky-on-scroll' class and toggle the lcp-sticky class
    if (header.classList.contains('lcp-sticky-on-scroll')) {
        if (scrolled > (headerHeight + adminBarHeight)) {
            header.classList.add('lcp-stuck'); // Slide the header down
        } else {
            header.classList.remove('lcp-stuck'); // Hide the header if scrolling back up
        }
    }
}

// Function to handle the initial page load position for both header and side content
function handleInitialPageLoad(header, sideContent, adminBarHeight) {
    const scrolled = window.scrollY || document.documentElement.scrollTop;
    const headerHeight = header.offsetHeight;

    // Ensure the side content is properly positioned below the header + admin bar on page load
    sideContent.style.top = (headerHeight + adminBarHeight) + 'px';

    // If the page is loaded with a scroll position greater than header + admin bar height, apply the 'lcp-fixed' class
    if (scrolled > (headerHeight + adminBarHeight)) {
        sideContent.classList.add('lcp-fixed');
    } else {
        sideContent.classList.remove('lcp-fixed');
    }

    // If the page is loaded with a scroll position greater than header + admin bar height, apply the 'lcp-stuck' class
    if (header.classList.contains('lcp-sticky-on-scroll') && scrolled > (headerHeight + adminBarHeight)) {
        header.classList.add('lcp-stuck');
    }

    const openLoginButtons = document.querySelectorAll('.lcpOpenLoginPopup');

    
    

}

// Highlight to share

document.addEventListener('mouseup', function() {
    // Get the selected text
    const selectedText = window.getSelection().toString();

    // Check if the selected text is at least 100 characters
    if (selectedText.length >= 100) {
      // Get the position of the selection
      const range = window.getSelection().getRangeAt(0);
      const rect = range.getBoundingClientRect();

      // Ensure the tooltip exists before trying to manipulate its style
      const tooltip = document.getElementById('share-tooltip');
      if (tooltip) {
        // Show the tooltip at the position of the selection
        tooltip.style.display = 'block';
        tooltip.style.left = `${rect.left + window.scrollX}px`;
        tooltip.style.top = `${rect.top + window.scrollY + window.getSelection().anchorNode.offsetHeight + 5}px`;
      }
    } else {
      // Hide the tooltip if selection is less than 100 characters
      const tooltip = document.getElementById('share-tooltip');
      if (tooltip) {
        tooltip.style.display = 'none';
      }
    }
  });

  // Share to Facebook
  document.getElementById('facebook-share')?.addEventListener('click', function() {
    const selectedText = window.getSelection().toString();
    const facebookUrl = `https://www.facebook.com/sharer/sharer.php?u=&quote=${encodeURIComponent(selectedText)}`;
    window.open(facebookUrl, '_blank');
  });

  // Share to Twitter
  document.getElementById('twitter-share')?.addEventListener('click', function() {
    const selectedText = window.getSelection().toString();
    const twitterUrl = `https://twitter.com/intent/tweet?text=${encodeURIComponent(selectedText)}`;
    window.open(twitterUrl, '_blank');
  });

  // Close the tooltip when clicked elsewhere
  document.addEventListener('click', function(e) {
    if (!e.target.closest('#share-tooltip') && !e.target.closest('.share-btn')) {
      const tooltip = document.getElementById('share-tooltip');
      if (tooltip) {
        tooltip.style.display = 'none';
      }
    }
  });