Jump to content

MediaWiki:Common.js: Difference between revisions

From Artemis Archive
← Older edit
No edit summary
No edit summary
Tags: Mobile edit Mobile web edit Advanced mobile edit
 
Line 1: Line 1:
$(function () {
$(function () {
     // Ensure required MediaWiki modules are loaded, including 'mediawiki.config'
     // check if MinervaNeue
     mw.loader.using(['mediawiki.util', 'mediawiki.config']).then(function () {
     if (mw.config.get('skin') === 'minerva') {
         console.log('[ReportAbuseLink] Initializing...');
         console.log('[ReportAbuseLink] when MinervaNeue skin，disable button');
        return;
    }


        // --- Mobile Check ---
    mw.loader.using('mediawiki.util').then(function () {
        // Get the current skin name from MediaWiki's configuration
         console.log('[ReportAbuseLink] insert hover button...');
        const currentSkin = mw.config.get('skin');
 
        // Check if the current skin is a known mobile skin (e.g., 'minerva', 'minervaneue')
        // You might need to adjust this list if your wiki uses a different custom mobile skin.
        if (currentSkin === 'minerva' || currentSkin === 'minervaneue') {
            console.log('[ReportAbuseLink] Mobile skin (' + currentSkin + ') detected. Button will not be added.');
            return; // Exit the function early if it's a mobile skin
        }
        // --- End Mobile Check ---
 
         console.log('[ReportAbuseLink] Desktop skin (' + currentSkin + ') detected. Proceeding to add button...');


         const pageTitle = 'Report_Animal_Abuse';
         const pageTitle = 'Report_Animal_Abuse';
Line 22: Line 13:
         const linkText = '🚨 Report Animal Abuse';
         const linkText = '🚨 Report Animal Abuse';


        // Check if the button already exists to avoid duplicates
         if (document.getElementById('report-abuse-button')) return;
         if (document.getElementById('report-abuse-button')) {
            console.log('[ReportAbuseLink] Button element already exists. Exiting.');
            return;
        }


         // Create a <style> element for hover effect
         // create <style> elements
        console.log('[ReportAbuseLink] Creating styles...');
         const style = document.createElement('style');
         const style = document.createElement('style');
         style.textContent = `
         style.textContent = `
             #report-abuse-button a {
             #report-abuse-button a:hover {
                 /* Add initial transition for smoothness when hover ends */
                 background-color: #ff0000 !important;
                box-shadow: 0 0 12px rgba(255, 0, 0, 0.8);
                transform: scale(1.05);
                 transition: all 0.2s ease-in-out;
                 transition: all 0.2s ease-in-out;
            }
            #report-abuse-button a:hover {
                background-color: #ff0000 !important; /* Brighter red on hover */
                box-shadow: 0 0 12px rgba(255, 0, 0, 0.8); /* Red glow */
                transform: scale(1.05); /* Slightly enlarge */
                /* Transition is already defined above */
             }
             }
         `;
         `;
         document.head.appendChild(style);
         document.head.appendChild(style);


         // Create the button container and the link
         // build button
        console.log('[ReportAbuseLink] Creating button element...');
         const container = document.createElement('div');
         const container = document.createElement('div');
         container.id = 'report-abuse-button';
         container.id = 'report-abuse-button';
         container.innerHTML = `<a href="${linkHref}" style="
         container.innerHTML = `<a href="${linkHref}" style="
             display: inline-block;
             display: inline-block;
             background-color: #b10000; /* Dark red */
             background-color: #b10000;
             color: #fff; /* White text */
             color: #fff;
             font-weight: bold;
             font-weight: bold;
             font-size: 18px; /* Large font */
             font-size: 18px;
             padding: 10px 18px; /* Generous padding */
             padding: 10px 18px;
             border-radius: 8px; /* Rounded corners */
             border-radius: 8px;
             text-decoration: none; /* No underline */
             text-decoration: none;
             position: fixed; /* Fixed position relative to viewport */
             position: fixed;
             top: 12px; /* Position from top */
             top: 12px;
             right: 12px; /* Position from right */
             right: 12px;
             z-index: 9999; /* Ensure it's on top */
             z-index: 9999;
             box-shadow: 0 4px 8px rgba(0,0,0,0.25); /* Subtle shadow */
             box-shadow: 0 4px 8px rgba(0,0,0,0.25);
         ">${linkText}</a>`;
         ">${linkText}</a>`;


        // Append the button container to the body
         document.body.appendChild(container);
         document.body.appendChild(container);
         console.log('[ReportAbuseLink] Button rendered with hover effect.');
         console.log('[ReportAbuseLink]');
 
    }).catch(function(e) {
        // Optional: Add error handling in case modules fail to load
        console.error('[ReportAbuseLink] Failed to load required MediaWiki modules:', e);
     });
     });
});
});

Latest revision as of 08:03, 21 April 2025

$(function () {
    // check if MinervaNeue
    if (mw.config.get('skin') === 'minerva') {
        console.log('[ReportAbuseLink] when MinervaNeue skin，disable button');
        return;
    }

    mw.loader.using('mediawiki.util').then(function () {
        console.log('[ReportAbuseLink] insert hover button...');

        const pageTitle = 'Report_Animal_Abuse';
        const linkHref = mw.util.getUrl(pageTitle);
        const linkText = '🚨 Report Animal Abuse';

        if (document.getElementById('report-abuse-button')) return;

        // create <style> elements
        const style = document.createElement('style');
        style.textContent = `
            #report-abuse-button a:hover {
                background-color: #ff0000 !important;
                box-shadow: 0 0 12px rgba(255, 0, 0, 0.8);
                transform: scale(1.05);
                transition: all 0.2s ease-in-out;
            }
        `;
        document.head.appendChild(style);

        // build button
        const container = document.createElement('div');
        container.id = 'report-abuse-button';
        container.innerHTML = `<a href="${linkHref}" style="
            display: inline-block;
            background-color: #b10000;
            color: #fff;
            font-weight: bold;
            font-size: 18px;
            padding: 10px 18px;
            border-radius: 8px;
            text-decoration: none;
            position: fixed;
            top: 12px;
            right: 12px;
            z-index: 9999;
            box-shadow: 0 4px 8px rgba(0,0,0,0.25);
        ">${linkText}</a>`;

        document.body.appendChild(container);
        console.log('[ReportAbuseLink]');
    });
});
Retrieved from "https://thelittlemole.press/index.php?title=MediaWiki:Common.js&oldid=62"