jrangel/local-content-pro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes to script.js and moved backend code to /includes/classes/backend.php

Browse Source
This commit is contained in:
Jeremy Rangel
2024-12-23 02:50:12 -08:00
parent f3fbe0fa32
commit 1ccc6f0031
5 changed files with 382 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
script.js
View File

@ -6,11 +6,28 @@ document.addEventListener('DOMContentLoaded', function () {
// Ensure elements exist before proceeding
if (!header || !sideContent) return;
// Check if the header has the 'lcp-sticky' and 'lcp-sticky-on-scroll' class
const isSticky = header.classList.contains('lcp-sticky');
const isStickyOnScroll = header.classList.contains('lcp-sticky-on-scroll');
// Measure the height of the header once the DOM is loaded
const headerHeight = header.offsetHeight;
let fullHeaderHeight;
// If the admin-bar is present, the fullHeaderHeight is the headerHeight + 32px
if (document.body.classList.contains('admin-bar')) {
const adminBarHeight = document.getElementById('wpadminbar').offsetHeight;
fullHeaderHeight = headerHeight + adminBarHeight;
} else {
fullHeaderHeight = headerHeight;
}
// Set the height of #lcp-sidecontent to 100vh minus the header height
sideContent.style.height = `calc(100vh - ${headerHeight}px)`;
// Set the initial height of #lcp-sidecontent based on whether the header is sticky or not
if (isSticky) {
sideContent.style.height = `calc(100vh - ${headerHeight}px)`;
} else {
sideContent.style.height = `100vh`;
}
// Function to handle the scroll event
function handleScroll() {
@ -18,13 +35,36 @@ document.addEventListener('DOMContentLoaded', function () {
// Check if the page has scrolled past the height of the header
if (scrolled >= headerHeight) {
// Add the 'lcp-fixed' class and set 'top' to 0
// Add the 'lcp-fixed' class and set 'top' to 0 for side content
sideContent.classList.add('lcp-fixed');
sideContent.style.top = '0';
// If the header has 'lcp-sticky-on-scroll', adjust height of side content to be 100vh - fullHeaderHeight
if (isStickyOnScroll) {
sideContent.style.height = `calc(100vh - ${fullHeaderHeight}px)`;
// Add 'lcp-fixed' to the header
header.classList.add('lcp-fixed');
// Set the 'top' of the sideContent to the height of the header
sideContent.style.top = `${fullHeaderHeight}px`;
} else if (isSticky) {
// If the header is sticky but not 'sticky-on-scroll', keep the side content height adjusted
sideContent.style.height = `calc(100vh - ${fullHeaderHeight}px)`;
} else {
// Set side content height to 100vh when not sticky
sideContent.style.height = '100vh';
}
} else {
// Remove the 'lcp-fixed' class if scrolled back above the header
// Remove the 'lcp-fixed' class from side content and header if scrolled back above the header
sideContent.classList.remove('lcp-fixed');
sideContent.style.top = ''; // Reset the 'top' style
// Reset height to 100vh when not fixed
sideContent.style.height = isSticky ? `calc(100vh - ${headerHeight}px)` : '100vh';
// If header has the 'lcp-sticky-on-scroll' class, remove 'lcp-fixed' from the header
if (isStickyOnScroll) {
header.classList.remove('lcp-fixed');
}
}
}
@ -39,10 +79,6 @@ document.addEventListener('DOMContentLoaded', function () {
const sidecontent = document.getElementById("lcp-sidecontent");
const innerContent = document.getElementById("lcp-sidecontent-inner");
const scrollTrack = document.getElementById("lcp-scroll-track");