Tanda: Suntingan perangkat seluler Suntingan peramban seluler |
Tanda: Suntingan perangkat seluler Suntingan peramban seluler |
| Baris 739: |
Baris 739: |
| } | | } |
| }); | | }); |
| });
| |
| })();
| |
|
| |
| /* ==========================================================
| |
| 📱 MIPPEDIA DATA - QR CODE MOBILE SHARING
| |
| Otomatis membuat QR Code unik untuk setiap halaman
| |
| ========================================================== */
| |
| (function() {
| |
| $(document).ready(function() {
| |
| // Jangan jalankan di halaman khusus/admin
| |
| if (mw.config.get('wgNamespaceNumber') !== 0) return;
| |
|
| |
| var pageUrl = window.location.href;
| |
| var qrUrl = "https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=" + encodeURIComponent(pageUrl);
| |
|
| |
| // 1. Buat tombol pemicu di atas infobox atau sidebar
| |
| var $qrButton = $('<div id="mip-qr-trigger">')
| |
| .css({
| |
| 'cursor': 'pointer', 'margin-top': '10px', 'padding': '8px',
| |
| 'background': '#f4f1ff', 'border': '1px solid #6a5acd',
| |
| 'border-radius': '8px', 'text-align': 'center', 'transition': '0.3s'
| |
| })
| |
| .html('<span style="font-size:1.2em;">📱</span> <strong style="color:#6a5acd; font-size:0.85em;">Buka di HP</strong>');
| |
|
| |
| // 2. Buat container pop-up QR (Hidden by default)
| |
| var $qrPopup = $('<div id="mip-qr-popup">')
| |
| .css({
| |
| 'display': 'none', 'position': 'fixed', 'top': '50%', 'left': '50%',
| |
| 'transform': 'translate(-50%, -50%)', 'z-index': '10001',
| |
| 'background': 'white', 'padding': '20px', 'border-radius': '15px',
| |
| 'box-shadow': '0 10px 30px rgba(0,0,0,0.3)', 'text-align': 'center',
| |
| 'border': '2px solid #6a5acd'
| |
| })
| |
| .html('<div style="font-weight:bold; margin-bottom:10px; color:#333;">Scan untuk lanjut baca</div>' +
| |
| '<img src="' + qrUrl + '" alt="QR Code" style="margin-bottom:10px; border:1px solid #eee;">' +
| |
| '<div style="font-size:0.75em; color:#666;">Mippedia Data Mobile</div>' +
| |
| '<button id="close-qr" style="margin-top:15px; border:none; background:#6a5acd; color:white; padding:5px 15px; border-radius:10px; cursor:pointer;">Tutup</button>');
| |
|
| |
| // 3. Overlay (Layar gelap di belakang)
| |
| var $overlay = $('<div id="mip-qr-overlay">').css({
| |
| 'display': 'none', 'position': 'fixed', 'top': '0', 'left': '0',
| |
| 'width': '100%', 'height': '100%', 'background': 'rgba(0,0,0,0.5)', 'z-index': '10000'
| |
| });
| |
|
| |
| // Gabungkan ke halaman
| |
| $('body').append($overlay).append($qrPopup);
| |
|
| |
| // Letakkan tombol di bawah judul atau di infobox
| |
| $('.mw-indicators').last().after($qrButton);
| |
|
| |
| // Event Klik
| |
| $qrButton.on('click', function() {
| |
| $overlay.fadeIn(200);
| |
| $qrPopup.fadeIn(200);
| |
| });
| |
|
| |
| $('#close-qr, #mip-qr-overlay').on('click', function() {
| |
| $overlay.fadeOut(200);
| |
| $qrPopup.fadeOut(200);
| |
| });
| |
|
| |
| // Hover effect
| |
| $qrButton.hover(
| |
| function() { $(this).css('background', '#eaddff'); },
| |
| function() { $(this).css('background', '#f4f1ff'); }
| |
| );
| |
| }); | | }); |
| })(); | | })(); |
