☰

Greasy Fork is available in English.

Risibank Avatar

Offre la possibilite d'ajouter un avatar anime (GIF) dans les parametres de profil JVC (Fonctionne aussi avec des images fixes) aux yeux des utilisateurs de ce script.

// ==UserScript==
// @name         Risibank Avatar
// @namespace    http://tampermonkey.net/
// @version      2024-09.v0.1.1
// @description  Offre la possibilite d'ajouter un avatar anime (GIF) dans les parametres de profil JVC (Fonctionne aussi avec des images fixes) aux yeux des utilisateurs de ce script.
// @author       Treflou
// @match        https://www.jeuxvideo.com/forums/*
// @match        https://www.jeuxvideo.com/messages-prives/*
// @match        https://www.jeuxvideo.com/profil/*?mode=infos
// @match        https://www.jeuxvideo.com/profil/*?mode=historique_forum
// @match        https://www.jeuxvideo.com/sso/infos_pseudo.php?id=*
// @icon         https://risibank.fr/logo.png
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function openRisiBank() { // Appel Risibank
        RisiBank.activate({

            ...RisiBank.Defaults.Overlay.Dark,
            mediaSize: 'sm',

            // Add selected image (risibank) to specified text area
            onSelectMedia: RisiBank.Actions.addRisiBankImageLink('#AvatarAnimeeRisi'),
        });
    }

    if (window.location.href.includes("https://www.jeuxvideo.com/sso/infos_pseudo.php?id=")) //Parametres du profil -> Ajout de la ligne "Ajouter un avatar anime :" avec previsualisation
    {

        // Import api risibank
        // html : script src="https://risibank.fr/downloads/web-api/risibank.js"></script>
        var risibankscript = document.createElement('script');
        risibankscript.src = "https://risibank.fr/downloads/web-api/risibank.js";
        risibankscript.type = "text/javascript";
        risibankscript.async = true;

        // Verifie que l'api est bien load
        risibankscript.addEventListener('load', function() {
            console.log('Le script Risibank est chargé et prêt à être utilisé.');
        });
        // Insertion du script dans le head
        document.head.appendChild(risibankscript);

        let InfosTable = document.getElementsByTagName("tbody")[0];
        let Ligne = InfosTable.insertRow(12); //Ajoute ligne au tableau
        let Case = Ligne.insertCell(0); //Ajoute première colonne

        Case.className += "cell-description p-inline-block";

        let Text = document.createElement('div');
        Text.className += "libelle";
        Text.appendChild(document.createTextNode("Avatar Animé : ")); //Ajoute ce texte dans la nouvelle ligne du tableau
        let button = document.createElement('a');
        button.className = "risibank-image"; //Bouton Risibank
        button.title = "Ajouter un média RisiBank";
        button.onclick = function() {
            document.getElementById('AvatarAnimeeRisi').value = ''; // Vide la zone de texte
            openRisiBank(); //Ouvre Risibank si logo cliqué
            return false;
        };
        button.href = "javascript:void(0);"; //palce holder
        let img = document.createElement('img'); //apparence logo risibank
        img.src = "https://risibank.fr/logo.png";
        img.width = 30; // Width in pixels //apparence
        img.height = 30; //apparence
        button.appendChild(img);
        Text.appendChild(button);
        Case.append(Text);

        let Url = document.createElement('div'); //Prépare la case lien URL
        Url.className += "valeur";
        Case.appendChild(Url);

        let UrlInput = document.createElement('input');
        UrlInput.className = 'form-control';
        UrlInput.placeholder = "https://risibank.fr/cache/medias..."; //Création de la case URl avec texte exemple
        UrlInput.id = "AvatarAnimeeRisi";
        Url.append(UrlInput);

        const InputStyle = {

            margin: "0.4rem 0", //Apparance de la case URL
            color : "#000000",
        };

        Object.assign(UrlInput.style, InputStyle); //Donne l'apparance à la case URL

        let Visuel = document.createElement('span');
        let Img = document.createElement('img'); //Création d'une image carré permettant de prévisualiser le sticker
        Img.setAttribute('src', 'https://image.jeuxvideo.com/avatar-sm/default.jpg'); //apparance sans avatar
        Img.style.height = '50px'; //apparance
        Img.style.width = '50px';
        Img.style.borderColor = "#4a4c4f";
        Img.style.margin = "10px";
        Img.style.objectFit = "scale-down"; //apparance

        Visuel.appendChild(Img);
        Case.appendChild(Visuel);

        let VisuelCercle = document.createElement('span');
        let ImgCercle = document.createElement('img'); //Création d'une image circulaire permettant de prévisualiser le sticker
        ImgCercle.setAttribute('src', 'https://image.jeuxvideo.com/avatar-sm/default.jpg'); //apparance sans avatar
        ImgCercle.style.height = '50px'; //apparance
        ImgCercle.style.width = '50px';
        ImgCercle.style.borderColor = "#4a4c4f";
        ImgCercle.style.borderRadius = "50%"; //Rend l'image circulaire
        ImgCercle.style.margin = "10px";
        ImgCercle.style.objectFit = "cover"; //apparance

        VisuelCercle.appendChild(ImgCercle);
        Case.appendChild(VisuelCercle);

        let NewSignature = document.querySelector("#signature");
        let NewSignatureText = NewSignature.textContent; //Récupère le texte de la signature
        let NewTag = ""; //initialisation du code sticker en lien avec le script
        let TagEnd = 0; //Fin du code
        let TagStart = 0; //Début du code

        let Valider = document.createElement('span');
        let BoutonValidation = document.createElement('button'); //Création du bouton "valider"
        BoutonValidation.innerText = "Valider"; //Texte du bouton
        BoutonValidation.className = 'simpleButton';
        Valider.appendChild(BoutonValidation);
        Valider.style.margin = '50px'; //apparence
        Case.appendChild(Valider);

        // Efface l'integralite du champ si "RETOUR ARRIERE" ou "SUPPR" sont utilises.
        UrlInput.onkeydown = function() {
            if(event.key === "Backspace" || event.key === "Delete") {
                UrlInput.value = "";
                return false;
            }
        };

        // Selectionne l'URL complete lors d'un clic si l'utilisateur veut la remplacer.
        UrlInput.addEventListener("click", () => UrlInput.select());

        UrlInput.addEventListener("input", (event) => {
            //let paste = (event.clipboardData || window.clipboardData).getData("text");
            let paste = UrlInput.value;

            if(paste === "")
            {
                return;
            }

            Img.setAttribute("src", paste); //Previsualisation "Carre"
            ImgCercle.setAttribute("src", paste); //Previsualisation "Cercle"

            NewTag = paste;

            if (NewTag.includes('https://risibank.fr/cache/medias/')) {
                //lien_risibank
            } else {
                alert("L'url doit contenir le lien direct risibank \nExemple : https://risibank.fr/cache/medias/0/34/3493/349399/full.png"); //Message d'erreur si l'URL n'est pas un lien Risibank (Noelshack non accepté par exemple)
                window.location.reload(); //RéActualise la page
                return;
            }

            let FormatLetter = NewTag.at(NewTag.lastIndexOf(".") + 1); //Récupère la première lette de l'extension : G comme Gif par exemple
            TagEnd = NewTag.lastIndexOf("/"); //Fin du Tag dans le lien collé
            TagStart = NewTag.lastIndexOf("/", TagEnd - 2); // Début du tag dans le lien collé

            NewTag = NewTag.substring(TagStart + 1,TagEnd) + FormatLetter; //Le nouveau code = le Tag du sticker (=son id) + la lettre de format G comme gif
        });

        Url.addEventListener("keydown", ({key}) => { //Validation du sticker si touche entrer - Securite

            if (key === "Enter") {

                Validation();
            }
        });

        BoutonValidation.addEventListener("click", () => { //Validation du sticker si bouton "Valider"

                Validation();
        });

        document.getElementsByClassName("valider-modif-profil")[0].addEventListener("click", () => { //Validation du sticker si validation du formulaire

                Validation();
        });

        function Validation() {
            if (NewTag.trim() !== "") { // Contenue valide
                if (NewSignatureText.indexOf("{") != -1) { //Verifie la presence d'un Tag debutant par {
                    let Accolade1 = NewSignatureText.indexOf("{"); //Position de la première accolade
                    let Accolade2 = NewSignatureText.indexOf("}", Accolade1 + 1); //Positon de la deuxième accolade
                    if (Accolade2 != -1) { //Verifie la presence d'une seconde } (= fin du tag)
                        if (Accolade1 + 1 === Accolade2) { //acolade_vide
                            NewSignature.innerHTML = NewSignatureText.slice(0, Accolade1 + 1) + NewTag + NewSignatureText.slice(Accolade2); //Indique que les accolades sont vides et où ajouter le tag
                        } else {
                            NewSignature.innerHTML = NewSignatureText.replace(NewSignatureText.substring(Accolade1 + 1, Accolade2), NewTag); //Si un ancien tag existait, le remplace
                        }
                    }
                } else { // = Premier avatar custom
                    NewSignature.innerHTML = NewSignatureText + " {"+NewTag+"} "; //Si premier avatar animé, ajout du tag
                }
            } else {
                // Si NewTag est vide vire les acolades existante avec des caratere ou non
                NewSignature.innerHTML = NewSignatureText.replace(/\{[^}]*\}/g, '');
            }
        }
    }

    if (window.location.href.includes("profil")) { //Si Page Profil
        try {
            let ProfilSignatureElement = document.getElementsByClassName("bloc-signature-desc"); //Regarde la signature
            let ProfilSignature = ProfilSignatureElement[0].textContent; //Récupère le texte de la signature
            let ProfilTag = getTag(ProfilSignature); //Récupère le tag en signature si existant
            if (ProfilTag != "") {

                let NewProfilAvatarURL = tagToURL(ProfilTag); //Permet de convertir le tag en lien Risibank équivalent
                let ProfilAvatar = document.querySelector("#header-profil > div.content-img-avatar > img");
                ProfilAvatar.setAttribute("src", NewProfilAvatarURL); //Change l'avatar de la page profil avec l'avatar animé
                ProfilAvatar.setAttribute("data-src", ""); // Corrige le lazy load
            }
        } catch (error) {
            console.error("Pas de Valeur PP signature"); //Si pas de tag en signature -> Message d'erreur
        }
    }

    let SignatureList = document.querySelectorAll("div.signature-msg"); //Liste des signatures de la page
    SignatureList.forEach(function(valeur){

        let Signature = valeur.textContent; //Recupere le texte de la signature
        let Tag = getTag(Signature); //Récupère le tag si existant

        if (Tag != "")
        {

            let NewAvatarURL = tagToURL(Tag); //Permet de convertir le tag en lien Risibank équivalent
            let Avatar = valeur.closest("div.conteneur-message").children[0].children[0].children[0]; //Trouve l'avatar lié à la signature
            Avatar.setAttribute("src", NewAvatarURL); //Change l'avatar du post avec l'avatar animé
            Avatar.setAttribute("data-src", ""); //Corrige le lazy load

            let TagRemoved = valeur.innerHTML.replace("{"+Tag+"}",""); //Enleve Tag de la signature
            valeur.innerHTML = TagRemoved;

        }
    });

    function getTag(SignatureString)
    {
        let Tag = "";

        if (SignatureString.indexOf("{") != -1) //Verifie la presence d'un Tag debutant par {
        {

            let PremiereAccolade = SignatureString.indexOf("{");
            let DeuxiemeAccolade = SignatureString.indexOf("}", PremiereAccolade + 1);

            if (DeuxiemeAccolade != -1) //Verifie la presence d'une seconde } (= fin du tag)
            {
                Tag = SignatureString.substring(PremiereAccolade + 1, DeuxiemeAccolade); //Scan les chiffres entre les {}
            }
        }

        return Tag;
    }

    function tagToURL(TagString) //Permet d'obtenir le lien de l'image desiree à partir de son tag
    {

        let Tag = TagString;
        let URL = "/full."; //fin de l'URL avant format
        let Format = Tag.slice(-1).toLowerCase(); //Dernier caractere ( p pour PNG, j pour JPEG, g pour GIF,s pour SVG, b pour BMP, t pour TIFF) -> ajoute le format de l'image en fin d'URL
        let Length = Tag.length - 1;

        switch (Format) {

            case 'p':
                URL = URL + "png";
                break;
            case 'j':
                URL = URL + "jpeg";
                break;
            case 'g':
                URL = URL + "gif";
                break;
            case 's':
                URL = URL + "svg";
                break;
            case 'b':
                URL = URL + "bpm";
                break;
            case 't':
                URL = URL + "tiff";
                break;
            default:
                URL = URL + "gif";
                Length = Length + 1;
        }

        Tag = Tag.slice(0, Length); //enleve le dernier caractere du type de format
        URL = Tag + URL;

        for (var k = 1; k < 4; k++) //Reproduit la generation des URL de Risibank en partant du Tag (De droite vers la gauche) /!\ Pourrait devenir obsolete si les URL Risibank venaient à changer de https://risibank.fr/cache/medias/0/2/239/23942/full.png à https://risibank.fr/cache/medias/0/0/2/239/23942/full.png

        {
            Length = Length - 2;

            if (Length > 0)
            {
                URL = Tag.slice(0,Length) +"/"+ URL;
            }
            else{URL = "0/" + URL;}
        }

        URL = "https://risibank.fr/cache/medias/" + URL; //Debut de l'URL
        return URL;
    }

})();