2chen scripts

// ==UserScript==
// @name         2chen Scripts
// @namespace    http://2chen.moe/
// @version      1.2
// @description  Add TikTok sauce button next to filenames; Hide posts with HEVC files; Highlight (You)s
// @author       Anonymous (You)
// @match        https://2chen.moe/*
// @grant        none
// ==/UserScript==

// ----- CONFIG -----

// border left for posts
const yourPost = "3px dashed rgba(145, 182, 214, .8)";
const quotesYou = "3px solid rgba(145, 182, 214, .8)";
const borderNone = "none";

// saucing config
const sauceText = "[tiktok]";
const sauceUrl = "https://www.tiktok.com/@share/video/";
const sauceRegex = /(6|7)\d{18}/g;

// thumbnails config
const thumbnailSize = 10

// ----- MAIN -----

// editing state consts
const NOT_EDITING = 0;
const EDITING = 1;
const EDITING_YOU = 2;

(function() {
    'use strict';

    // parse all pre-existing posts when page loads
    for (let fileMeta of document.getElementsByTagName("figcaption")) {
        parseFileMeta(fileMeta);
        removeIfHevc(fileMeta);
    }
    //for (let article of document.getElementsByTagName("article")) {
    //    filterPost(article);
    //}

    // callback function to execute when mutations are observed
    let callback = function(mutationsList) {
        for(let mutation of mutationsList) {
           for (let node of mutation.addedNodes) {
               //console.log(node)
               if (node.tagName == "FIGCAPTION") {
                   // cases where post appears first and attachment appears afterward (triggered by attachment attaching to post which generates a figcaption)
                   parseFileMeta(node);
                   removeIfHevc(node);
               } else if (node.tagName == "ARTICLE") {
                   // cases where attachment appears simultaneously with post (attachment generates the post which will not create a singular "figcaption" mutation event, adding text to the post will then continue to proc the else branch)
                   // getElementsByTagName doesn't work on node?
                   for (let child of node.childNodes) {
                       if (child.tagName == "FIGCAPTION") {
                           parseFileMeta(child);
                           removeIfHevc(child);
                           break;
                       }
                   }
               }
               // (you)s get added after page loads, but also all of them trigger the mutation observer
               let article = getParentArticle(node);
               if (article != null) {
                   highlightYous(article);
                   //filterPost(article);
               }
           }
        }
    };

    // observe page for changes to sauce new posts (all articles/posts should be inside the a tag with the id "thread-container")
    var observer = new MutationObserver(callback);
    observer.observe(document.getElementById("thread-container"), { childList: true, subtree:true });
})();

// ----- HELPERS -----

// recursively find the (first) enclosing parent article, or null if no such node exists for the given node (returns node immediately if node is article)
function getParentArticle(node) {
    if (node == null || node.tagName == null) return null;
    else if (node.tagName == "ARTICLE") return node;
    else return getParentArticle(node.parentNode);
}

// checks if article is editing (checks for presence of specific classes)
// returns a const integer depending on if the article is not in edit mode, if it is in edit mode or if it is in edit mode and you are the one editing
function isArticleEditing(article) {
    if (article.classList.contains("editing")) {
        if (article.classList.contains("reply-form")) {
            return EDITING_YOU;
        } else {
            return EDITING;
        }
    } else {
        return NOT_EDITING;
    }
}

// checks if an article was made by you (checks for presence of (You) in article name field)
function isArticleYou(article) {
    let name = article.getElementsByClassName("name")[0];
    return name.innerHTML.includes("(You)");
}

// ----- SAUCE -----

