MediaWiki:Common.js: Perbedaan antara revisi

  * MIPPEDIA DATA - ADVANCED STRUCTURED DATA SYSTEM (V9.0 SECURE ULTIMATE)

  * Fitur Baru: Top Social Media Container, Smart Image/Media Preview,  

  * Wiki Page Autocomplete (OpenSearch), Auto-Wikilink Detection.

         // 4. HELPER UTILITY & ADVANCED SECURITY (Tingkat Tinggi OWASP)

         // 5. STYLESHEET (V9.0 dengan Komponen Baru)

             /* NEW: Container Media Sosial Terpisah di Atas */

             .md-top-social-container { background: #f8fafc; border: 1px solid #e2e8f0; padding: 14px 16px; border-radius: 12px; margin-bottom: 16px; box-shadow: inset 0 2px 4px rgba(0,0,0,0.02); }

             .md-top-social-label { font-size: 0.72rem; font-weight: 800; color: #64748b; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.6px; display: flex; align-items: center; gap: 5px; }

             .md-social-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; color: white !important; text-decoration: none; transition: transform 0.2s, opacity 0.2s; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }

             .md-social-badge:hover { transform: translateY(-2px); opacity: 0.92; text-decoration: none; }

             var summaryTxt = customSummary ? ('Mippedia Data: ' + customSummary) : ('Mippedia Data V9.0: ' + actionType);

             // Tampilkan Search Box

             // --- FITUR BARU: Pisahkan Sosial Media ke Kotak Atas ---

             var aggregatedSocials = {};

            var hasSocials = false;

                     Object.assign(aggregatedSocials, item.socials);

                    hasSocials = true;

             if (hasSocials) {

                 var $topSocialContainer = $('<div class="md-top-social-container"></div>');

                 $topSocialContainer.append('<div class="md-top-social-label">' + svgVerified + ' PROFIL MEDIA SOSIAL & MUSIK</div>');

                 var $socialGroup = $('<div class="md-social-group"></div>');

                     if (aggregatedSocials[key]) {

                         var fullUrl = platform.base + aggregatedSocials[key].replace(/^@/, '');

                         $socialGroup.append($badge);

                 $topSocialContainer.append($socialGroup);

                 $app.append($topSocialContainer);

                     // Jika ini Pratinjau Gambar/Media, maka deteksi URL nya dan masukkan ke tag img

                    else if (rawVal.match(/^https?:\/\//i)) {

                             showModal('Situs Terverifikasi', 'Centang biru menandakan bahwa URL referensi ini valid dan berasal dari entitas, media publikasi besar, portal populer, atau pangkalan data resmi yang bereputasi kredibel.');

             var currentData = isNew ? { prop: '', val: '', link: false, linkTarget: '', linkSplit: false, isMediaPreview: false, ref: {}, isPersonOrg: false, socials: {} } : dataItems[index];

             $valBox.append('<label>Nilai Data <span class="md-help-icon" data-help="Isi dari data tersebut. Ketik kata kunci, kami akan memunculkan rekomendasi artikel yang sudah ada di Wiki ini!">' + svgHelp + '</span></label>');

             var $valInput = $('<input type="text" id="md-inp-val" class="md-input" autocomplete="off" placeholder="Ketik nilai atau cari halaman di Wiki..." value="' + sanitizeHTML(currentData.val || '') + '">');

             var typingTimer;

             var lastSelectedTitle = currentData.val || "";

                 var q = $(this).val().trim();

                 // Jika input diubah tidak sesuai dengan yang di-select sebelumnya, uncheck Wikilink Standar

                 if (q !== lastSelectedTitle) {

                     $('#md-inp-link').prop('checked', false);

                 if (q.length < 1) { $autoList.hide(); return; }

                 typingTimer = setTimeout(function() {

                    // API Call ke Mediawiki untuk saran halaman

                    api.get({ action: 'opensearch', search: q, limit: 7, format: 'json' }).done(function(res) {

                        $autoList.empty();

                        if (titles && titles.length > 0) {

                            titles.forEach(function(t) {

                                var $item = $('<div class="md-autocomplete-item">' + svgSearch + ' ' + sanitizeHTML(t) + '</div>');

                                $item.on('click', function() {

                                    $valInput.val(t);

                                    lastSelectedTitle = t;

                                    $('#md-inp-link').prop('checked', true); // AUTO-CENTANG

                                 });

                                $autoList.append($item);

                             $autoList.show();

                        } else {

                            $autoList.hide();

                     });

                 }, 400); // debounce

             // Klik di luar daftar hilangkan autocomplete

             $(document).on('click.auto', function(e) {

                 if (!$(e.target).closest('.md-autocomplete-wrapper').length) $autoList.hide();

             $wikilinkOpts.append('<label style="display:flex; align-items:center; gap:8px; font-size:0.82rem; font-weight:700; cursor:pointer;"><input type="checkbox" id="md-inp-link" ' + chkLink + '> Jadikan Wikilink Standar</label>');

             $socialSec.append('<label style="display:flex; align-items:center; gap:8px; cursor:pointer; background:#e0e7ff; padding:10px; border-radius:8px; font-weight:700; color:#3730a3; font-size:0.85rem;"><input type="checkbox" id="md-chk-person" ' + chkPerson + '> Simpan Link Profil Media Sosial & Musik <span class="md-help-icon" data-help="Centang ini jika data ini mengandung identitas. Sistem akan memisahkan tombol sosial media ini secara otomatis ke dalam kotak khusus di panel atas (Header).">' + svgHelp + '</span></label>');

                 $socialGrid.append('<div><label style="font-size:0.78rem; color:#334155; font-weight:700; margin-bottom:4px;">' + p.name + '</label><input type="text" id="md-soc-' + key + '" class="md-input" placeholder="ID / Username / URL" value="' + sanitizeHTML(valUname) + '"></div>');

             $refArea.append('<label style="font-size:0.95rem; font-weight:800; color:#0f172a; margin-bottom:10px;">Sumber Referensi <span class="md-help-icon" data-help="Mohon berikan sumber referensi yang valid. Jika URL rujukan Anda mengarah ke situs web besar yang terverifikasi, lencana centang biru akan muncul otomatis.">' + svgHelp + '</span></label>');

             $btnCancel.on('click', function() {  

                $container.empty();  

            });

             'Seluruh data terstruktur yang tersaji dalam repositori ini merupakan milik publik dan tersedia di bawah lisensi resmi ' +

             '<a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" style="color:#6a5acd; text-decoration:none; font-weight:700;">Creative Commons Attribution-ShareAlike 4.0 International</a>.' +