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 531: Baris 531:


/* ==========================================================
/* ==========================================================
   🌐 MIPPEDIA SHORTDESC - DATA CENTER
   🌐 MIPPEDIA SHORTDESC - DATA CENTER (VISUAL UPDATE)
   Status: INDEPENDENT SYSTEM (Separated from Sitelinks)
   Status: INDEPENDENT & VISUAL MATCH
   Storage: MediaWiki:ShortDesc-Data.json
   Storage: MediaWiki:ShortDesc-Data.json
   ========================================================== */
   ========================================================== */
Baris 541: Baris 541:


         var pageTitle = mw.config.get('wgPageName');
         var pageTitle = mw.config.get('wgPageName');
         var storagePage = 'MediaWiki:ShortDesc-Data.json'; // File penyimpanan berbeda
         var storagePage = 'MediaWiki:ShortDesc-Data.json';
         var isAdmin = mw.config.get('wgUserGroups').some(g => ['sysop', 'interface-admin'].includes(g));
         var isAdmin = mw.config.get('wgUserGroups').some(g => ['sysop', 'interface-admin'].includes(g));


         // UI Box untuk Input Deskripsi
        var langs = {
            id: { label: 'ID', color: '#6a5acd' },
            en: { label: 'EN', color: '#4169e1' },
            concise: { label: 'Concise', color: '#20b2aa' }
        };
 
         // UI Box
         var html = `
         var html = `
             <div id="desc-manager" style="border: 2px solid #20b2aa; padding: 15px; background: #fff; margin-bottom: 20px; border-radius: 10px; font-family: sans-serif;">
             <div id="desc-manager" style="background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:22px; margin-top:20px; box-shadow:0 10px 25px rgba(0,0,0,0.04); font-family: sans-serif;">
                 <div style="font-weight: bold; color: #20b2aa; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center;">
                 <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:15px;">
                     <span>📝 Mippedia Short Description</span>
                     <strong style="font-size:15px; color:#1a202c; display:flex; align-items:center; gap:8px;">
                     <button id="desc-toggle" style="cursor:pointer; padding:2px 8px; font-size:11px;">Buka Editor</button>
                        📝 Deskripsi singkat
                    </strong>
                     <span id="desc-open-editor" style="cursor:pointer; font-size:18px; color:#6a5acd; opacity:0.8;" title="Edit Deskripsi"></span>
                 </div>
                 </div>
                <div id="desc-current" style="font-size: 13px; color: #666; font-style: italic;">Memuat data deskripsi...</div>
                  
                  
                 <div id="desc-editor" style="display:none; margin-top: 10px; border-top: 1px solid #eee; padding-top: 10px;">
                 <div id="desc-status-display" style="display:flex; gap:8px; flex-wrap:wrap;">
                     <div style="margin-bottom:8px;">
                     <small style="color:#a0aec0;">Memuat status data...</small>
                        <label style="display:block; font-size:11px; font-weight:bold;">ID (Indonesia):</label>
                </div>
                        <input type="text" id="desc-in-id" style="width:100%; padding:6px; border:1px solid #ccc; border-radius:4px;">
 
                     </div>
                <div id="desc-editor" style="display:none; margin-top:20px; border-top:2px solid #f7fafc; padding-top:20px;">
                    <div style="margin-bottom:8px;">
                     ${Object.keys(langs).map(k => `
                        <label style="display:block; font-size:11px; font-weight:bold;">EN (English):</label>
                        <div style="margin-bottom:12px; display:flex; gap:10px;">
                        <input type="text" id="desc-in-en" style="width:100%; padding:6px; border:1px solid #ccc; border-radius:4px;">
                            <span style="width:75px; font-size:11px; font-weight:bold; background:#edf2f7; display:flex; align-items:center; justify-content:center; border-radius:8px; color:#4a5568;">${langs[k].label}</span>
                    </div>
                            <input type="text" id="desc-in-${k}" placeholder="Tulis deskripsi ${langs[k].label}..." style="flex:1; padding:10px; font-size:13px; border:1.5px solid #e2e8f0; border-radius:10px; outline:none;">
                    <div style="margin-bottom:12px;">
                        </div>
                        <label style="display:block; font-size:11px; font-weight:bold;">CONCISE (Ringkas):</label>
                    `).join('')}
                        <input type="text" id="desc-in-concise" style="width:100%; padding:6px; border:1px solid #ccc; border-radius:4px;">
                     <button id="desc-save" style="width:100%; padding:14px; background:#20b2aa; color:white; border:none; border-radius:12px; font-size:14px; font-weight:bold; cursor:pointer; transition:0.3s;">Simpan Deskripsi</button>
                    </div>
                     <button id="desc-save" style="width:100%; background:#20b2aa; color:white; border:none; padding:8px; border-radius:5px; font-weight:bold; cursor:pointer;">Simpan Deskripsi</button>
                 </div>
                 </div>
             </div>`;
             </div>`;
