Jump to content

MediaWiki:Common.js: Difference between revisions

From Artemis Archive
No edit summary
No edit summary
Tags: Mobile edit Mobile web edit Advanced mobile edit
 
(18 intermediate revisions by the same user not shown)
Line 1: Line 1:
// Wait for the page elements to be ready
$(function () {
$(function() {
     // check if MinervaNeue
     // Use mw.loader.using to ensure necessary MediaWiki JS utilities are loaded
     if (mw.config.get('skin') === 'minerva') {
     mw.loader.using( 'mediawiki.util' ).then( function () {
         console.log('[ReportAbuseLink] when MinervaNeue skin,disable button');
         console.log( '[ReportAbuseLink] Attempting to add link...' ); // Log message for console
        return;
    }


        // Use the selector for the list containing personal tools based on inspection
    mw.loader.using('mediawiki.util').then(function () {
         const personalToolsList = document.querySelector( '#p-personal ul.vector-menu-content-list' );
         console.log('[ReportAbuseLink] insert hover button...');


         // Use the correct ID for the login list item based on inspection
         const pageTitle = 'Report_Animal_Abuse';
         const loginItem = document.querySelector( '#pt-login-2' );
         const linkHref = mw.util.getUrl(pageTitle);
        const linkText = '🚨 Report Animal Abuse';


        // Check if we found the list where links should go
         if (document.getElementById('report-abuse-button')) return;
         if ( !personalToolsList ) {
            console.log( '[ReportAbuseLink] Could not find personal tools list (#p-personal ul.vector-menu-content-list).' );
            return; // Exit if list element is not found
        }
        console.log( '[ReportAbuseLink] Found personal tools list.' );


         // --- Configuration ---
         // create <style> elements
         const reportPageName = 'Report_Animal_Abuse'; // **CHANGE THIS** if your wiki page has a different name
         const style = document.createElement('style');
         const linkText = 'Report Abuse'; // Text displayed for the link
         style.textContent = `
        // --- End Configuration ---
            #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);


         // Create the new list item (<li>)
         // build button
         const li = document.createElement( 'li' );
         const container = document.createElement('div');
         li.id = 'pt-reportabuse'; // Set an ID for the new list item
         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>`;


         // Create the link element (<a>)
         document.body.appendChild(container);
        const link = document.createElement( 'a' );
         console.log('[ReportAbuseLink]');
        link.href = mw.util.getUrl( reportPageName ); // Generates correct URL for the wiki page
        link.textContent = linkText;
        // link.title = 'Report animal abuse'; // Optional: Add a tooltip title
 
        // Add the link inside the list item
        li.appendChild( link );
 
        // Try to insert the new list item before the 'Log in' list item
        if ( loginItem && loginItem.parentNode === personalToolsList ) {
            console.log( '[ReportAbuseLink] Found login item (#pt-login-2), inserting link before it.' );
            personalToolsList.insertBefore( li, loginItem );
         } else {
            // Fallback if login item isn't found (e.g., user is logged in) or has unexpected parent
            // Try appending to the end of the list as a fallback
            console.log( '[ReportAbuseLink] Login item (#pt-login-2) not found or has wrong parent. Appending link to end.' );
            personalToolsList.appendChild( li );
            // Note: Inserting before 'Preferences' or after 'ULS' dynamically when logged in
            // requires finding those elements reliably too. Appending is a simpler fallback.
        }
     });
     });
});
});

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]');
    });
});