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 AUTO-FORMATTER ENGINE
   🌙 MIPPEDIA DARK MODE ENGINE
   Fitur: Perbaikan Spasi, Tanda Baca, & Tipografi Otomatis
   Fitur: Toggle Mode Gelap/Terang dengan Memory (Simpan Pilihan)
   ========================================================== */
   ========================================================== */
(function() {
(function() {
     function cleanTypography(text) {
     // 1. Definisikan Gaya Dark Mode (CSS)
         var clean = text;
    var darkModeStyles = `
        /* Warna Dasar */
        body.mippedia-dark { background-color: #121212 !important; color: #e0e0e0 !important; }
        .mippedia-dark #content, .mippedia-dark #mw-content-text { background-color: #1e1e1e !important; color: #e0e0e0 !important; border-color: #333 !important; }
       
        /* Link & Header */
        .mippedia-dark a { color: #8ab4f8 !important; }
        .mippedia-dark a:visited { color: #c58af9 !important; }
        .mippedia-dark h1, .mippedia-dark h2, .mippedia-dark h3 { color: #ffffff !important; border-bottom-color: #333 !important; }
       
        /* Kotak Pencarian & Sidebar */
        .mippedia-dark input, .mippedia-dark textarea { background-color: #2d2d2d !important; color: #ffffff !important; border: 1px solid #444 !important; }
        .mippedia-dark #mw-panel, .mippedia-dark #p-logo { background-color: #121212 !important; }
       
        /* Tombol Saklar */
        #darkmode-toggle {
            position: fixed;
            bottom: 20px;
            right: 20px;
            width: 45px;
            height: 45px;
            background: #3498db;
            color: white;
            border-radius: 50%;
            text-align: center;
            line-height: 45px;
            font-size: 22px;
            cursor: pointer;
            z-index: 10000;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
            transition: 0.3s;
            user-select: none;
        }
        #darkmode-toggle:hover { transform: scale(1.1); background: #2980b9; }
         .mippedia-dark #darkmode-toggle { background: #f1c40f; color: #333; }
    `;


        // 1. Spasi Ganda: Ubah spasi yang lebih dari satu menjadi satu spasi saja
    // 2. Suntikkan CSS ke Head
        clean = clean.replace(/[ \t]+/g, ' ');
    var styleEl = document.createElement('style');
    styleEl.innerHTML = darkModeStyles;
    document.head.appendChild(styleEl);


        // 2. Tanda Baca (Koma & Titik):
    // 3. Logika Fungsi Toggle
         // Hapus spasi SEBELUM tanda baca, dan pastikan ada satu spasi SESUDAHnya
    $(document).ready(function() {
         // Contoh: "Halo ,apa kabar ." -> "Halo, apa kabar."
         // Tambahkan tombol saklar ke Body
        clean = clean.replace(/\s+([,.!?;:])/g, '$1');  
         var $toggle = $('<div id="darkmode-toggle" title="Ganti Mode Lampu">🌙</div>');
         clean = clean.replace(/([,.!?;:])(?=[^\s\d,.!?;:])/g, '$1 ');
         $('body').append($toggle);


         // 3. Spasi di dalam kurung: "( teks )" -> "(teks)"
         // Cek memory (localStorage) apakah sebelumnya user pake dark mode
         clean = clean.replace(/\(\s+/g, '(');
         if (localStorage.getItem('mip-dark-mode') === 'enabled') {
        clean = clean.replace(/\s+\)/g, ')');
            $('body').addClass('mippedia-dark');
 
            $toggle.html('☀️');
        // 4. Perbaikan Baris Baru: Maksimal dua kali enter (biar gak ada ruang kosong raksasa)
         }
        clean = clean.replace(/\n{3,}/g, '\n\n');
 
        // 5. Simbol Khusus: Ubah (c) jadi ©, (r) jadi ®, atau -- jadi — (em-dash) agar pro
        clean = clean.replace(/\(c\)/gi, '©');
        clean = clean.replace(/\(r\)/gi, '®');
         clean = clean.replace(/ -- /g, ' — ');


         return clean;
         // Event Klik
    }
        $toggle.on('click', function() {
 
            $('body').toggleClass('mippedia-dark');
    // Jalankan pas user klik tombol Simpan
    $(document).on('click', '#wpSave, #wpSaveWidget, .editCheck-save, button[type="submit"]', function() {
        var $textbox = $('#wpTextbox1');
        if ($textbox.length) {
            var originalText = $textbox.val();
            var formattedText = cleanTypography(originalText);
              
              
            // Update isi kotak teks sebelum terkirim ke server
             if ($('body').hasClass('mippedia-dark')) {
             if (originalText !== formattedText) {
                localStorage.setItem('mip-dark-mode', 'enabled');
                 $textbox.val(formattedText);
                 $toggle.html('☀️');
                 console.log("Mippedia System: Typography cleaned automatically.");
            } else {
                 localStorage.setItem('mip-dark-mode', 'disabled');
                $toggle.html('🌙');
             }
             }
         }
         });
     });
     });
})();
})();