// ==UserScript==
// @name         VoidVerified
// @namespace    http://tampermonkey.net/
// @version      0.3.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 version = "0.3.1";

    const verified = {
        username: {
            enabled: true,
            enabledForReplies: true,
            color: "white",
            sign: "✔",
        },
        highlight: {
            enabled: true,
            enabledForReplies: true,
            enabledForSmallCards: false,
            color: undefined,
            size: "5px",
        }
    };

    const verifiedUsers = [
        {
            username: "voidnyan",
            color: "#f8aade",
            sign: "💻",
        },
    ].map(u => typeof u === "string" ? {username: u} : u);

    let verifiedStyles = "";

    for (const user of verifiedUsers){
        if (verified.username.enabled) {
            createUsernameCSS(user);
        }

        if (verified.highlight.enabled) {
            createHighlightCSS(user, `div.wrap:has( div.header > a.name[href*="${user.username}"] )`);
            createHighlightCSS(user, `div.wrap:has( div.details > a.name[href*="${user.username}"] )`);
        }

        if (verified.highlight.enabledForReplies) {
            createHighlightCSS(user, `div.reply:has( a.name[href*="${user.username}"] )`);
        }
    }

    if (verified.highlight.enabled && !verified.highlight.enabledForSmallCards) {
        disableHighlightOnSmallCards();
    }

    function createUsernameCSS(user) {
        verifiedStyles += `
        a.name[href*="${user.username}"]::after {
            content: "${user.sign ?? verified.username.sign}";
            color: ${user.color ?? verified.username.color ?? "rgb(var(--color-blue))"}
        }
        `;
    };

    function createHighlightCSS(user, selector){
        verifiedStyles += `
        ${selector} {
            margin-right: -${verified.highlight.size};
            border-right: ${verified.highlight.size} solid ${user.color ?? verified.highlight.color ?? "rgb(var(--color-blue))"};
            border-radius: 5px;
        }
        `;
    }

    function disableHighlightOnSmallCards(){
        verifiedStyles += `
        div.wrap:has(div.small) {
        margin-right: 0px !important;
        border-right: 0px solid black !important;
        }
        `;
    }

    const linkElement = document.createElement('link');
    linkElement.setAttribute('rel', 'stylesheet');
    linkElement.setAttribute('type', 'text/css');
    linkElement.setAttribute('href', 'data:text/css;charset=UTF-8,' + encodeURIComponent(verifiedStyles));
    document.head?.append(linkElement);

    console.log(`VoidVerified ${version} loaded.`);
})();