Imaglr Swap Actions のソースコード

Imaglr Swap Actions

Swap left and right action groups in streaming layout posts
右端で折り返す
// ==UserScript==
// @name         Imaglr Swap Actions
// @namespace    imaglr.com/
// @version      1.0.0
// @description  Swap left and right action groups in streaming layout posts
// @match        https://*imaglr.com/*
// @grant        none
// @run-at       document-idle
// ==/UserScript==

(function () {
  'use strict';

  const FOOTER_SELECTOR = 'footer.stream-post-actions';
  const LEFT_SELECTOR = '.stream-post-actions-left';
  const RIGHT_SELECTOR = '.stream-post-actions-right';

  function swapActions(footer) {
    if (!footer || footer.dataset.tmActionsSwapped === 'true') {
      return;
    }

    const left = footer.querySelector(LEFT_SELECTOR);
    const right = footer.querySelector(RIGHT_SELECTOR);

    if (!left || !right) {
      return;
    }

    /*
      Move the right group before the left group.

      Original:
        footer
          .stream-post-actions-left
          .stream-post-actions-right

      Result:
        footer
          .stream-post-actions-right
          .stream-post-actions-left
    */
    footer.insertBefore(right, left);

    footer.dataset.tmActionsSwapped = 'true';
  }

  function swapAllActions(root = document) {
    root.querySelectorAll(FOOTER_SELECTOR).forEach(swapActions);
  }

  // Initial run
  swapAllActions();

  // Handle dynamically added posts
  const observer = new MutationObserver((mutations) => {
    for (const mutation of mutations) {
      for (const node of mutation.addedNodes) {
        if (!(node instanceof Element)) {
          continue;
        }

        if (node.matches?.(FOOTER_SELECTOR)) {
          swapActions(node);
        } else {
          swapAllActions(node);
        }
      }
    }
  });

  observer.observe(document.body, {
    childList: true,
    subtree: true
  });
})();