// ==UserScript==
// @name         On'Chat
// @namespace    http://tampermonkey.net/
// @version      0.3
// @description  Ajoute un LiveChat sur onche.org comme sur JVChat
// @author       NixOS@onche.com
// @match        https://onche.org/topic/*
// @downloadURL  https://codeberg.org/AntoineForum/OnChat/raw/branch/main/user.main.js
// @updateURL    https://codeberg.org/AntoineForum/OnChat/raw/branch/main/user.main.js
// @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
// @grant        none
// ==/UserScript==

(function() {


    'use strict';


// Vérificion clé PGP
    const usersToReplace = ['ANTOlNEFORUM2'];
    const iconHTML = '<img class="icon" src="https://i.imgur.com/i8itfkj.png" alt="Clé PGP vérifié" title="Clé PGP vérifié">';

    function replaceUsernames() {
        const messageUsernames = document.querySelectorAll('a.message-username:not(.replaced)');
        messageUsernames.forEach(usernameElement => {
            if (usersToReplace.includes(usernameElement.textContent)) {
                const parentDiv = document.createElement('div');
                parentDiv.classList.add('flex', 'message-badges');
                usernameElement.parentElement.insertBefore(parentDiv, usernameElement);
                parentDiv.appendChild(usernameElement);
                parentDiv.insertAdjacentHTML('beforeend', iconHTML);
                usernameElement.classList.add('replaced'); // Add a class to indicate that this element has been replaced
            }
        });
    }

    // Disconnect the observer while modifying the DOM to avoid infinite loops
    const observer = new MutationObserver((mutationsList, observer) => {
        observer.disconnect();
        replaceUsernames();
        observer.observe(document, { childList: true, subtree: true });
    });


      // CONFIGURATION
      const MESSAGES_PER_PAGES = 20;

      // Variables for the keyboard event
      const textarea = document.querySelector(".textarea");
      const button = document.querySelector("input.button");

      textarea.addEventListener("keydown", (event) => {
          // Check if the pressed key is Enter and the Shift key isn't pressed
          if (event.key === "Enter" && !event.shiftKey ) {
              // Prevent the default behavior of the Enter key (i.e., inserting a newline)
              event.preventDefault();

              // Trigger the button click
              button.click();
          }
      });

      const fullUrlString = document.querySelector("div.pagination a.active").getAttribute('href');

      // The
      const rawUrlString = fullUrlString.split('\/').slice(0, -1).join('\/');
      let activePage = parseInt(document.querySelector('.active').text, 10);
      const allPagesElements = document.querySelectorAll("div.content.pagination div.pagination")[0].querySelectorAll('a');
      let currentMessageCount = document.querySelectorAll("div.messages div.message:not(.answer)").length;
      let initialMaxPage = parseInt(allPagesElements[allPagesElements.length - 1].text, 10);

      console.log("Script is on")
      console.log(rawUrlString)


     function callMakeRequest() {
         makeRequest(rawUrlString + "/" + activePage)
     }

      function isElementVisible(el) {
          const rect = el.getBoundingClientRect();
          return (
              rect.top >= 0 &&
              rect.left >= 0 &&
              rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
              rect.right <= (window.innerWidth || document.documentElement.clientWidth)
          );
      }


    function makeRequest(url) {
        // Create a new XMLHttpRequest object
        const xhr = new XMLHttpRequest();

        // Define the URL and method of the request
        const method = "GET";

        // Open the request with the URL and method
        xhr.open(method, url);

        // Define the callback function to read the response
        xhr.onload = function() {
            if (xhr.status === 200) {
                const response = xhr.responseText;
                // console.log(response)
                const parser = new DOMParser();
              const htmlDocument = parser.parseFromString(response, "text/html"); // Parse the HTML response
              let messageCount = htmlDocument.querySelectorAll("div.messages div.message:not(.answer)").length
              console.log(htmlDocument.querySelectorAll("div.messages div.message:not(.answer)"))

              console.log("Number of text messages:", messageCount);

                if (messageCount > currentMessageCount) {
                    console.log("New message")
                    let numberOfMessagesToAdd = messageCount - currentMessageCount;
                    let nodeArray = htmlDocument.querySelectorAll("div.messages div.message:not(.answer)")
                    let substring = Array.from(nodeArray).slice(messageCount - numberOfMessagesToAdd, messageCount);

                    // For each elements that we received. We apppend it to the messages
                    substring.forEach(element => {
                        document.querySelector('.messages').appendChild(element);
                    });
                    currentMessageCount = messageCount;

                    // If the textarea is visible we scroll
                    if (isElementVisible(textarea)) {
                        // execute the action if the element is visible
                        document.querySelector(".textarea").scrollIntoView({
                            block: "center",
                            inline: "nearest",
                            behavior: "smooth"
                        });
                    }


                    if (currentMessageCount === MESSAGES_PER_PAGES) {
                        activePage += 1
                        currentMessageCount = 0
                    }
                }
                //console.log(response);
                // Replace this with your actual response handling code
            }
        };

        // Send the request
        xhr.send();
    }
      console.log()
        observer.observe(document, { childList: true, subtree: true });
      if (activePage !== initialMaxPage) { return }
      setInterval(callMakeRequest, 2000);
  })();