Mippedia

MediaWiki:Common.js: Perbedaan antara revisi

← Revisi sebelumnyaRevisi selanjutnya →

Admin (bicara | kontrib)

16 grup pengguna
7.586 suntingan
Tidak ada ringkasan suntingan
Tanda: Suntingan perangkat seluler Suntingan peramban seluler
Tidak ada ringkasan suntingan
Tanda: Suntingan perangkat seluler Suntingan peramban seluler
Baris 238: Baris 238:


/* ==========================================================
/* ==========================================================
   🚀 MIPPEDIA DATA INTEGRATION (Aligned Version)
   🚀 MIPPEDIA DATA INTEGRATION (Perfect Inline Version)
   Posisi: Sejajar (Horizontal) dengan Estimasi Waktu Baca
   Posisi: Langsung di sebelah kanan teks "5 menit"
   ========================================================== */
   ========================================================== */
$(document).ready(function() {
$(document).ready(function() {
     function alignMippediaData() {
     function fixInlineMippediaData() {
        // 1. Cari elemen template dan estimasi baca
         var $dataTemplate = $('.mw-parser-output div:contains("Mippedia Data")').first();
         var $dataTemplate = $('.mw-parser-output div:contains("Mippedia Data")').first();
         var dataUrl = $dataTemplate.find('a').attr('href');
         var dataUrl = $dataTemplate.find('a').attr('href');
         var $estimasiBaca = $('.estimasi-baca-container'); // Pastikan class ini sesuai dengan script estimasi lo
         var $estimasiContainer = $('.estimasi-baca-container');


         if ($dataTemplate.length && dataUrl && $('#mippedia-data-inline').length === 0) {
         if ($dataTemplate.length && dataUrl && $('#mippedia-data-inline').length === 0) {
              
              
             // 2. Buat container pembungkus agar sejajar (Flexbox)
             // 1. Buat tombol versi super compact
            var $flexContainer = $('<div id="mippedia-header-meta" style="display: flex; align-items: center; justify-content:建设性; gap: 12px; flex-wrap: wrap; margin: 10px 0;"></div>');
             var $inlineBtn = $(`
 
                 <a id="mippedia-data-inline" href="${dataUrl}" target="_blank" style="text-decoration: none !important; margin-left: 10px; display: inline-flex; vertical-align: middle;">
            // 3. Buat tombol versi mini & rapi
                     <div style="display: flex; align-items: center; background: #36c; color: #fff; padding: 2px 8px; border-radius: 4px; font-family: sans-serif; box-shadow: 0 2px 4px rgba(54,102,204,0.2); transform: translateY(-1px);">
             var $dataBtn = $(`
                         <span style="font-size: 10px; margin-right: 4px;">📊</span>
                 <a id="mippedia-data-inline" href="${dataUrl}" target="_blank" style="text-decoration: none !important;">
                         <span style="font-size: 9px; font-weight: 800; text-transform: uppercase; white-space: nowrap;">Data</span>
                     <div style="display: flex; align-items: center; background: #36c; color: #fff; padding: 4px 10px; border-radius: 6px; font-family: sans-serif; box-shadow: 0 2px 6px rgba(54,102,204,0.2);">
                         <span style="font-size: 12px; margin-right: 5px;">📊</span>
                         <span style="font-size: 10px; font-weight: 800; letter-spacing: 0.3px; text-transform: uppercase; white-space: nowrap;">Lihat di Mippedia Data</span>
                     </div>
                     </div>
                 </a>
                 </a>
             `);
             `);


            // 4. Masukkan Estimasi Baca dan Tombol ke dalam Flex Container
             if ($estimasiContainer.length) {
             if ($estimasiBaca.length) {
                 // 2. Paksa container estimasi jadi inline-flex biar bisa dijejerin
                 // Bungkus estimasi baca yang sudah ada
                 $estimasiContainer.css({
                $estimasiBaca.before($flexContainer);
                    'display': 'inline-flex',
                $flexContainer.append($estimasiBaca).append($dataBtn);
                    'align-items': 'center',
               
                    'margin-bottom': '0'
                // Rapikan margin internal estimasi baca agar pas
                });
                 $estimasiBaca.css({'margin': '0', 'display': 'flex', 'align-items': 'center'});
 
                // 3. Tempel tombol tepat di dalam container estimasi (setelah teks menit)
                $estimasiContainer.append($inlineBtn);
             } else {
             } else {
                 // Fallback jika class estimasi tidak ketemu, taruh di bawah tagline
                 // Fallback jika container tidak ketemu
                 $('.mw-body-content').first().prepend($flexContainer);
                 $('.mw-parser-output').first().prepend($inlineBtn);
                $flexContainer.append($dataBtn);
             }
             }


             // Sembunyikan template asli
             // Sembunyikan template lama
             $dataTemplate.hide();
             $dataTemplate.hide();
         }
         }
     }
     }


     // Jalankan eksekusi
     fixInlineMippediaData();
    alignMippediaData();
     setTimeout(fixInlineMippediaData, 1500);
     setTimeout(alignMippediaData, 1500);
});
});


Diperoleh dari "https://id.mippedia.org/wiki/MediaWiki:Common.js"