JanitorAI CSS Toggle

Toggles JanitorAI custom CSS
Fra 25.04.2025. Se den seneste versjonen.
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name         JanitorAI CSS Toggle
// @namespace    http://tampermonkey.net/
// @version      0.1.1
// @description  Toggles JanitorAI custom CSS
// @author       IWasTheSyntaxError
// @match        https://janitorai.com/*
// @grant        none
// @license MIT
// ==/UserScript==
 
(function() {
    'use strict';
 
    let alreadyReloaded = true;
    let isMenuVisible = false;
    let isCustomCssDisabled = localStorage.getItem('janitorAICustomCssDisabled') === 'true';
 
    let controlPanel = null;
    let controlsContainer = null;
 
    const isAllowedPage = () => {
        const path = window.location.pathname;
        return path.startsWith('/characters') || path === '/my_characters' || path.startsWith('/profiles/');
    };
 
    const isChatsPage = () => window.location.pathname.startsWith('/chats');
 
    const getNextPageElement = () => {
        const currentPage = document.querySelector('.css-1xdrgup');
        if (!currentPage) return null;
 
        let nextElement = currentPage.nextElementSibling;
        while (nextElement) {
            if (nextElement.classList.contains('css-kzd6o0') || nextElement.classList.contains('css-15aspjy')) {
                return nextElement;
            }
            nextElement = nextElement.nextElementSibling;
        }
        return null;
    };
 
    const toggleMenu = () => {
        isMenuVisible = !isMenuVisible;
        updateElementsVisibility();
        updateControlText();
    };
 
    const toggleCustomCss = () => {
        isCustomCssDisabled = !isCustomCssDisabled;
        localStorage.setItem('janitorAICustomCssDisabled', isCustomCssDisabled);
        applyCustomCssToggle();
        updateControlText();
    };
 
    const applyCustomCssToggle = () => {
        if (isCustomCssDisabled) {
            alreadyReloaded = false;
            removeCustomStyles();
            const parentElement = document.querySelector('.css-1bn1yyx');
            if(parentElement){
                const childElements = parentElement.querySelectorAll('*');
                for (let i = 0; i < childElements.length; i++) {
                    if (childElements[i].nodeName === "STYLE") {
                        childElements[i].parentNode.removeChild(childElements[i]);
                    }
                }
                const background = document.querySelector(".css-14l6kwv").firstChild;background.style.background = "none";
            }const char = document.querySelector(".css-fu9q4m");
            if(!char){
                const main = document.querySelector(".css-lo240v");
                const elementsWithStyle = main.querySelectorAll('[style]');elementsWithStyle.forEach(element => {
                    element.removeAttribute('style');
                });
            } else {
                const elementsWithStyle = char.querySelectorAll('[style]');elementsWithStyle.forEach(element => {
                    element.removeAttribute('style');
                });
            };
            //blockCustomElements();
        } else {
            if(!alreadyReloaded){
                console.log('alreadyReloaded');
                location.reload();
                alreadyReloaded = true;
            }
        }
    };
 
    const removeCustomStyles = () => {
        const styles = document.querySelectorAll('body style');
        styles.forEach(style => style.remove());
    };
 
    const blockCustomElements = () => {
        document.querySelectorAll('.css-1bn1yyx').forEach(element => {
            element.style.display = 'none';
        });
 
        document.querySelectorAll('*').forEach(element => {
            const style = window.getComputedStyle(element);
            const bgImage = style.backgroundImage;
            if (bgImage && bgImage.includes('ella.janitorai.com/background-image/')) {
                element.style.backgroundImage = 'none';
            }
        });
    };
 
    const updateControlText = () => {
        const cssToggleText = document.getElementById('css-toggle-text');
        if (cssToggleText) {
            cssToggleText.textContent = `Custom CSS: ${isCustomCssDisabled ? 'OFF' : 'ON'}`;
            cssToggleText.style.color = isCustomCssDisabled ? '#fff' : '#ccc';
        }
    };
 
    const createControlPanel = () => {
        if (controlPanel) return;
 
        controlPanel = document.createElement('div');
        controlPanel.id = 'janitor-control-panel';
        Object.assign(controlPanel.style, {
            position: 'fixed',
            top: '75px',
            left: '10px',
            zIndex: '100000',
            display: 'flex',
            flexDirection: 'column',
            gap: '5px',
            alignItems: 'flex-start'
        });
 
        const settingsButton = document.createElement('button');
        settingsButton.id = 'token-filter-toggle';
        settingsButton.textContent = '⚙️';
        Object.assign(settingsButton.style, {
            width: '30px',
            height: '30px',
            padding: '0',
            backgroundColor: 'rgba(74, 74, 74, 0.7)',
            color: '#fff',
            border: 'none',
            borderRadius: '5px',
            cursor: 'pointer',
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'center',
            fontSize: '16px',
            transition: 'background-color 0.2s'
        });
        settingsButton.addEventListener('click', toggleMenu);
 
        controlsContainer = document.createElement('div');
        controlsContainer.id = 'controls-container';
        Object.assign(controlsContainer.style, {
            display: 'none',
            flexDirection: 'column',
            gap: '5px',
            backgroundColor: 'rgba(74, 74, 74, 0.7)',
            padding: '5px',
            borderRadius: '5px',
            zIndex: '100001'
        });
 
        const cssToggleText = document.createElement('span');
        cssToggleText.id = 'css-toggle-text';
        cssToggleText.style.cursor = 'pointer';
        cssToggleText.style.fontSize = '12px';
        cssToggleText.addEventListener('click', toggleCustomCss);
 
        controlsContainer.appendChild(cssToggleText);
        controlPanel.appendChild(settingsButton);
        controlPanel.appendChild(controlsContainer);
        document.body.appendChild(controlPanel);
        updateControlText();
    };
 
    const updateElementsVisibility = () => {
        const shouldShow = isAllowedPage() && !isChatsPage();
        if (controlPanel) controlPanel.style.display = shouldShow ? 'flex' : 'none';
        if (controlsContainer) controlsContainer.style.display = shouldShow && isMenuVisible ? 'flex' : 'none';
    };
 
    const initialize = () => {
        createControlPanel();
        updateElementsVisibility();
 
        if (isAllowedPage() && !isChatsPage()) {
            applyCustomCssToggle();
 
            new MutationObserver(() => {
                applyCustomCssToggle();
            }).observe(document.body, { childList: true, subtree: true });
 
            const originalAppendChild = Element.prototype.appendChild;
            Element.prototype.appendChild = function(node) {
                if (isCustomCssDisabled && node.tagName === 'STYLE' && this.tagName === 'HEAD') {
                    return node;
                }
                return originalAppendChild.call(this, node);
            };
        }
    };
 
    const tryInitialize = () => {
        if (document.body) {
            initialize();
            let lastPath = window.location.pathname;
            setInterval(() => {
                if (lastPath !== window.location.pathname) {
                    lastPath = window.location.pathname;
                    updateElementsVisibility();
                    if (isAllowedPage() && !isChatsPage()) {
                        applyCustomCssToggle();
                    }
                }
            }, 500);
        } else {
            setTimeout(tryInitialize, 1000);
        }
    };
 
    tryInitialize();
})();