xRock / JVChat - Grandes images

// ==UserScript==
// @name         JVChat - Grandes images
// @namespace    JVChat - Grandes images
// @version      1.12
// @description  Affiche les images en grand si le message contient un :globe: ou :mac: (taille réglable)
// @author       xRock
// @match        http://*.jeuxvideo.com/forums/42-*
// @match        https://*.jeuxvideo.com/forums/42-*
// @match        http://*.jeuxvideo.com/forums/1-*
// @match        https://*.jeuxvideo.com/forums/1-*
// @updateURL https://openuserjs.org/install/xRock/JVChat_-_Grandes_images.meta.js
// @license      MIT
// ==/UserScript==

let CSS = `<style type="text/css" id="jvchatplus-css">input[id="jvchat-images-orga-input"]:focus {outline: solid 2px #ffc926;}#content.jvchat-night-mode input[id="jvchat-images-orga-input"] {background-color: #484C52;color: white;}input[id="jvchat-images-orga-input"] {color: black;border: 1px solid #2a2a2a;padding: 5px;width: 65%;height: 1.5rem;}`
let options = `<div class="jvchat-config-option" id="jvchat-images-taille"><label><span>Taille des images</span></label><div class="jvchat-range-option"><input id="jvchat-images-taille-range" type="range" min="50" max="900" step="50"><span id="jvchat-images-taille-span">? px</span></div><p>Permet d'ajuster la taille des images dans les questions</p></div><div class="jvchat-config-option" id="jvchat-images-orga"><label>Organisateur du quiz image</label><input id="jvchat-images-orga-input"></input><p>Permet de choisir de qui agrandir les images</p></div>`

let storageKey = "jvchat-images-configuration"

let configuration = {
  pseudorga: "[Mine]Volt",
  tailleimages: 600
};

// Sauvegarde de la configuration
const saveConfig = () => {
  let config = JSON.stringify(configuration)
  localStorage.setItem(storageKey, config)
}

// Chargement de la configuration
const loadConfig = () => {
  let config = JSON.parse(localStorage.getItem(storageKey) || "{}")
  for (let key in config) {
    if (config.hasOwnProperty(key) && configuration.hasOwnProperty(key)) {
      configuration[key] = config[key]
    }
  }

  document.getElementById("jvchat-images-orga-input").value = configuration.pseudorga
  document.getElementById("jvchat-images-taille-range").value = configuration.tailleimages
}

const setScrollDown = () => {
    let element = document.getElementById("jvchat-main")
    element.scrollTop = element.scrollHeight + 10000
}


const main = () => {
    addEventListener("jvchat:newmessage", function (event) {
        // Déclaration de variables utiles
        const message = document.querySelector(`.jvchat-message[jvchat-id="${event.detail.id}"]`)
        let text = message.querySelector(".txt-msg").innerHTML
        let author = message.querySelector(".jvchat-author").textContent.toLowerCase()
        let authorOptions = document.getElementById("jvchat-images-orga-input").value.toLowerCase()
        let images = ''
        let CSS = ''

        if (authorOptions === author) {
            if (text.includes("noelshack.com") && text.includes("https://image.jeuxvideo.com/smileys_img/6.gif") || text.includes("https://image.jeuxvideo.com/smileys_img/16.gif")) {
                if (text.includes("image.noelshack.com/fichiers/")) {
                    images = message.querySelectorAll(".img-shack");
                    for (const image of images) {
                        image.src = image.getAttribute("currentSrc")
                        image.style.width = "auto"
                        image.style.height = configuration.tailleimages
                        CSS = `<style type="text/css"> .img-shack[src="${image.getAttribute("currentSrc")}"] { width: auto !important; height: ${configuration.tailleimages}px !important; }</style>`
                        document.head.insertAdjacentHTML("beforeend", CSS)
                        image.setAttribute("isse", "true")
                    }
                } else {
                    images = message.querySelectorAll(".img-shack");
                    for (const image of images) {
                        const regex = image.getAttribute("alt").match(/(http|https):\/\/www.noelshack.com\/(\d\d\d\d)-(\d\d)-(\d)-(.*)/);
                        const imagesNSlink = `${regex[1]}://image.noelshack.com/fichiers/${regex[2]}/${regex[3]}/${regex[4]}/${regex[5]}`;
                        image.src = imagesNSlink;
                        CSS = `<style type="text/css"> .img-shack[src="${imagesNSlink}"] { width: auto; height: 600px; }</style>`;
                        document.head.insertAdjacentHTML("beforeend", CSS);
                        image.setAttribute("isse", "true");
                    }
                }
            }
            setScrollDown();
        }
    })
}


addEventListener("jvchat:activation", () => {
        main();

        document.head.insertAdjacentHTML("beforeend", `<style type="text/css">img[isse="true"] { height: ${configuration.tailleimages}px !important;}</style>`)
        document.getElementById("jvchat-max-width").insertAdjacentHTML("afterend", options)
        document.head.insertAdjacentHTML("beforeend", CSS)
        loadConfig()

        document.getElementById("jvchat-images-taille-span").innerHTML = `${configuration.tailleimages} px`

        document.getElementById("jvchat-images-orga-input").addEventListener("input", function () {
            configuration.pseudorga = document.getElementById("jvchat-images-orga-input").value
            saveConfig()
        })

        document.getElementById("jvchat-images-taille-range").addEventListener("input", function () {
            configuration.tailleimages = document.getElementById("jvchat-images-taille-range").value
            document.getElementById("jvchat-images-taille-span").innerHTML = `${configuration.tailleimages} px`
            saveConfig()
            document.head.insertAdjacentHTML("beforeend", `<style type="text/css">img[isse="true"] { height: ${configuration.tailleimages}px !important;}</style>`)
        })
    })