2ch tree post

делает треды древовидными

2022/09/28のページです。最新版はこちら

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

You will need to install an extension such as Tampermonkey to install this script.

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
// ==UserScript==
// @name         2ch tree post
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  делает треды древовидными
// @author       You
// @match        http://2ch.hk/*/res/*
// @match        https://2ch.hk/*/res/*
// @match        http://2ch.life/*/res/*
// @match        https://2ch.life/*/res/*
// @grant        none
// ==/UserScript==

(function () {
  "use strict";
  // console.time("tree script");
  //находим все ссылки в постах
  const post = document.querySelectorAll(
    `.post__message > :nth-child(1)[data-num]`
  );

  //функцию вызываем на все посты в треде
  //Перемащает пост и применяет стили для создания дерева
  function postMove(linkPost, newpost = false) {
    const nodePostCurr = linkPost.parentNode.parentNode;
    const nodePostReply = document.querySelector(
      `#post-${linkPost.innerText.match(/\d+/)[0]}`
    );
    //если эта ссылка ведёт на оппост или другой тред или пост не существует - пропускаем
    if (/OP|→/.test(linkPost.innerText) || !nodePostReply) {
      return;
    }
    nodePostCurr.style.cssText = `border-left:2px dashed;padding-left:2px;margin-left:21px;display:flex;flex-direction:column`;
    nodePostReply.append(nodePostCurr);
    if (newpost) {
      nodePostCurr.style["border-left"] = "5px solid";
      nodePostCurr.addEventListener(
        "click",
        () => {
          nodePostCurr.style["border-left"] = "2px dashed";
        },
        { once: true }
      );
    }
  }
  //перебираем и вызываем функцию
  for (const key of post) {
    postMove(key);
  }

  //наблюдаем за появлением новых постов
  const fromThreads = document.querySelector(".thread");

  const observer = new MutationObserver((mutationRecords) => {
    for (const key of mutationRecords) {
      if (key.addedNodes.length > 0) {
        const post = key.addedNodes[0].querySelector(
          `.post__message > :nth-child(1)[data-num]`
        );
        if (post) {
          postMove(post, true);
        }
      }
    }
  });

  observer.observe(fromThreads, { childList: true });
  // console.timeEnd("tree script");
})();