// filename & metadata is stored in the <fileinfo> tag inside <article> (article is a post essentially)
function parseFileMeta(fileMeta) {
    let sauceLink = null;
    // attempt to get link from filename (check all links instead of breaking after you find the id to avoid duplicating the link if it already exists)
    let links = fileMeta.getElementsByTagName("a");
    let resolveFromMetaFilename = true;
    for (let link of links) {
        // found a pre-existing <a> tag that should link to sauce, no further action necessary (without this links can start duplicating when e.g. inlining replies)
        if (link.innerHTML == sauceText) {
            resolveFromMetaFilename = false;
            sauceLink = null;
            break;
        }

        // attempt to resolve from "download" attribute of link (contains original filename)
        let filename = link.getAttribute("download");
        let generatedLink = parseSauceFromString(filename);
        if (generatedLink != null) {
            // found the id, <a> was created
            sauceLink = generatedLink;
            resolveFromMetaFilename = false;
        }
    }
    // attempt to get link from filename in metadata if resolving from filename failed
    if (resolveFromMetaFilename) {
        try {
            // one of the spans in <span class="fileinfo"> should have the filename if it exists
            let fileInfoSpans = fileMeta.querySelector('span[class="fileinfo"]').getElementsByTagName("span");
            for (let span of fileInfoSpans) {
                sauceLink = parseSauceFromString(span.innerHTML);
                if (sauceLink != null) break;
            }
        } catch (e) {}
    }
    // if saucing was successful add the link at the end of figcaption
    if (sauceLink != null) {
        fileMeta.appendChild(sauceLink);
    }
}

// pass a string that may or may not contain a TT id, returns an <a> element that links to sauce if it found an id, null otherwise
function parseSauceFromString(string) {
    if (string == null) return null;

    const found = string.match(sauceRegex);
    if (found != null) {
        var a = document.createElement('a');
        a.setAttribute('href', sauceUrl + found);
        a.setAttribute('target', "_blank"); // new window or tab
        a.innerHTML = sauceText;
        return a;
    }
    return null;
}

// ----- HEVC -----

function removeIfHevc(fileMeta) {
   if (isHevcOrThumbnail(fileMeta)) {
        // seems posts need more than just the "deleted" class on <article> to shadowbin it
        // removing the node is not great - the chen js will start throwing errors that it's missing nodes
        // simply hide the post
        //fileMeta.parentNode.style.display = 'none';
        let figures = fileMeta.parentNode.querySelector('div[class="post-container"]').getElementsByTagName("figure");
        for (let figure of figures) {
            figure.style.display = 'none';
        }
    }
}

// metadata is stored in the <figcaption> tag inside <article> (article is a post essentially)
function isHevcOrThumbnail(fileMeta) {
    let isHevc = false;
    let isThumbnail = false;
    try {
        // one of the spans in <span class="fileinfo"> should be "HEVC" if it exists
        let fileInfoSpans = fileMeta.querySelector('span[class="fileinfo"]').getElementsByTagName("span");
        if (fileInfoSpans.length > 1) {
            for (let span of fileInfoSpans) {
                isHevc = span.innerHTML.match("HEVC");
                if (isHevc) break;
            }
            let thumbnailRegex = fileInfoSpans[1].innerHTML.match(/\d+x\d+/);
            if (thumbnailRegex != null) {
                let dimens = thumbnailRegex[0].split("x");
                isThumbnail = parseInt(dimens[0]) < thumbnailSize && parseInt(dimens[1]) < thumbnailSize;
            }
        }
    } catch (e) {
        console.log(e);
    }
    return isHevc || isThumbnail;
}

// ----- (YOU)s -----

// highlight your posts and highlight replies to your posts
function highlightYous(article) {
    if (isArticleYou(article)) {
        article.style.borderLeft = yourPost;
    } else {
        // post-container intermediate step required, otherwise it'll also grab backlinks
        let postLinks = article.getElementsByClassName("post-container")[0].getElementsByClassName("post-link");
        let isReply = false;
        for (let link of postLinks) {
            if (link.innerHTML.includes("(You)")) {
                isReply = true;
                break;
            }
        }
        // if someone quotes you and deletes that quote the border needs to clear
        if (isReply) {
            article.style.borderLeft = quotesYou;
        } else {
            article.style.borderLeft = borderNone;
        }
    }
}