MediaWiki:Common.js: Difference between revisions

Revision as of 01:49, 21 January 2026

/* Any JavaScript here will be loaded for all users on every page load. */
/* Clean Print mode + PDF & Share buttons for Vector-2022 */

$(function () {

    // --- 1. Inject Clean Print CSS (full-width A4, desktop + mobile) ---
    var printCss = ''
        + '@media print {'
        + '    /* Hide all non-content elements */'
        + '    #mw-page-base,'
        + '    #mw-head-base,'
        + '    #mw-navigation,'
        + '    #mw-panel,'
        + '    #footer,'
        + '    .vector-header,'
        + '    .vector-page-toolbar,'
        + '    .vector-toc,'
        + '    .vector-sticky-header,'
        + '    .vector-page-tools,'
        + '    .vector-menu,'
        + '    .mw-indicators,'
        + '    .vector-user-links,'
        + '    .vector-search-box,'
        + '    .vector-pinned-container {'
        + '        display: none !important;'
        + '    }'
        + '    #content,'
        + '    .mw-body,'
        + '    .mw-content-container,'
        + '    .mw-body-content {'
        + '        margin: 0 !important;'
        + '        padding: 0 !important;'
        + '        width: 100% !important;'
        + '        max-width: none !important;'
        + '    }'
        + '    body,'
        + '    #content {'
        + '        background: white !important;'
        + '    }'
        + '    .mw-body-content {'
        + '        font-size: 14pt !important;'
        + '        line-height: 1.5 !important;'
        + '    }'
        + '}';

    var styleEl = document.createElement('style');
    styleEl.type = 'text/css';
    styleEl.appendChild(document.createTextNode(printCss));
    document.head.appendChild(styleEl);

    // --- 2. Add PDF + Share buttons to Vector-2022 action bar ---
    if (mw.config.get('wgNamespaceNumber') === 0) {
        var $actions = $('.vector-page-toolbar .vector-page-tools .vector-menu-content-list');
        if ($actions.length) {
            $actions.find('li').filter(function () {
                var t = $(this).text() || '';
                return t.toLowerCase().indexOf('pdf') !== -1;
            }).remove();

            $actions.prepend(
                '<li class="vector-menu-content-list-item"><a href="javascript:window.print()" title="Download clean PDF">PDF</a></li>'
            );

            $actions.prepend(
                '<li class="vector-menu-content-list-item"><a href="javascript:(function(){if(navigator.share){navigator.share({title:document.title,url:location.href});}else{prompt(\'Copy link:\',location.href);}})()" title="Share this page">Share</a></li>'
            );
        }
    }

    // --- 3. Google Search Results under MediaWiki Search ---
    mw.loader.using('mediawiki.util', function () {

        if (mw.config.get('wgCanonicalSpecialPageName') !== 'Search') return;

        var query = mw.util.getParamValue('search');
        if (!query) return;

        // CSS für collapsable Menüs
        var collapseCss = ''
            + '#extra-search-results { margin-top: 2em; border-top: 1px solid #ddd; padding-top: 1em; }'
            + '.search-collapse-section { margin-bottom: 1.5em; border: 1px solid #e0e0e0; border-radius: 4px; }'
            + '.search-collapse-header { background: #f8f9fa; padding: 12px 15px; cursor: pointer; font-weight: bold; border-radius: 4px 4px 0 0; }'
            + '.search-collapse-header:hover { background: #e8e9ea; }'
            + '.search-collapse-header::before { content: "▼ "; display: inline-block; transition: transform 0.2s; }'
            + '.search-collapse-header.collapsed::before { transform: rotate(-90deg); }'
            + '.search-collapse-content { padding: 15px; display: block; }'
            + '.search-collapse-content.collapsed { display: none; }'
            + '.gcse-searchresults-only { min-height: 200px; }'
            + '.search-engine-link { display: block; padding: 8px 0; font-size: 16px; border-bottom: 1px solid #f0f0f0; }'
            + '.search-engine-link:last-child { border-bottom: none; }'
            + '.search-engine-link a { text-decoration: none; color: #0645ad; }'
            + '.search-engine-link a:hover { text-decoration: underline; }'
            + '.pse-direct-link { margin-bottom: 15px; padding: 10px; background: #f0f7ff; border-radius: 4px; }'
            + '.pse-direct-link a { font-size: 15px; color: #0066cc; text-decoration: none; }'
            + '.pse-direct-link a:hover { text-decoration: underline; }';

        var collapseStyle = document.createElement('style');
        collapseStyle.appendChild(document.createTextNode(collapseCss));
        document.head.appendChild(collapseStyle);

        // Finde die Paginierung (Ergebnisse 1-20, 20-40, etc.)
        var pagination = $('.mw-search-pager-bottom, .results-info').last();
        var insertPoint = pagination.length ? pagination : $('#mw-search-results');

        if (insertPoint.length) {
            var container = document.createElement('div');
            container.id = 'extra-search-results';

            // Programmable Search Engine (PSE) - mit Direktlink
            var pseSection = document.createElement('div');
            pseSection.className = 'search-collapse-section';
            
            var pseDirectUrl = 'https://cse.google.com/cse?cx=86021a982e3a14848&q=' + encodeURIComponent(query);
            
            pseSection.innerHTML =
                '<div class="search-collapse-header" data-target="pse-content">Programmable Search Engine</div>' +
                '<div class="search-collapse-content" id="pse-content">' +
                '<div class="pse-direct-link">' +
                '<a href="' + pseDirectUrl + '" target="_blank" rel="noopener noreferrer">' +
                '🔗 Open in Programmable Search Engine</a>' +
                '</div>' +
                '<div class="gcse-searchresults-only" data-queryParameterName="gq"></div>' +
                '</div>';

            // Alternative Suchmaschinen
            var searchEngines = [
                {
                    name: 'Google',
                    url: 'https://www.google.com/search?q=' + encodeURIComponent(query),
                    icon: '🔍'
                },
                {
                    name: 'Bing',
                    url: 'https://www.bing.com/search?q=' + encodeURIComponent(query),
                    icon: '🔎'
                },
                {
                    name: 'DuckDuckGo',
                    url: 'https://duckduckgo.com/?q=' + encodeURIComponent(query),
                    icon: '🦆'
                },
                {
                    name: 'Yandex',
                    url: 'https://yandex.com/search/?text=' + encodeURIComponent(query),
                    icon: '🔍'
                },
                {
                    name: 'Brave Search',
                    url: 'https://search.brave.com/search?q=' + encodeURIComponent(query),
                    icon: '🦁'
                },
                {
                    name: 'Ecosia',
                    url: 'https://www.ecosia.org/search?q=' + encodeURIComponent(query),
                    icon: '🌳'
                }
            ];

            var searchSection = document.createElement('div');
            searchSection.className = 'search-collapse-section';
            
            var searchLinksHtml = '';
            searchEngines.forEach(function(engine) {
                searchLinksHtml += 
                    '<div class="search-engine-link">' +
                    '<a href="' + engine.url + '" target="_blank" rel="noopener noreferrer">' +
                    engine.icon + ' Search on ' + engine.name + '</a>' +
                    '</div>';
            });
            
            searchSection.innerHTML =
                '<div class="search-collapse-header" data-target="search-engines-content">Alternative Search Engines</div>' +
                '<div class="search-collapse-content" id="search-engines-content">' +
                searchLinksHtml +
                '</div>';

            container.appendChild(pseSection);
            container.appendChild(searchSection);

            // Einfügen nach Paginierung
            if (pagination.length) {
                pagination.after(container);
            } else {
                insertPoint.after(container);
            }

            // Toggle-Funktionalität für collapsable Menüs
            $('.search-collapse-header').on('click', function () {
                var targetId = $(this).data('target');
                var content = $('#' + targetId);
                
                $(this).toggleClass('collapsed');
                content.toggleClass('collapsed');
            });

            // Google CSE Script laden und Suche ausführen
            if (!window.googleCSELoaded) {
                window.googleCSELoaded = true;
                
                // Callback für wenn CSE geladen ist
                window.__gcse = {
                    parsetags: 'explicit',
                    callback: function() {
                        // Suche programmatisch ausführen
                        var element = document.querySelector('.gcse-searchresults-only');
                        if (element) {
                            google.search.cse.element.render({
                                div: element,
                                tag: 'searchresults-only',
                                gname: 'pse_search'
                            });
                            
                            // Suche mit Query ausführen
                            var searchControl = google.search.cse.element.getElement('pse_search');
                            if (searchControl) {
                                searchControl.execute(query);
                            }
                        }
                    }
                };
                
                var s = document.createElement('script');
                s.async = true;
                s.src = 'https://cse.google.com/cse.js?cx=86021a982e3a14848';
                document.head.appendChild(s);
            }
        }
    });

}); // Ende $(function(){})