feed-condense-content.js: add button text content

1 files changed, 18 insertions, 2 deletions

diff --git a/http/public/scripts/feed-condense-content.js b/http/public/scripts/feed-condense-content.js
index d15deb0..7fd01b3 100644
--- a/http/public/scripts/feed-condense-content.js
+++ b/http/public/scripts/feed-condense-content.js
@@ -1,17 +1,32 @@
 const expandedClass = "e-content--expanded";
 
 export function toggleContentExpanded(id) {
-  const content = document.querySelector(`[data-content-id=${id}`);
+  const content = document.querySelector(`[data-content-id=${id}]`);
+  const button = document.querySelector(`[data-content-id=${id}] + button`);
+
   if (!content) {
     throw new Error(`No content found with ID: ${id}`);
   }
   const classes = content.getAttribute("class").split(" ");
-  if (classes.includes(expandedClass)) {
+  const wasExpanded = classes.includes(expandedClass);
+  if (wasExpanded) {
     const newClasses = classes.filter((c) => c != expandedClass);
     content.setAttribute("class", newClasses.join(" "));
   } else {
     content.setAttribute("class", [...classes, expandedClass].join(" "));
   }
+
+  if (!button) {
+    console.warn(
+      `Toggled content expansion, but no button next to content with ID: ${id}`,
+    );
+  } else {
+    if (wasExpanded) {
+      button.textContent = "Read more";
+    } else {
+      button.textContent = "Read less";
+    }
+  }
 }
 
 export function addExpandItemButtons() {
@@ -19,6 +34,7 @@ export function addExpandItemButtons() {
     const contentId = crypto.randomUUID();
     content.setAttribute("data-content-id", contentId);
     const button = document.createElement("button");
+    button.textContent = "Read more";
     button.addEventListener("click", () => toggleContentExpanded(contentId));
     content.insertAdjacentElement("afterend", button);
   }