Widget:CommentsRSS: Difference between revisions

From Jcastle.info
No edit summary
No edit summary
Line 2: Line 2:


<script>
<script>
fetch('/smw139/resources/assets/comments_feed.xml')
function truncate(text, limit) {
  if (text.length <= limit) return text;
  return text.slice(0, text.lastIndexOf(" ", limit)) + "…";
}
 
fetch('/view/Special:CommentsRSS')
   .then(res => res.text())
   .then(res => res.text())
   .then(str => (new window.DOMParser()).parseFromString(str, "text/xml"))
   .then(str => (new window.DOMParser()).parseFromString(str, "text/xml"))
Line 14: Line 19:
     }
     }


     let html = "";
     const maxItems = 5;
    container.innerHTML = "";
    const titleRow = document.createElement("div");
    titleRow.innerHTML = `
      <div style="display: flex; justify-content: space-between; align-items: center;">
        <strong>Recent Comments</strong>
        <span>
          <a href='/view/Special:RecentComments' style='margin-right: 10px;'>More...</a>
          <a href='/view/Subscribe_To_Comments' target='_blank'><i class='fas fa-envelope'></i></a>
        </span>
      </div>
    `;
    container.appendChild(titleRow);


     items.forEach((item, index) => {
     Array.from(items).slice(0, maxItems).forEach(item => {
      if (index >= 5) return; // stop after 5 items
       const title = item.querySelector("title").textContent;
       const titleText = item.querySelector("title").textContent;
       const link = item.querySelector("link").textContent;
       const link = item.querySelector("link").textContent;
       const commentText = item.querySelector("description").textContent;
       const rawDesc = item.querySelector("description").textContent;
       const pubDate = new Date(item.querySelector("pubDate").textContent);
       const commentText = rawDesc.replace(/<br\s*\/?>/gi, '\n').replace(/<[^>]+>/g, '').trim();
      const date = new Date(item.querySelector("pubDate").textContent);


       const match = titleText.match(/^(.*?) commented on (.*?)$/);
       const entry = document.createElement("div");
      const actor = match ? match[1] : 'User';
      entry.style.marginBottom = "1em";
      const pageTitle = match ? match[2] : 'a page';
      entry.innerHTML = `
        <div><a href="${link}" target="_blank">${truncate(commentText, 200)}</a></div>
        <small style="color: #555;">${date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' })}</small>
      `;


       html += `
       container.appendChild(entry);
        <div style="margin-bottom: 1em;">
          <div>
            <strong>${actor}</strong> commented on
            <a href="${link}" target="_blank">${pageTitle}</a>
            <small style="color: #555;"> (${pubDate.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' })})</small>
          </div>
          <div style="margin-top: 0.25em;">${commentText}</div>
        </div>
      `;
     });
     });
    html += `<div style="font-size: 0.85em; margin-top: 1em;">
      <a href="/view/Subscribe_To_Comments" target="_blank"><i class="fas fa-envelope"></i> Subscribe to comments by email</a>
    </div>`;
    container.innerHTML = html;
   })
   })
   .catch(error => {
   .catch(error => {

Revision as of 18:33, 1 June 2025

<script> function truncate(text, limit) {

 if (text.length <= limit) return text;
 return text.slice(0, text.lastIndexOf(" ", limit)) + "…";

}

fetch('/view/Special:CommentsRSS')

 .then(res => res.text())
 .then(str => (new window.DOMParser()).parseFromString(str, "text/xml"))
 .then(data => {
   const items = data.querySelectorAll("item");
   const container = document.getElementById("recent-comments");
   if (items.length === 0) {

container.innerHTML = "

No recent comments.

";

     return;
   }
   const maxItems = 5;
   container.innerHTML = "";
   const titleRow = document.createElement("div");
   titleRow.innerHTML = `
       Recent Comments
       
         <a href='/view/Special:RecentComments' style='margin-right: 10px;'>More...</a>
         <a href='/view/Subscribe_To_Comments' target='_blank'></a>
       
   `;
   container.appendChild(titleRow);
   Array.from(items).slice(0, maxItems).forEach(item => {
     const title = item.querySelector("title").textContent;
     const link = item.querySelector("link").textContent;
     const rawDesc = item.querySelector("description").textContent;
     const commentText = rawDesc.replace(/<br\s*\/?>/gi, '\n').replace(/<[^>]+>/g, ).trim();
     const date = new Date(item.querySelector("pubDate").textContent);
     const entry = document.createElement("div");
     entry.style.marginBottom = "1em";
     entry.innerHTML = `
<a href="${link}" target="_blank">${truncate(commentText, 200)}</a>
       ${date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' })}
     `;
     container.appendChild(entry);
   });
 })
 .catch(error => {

document.getElementById("recent-comments").innerHTML = "

Error loading comments.

";

   console.error("RSS Load Error:", error);
 });

</script>