Tanda: Suntingan perangkat seluler Suntingan peramban seluler |
Tanda: Pengosongan Pengembalian manual Suntingan perangkat seluler Suntingan peramban seluler |
| (3 revisi perantara oleh pengguna yang sama tidak ditampilkan) |
| Baris 1: |
Baris 1: |
| mw.hook('wikipage.content').add(function ($content) {
| |
| // KHUSUS HALAMAN UTAMA
| |
| if (!mw.config.get('wgIsMainPage')) {
| |
| return;
| |
| }
| |
|
| |
|
| // Cari link bawaan template yang berisi kata "Selengkapnya"
| |
| $content.find('a').filter(function () {
| |
| return $(this).text().indexOf('Baca selengkapnya....') !== -1;
| |
| }).first().each(function () {
| |
| var $link = $(this);
| |
| var $container = $link.closest('p'); // Paragraf teks artikel unggulan
| |
|
| |
| if ($container.length && !$container.hasClass('mp-processed')) {
| |
| $container.addClass('mp-featured-paragraph mp-processed');
| |
|
| |
| var articleUrl = $link.attr('href'); // Ambil URL artikel asli
| |
|
| |
| // Ambil teks bersih dari paragraf tanpa link
| |
| var $clone = $container.clone();
| |
| $clone.find('a').remove();
| |
| var fullText = $clone.text().trim();
| |
|
| |
| // Batasi karakter untuk tampilan awal (sekitar 3 baris)
| |
| var charLimit = 135;
| |
| var truncatedText = fullText.length > charLimit ? fullText.substring(0, charLimit).trim() + '...' : fullText;
| |
| var remainingText = fullText.length > charLimit ? fullText.substring(charLimit) : '';
| |
|
| |
| // Buat HTML dengan teks baru "Baca selengkapnya...."
| |
| var linkHtml = '<a class="featured-readmore-link" href="' + articleUrl + '">Baca selengkapnya....</a>';
| |
|
| |
| var collapsedHtml = '<span class="mp-text-main">' + truncatedText + ' </span>' +
| |
| '<span class="mp-text-extra" style="display:none;">' + remainingText + ' </span>' +
| |
| linkHtml;
| |
|
| |
| // Render ke dalam paragraf
| |
| $container.html(collapsedHtml);
| |
|
| |
| var isExpanded = false;
| |
|
| |
| // Handle Klik dengan Animasi Mulus
| |
| $container.on('click', '.featured-readmore-link', function (e) {
| |
| if (!isExpanded) {
| |
| e.preventDefault();
| |
| isExpanded = true;
| |
|
| |
| // KLIK PERTAMA: Munculkan sisa teks dengan animasi fade-in yang halus
| |
| var $extra = $container.find('.mp-text-extra');
| |
| $extra.css({ display: 'inline', opacity: 0 }).animate({ opacity: 1 }, 400);
| |
| }
| |
| // KLIK KEDUA: Otomatis mengarahkan ke halaman artikel asli
| |
| });
| |
| }
| |
| });
| |
| });
| |
