reddit-tweaks-ffe/content/tweaks/badges.js

(function () {
  "use strict";

  let currentSettings = null;

  function applyColorsToContainer(container, settings, subredditName) {
    const prefix = window.RedditTweaks.getColorPrefix(settings);

    const entry = subredditName && settings.subredditColors[subredditName];
    const overrides = entry && entry[prefix];

    container.style.setProperty("--rt-sub-bg", overrides?.bg || settings[prefix + ".subredditBgColor"]);
    container.style.setProperty("--rt-sub-border", overrides?.border || settings[prefix + ".subredditBorderColor"]);
    container.style.setProperty("--rt-sub-text", overrides?.text || settings[prefix + ".subredditTextColor"]);
    container.style.setProperty("--rt-com-bg", settings[prefix + ".commentsBgColor"]);
    container.style.setProperty("--rt-com-border", settings[prefix + ".commentsBorderColor"]);
    container.style.setProperty("--rt-com-text", settings[prefix + ".commentsTextColor"]);
  }

  function normalizeCommentText(text) {
    const trimmed = text.trim();
    if (trimmed === "comment") return "0 comments";
    return trimmed;
  }

  function processPost(post, settings) {
    if (post.hasAttribute("data-rt-processed")) return;

    const entry = post.querySelector(".entry");
    if (!entry) return;

    const container = document.createElement("div");
    container.className = "reddit-tweaks-badges";

    let subredditName = null;

    const subLink = post.querySelector(".tagline .subreddit");
    if (subLink) {
      const badge = document.createElement("a");
      badge.className = "rt-badge rt-badge--subreddit";
      badge.href = subLink.href;
      badge.textContent = subLink.textContent.trim();
      subredditName = subLink.textContent.trim().replace(/^r\//, "");
      container.setAttribute("data-rt-subreddit", subredditName);
      container.appendChild(badge);

      const gear = document.createElement("span");
      gear.className = "rt-badge-gear";
      gear.textContent = "\u2699";
      gear.addEventListener("click", function (e) {
        e.preventDefault();
        e.stopPropagation();
        if (window.RedditTweaks.colorPopover) {
          window.RedditTweaks.colorPopover.open(badge, subredditName, currentSettings);
        }
      });
      badge.appendChild(gear);

      const prevNode = subLink.previousSibling;
      if (prevNode && prevNode.nodeType === Node.TEXT_NODE && /\bto\s*$/.test(prevNode.textContent)) {
        prevNode.textContent = prevNode.textContent.replace(/\s*to\s*$/, " ");
      }
    }

    const commentsLink = post.querySelector(".flat-list .comments");
    if (commentsLink) {
      const badge = document.createElement("a");
      badge.className = "rt-badge rt-badge--comments";
      badge.href = commentsLink.href;
      badge.textContent = normalizeCommentText(commentsLink.textContent);
      container.appendChild(badge);
    }

    if (container.children.length === 0) return;

    applyColorsToContainer(container, settings, subredditName);
    entry.insertBefore(container, entry.firstChild);
    post.setAttribute("data-rt-processed", "true");
  }

  function processPosts(settings) {
    const posts = document.querySelectorAll("div.thing.link:not([data-rt-processed])");
    posts.forEach(function (post) {
      processPost(post, settings);
    });
  }

  function updateColors(settings) {
    currentSettings = settings;
    const containers = document.querySelectorAll(".reddit-tweaks-badges");
    containers.forEach(function (container) {
      const subredditName = container.getAttribute("data-rt-subreddit");
      applyColorsToContainer(container, settings, subredditName);
    });
  }

  function apply(settings) {
    currentSettings = settings;
    processPosts(settings);
  }

  window.RedditTweaks = window.RedditTweaks || {};
  window.RedditTweaks.badgeTweak = {
    apply: apply,
    updateColors: updateColors,
    processNewPosts: processPosts,
  };
})();