RisiOnche

Risibank sur onche.org (Fix)

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         RisiOnche
// @namespace    RisiOnche
// @version      0.31.2
// @description  Risibank sur onche.org (Fix)
// @author       RisiOnche
// @match        https://onche.org/topic/*
// @match        https://onche.org/forum/*
// @match        https://onche.org/chat/*
// @exclude      https://onche.org/forum/**/search
// @exclude      https://onche.org/forum/**/search?*
// @icon         https://www.risishack.com/lfoubw.png
// ==/UserScript==

let overlay = JSON.parse(localStorage.getItem('risi-overlay')) ?? false;
let risiOpen = JSON.parse(localStorage.getItem('risi-toggle-open')) ?? true;

const themeRisi = document.body.matches('.blue, .grey') ? 'dark' : 'light';


let showNSFW;
if (location.href.includes('onche.org/forum/3')) {
    showNSFW = true;
} else if (document.querySelector('.title a[href*="onche.org/forum/3"]')) {
    showNSFW = true;
} else {
    showNSFW = false;
}


let toggleAddCSS;
let placeForToggle;
let textArea;
let placeForRisi;
if (location.href.includes('onche.org/chat/')) {
    toggleAddCSS = 'cursor: pointer; padding : 10px 20px 7px; float: right;';
    placeForToggle = document.querySelector('.Form.insert-image')
    placeForRisi = document.querySelector('.chat .content');
    textArea = document.querySelector('.Form__input');
} else {
    toggleAddCSS = '';
    placeForToggle = document.querySelector('.format .item:last-of-type')
    placeForRisi = document.querySelector('.favoriteStickers');
    textArea = document.querySelector('.textarea');
}

// Injection de la feuille JS dans le head pour compatibilité Violentmonkey
const script = document.createElement('script');
script.src = 'https://risibank.fr/downloads/web-api/risibank.js';
document.head.appendChild(script);
script.onload = () => risibankReady();


//API RISIBANK
function activateRisibankOn(container) {
    RisiBank.activate({
        type : overlay ? 'overlay' : 'iframe',
        container,
        theme : themeRisi,
        mediaSize : 'sm',
        navbarSize : 'sm',
        defaultTab : 'fav',
        showNSFW : showNSFW,
        allowUsernameSelection : true,
        //onSelectMedia: RisiBank.Actions.addSourceImageLink(document.querySelector(textArea)
        onSelectMedia: (e) => {
            RisiBank.Actions.addSourceImageLink(textArea)(e);
            textArea?.dispatchEvent(new Event('change', { bubbles: true })); //Remonte au listener JS du site
        }
    });
}

function risibankReady() {
    //Create Node RisiOnche
    function remountRisiOnche() {
        document.getElementById('risi-onche')?.remove();
        if (overlay || !risiOpen) return;

        if (!placeForRisi) return;
        placeForRisi.insertAdjacentHTML('afterend', '<div id="risi-onche" style="max-height: 30rem"></div>');


        activateRisibankOn(document.getElementById('risi-onche'));
        const iframeRisi = document.querySelector('iframe[src^="https://risibank.fr/embed"]');
        if (iframeRisi) iframeRisi.style.height = '10rem';

    }
    remountRisiOnche();

    // HTML Btn Risibank
    placeForToggle?.insertAdjacentHTML('afterend', `
        <div id="risibank-toggle" class="item" title="Ouvrir / Fermer RisiBank" style="${toggleAddCSS}">
           <img src="https://risibank.fr/logo.png" width="24" style="filter: hue-rotate(250deg)">
        </div>
    `);
    // Listeners JS Bloc
    document.getElementById('risibank-toggle')?.addEventListener('click', () => {
        //Bouton RisiOnche
        if (overlay) {
            activateRisibankOn(document.body);
        } else {
            risiOpen = !risiOpen; // Revert
            localStorage.setItem('risi-toggle-open', JSON.stringify(risiOpen));

            remountRisiOnche();
        }
    });


    // Bloc Options dans la sidebar 
    const lastDivRight = [...document.querySelectorAll('#right .bloc.border')].pop();
    lastDivRight?.insertAdjacentHTML('afterend', `
        <div class="bloc border red">
            <div class="title">🔧 Risibank</div>
            <div class="content centered">
                <button id="swtich-mode" class="button bordered" type="button" style="background: transparent;">Mode intégré ON/OFF</button>
            </div>
        </div>
    `);
    // Listeners Bloc Options
    document.getElementById('swtich-mode')?.addEventListener('click', () => {
        overlay = !overlay; // Revert
        localStorage.setItem('risi-overlay', JSON.stringify(overlay));

        document.querySelector('.bloc.border.red')?.insertAdjacentHTML('afterend',
            `<div class="alert green margin-bottom vanish">Mode Risibank ${overlay ? 'Overlay' : 'Intégré'}</div>`);
        setTimeout(() => [...document.querySelectorAll('.alert.green.margin-bottom.vanish')].pop()?.remove(), 2000);

        remountRisiOnche();
    });

}


//Clean 403 Open Img NoelShack
document.getElementById('left').addEventListener('click', (e) => {
    const linkShack = e.target.closest('a.link[href^="https://image.noelshack.com/"]');
    if (linkShack) {
        e.preventDefault();
        window.open(linkShack.href, '_blank', 'noopener,noreferrer'); //NoReferrer
        //window.open(`https://risibank.fr/api/v1/medias/by-source?type=jvc&url=${linkShack.href}`, '_blank'); //Risibank
    }
});


// Remplace les liens risibank par des images inline
document.querySelectorAll('a.link[href^="https://risibank.fr/cache/medias/"]').forEach(link => {
    link.outerHTML = `<div class="smiley"><img src="${link.href}"></div>`;
});