Tanda: Dikembalikan Suntingan perangkat seluler Suntingan peramban seluler |
Tanda: Pengembalian manual Suntingan perangkat seluler Suntingan peramban seluler |
| Baris 1.412: |
Baris 1.412: |
| }); | | }); |
| }); | | }); |
| });
| |
| })();
| |
|
| |
| /* ==========================================================
| |
| ✨ MIPPEDIA ATMOSPHERIC TOOLS
| |
| 1. Dynamic Greeting (Sapaan Waktu)
| |
| 2. Smart Image Attribution (Auto-Caption on Hover)
| |
| ========================================================== */
| |
| (function() {
| |
| $(document).ready(function() {
| |
|
| |
| // --- 1. DYNAMIC GREETING LOGIC ---
| |
| function getMippediaGreeting() {
| |
| var hour = new Date().getHours();
| |
| var greeting = "";
| |
|
| |
| if (hour >= 5 && hour < 11) greeting = "🌅 Selamat Pagi";
| |
| else if (hour >= 11 && hour < 15) greeting = "☀️ Selamat Siang";
| |
| else if (hour >= 15 && hour < 18) greeting = "🌆 Selamat Sore";
| |
| else greeting = "🌙 Selamat Malam";
| |
|
| |
| return `${greeting}, Selamat mengeksplorasi ilmu di Mippedia!`;
| |
| }
| |
|
| |
| // Tampilkan di atas judul artikel
| |
| if ($('#firstHeading').length) {
| |
| var $greetingDiv = $('<div id="mip-greeting"></div>').css({
| |
| 'font-size': '14px',
| |
| 'color': '#7f8c8d',
| |
| 'margin-bottom': '5px',
| |
| 'font-style': 'italic'
| |
| }).text(getMippediaGreeting());
| |
|
| |
| $('#firstHeading').before($greetingDiv);
| |
| }
| |
|
| |
|
| |
| // --- 2. SMART IMAGE ATTRIBUTION (Auto-Caption) ---
| |
| // Mencari semua gambar di dalam konten artikel
| |
| $('.mw-parser-output img').each(function() {
| |
| var $img = $(this);
| |
| var altText = $img.attr('alt') || "Dokumentasi Mippedia";
| |
|
| |
| // Bungkus gambar dengan container posisi relatif
| |
| $img.wrap('<div class="mip-img-container" style="position:relative; display:inline-block;"></div>');
| |
|
| |
| // Buat label attribution
| |
| var $label = $(`
| |
| <div class="mip-attribution">
| |
| 📄 Source: ${altText}
| |
| </div>
| |
| `).css({
| |
| 'position': 'absolute',
| |
| 'bottom': '5px',
| |
| 'right': '5px',
| |
| 'background': 'rgba(0, 0, 0, 0.7)',
| |
| 'color': '#fff',
| |
| 'padding': '3px 8px',
| |
| 'font-size': '10px',
| |
| 'border-radius': '4px',
| |
| 'opacity': '0',
| |
| 'transition': 'opacity 0.3s ease',
| |
| 'pointer-events': 'none',
| |
| 'white-space': 'nowrap'
| |
| });
| |
|
| |
| $img.after($label);
| |
| });
| |
|
| |
| // Efek Hover untuk memunculkan caption
| |
| $('.mip-img-container').hover(
| |
| function() { $(this).find('.mip-attribution').css('opacity', '1'); },
| |
| function() { $(this).find('.mip-attribution').css('opacity', '0'); }
| |
| );
| |
|
| |
| }); | | }); |
| })(); | | })(); |
