// ==UserScript==
// @name         !HSSSysMsg
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  HELL STUMBLECHAT SCRIPT
// @author       MeKLiN
// @match        https://stumblechat.com/room/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=stumblechat.com
// @grant        none
// @run-at       document-end
// @license      MIT
// ==/UserScript==

(function() {
    let css = `
        .message .nickname ~ .content {
            display: inline-block;
            top: -7px;
            position: relative;
            margin-left: 2px;
            margin-right: 1em;
        }
        .content + .content {
            display: inline-block!important;
            margin-right: 1em;
        }
        .message .nickname ~ .content span {
            line-height: 1.5em;
        }
    `;
    if (typeof GM_addStyle !== "undefined") {
      GM_addStyle(css);
    } else {
      let styleNode = document.createElement("style");
      styleNode.appendChild(document.createTextNode(css));
      (document.querySelector("head") || document.documentElement).appendChild(styleNode);
    }
})();

var scripts = document.getElementsByTagName("script");
var script = null;
var found = false;

for (var i = 0; i < scripts.length; i++) {
    script = scripts[i];
    if (/^jQuery.*\.js$/i.test(script.src)) {
        found = true;
        break;
    }
}

if (!found) {
    try {
        $ || jQuery || $ === jQuery;
        found = true;
    } catch (err) {

    }
}

if (!found) {
    // inject jQuery.
    script = document.createElement("script");
    script.type = "text/javascript";

    var protocol = /^https:/i.test(document.location) ? "https" : "http";
    script.src = protocol + "://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
    document.getElementsByTagName("body")[0].appendChild(script);
}

// Define App globally
window.App = {
    Init: () => {
        // Define the behavior of App.Init() here
        console.log('App.Init() called');
    }
};

class VerifyScript {
    constructor() {
        this.observeDOM();
        this.setupConsoleOverlay();
        this.clickCount = 0;
    }

    clickVerifyButton = (verifyButton) => {
        this.clickCount++;
        this.logToOverlay(`Attempting to click VERIFY button ${this.clickCount} time(s)...`);
        if (verifyButton) {
            this.logToOverlay('VERIFY button found.');
            // Remove any existing event listeners on the button
            verifyButton.removeEventListener('click', this.clickVerifyButton);
            // Manually create and dispatch a click event
            const clickEvent = new MouseEvent('click', {
                bubbles: true,
                cancelable: true,
                view: window
            });
            this.logToOverlay('Before dispatchEvent');
            verifyButton.dispatchEvent(clickEvent);
            this.logToOverlay('After dispatchEvent');

            if (this.clickCount < 3) {
                setTimeout(() => {
                    if (this.isMouseLocked()) {
                        this.sendMouseUp();
                    }
                    this.clickVerifyButton(verifyButton);
                }, 500); // Delay between clicks
            } else if (this.clickCount === 3) {
                // After the third click, call App.Init()
                this.logToOverlay('Third click completed, calling App.Init()...');
                setTimeout(() => {
                    this.logToOverlay('Calling App.Init()...');
                    App.Init();
                }, 500); // Adjust the delay as needed
            }
        } else {
            this.logToOverlay('VERIFY button not found.');
        }
    }

    isMouseLocked = () => {
        return document.pointerLockElement === document.body ||
            document.mozPointerLockElement === document.body ||
            document.webkitPointerLockElement === document.body;
    }

    sendMouseUp = () => {
        this.logToOverlay('Mouse is locked, sending mouseup command...');
        const mouseUpEvent = new MouseEvent('mouseup', {
            bubbles: true,
            cancelable: true,
            view: window
        });
        document.body.dispatchEvent(mouseUpEvent);
    }

    observeDOM = () => {
        this.logToOverlay('Setting up MutationObserver...');
        const observer = new MutationObserver((mutationsList) => {
            this.logToOverlay(`Mutation observed... ${mutationsList.length} mutation(s) in total.`);
            for (const mutation of mutationsList) {
                this.logToOverlay(`Mutation type: ${mutation.type}`);
                this.logToOverlay(`Mutation target: ${mutation.target.outerHTML}`);
                this.logToOverlay(`Added nodes: ${mutation.addedNodes.length}`);
                mutation.addedNodes.forEach((node) => {
                    if (node instanceof HTMLElement) {
                        this.logToOverlay(`Added node: ${node.nodeName}`);
                        // Check if the added node is a system message
                        if (node.classList.contains('system')) {
                            // Move the system message to the system message window
                            systemMessageWindow.appendChild(node.cloneNode(true));
                        }
                    }
                });
                this.logToOverlay(`Removed nodes: ${mutation.removedNodes.length}`);
                mutation.removedNodes.forEach((node) => {
                    this.logToOverlay(`Removed node: ${node.nodeName}`);
                });
            }
        });

        // Start observing changes in the chat content
        this.logToOverlay('Attempting to observe chat content...');
        const chatContent = document.querySelector('#chat-content');
        if (chatContent) {
            this.logToOverlay('Chat content found. Starting observation...');
            observer.observe(chatContent, { childList: true });
        } else {
            this.logToOverlay('Chat content not found.');
        }
    }

    setupConsoleOverlay = () => {
        // Setup console overlay as before
        // ...
    }

    logToOverlay = (message, target = this.consoleOverlay) => {
        const logEntry = document.createElement('div');
        logEntry.textContent = message;
        if (target) {
            target.appendChild(logEntry);
        }
        console.log(message);
    }
}

// Start the script
new VerifyScript();

// Create draggable div window for system messages
const systemMessageWindow = document.createElement('div');
systemMessageWindow.classList.add('system-message-window');
systemMessageWindow.style.position = 'fixed';
systemMessageWindow.style.top = '20px';
systemMessageWindow.style.right = '20px';
systemMessageWindow.style.background = 'rgba(255, 255, 255, 0.9)';
systemMessageWindow.style.border = '1px solid #ccc';
systemMessageWindow.style.padding = '10px';
systemMessageWindow.style.cursor = 'move';
systemMessageWindow.style.maxWidth = '400px'; // Limit the width to prevent infinite length
systemMessageWindow.innerHTML = 'System Messages Window';

// Make the window draggable
let isDragging = false;
let offsetX, offsetY;
systemMessageWindow.addEventListener('mousedown', e => {
    isDragging = true;
    offsetX = e.clientX - systemMessageWindow.getBoundingClientRect().left;
    offsetY = e.clientY - systemMessageWindow.getBoundingClientRect().top;
});

document.addEventListener('mousemove', e => {
    if (isDragging) {
        const x = e.clientX - offsetX;
        const y = e.clientY - offsetY;
        systemMessageWindow.style.left = `${x}px`;
        systemMessageWindow.style.top = `${y}px`;
    }
});

document.addEventListener('mouseup', () => {
    isDragging = false;
});

// Append the window to the body
document.body.appendChild(systemMessageWindow);