User:Ieditrandomarticles/autobox.js

/* 
autobox gadget - One-click maintenance templates for Wikipedia
Updated: 2025-04-10
*/

(function() {
    const availableTags = {
        'noref': {template: 'noref', placement: 'top'},
        'onesource': {template: 'onesource', placement: 'top'},
        'copyedit': {template: 'copyedit', placement: 'top'},
        'wikify': {template: 'wikify', placement: 'top'},
        'POV': {template: 'POV', placement: 'top'},
        'update': {template: 'update', placement: 'top'},
        'refimprove': {template: 'refimprove', placement: 'top'},
        'citation needed': {template: 'cn', placement: 'inline'},
        'dubious': {template: 'dubious', placement: 'inline'},
        'clarify': {template: 'clarify', placement: 'inline'},
        'who': {template: 'who', placement: 'inline'},
        'when': {template: 'when', placement: 'inline'}
    };

    function getCurrentDate() {
        const months = ['January', 'February', 'March', 'April', 'May', 'June', 
                        'July', 'August', 'September', 'October', 'November', 'December'];
        const now = new Date();
        return months[now.getMonth()] + ' ' + now.getFullYear();
    }

    function initUI() {
        if (mw.config.get('wgNamespaceNumber') !== 0 || document.getElementById('autobox-button')) return;

        const button = document.createElement('div');
        button.id = 'autobox-button';
        button.title = 'Quick maintenance tags';
        button.innerHTML = '📦 autobox';
        Object.assign(button.style, {
            position: 'fixed',
            bottom: '20px',
            right: '20px',
            zIndex: '9999',
            cursor: 'pointer',
            padding: '8px 12px',
            backgroundColor: '#2a4b8d',
            color: 'white',
            borderRadius: '6px',
            boxShadow: '0 2px 5px rgba(0,0,0,0.3)',
            fontFamily: 'sans-serif',
            fontSize: '14px'
        });

        const panel = document.createElement('div');
        panel.id = 'autobox-panel';
        Object.assign(panel.style, {
            display: 'none',
            position: 'fixed',
            bottom: '60px',
            right: '20px',
            zIndex: '9998',
            backgroundColor: '#f8f9fa',
            padding: '10px',
            borderRadius: '6px',
            boxShadow: '0 2px 10px rgba(0,0,0,0.2)',
            width: '220px',
            maxHeight: '60vh',
            overflowY: 'auto',
            border: '1px solid #a2a9b1'
        });

        const topHeading = document.createElement('h4');
        topHeading.textContent = 'Article-wide tags';
        Object.assign(topHeading.style, {
            margin: '5px 0 10px 0',
            fontSize: '13px',
            color: '#54595d'
        });
        panel.appendChild(topHeading);

        for (const [name, config] of Object.entries(availableTags)) {
            if (config.placement === 'top') {
                panel.appendChild(createTagButton(name, config));
            }
        }

        const inlineHeading = document.createElement('h4');
        inlineHeading.textContent = 'Inline tags';
        Object.assign(inlineHeading.style, {
            margin: '15px 0 10px 0',
            fontSize: '13px',
            color: '#54595d'
        });
        panel.appendChild(inlineHeading);

        for (const [name, config] of Object.entries(availableTags)) {
            if (config.placement === 'inline') {
                panel.appendChild(createTagButton(name, config));
            }
        }

        const toast = document.createElement('div');
        toast.id = 'autobox-toast';
        toast.textContent = '✅ Tag copied!';
        Object.assign(toast.style, {
            position: 'fixed',
            bottom: '90px',
            right: '20px',
            backgroundColor: '#2a4b8d',
            color: 'white',
            padding: '8px 12px',
            borderRadius: '4px',
            fontSize: '13px',
            display: 'none',
            zIndex: '10000'
        });

        document.body.appendChild(button);
        document.body.appendChild(panel);
        document.body.appendChild(toast);

        button.addEventListener('click', e => {
            e.stopPropagation();
            panel.style.display = panel.style.display === 'none' ? 'block' : 'none';
        });

        document.addEventListener('click', () => panel.style.display = 'none');
        panel.addEventListener('click', e => e.stopPropagation());
    }

    function createTagButton(name, config) {
        const btn = document.createElement('button');
        btn.textContent = name;
        Object.assign(btn.style, {
            display: 'block',
            width: '100%',
            margin: '4px 0',
            padding: '6px 8px',
            textAlign: 'left',
            backgroundColor: 'white',
            border: '1px solid #a2a9b1',
            borderRadius: '3px',
            cursor: 'pointer',
            fontSize: '13px'
        });

        btn.addEventListener('mouseover', () => btn.style.backgroundColor = '#eaf3ff');
        btn.addEventListener('mouseout', () => btn.style.backgroundColor = 'white');
        btn.addEventListener('click', e => {
            e.stopPropagation();
            addTag(name, config);
        });

        return btn;
    }

    function showToast(message = '✅ Tag copied!') {
        const toast = document.getElementById('autobox-toast');
        toast.textContent = message;
        toast.style.display = 'block';
        setTimeout(() => { toast.style.display = 'none'; }, 2000);
    }

    function addTag(tagName, config) {
        const date = getCurrentDate();
        const template = config.template;
        const tagText = `{{${template}|date=${date}}}`;
        const title = mw.config.get('wgPageName');
        const editSummary = `added ${tagName} using autobox`;

        navigator.clipboard.writeText(tagText).then(() => {
            showToast();
            const sectionParam = config.placement === 'top' ? '' : '&section=0';
            setTimeout(() => {
                window.location.href = `/w/index.php?title=${title}&action=edit${sectionParam}&summary=${encodeURIComponent(editSummary)}`;
            }, 800);
        }).catch(() => {
            alert(`Copy this tag manually:\n\n${tagText}`);
        });
    }

    mw.loader.using('mediawiki.util').then(() => {
        $(initUI);
    });
})();