xitter digits observer

Displays the post ID number after the username/date and enables chan-style greentext formatting on x.com.

Bu betiği kurabilmeniz için Tampermonkey, Greasemonkey ya da Violentmonkey gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

Bu betiği yüklemek için Tampermonkey gibi bir uzantı yüklemeniz gerekir.

Bu betiği kurabilmeniz için Tampermonkey ya da Violentmonkey gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

Bu betiği kurabilmeniz için Tampermonkey ya da Userscripts gibi bir kullanıcı betiği eklentisini kurmanız gerekmektedir.

Bu betiği indirebilmeniz için ayrıca Tampermonkey gibi bir eklenti kurmanız gerekmektedir.

Bu betiği yüklemek için bir betik yöneticisi eklentisi yüklemeniz gerekecektir.

(Zaten bir betik yöneticim var, hadi yükleyelim!)

Advertisement:

Bu stili yüklemek için Stylus gibi bir uzantı yüklemeniz gerekir.

Bu stili yüklemek için Stylus gibi bir uzantı kurmanız gerekir.

Bu stili yükleyebilmek için Stylus gibi bir uzantı yüklemeniz gerekir.

Bu stili yüklemek için bir kullanıcı stili yöneticisi uzantısı yüklemeniz gerekir.

Bu stili yüklemek için bir kullanıcı stili yöneticisi uzantısı kurmanız gerekir.

Bu stili yükleyebilmek için bir kullanıcı stili yöneticisi uzantısı yüklemeniz gerekir.

(Zateb bir user-style yöneticim var, yükleyeyim!)

Advertisement:

// ==UserScript==
// @name         xitter digits observer
// @namespace    https://x.com/
// @version      1.4
// @description  Displays the post ID number after the username/date and enables chan-style greentext formatting on x.com.
// @match        https://x.com/*
// @match        https://twitter.com/*
// @author       @gigagroid
// @license      GNU GPLv3
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function () {
    'use strict';

    // =========================
    // GREENTEXT (UNCHANGED CORE)
    // =========================
    function processGreentext(tweet) {
        if (tweet.dataset.gtDone === "1") return;
        tweet.dataset.gtDone = "1";

        const textContainer = tweet.querySelector('[data-testid="tweetText"]');
        if (!textContainer) return;

        const walker = document.createTreeWalker(
            textContainer,
            NodeFilter.SHOW_TEXT,
            null,
            false
        );

        const nodes = [];
        let n;

        while ((n = walker.nextNode())) nodes.push(n);

        nodes.forEach(textNode => {
            const text = textNode.nodeValue;
            if (!text.includes('>')) return;

            const frag = document.createDocumentFragment();
            const parts = text.split(/(\n)/);

            for (const part of parts) {
                if (part === '\n') {
                    frag.appendChild(document.createTextNode(part));
                    continue;
                }

                if (/^\s*>/.test(part)) {
                    const span = document.createElement('span');
                    span.style.color = 'rgb(90, 150, 65)';
                    span.textContent = part;
                    frag.appendChild(span);
                } else {
                    frag.appendChild(document.createTextNode(part));
                }
            }

            textNode.parentNode.replaceChild(frag, textNode);
        });
    }

    // =========================
    // POST ID (NATIVE INLINE STYLE)
    // =========================

    function getTweetKey(tweet) {
        const link = tweet.querySelector('a[href*="/status/"]');
        return link?.href || null;
    }

    function processTweet(tweet) {
        processGreentext(tweet);

        const key = getTweetKey(tweet);
        if (!key) return;

        const match = key.match(/status\/(\d+)/);
        if (!match) return;

        const postId = match[1];

        const nameContainer = tweet.querySelector('[data-testid="User-Name"]');
        if (!nameContainer) return;

        // prevent duplicates even after X re-render
        if (tweet.dataset.xPostId === postId) return;
        tweet.dataset.xPostId = postId;

        // IMPORTANT: find last metadata text node (where " · time" lives)
        const walker = document.createTreeWalker(
            nameContainer,
            NodeFilter.SHOW_TEXT,
            null,
            false
        );

        let lastTextNode = null;
        let node;

        while ((node = walker.nextNode())) {
            lastTextNode = node;
        }

        // fallback if structure changes
        const target = lastTextNode || nameContainer;

        // insert EXACT native-style separator + id
        const injection = document.createTextNode(` · >>${postId}`);

        // if we have a text node, append to it; otherwise append to container
        if (target.nodeType === Node.TEXT_NODE) {
            target.nodeValue += ` · >>${postId}`;
        } else {
            target.appendChild(injection);
        }
    }

    // =========================
    // RESILIENT SCANNER
    // =========================
    function scan(root = document) {
        root.querySelectorAll('[data-testid="tweet"]').forEach(processTweet);
    }

    const observer = new MutationObserver((mutations) => {
        for (const m of mutations) {
            for (const node of m.addedNodes) {
                if (node.nodeType !== 1) continue;

                if (node.matches?.('[data-testid="tweet"]')) {
                    processTweet(node);
                } else {
                    node.querySelectorAll?.('[data-testid="tweet"]')?.forEach(processTweet);
                }
            }
        }
    });

    scan();

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

    // backup for full React tree rewrites
    setInterval(scan, 5000);

})();