MediaWiki:Common.js: Perbedaan antara revisi

Tidak ada ringkasan suntingan
Tanda: Suntingan perangkat seluler Suntingan peramban seluler
Tidak ada ringkasan suntingan
Tanda: Suntingan perangkat seluler Suntingan peramban seluler
Baris 1.327: Baris 1.327:


/* ==========================================================
/* ==========================================================
   🧠 MIPPEDIA SMART-SUMMARY V5 - MOBILE OPTIMIZED
   🔍 MIPPEDIA GLOBAL SEARCH SWITCHER
   - Fix: Bener-bener hilang di HP saat Edit & View Gambar
   Fungsi: Menambahkan opsi cari ke proyek Mippedia lain
   - Anti-Leak: Pengecekan elemen khusus MobileFrontend
   Target: Mobile & Desktop
   ========================================================== */
   ========================================================== */
(function() {
(function() {
    function getSummary() {
        var paragraphs = $('#mw-content-text p').filter(function() {
            return $(this).text().trim().length > 40;
        }).slice(0, 4);
       
        var points = [];
        paragraphs.each(function() {
            var sentence = $(this).text().split('.')[0];
            if (sentence.length > 10) points.push('• ' + sentence + '.');
        });
        return points.join('\n\n');
    }
     $(document).ready(function() {
     $(document).ready(function() {
         var ns = mw.config.get('wgNamespaceNumber');
        // 1. Konfigurasi Subdomain Mippedia
        var action = mw.config.get('wgAction');
         var projects = [
            { id: 'en', name: 'Mippedia English', url: 'https://en.mippedia.org/w/index.php?search=' },
            { id: 'idr', name: 'Mippedia Ringkas', url: 'https://ringkas.mippedia.org/w/index.php?search=' },
            { id: 'data', name: 'Mippedia Data', url: 'https://data.mippedia.org/w/index.php?search=' }
        ];


         // 1. SATPAM CSS KHUSUS MOBILE & DESKTOP
         // 2. CSS agar tampilan tombol rapi di bawah bar pencarian
         $('<style>').text(`
         $('<style>').text(`
             /* Sembunyikan jika bukan di halaman baca artikel */
             .mip-search-switcher {
            body:not(.action-view) #mip-summary-btn,
                display: flex;
            body.ns-special #mip-summary-btn,
                flex-wrap: wrap;
            body:not(.ns-0) #mip-summary-btn { display: none !important; }
                gap: 5px;
              
                padding: 10px;
            /* Sembunyikan saat Multimedia Viewer (Layar hitam gambar) aktif - KHUSUS HP */
                background: #f8f9fa;
             .mw-mmv-viewer-active #mip-summary-btn,
                border-bottom: 1px solid #ddd;
            .media-viewer #mip-summary-btn,
             }
            .mw-widgets-abandonEditDialog #mip-summary-btn { display: none !important; }
             .mip-search-btn {
           
                font-size: 11px;
             /* Sembunyikan saat Editor Mobile Aktif */
                padding: 5px 10px;
             .editor-overlay #mip-summary-btn,
                background: #fff;
            .editing #mip-summary-btn,
                border: 1px solid #3498db;
            #wpTextbox1:visible ~ #mip-summary-btn { display: none !important; }
                color: #3498db;
 
                border-radius: 15px;
             /* Pastikan tombol ada di bawah overlay apapun */
                cursor: pointer;
             #mip-summary-btn { z-index: 5 !important; }
                font-weight: bold;
                transition: 0.2s;
             }
             .mip-search-btn:hover {
                background: #3498db;
                color: #fff;
            }
             /* Sembunyikan jika tidak ada input */
             .mip-hidden { display: none !important; }
         `).appendTo('head');
         `).appendTo('head');


         // Proteksi awal: Jangan jalan kalau bukan artikel atau lagi bukan mode 'view'
         // 3. Logic Injeksi Tombol
        if (ns !== 0 || action !== 'view') return;
        function injectSwitcher() {
            // Cek apakah kontainer sudah ada, kalau belum buat
            if ($('#mip-switcher-container').length === 0) {
                var $container = $('<div id="mip-switcher-container" class="mip-search-switcher mip-hidden"></div>');
               
                // Tambahkan teks instruksi kecil
                $container.append('<div style="width:100%; font-size:10px; color:#777; margin-bottom:5px;">Cari di proyek lain:</div>');
               
                projects.forEach(function(p) {
                    var $btn = $(`<div class="mip-search-btn" data-url="${p.url}">${p.name}</div>`);
                    $btn.on('click', function() {
                        var query = $('.mw-ui-input, .searchInput').val(); // Ambil apa yang diketik user
                        if (query) {
                            window.location.href = $(this).data('url') + encodeURIComponent(query);
                        }
                    });
                    $container.append($btn);
                });


        // 2. Tombol Melayang
                // Masukkan ke bawah kolom input pencarian (Mobile & Desktop support)
        var $btn = $('<div id="mip-summary-btn">✨ Rangkum</div>').css({
                $('.search-overlay .search-content, #searchform, .mw-searchInput-container').after($container);
            'position': 'absolute', 'right': '15px', 'top': '-35px',
            }
            'padding': '4px 14px', 'background': '#3498db', 'color': '#fff',
        }
            'border-radius': '20px', 'cursor': 'pointer', 'font-size': '11px',
            'font-weight': 'bold', 'box-shadow': '0 2px 8px rgba(0,0,0,0.15)'
        });
       
        // Pasang di kontainer menu aksi halaman
        $('.page-actions-menu, .page-header-actions').css('position', 'relative').prepend($btn);


         // 3. Logic Cinematic Typing
         // 4. Trigger: Munculkan tombol hanya saat user mulai mengetik
         $btn.on('click', function() {
         $(document).on('input', '.mw-ui-input, .searchInput, .mw-searchInput', function() {
            var fullText = getSummary();
             var val = $(this).val().trim();
            var $overlay = $('<div id="mip-sum-ov"></div>').css({
             injectSwitcher(); // Pastikan container terpasang
                'position': 'fixed', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%',
              
                'background': 'rgba(0,0,0,0.8)', 'backdrop-filter': 'blur(4px)',
             if (val.length > 0) {
                'z-index': '1000000', 'display': 'flex', 'align-items': 'center', 'justify-content': 'center',
                 $('#mip-switcher-container').removeClass('mip-hidden');
                'opacity': '0', 'transition': 'opacity 0.3s'
             } else {
            });
                 $('#mip-switcher-container').addClass('mip-hidden');
 
             var $modal = $('<div id="mip-sum-mod"></div>').css({
                'background': '#fff', 'width': '88%', 'max-height': '80vh', 'padding': '20px',
                'border-radius': '12px', 'display': 'flex', 'flex-direction': 'column',
                'box-shadow': '0 10px 30px rgba(0,0,0,0.5)', 'transform': 'scale(0.9)', 'transition': '0.3s'
            });
 
             $modal.html(`
                <div style="font-weight:bold; color:#3498db; border-bottom:1px solid #eee; padding-bottom:10px; margin-bottom:15px; font-size:16px;">📌 Intisari Mippedia</div>
                <div id="mip-typing-area" style="color:#333; line-height:1.6; font-size:14px; overflow-y:auto; flex-grow:1; white-space: pre-wrap; font-family: sans-serif;"></div>
                <div id="mip-close" style="margin-top:15px; padding-top:10px; border-top:1px solid #eee; text-align:center; color:#e74c3c; font-weight:bold; cursor:pointer; font-size:14px;">Tutup</div>
             `);
 
             $overlay.append($modal);
            $('body').append($overlay);
 
            setTimeout(function() {  
                 $overlay.css('opacity', '1');
                $modal.css('transform', 'scale(1)');
             }, 50);
 
            var i = 0;
            var speed = 25;
            function typeWriter() {
                 if (i < fullText.length) {
                    var area = document.getElementById("mip-typing-area");
                    if (area) {
                        area.innerHTML += fullText.charAt(i);
                        area.scrollTop = area.scrollHeight;
                        i++;
                        setTimeout(typeWriter, speed);
                    }
                }
             }
             }
            setTimeout(typeWriter, 500);
            $('#mip-close, #mip-sum-ov').on('click', function(e) {
                if (e.target !== this) return;
                $overlay.css('opacity', '0');
                setTimeout(function() { $overlay.remove(); }, 300);
            });
         });
         });
     });
     });
})();
})();