Update bilingual scholarship content

groups/ApeNameTeamE/assets/js/popup.js

@@ -1,6 +1,7 @@
 // =====================================================
 // popup.js — Modal Detail Beasiswa
 // Tutup via: tombol ×, klik overlay, tekan Escape
+// + DUKUNGAN MULTI-BAHASA (ID/EN)
 // =====================================================
 
 const overlay   = document.getElementById('popup-overlay');
@@ -8,32 +9,91 @@ const modal     = document.getElementById('popup-modal');
 const closeBtn  = document.getElementById('popup-close');
 const popupBody = document.getElementById('popup-content');
 
-// Format tanggal ke format Indonesia
-function fmtDate(str) {
+let currentOpenId = null; // Menyimpan status beasiswa mana yang sedang dibuka
+
+// Bertanya langsung ke mesin utama (localization.js)
+function getPopupLang() {
+  if (typeof window.getLang === 'function') {
+    return window.getLang();
+  }
+  return localStorage.getItem('if_untan_lang') || 'id';
+}
+
+// Format tanggal dinamis (ID / EN)
+function fmtDate(str, lang) {
   if (!str) return '—';
   const d = new Date(str);
   if (isNaN(d.getTime())) return str;
-  return d.toLocaleDateString('id-ID', {
+  return d.toLocaleDateString(lang === 'en' ? 'en-US' : 'id-ID', {
     day: 'numeric',
     month: 'long',
     year: 'numeric'
   });
 }
 
+// Kamus Teks Statis Modal
+const popupDict = {
+  id: {
+    req_empty: 'Syarat belum tersedia. Kunjungi sumber resmi.',
+    req_title: 'Syarat Umum',
+    open_date: 'Tanggal Buka',
+    close_date: 'Tanggal Tutup',
+    contact: 'Kontak',
+    more_info: 'Info Lebih Lanjut',
+    no_link: 'Tautan tidak tersedia. Silakan hubungi admin prodi.',
+    status_open: 'Buka',
+    status_closed: 'Ditutup'
+  },
+  en: {
+    req_empty: 'Requirements not available. Visit official source.',
+    req_title: 'General Requirements',
+    open_date: 'Open Date',
+    close_date: 'Closing Date',
+    contact: 'Contact',
+    more_info: 'More Information',
+    no_link: 'Link unavailable. Please contact department admin.',
+    status_open: 'Open',
+    status_closed: 'Closed'
+  }
+};
+
 /**
  * Buka popup modal untuk beasiswa dengan ID tertentu
- * Data diambil dari window.beasiswaData yang diset oleh filter.js
  */
 function openPopup(id) {
+  currentOpenId = id;
   const data = window.beasiswaData || [];
   const bsw  = data.find(b => b.id === id);
   if (!bsw) return;
 
+  const lang = getPopupLang();
+  const d = popupDict[lang];
+
   const isBuka = bsw.status === 'Buka' || bsw.status === 'Dibuka';
   const badgeClass = isBuka ? 'badge-buka' : 'badge-ditutup';
+  
+  // Terjemahkan Status & Kategori
+  const statusText = isBuka ? d.status_open : (lang === 'en' && (bsw.status === 'Ditutup' || bsw.status === 'Tutup') ? d.status_closed : bsw.status);
+  
+  // Menerjemahkan Kategori (Misal: "Beasiswa Swasta" -> "Private Scholarship")
+  let kategoriText = bsw.kategori;
+  if (lang === 'en') {
+    if (bsw.kategori_en) {
+        kategoriText = bsw.kategori_en;
+    } else if (bsw.kategori.toLowerCase().includes('swasta')) {
+        kategoriText = 'Private Scholarship';
+    } else if (bsw.kategori.toLowerCase().includes('pemerintah')) {
+        kategoriText = 'Government Scholarship';
+    }
+  }
+
+  // Teks Dinamis (Ambil _en dari JSON jika ada, jika tidak pakai ID)
+  const namaText = (lang === 'en' && bsw.nama_en) ? bsw.nama_en : bsw.nama;
+  const deskripsiText = (lang === 'en' && bsw.deskripsi_singkat_en) ? bsw.deskripsi_singkat_en : bsw.deskripsi_singkat;
+  const syaratData = (lang === 'en' && bsw.syarat_umum_en) ? bsw.syarat_umum_en : (bsw.syarat_umum || []);
 
   // Bangun list syarat umum
-  const syaratItems = (bsw.syarat_umum || [])
+  const syaratItems = syaratData
     .map(s => `
       <li>
         <i class="fas fa-check-circle"></i>
@@ -43,74 +103,65 @@ function openPopup(id) {
 
   const syaratHTML = syaratItems
     ? `<ul class="syarat-list">${syaratItems}</ul>`
-    : `<p style="font-size:13px;color:#94a3b8;font-style:italic;">
-        Syarat belum tersedia. Kunjungi sumber resmi.
-       </p>`;
+    : `<p style="font-size:13px;color:#94a3b8;font-style:italic;">${d.req_empty}</p>`;
 
   const hasUrl = bsw.url_sumber && bsw.url_sumber !== '#';
 
-  // Render konten popup
+  // Render konten popup dengan template Anda yang dipertahankan
   popupBody.innerHTML = `
     <div class="popup-body">
-      <!-- Badge status + kategori -->
       <div class="popup-kategori-row">
-        <span class="badge-status ${badgeClass}">${bsw.status}</span>
-        <span class="popup-kategori">${bsw.kategori}</span>
+        <span class="badge-status ${badgeClass}">${statusText}</span>
+        <span class="popup-kategori">${kategoriText}</span>
       </div>
 
-      <!-- Judul -->
-      <h2 id="popup-title" class="popup-title">${bsw.nama}</h2>
+      <h2 id="popup-title" class="popup-title">${namaText}</h2>
 
-      <!-- Deskripsi singkat -->
-      <p class="popup-desc">${bsw.deskripsi_singkat}</p>
+      <p class="popup-desc">${deskripsiText}</p>
 
-      <!-- Syarat Umum -->
       <div class="popup-section-title">
         <i class="fas fa-list-check"></i>
-        Syarat Umum
+        ${d.req_title}
       </div>
       ${syaratHTML}
 
-      <!-- Periode Pendaftaran -->
       <div class="popup-periode">
         <div class="popup-periode-item">
-          <label>Tanggal Buka</label>
-          <span>${fmtDate(bsw.tanggal_buka)}</span>
+          <label>${d.open_date}</label>
+          <span>${fmtDate(bsw.tanggal_buka, lang)}</span>
         </div>
         <div class="popup-periode-item">
-          <label>Tanggal Tutup</label>
-          <span style="${!isBuka ? 'color:#EF4444;' : ''}">${fmtDate(bsw.tanggal_tutup)}</span>
+          <label>${d.close_date}</label>
+          <span style="${!isBuka ? 'color:#EF4444;' : ''}">${fmtDate(bsw.tanggal_tutup, lang)}</span>
         </div>
       </div>
 
-      <!-- Kontak -->
       ${bsw.kontak ? `
       <div class="popup-kontak">
         <i class="fas fa-phone-alt"></i>
         <div>
-          <div style="font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;">Kontak</div>
+          <div style="font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;">${d.contact}</div>
           ${bsw.kontak}
         </div>
       </div>` : ''}
 
-      <!-- Tombol Info Lebih Lanjut (UC-05) -->
       ${hasUrl
         ? `<a
             href="${bsw.url_sumber}"
             target="_blank"
             rel="noopener noreferrer"
             class="popup-cta"
-            aria-label="Info lebih lanjut tentang ${bsw.nama}"
+            aria-label="${d.more_info} ${bsw.nama}"
           >
-            Info Lebih Lanjut
+            ${d.more_info}
             <i class="fas fa-external-link-alt" style="font-size:12px;"></i>
           </a>`
         : `<button class="popup-cta disabled" disabled aria-disabled="true">
-            Info Lebih Lanjut
+            ${d.more_info}
             <i class="fas fa-external-link-alt" style="font-size:12px;"></i>
           </button>
           <p style="text-align:center;font-size:11px;color:#94a3b8;margin-top:8px;">
-            Tautan tidak tersedia. Silakan hubungi admin prodi.
+            ${d.no_link}
           </p>`
       }
     </div>
@@ -126,25 +177,26 @@ function openPopup(id) {
 
 /** Tutup popup modal */
 function closePopup() {
+  currentOpenId = null;
   overlay.classList.remove('show');
   document.body.style.overflow = '';
 }
 
 // === Event Listeners untuk menutup popup ===
-
-// 1. Tombol × close
 closeBtn?.addEventListener('click', closePopup);
-
-// 2. Klik di luar area modal (backdrop)
 document.getElementById('popup-backdrop')?.addEventListener('click', closePopup);
-
-// 3. Tekan Escape
 document.addEventListener('keydown', (e) => {
   if (e.key === 'Escape' && overlay.classList.contains('show')) {
     closePopup();
   }
 });
 
-// Expose ke global (dipanggil dari onclick di kartu)
+// Jika bahasa diganti SAAT popup sedang terbuka, cetak ulang isinya!
+document.addEventListener('languageChanged', () => {
+  if (currentOpenId && overlay.classList.contains('show')) {
+    openPopup(currentOpenId);
+  }
+});
+
 window.openPopup  = openPopup;
-window.closePopup = closePopup;
+window.closePopup = closePopup;