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 GLOBAL SEARCH SWITCHER | |||
Fungsi: Menambahkan opsi cari ke proyek Mippedia lain | |||
Target: Mobile & Desktop | |||
========================================================== */ | ========================================================== */ | ||
(function() { | (function() { | ||
$(document).ready(function() { | $(document).ready(function() { | ||
var | // 1. Konfigurasi Subdomain Mippedia | ||
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=' } | |||
]; | |||
// | // 2. CSS agar tampilan tombol rapi di bawah bar pencarian | ||
$('<style>').text(` | $('<style>').text(` | ||
.mip-search-switcher { | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 5px; | |||
padding: 10px; | |||
background: #f8f9fa; | |||
. | border-bottom: 1px solid #ddd; | ||
} | |||
.mip-search-btn { | |||
font-size: 11px; | |||
padding: 5px 10px; | |||
. | background: #fff; | ||
border: 1px solid #3498db; | |||
color: #3498db; | |||
border-radius: 15px; | |||
/* | cursor: pointer; | ||
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'); | ||
// | // 3. Logic Injeksi Tombol | ||
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); | |||
}); | |||
// Masukkan ke bawah kolom input pencarian (Mobile & Desktop support) | |||
$('.search-overlay .search-content, #searchform, .mw-searchInput-container').after($container); | |||
} | |||
} | |||
// | // 4. Trigger: Munculkan tombol hanya saat user mulai mengetik | ||
$ | $(document).on('input', '.mw-ui-input, .searchInput, .mw-searchInput', function() { | ||
var val = $(this).val().trim(); | |||
injectSwitcher(); // Pastikan container terpasang | |||
if (val.length > 0) { | |||
$('#mip-switcher-container').removeClass('mip-hidden'); | |||
} else { | |||
$('#mip-switcher-container').addClass('mip-hidden'); | |||
var | |||
$ | |||
} | |||
} | } | ||
}); | }); | ||
}); | }); | ||
})(); | })(); | ||