85 lines
2.6 KiB
JavaScript
85 lines
2.6 KiB
JavaScript
// // Truncate or expand based on the element's max-height
|
|
// function toggleDescription(guid, expanded) {
|
|
// const content = document.querySelector(`.desc-${guid}`);
|
|
// if (expanded) {
|
|
// content.style.maxHeight = "none"; // Expand fully
|
|
// } else {
|
|
// content.style.maxHeight = "100px"; // Truncate (set to desired truncation height)
|
|
// }
|
|
// }
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
const allDescriptions = document.querySelectorAll('[id^="desc-"]');
|
|
allDescriptions.forEach((desc) => {
|
|
const id = desc.id.replace("desc-", "");
|
|
toggleDescription(id, false); // Start all as collapsed
|
|
});
|
|
});
|
|
|
|
window.toggleDescription = function (guid, shouldExpand) {
|
|
const descContainer = document.querySelector(`.desc-${guid}`);
|
|
if (descContainer) {
|
|
if (shouldExpand) {
|
|
descContainer.classList.add("expanded");
|
|
descContainer.classList.remove("collapsed");
|
|
} else {
|
|
descContainer.classList.remove("expanded");
|
|
descContainer.classList.add("collapsed");
|
|
}
|
|
} else {
|
|
console.error("Description container not found for GUID: " + guid);
|
|
}
|
|
};
|
|
|
|
window.addEventListener("load", function () {
|
|
const descriptions = document.querySelectorAll(
|
|
".episode-description-container",
|
|
);
|
|
descriptions.forEach((desc) => {
|
|
const btn = desc.nextElementSibling; // Assuming button is the next sibling
|
|
if (desc.scrollHeight > desc.clientHeight) {
|
|
if (btn) {
|
|
btn.classList.remove("hidden"); // Show button if content is clipped
|
|
}
|
|
} else {
|
|
if (btn) {
|
|
btn.classList.add("hidden"); // Hide button if content is not clipped
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
function toggle_description(guid) {
|
|
const selector = `#${guid.replace(/[^a-zA-Z0-9-]/g, "")}`; // Use ID selector
|
|
console.log("Trying to select:", selector);
|
|
const descContainer = document.querySelector(selector);
|
|
|
|
if (!descContainer) {
|
|
console.error(
|
|
"Description container not found for GUID: " +
|
|
guid +
|
|
" with selector: " +
|
|
selector,
|
|
);
|
|
return;
|
|
}
|
|
|
|
const button = descContainer.querySelector(".toggle-desc-btn");
|
|
if (!button) {
|
|
console.error(
|
|
"Button not found in description container for GUID: " + guid,
|
|
);
|
|
return;
|
|
}
|
|
|
|
if (descContainer.classList.contains("desc-collapsed")) {
|
|
descContainer.classList.remove("desc-collapsed");
|
|
descContainer.classList.add("desc-expanded");
|
|
button.textContent = "";
|
|
} else {
|
|
descContainer.classList.add("desc-collapsed");
|
|
descContainer.classList.remove("desc-expanded");
|
|
button.textContent = "";
|
|
}
|
|
}
|