// ==UserScript==
// @name         치지직 채팅 닉네임 색상
// @namespace    https://yoonu.io/
// @version      2023-12-19 15:42
// @description  치지직 채팅의 닉네임 색상을 트위치와 비슷하게 변경
// @author       Yoonu
// @match        https://chzzk.naver.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=chzzk.naver.com
// @grant        none
// @license      MIT
// @downloadURL none
// ==/UserScript==


const color_list = [
    "rgb(255, 0, 0)",
    "rgb(0, 0, 255)",
    "rgb(0, 128, 0)",
    "rgb(178, 34, 34)",
    "rgb(255, 127, 80)",
    "rgb(154, 205, 50)",
    "rgb(255, 69, 0)",
    "rgb(46, 139, 87)",
    "rgb(218, 165, 32)",
    "rgb(210, 105, 30)",
    "rgb(95, 158, 160)",
    "rgb(30, 144, 255)",
    "rgb(255, 105, 180)",
    "rgb(138, 43, 226)",
    "rgb(0, 255, 127)"
];

(function() {
    'use strict';

    const callback = () => {
        const targetNode = document.querySelector("#layout-body > section > aside");
        if(targetNode)
            colorizeChat(targetNode)
    }

    const observer = new MutationObserver(callback);
    observer.observe(document.getElementById("layout-body"), { attributes: false, childList: true, subtree: false });
})();

const colorizeChat = (chatNode) => {
    const callback = (mutationList, observer) => {
        for (const mutation of mutationList) {
            if (mutation.type !== "childList")
                continue

            for(let addedNode of mutation.addedNodes) {
                const nickNode = addedNode.querySelector(".name_text__yQG50");
                setNicknameColor(nickNode)
            }
        }
    };

    const observer = new MutationObserver(callback);
    observer.observe(chatNode, { attributes: false, childList: true, subtree: true });
}
const setNicknameColor = (node) => {
    const nickname = node.innerText;
    let val = 0;
    if (nickname.length > 0) {
        for (let i = 0; i < nickname.length; i++)
            val += nickname.charCodeAt(i);
    }

    node.style.color = color_list[val % color_list.length];
}