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 203: | Baris 203: | ||
/* ========================================================== | /* ========================================================== | ||
🔗 MIPPEDIA DATA - ULTIMATE SITELINK CONNECTOR ( | 🔗 MIPPEDIA DATA - ULTIMATE SITELINK CONNECTOR (FINAL V3) | ||
Status: | Status: STABLE & BEAUTIFIED (Fixing Sync & Delete Bug) | ||
========================================================== */ | ========================================================== */ | ||
(function() { | (function() { | ||
$(document).ready(function() { | $(document).ready(function() { | ||
if (mw.config.get('wgAction') !== 'view' || mw.config.get('wgNamespaceNumber') !== 0) return; | if (mw.config.get('wgAction') !== 'view' || mw.config.get('wgNamespaceNumber') !== 0) return; | ||
var pageTitle = mw.config.get('wgPageName'); | var pageTitle = mw.config.get('wgPageName'); | ||
var dataPage = 'MediaWiki:Sitelinks-Data.json'; | var dataPage = 'MediaWiki:Sitelinks-Data.json'; | ||
var projects = { | var projects = { | ||
'id': { name: 'ID', url: 'https://id.mippedia.org/api.php', base: 'https://id.mippedia.org/wiki/', color: '#6a5acd' }, | 'id': { name: 'ID', url: 'https://id.mippedia.org/api.php', base: 'https://id.mippedia.org/wiki/', color: '#6a5acd' }, | ||
| Baris 223: | Baris 218: | ||
}; | }; | ||
// 1. | // 1. Desain Notifikasi Keren | ||
var | function showFancyNotif(msg, type) { | ||
$('.mip-notif').remove(); | |||
var icon = type === 'success' ? '🚀' : '⚠️'; | |||
var color = type === 'success' ? '#2ecc71' : '#e74c3c'; | |||
var $notif = $('<div class="mip-notif" style="position:fixed; top:30px; left:50%; transform:translateX(-50%); background:rgba(0,0,0,0.85); backdrop-filter:blur(10px); color:white; padding:12px 24px; border-radius:50px; font-size:13px; font-weight:bold; z-index:10000; display:flex; align-items:center; gap:10px; box-shadow:0 10px 30px rgba(0,0,0,0.3); border:1px solid '+color+'; animation:mipPop 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);">'+icon+' '+msg+'</div>').appendTo('body'); | |||
setTimeout(function() { $notif.css('transform', 'translateX(-50%) translateY(-100px)').css('opacity', '0'); setTimeout(function(){ $notif.remove(); }, 500); }, 3500); | |||
} | |||
// 2. Load Data Awal | |||
function loadServerData() { | |||
// 2. | new mw.Api().get({ action: 'query', prop: 'revisions', titles: dataPage, rvprop: 'content', formatversion: 2 }).done(function(data) { | ||
function | var content = data.query.pages[0].revisions ? JSON.parse(data.query.pages[0].revisions[0].content) : {}; | ||
renderLinks(content[pageTitle] || {}); | |||
var | |||
renderLinks( | |||
}).fail(function() { | }).fail(function() { | ||
$('#mip-link-display').html('< | $('#mip-link-display').html('<em style="color:#e74c3c; font-size:12px;">Gagal tersambung ke pusat data.</em>'); | ||
}); | }); | ||
} | } | ||
| Baris 270: | Baris 239: | ||
function renderLinks(links) { | function renderLinks(links) { | ||
var $display = $('#mip-link-display').empty(); | var $display = $('#mip-link-display').empty(); | ||
var | var hasAny = false; | ||
Object.keys(projects).forEach(p => { | |||
if (links[p]) { | if (links[p]) { | ||
hasAny = true; | |||
$display.append('<a class="mip-pill" style="background:'+projects[p].color+'" href="'+projects[p].base+encodeURIComponent(links[p])+'" target="_blank">Mippedia '+projects[p].name+': '+links[p]+'</a>'); | $display.append('<a class="mip-pill" style="background:'+projects[p].color+'" href="'+projects[p].base+encodeURIComponent(links[p])+'" target="_blank">Mippedia '+projects[p].name+': '+links[p]+'</a>'); | ||
$('#input-' + p).val(links[p]); | $('#input-' + p).val(links[p]); | ||
} else { | |||
$('#input-' + p).val(''); // Pastikan input kosong kalau gak ada data | |||
} | } | ||
} | }); | ||
if ( | if (!hasAny) $display.html('<em style="color:#bbb; font-size:12px;">Data belum terhubung.</em>'); | ||
} | } | ||
// 3. | // 3. Render HTML UI | ||
var editIcon = mw.config.get('wgUserGroups').includes('sysop') || !mw.config.get('wgRestrictionEdit').includes('sysop') ? '<span id="mip-edit-links" style="cursor:pointer; color:#6a5acd; font-size:18px; transition:0.3s;">✎</span>' : ''; | |||
var uiHtml = '<div id="mip-sitelink-box" style="background:#fff; border:1px solid #ddd; border-radius:12px; padding:18px; margin-top:25px; box-shadow:0 4px 15px rgba(0,0,0,0.05);">' + | |||
'<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:15px;">' + | |||
'<strong style="font-size:14px; color:#333;">🔗 Koneksi Ekosistem Mippedia</strong>' + editIcon + '</div>' + | |||
'<div id="mip-link-display" style="display:flex; gap:10px; flex-wrap:wrap;"><div class="mip-loader"></div></div>' + | |||
'<div id="mip-link-editor" style="display:none; margin-top:15px; border-top:1px solid #eee; padding-top:15px;">' + | |||
Object.keys(projects).map(p => '<div style="margin-bottom:8px; display:flex; gap:8px;"><span style="width:60px; font-size:10px; font-weight:800; background:#f0f0f0; display:flex; align-items:center; justify-content:center; border-radius:6px;">'+projects[p].name+'</span><input type="text" id="input-'+p+'" placeholder="Judul..." style="flex:1; padding:7px; font-size:13px; border:1px solid #ddd; border-radius:6px;"></div>').join('') + | |||
'<button id="mip-save-links" style="width:100%; margin-top:10px; padding:10px; background:#6a5acd; color:white; border:none; border-radius:8px; font-size:13px; font-weight:bold; cursor:pointer;">Sinkronkan Data</button></div></div>' + | |||
'<style>@keyframes mipPop{0%{transform:translateX(-50%) scale(0.5); opacity:0;} 100%{transform:translateX(-50%) scale(1); opacity:1;}} .mip-pill{color:white !important; padding:6px 14px; border-radius:20px; font-size:11px; font-weight:bold; text-decoration:none !important; transition:0.2s;} .mip-pill:hover{transform:translateY(-2px); box-shadow:0 4px 8px rgba(0,0,0,0.1);}</style>'; | |||
$('#mip-data-footer').before(uiHtml); | |||
// 4. | // 4. Aksi Simpan & Hapus Permanen | ||
$(document).on('click', '#mip-save-links', function() { | $(document).on('click', '#mip-save-links', function() { | ||
var btn = $(this).text(' | var $btn = $(this); | ||
$btn.text('Menyimpan...').prop('disabled', true); | |||
var api = new mw.Api(); | var api = new mw.Api(); | ||
api.get({ action: 'query', prop: 'revisions', titles: dataPage, rvprop: 'content', formatversion: 2 }).done(function(res) { | api.get({ action: 'query', prop: 'revisions', titles: dataPage, rvprop: 'content', formatversion: 2 }).done(function(res) { | ||
var fullData = res.query.pages[0].revisions ? JSON.parse(res.query.pages[0].revisions[0].content) : {}; | var fullData = res.query.pages[0].revisions ? JSON.parse(res.query.pages[0].revisions[0].content) : {}; | ||
var | var newData = {}; | ||
var isDeleting = true; | var isDeleting = true; | ||
Object.keys(projects).forEach(p => { | Object.keys(projects).forEach(p => { | ||
var | var v = $('#input-' + p).val().trim(); | ||
if ( | if (v) { newData[p] = v; isDeleting = false; } | ||
}); | }); | ||
if (isDeleting) delete fullData[pageTitle]; | if (isDeleting) delete fullData[pageTitle]; | ||
else fullData[pageTitle] = | else fullData[pageTitle] = newData; | ||
api.postWithEditToken({ | api.postWithEditToken({ | ||
action: 'edit', title: dataPage, text: JSON.stringify(fullData, null, 2), | action: 'edit', title: dataPage, text: JSON.stringify(fullData, null, 2), | ||
summary: 'Update Sitelink: ' + pageTitle | summary: 'Update Sitelink: ' + pageTitle, format: 'json' | ||
}).done(function() { | }).done(function() { | ||
showFancyNotif(isDeleting ? 'Koneksi Berhasil Dihapus' : 'Data Berhasil Terhubung!', 'success'); | |||
setTimeout(function() { location.reload(); }, | setTimeout(function(){ location.reload(); }, 1200); | ||
}).fail(function(code) { | }).fail(function(code) { | ||
showFancyNotif('Error: ' + code + '. Periksa izin server.', 'error'); | |||
btn.text('Sinkronkan Data').prop('disabled', false); | $btn.text('Sinkronkan Data').prop('disabled', false); | ||
}); | }); | ||
}); | }); | ||
| Baris 323: | Baris 299: | ||
$(document).on('click', '#mip-edit-links', function() { $('#mip-link-editor').slideToggle(); }); | $(document).on('click', '#mip-edit-links', function() { $('#mip-link-editor').slideToggle(); }); | ||
loadServerData(); | |||
}); | }); | ||
})(); | })(); | ||