Baris 572: Baris 577:
         $('.mw-parser-output').prepend(html);
         $('.mw-parser-output').prepend(html);


         // 1. Load data dari JSON
         // 1. Load data & Render Status Chips
         new mw.Api().get({ action: 'query', prop: 'revisions', titles: storagePage, rvprop: 'content', formatversion: 2 }).done(function(res) {
         function loadDescStatus() {
            var content = res.query.pages[0].revisions ? res.query.pages[0].revisions[0].content : "{}";
            new mw.Api().get({ action: 'query', prop: 'revisions', titles: storagePage, rvprop: 'content', formatversion: 2 }).done(function(res) {
            var fullData = JSON.parse(content);
                var content = res.query.pages[0].revisions ? res.query.pages[0].revisions[0].content : "{}";
            var myData = fullData[pageTitle] || {};
                var fullData = JSON.parse(content);
                var myData = fullData[pageTitle] || {};
                var $statusBox = $('#desc-status-display').empty();
                var foundAny = false;
 
                Object.keys(langs).forEach(k => {
                    var val = myData[k];
                    if (val && val.trim() !== "") {
                        foundAny = true;
                        $statusBox.append(`<div style="background:${langs[k].color}; color:white; padding:8px 16px; border-radius:10px; font-size:12px; font-weight:bold; border-bottom:3px solid rgba(0,0,0,0.15);">${langs[k].label}: ${val}</div>`);
                        $('#desc-in-' + k).val(val);
                    }
                });


            $('#desc-in-id').val(myData.id || '');
                if (!foundAny) {
             $('#desc-in-en').val(myData.en || '');
                    $statusBox.html('<em style="color:#cbd5e0; font-size:13px;">Belum ada deskripsi yang terhubung.</em>');
            $('#desc-in-concise').val(myData.concise || '');
                }
           
             });
             $('#desc-current').html(`<b>Current:</b> ${myData.id || 'Belum ada deskripsi'}`);
        }
 
        // 2. Event Handlers
        $(document).on('click', '#desc-open-editor', function() {
             $('#desc-editor').slideToggle();  
         });
         });


         $('#desc-toggle').click(function() { $('#desc-editor').slideToggle(); });
         $(document).on('click', '#desc-save', function() {
 
             if (!isAdmin) {  
        // 2. Simpan data ke JSON
                alert('Hanya Pengurus yang bisa memodifikasi metadata.');  
        $('#desc-save').click(function() {
                return;  
             if (!isAdmin) { alert('Hanya Pengurus yang bisa menyimpan data.'); return; }
            }
              
              
            var $btn = $(this).text('Menyimpan...').prop('disabled', true);
             var api = new mw.Api();
             var api = new mw.Api();
             var newData = {
             var newData = {
Baris 600: Baris 622:
             api.get({ action: 'query', prop: 'revisions', titles: storagePage, rvprop: 'content', formatversion: 2 }).done(function(r) {
             api.get({ action: 'query', prop: 'revisions', titles: storagePage, rvprop: 'content', formatversion: 2 }).done(function(r) {
                 var json = r.query.pages[0].revisions ? JSON.parse(r.query.pages[0].revisions[0].content) : {};
                 var json = r.query.pages[0].revisions ? JSON.parse(r.query.pages[0].revisions[0].content) : {};
                 json[pageTitle] = newData;
                  
                // Jika semua kosong, hapus entitas dari JSON agar hemat size
                if (!newData.id && !newData.en && !newData.concise) {
                    delete json[pageTitle];
                } else {
                    json[pageTitle] = newData;
                }


                 api.postWithEditToken({
                 api.postWithEditToken({
Baris 606: Baris 634:
                     title: storagePage,
                     title: storagePage,
                     text: JSON.stringify(json, null, 2),
                     text: JSON.stringify(json, null, 2),
                     summary: 'Update ShortDesc: ' + pageTitle
                     summary: 'Update Unified ShortDesc: ' + pageTitle
                 }).done(function() {
                 }).done(function() {
                    alert('Berhasil disimpan!');
                     location.reload();
                     location.reload();
                }).fail(function() {
                    alert('Gagal menyimpan ke JSON.');
                    $btn.text('Simpan Deskripsi').prop('disabled', false);
                 });
                 });
             });
             });
         });
         });
        loadDescStatus();
     });
     });
})(jQuery, mediaWiki);
})(jQuery, mediaWiki);