function getChannelName() {
    const path = window.location.pathname.split('/').filter(Boolean);
    if (path.length == 1) return path[path.length - 1];
    return null;
}

function addEmotePopup(node, emote) {
    let popup;
    console.log("added");

    node.addEventListener("mouseenter", () => {
        const img = document.createElement("img");
        img.src = emote.fullurl;
        img.alt = emote.code;

        const code = document.createElement("p");
        code.textContent = emote.code;
        code.style.fontWeight = 'bold';

        const type = document.createElement("p");
        type.textContent = `Channel ${emote.instance} emote`;

        const uploader = document.createElement("p");
        uploader.textContent = `By: ${emote.uploader}`;

        popup = document.createElement("div");
        popup.append(img, code, type, uploader);

        popup.style.position = 'absolute';
        popup.style.display = 'flex';
        popup.style.flexDirection = 'column';
        popup.style.justifyContent = 'center';
        popup.style.alignItems = 'center';
        popup.style.padding = '8px';
        popup.style.background = 'linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(20, 20, 20, 0.8))';
        popup.style.color = '#fff';
        popup.style.borderRadius = '4px';
        popup.style.border = 'solid 1px rgba(10, 10, 10, 0.8)';
        popup.style.fontSize = '12px';
        popup.style.pointerEvents = 'none';
        popup.style.zIndex = '10';

        document.body.appendChild(popup);

        const rect = node.getBoundingClientRect();
        const popupRect = popup.getBoundingClientRect();
        popup.style.top = `${rect.bottom + window.scrollY + 2}px`;
        popup.style.left = `${rect.left + window.scrollX - (popupRect.width / 2)}px`;
    });

    node.addEventListener("mouseleave", () => {
        if (popup) {
            popup.remove();
            popup = null;
        }
    });
}

function replaceEmotes(node, emotes) {
    const walker = document.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);

    const textNodes = [];
    while (walker.nextNode()) textNodes.push(walker.currentNode);

    textNodes.forEach(x => {
        const parent = x.parentNode;
        const frag = document.createDocumentFragment();
        const words = x.textContent.split(/(\s+)/);

        words.forEach(word => {
            if (emotes[word]) {
                const emote = emotes[word];

                const img = document.createElement("img");
                img.src = emote.miniatureurl;
                img.alt = word;
                img.classList.add("tiny-emote");
                addEmotePopup(img, emote);
                frag.appendChild(img);
            } else {
                frag.appendChild(document.createTextNode(word));
            }
        });

        parent.replaceChild(frag, x);
    });
}