// ==UserScript==
// @name         VoidVerified
// @namespace    http://tampermonkey.net/
// @version      0.1.1
// @description  Display a verified sign next to user's name in AniList.
// @author       voidnyan
// @match        https://anilist.co/*
// @grant        none
// @license MIT
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';
    const observer = new MutationObserver(observeMutations);
    observer.observe(document.body, {childList: true, subtree: true});

    const usernameSelector = ["a.name"];

    const verified = {
        color: undefined,
        sign: "✔",
        title: "Verified",
        disableOnProfile: false,
    };

    const verifiedUsers = [
        "voidnyan"
    ];

    console.log("VoidVerified loaded.");

    function observeMutations(mutations) {
        for (const mutation of mutations) {
            if (mutation.addedNodes.length > 0) {
                mutation.addedNodes.forEach(handleVerified);
            }
        }
    }

    function handleVerified(node){
        if (!(node instanceof HTMLElement)) {
            return;
        }

        switch (true){
            case node.matches("div.reply"):
                handleReply(node);
                break;
            case node.matches("div.activity-anime_list"):
            case node.matches("div.activity-manga_list"):
                handleListActivity(node);
                break;
            case node.matches("div.activity-text"):
            case node.matches("div.activity-message"):
                handleTextActivity(node);
                break;
            case node.matches("div.user"):
                handleProfile(node);
        }
    }

    function handleReply(node) {
        const username = node.querySelector(usernameSelector);
        addVerifiedMarkToReply(username);
    }

    function handleListActivity(node) {
        const isProfileActivity = node.querySelector(".small") !== null;

        if (isProfileActivity) {
            return;
        }

        const username = node.querySelector(usernameSelector);
        addVerifiedMark(username);
    }

    function handleTextActivity(node) {
        const username = node.querySelector(usernameSelector);
        addVerifiedMark(username);
    }

    function handleProfile(node){
        if (verified.disableOnProfile){
            return;
        }
        const username = node.querySelector("h1.name");
        addVerifiedMarkToProfile(username);
    }

    function addVerifiedMark(username) {
        if (verifiedUsers.includes(username.innerHTML.trim())) {
            const span = createMarkElement(username);
            span.style.width = "min-content";

            username.after(span);
        }
    }

    function addVerifiedMarkToReply(username) {
        if (verifiedUsers.includes(username.innerHTML.trim())) {
            const span = createMarkElement(username);

            span.style.display = "inline-block";
            span.style.verticalAlign = "top";
            span.style.lineHeight = "25px";
            span.style.height = "25px";

            username.after(span);
        }
    }

    function addVerifiedMarkToProfile(username) {
        if (verifiedUsers.includes(username.innerHTML.trim())) {
            const span = document.createElement("span");
            span.innerHTML = verified.sign;
            span.style.color = verified.color;
            span.style.marginLeft = "6px";

            username.after(span);
        }
    }

    function getLinkColor(username){
        var linkColor = getComputedStyle(username).getPropertyValue("--color-blue");
        return `rgb(${linkColor})`;
    }

    function createMarkElement(username){
        const span = document.createElement("span");

        span.style.color = verified.color ?? getLinkColor(username);
        span.style.marginLeft = "6px";
        span.innerHTML = verified.sign;
        span.title = verified.title;

        return span;
    }
})();