edit files

2026-06-10 19:48:00 +07:00
parent 8d26d3842d
commit 13cc0c9bb7
63 changed files with 8750 additions and 0 deletions
@@ -0,0 +1,99 @@
+const Chat = (() => {
+  let currentRoom = null, pollTimer = null;
+
+  const DEMO_ROOMS = [
+    { id:1, nama:'# Koordinasi Umum' },
+    { id:2, nama:'# Bantuan Darurat' },
+    { id:3, nama:'# Distribusi Sembako' },
+  ];
+
+  const DEMO_MSGS = {
+    null: [
+      { id:1, id_user:2, nama_lengkap:'Ahmad Fauzi',    pesan:'Salam rekan-rekan semua. Ada keluarga di Gg. Mawar yang sangat butuh bantuan sembako segera.',     created_at:'2025-05-13 08:00:00' },
+      { id:2, id_user:3, nama_lengkap:'Romo Benediktus',pesan:'Baik. Kami di Katedral juga sedang tangani kasus Ibu Maria yang sakit keras. Mohon dikoordinasikan.', created_at:'2025-05-13 08:05:00' },
+      { id:3, id_user:2, nama_lengkap:'Ahmad Fauzi',    pesan:'Insya Allah kita distribusi bersama hari Jumat. Tolong daftarkan semua ke sistem ya.',               created_at:'2025-05-13 08:10:00' },
+      { id:4, id_user:3, nama_lengkap:'Romo Benediktus',pesan:'Setuju. Saya sudah verifikasi laporan Ibu Maria. Status diproses.',                                   created_at:'2025-05-13 08:15:00' },
+    ],
+    1: [{ id:5, id_user:2, nama_lengkap:'Ahmad Fauzi', pesan:'Koordinasi umum aktif. Silakan gunakan channel ini untuk diskusi lintas RI.', created_at:'2025-05-13 09:00:00' }],
+    2: [{ id:6, id_user:3, nama_lengkap:'Romo Benediktus', pesan:'Ada kasus darurat di Akcaya — balita gizi buruk. Butuh respons cepat.', created_at:'2025-05-14 07:00:00' }],
+    3: [{ id:7, id_user:2, nama_lengkap:'Ahmad Fauzi', pesan:'Jadwal distribusi sembako Ramadan: 15 Maret 2025, mulai pukul 08.00 di halaman masjid.', created_at:'2025-05-12 16:00:00' }],
+  };
+
+  async function init() {
+    // Load rooms
+    let rooms = [];
+    try { const d = await Api.get('/chat/rooms'); rooms = d?.length ? d : DEMO_ROOMS; }
+    catch { rooms = DEMO_ROOMS; }
+
+    const container = ge('chat-rooms');
+    container.innerHTML = `<button class="room-btn active" data-room="" onclick="Chat.loadRoom('',this)"># Umum</button>`;
+    rooms.forEach(r => {
+      const btn = document.createElement('button');
+      btn.className = 'room-btn';
+      btn.dataset.room = r.id;
+      btn.textContent = r.nama;
+      btn.onclick = function() { Chat.loadRoom(r.id, this); };
+      container.appendChild(btn);
+    });
+
+    await loadRoom(null, container.firstChild);
+  }
+
+  async function loadRoom(roomId, btn) {
+    currentRoom = roomId || null;
+    clearInterval(pollTimer);
+    document.querySelectorAll('.room-btn').forEach(b => b.classList.remove('active'));
+    if (btn) btn.classList.add('active');
+    await fetchMessages();
+    pollTimer = setInterval(fetchMessages, 5000); // poll tiap 5 detik
+  }
+
+  async function fetchMessages() {
+    let msgs = [];
+    try {
+      const url = currentRoom ? `/chat?room=${currentRoom}` : '/chat';
+      msgs = await Api.get(url);
+    } catch {
+      msgs = DEMO_MSGS[currentRoom] || DEMO_MSGS[null];
+    }
+    renderMessages(msgs);
+  }
+
+  function renderMessages(msgs) {
+    const box = ge('chat-messages');
+    const user = App.currentUser();
+    if (!msgs?.length) {
+      box.innerHTML = '<div class="chat-empty">💬 Belum ada pesan di channel ini</div>';
+      return;
+    }
+    const prevScroll = box.scrollHeight - box.scrollTop;
+    box.innerHTML = msgs.map(m => {
+      const mine = user && m.id_user == user.id;
+      return `<div class="chat-bubble ${mine ? 'mine' : 'other'}">
+        ${!mine ? `<div class="chat-sender">${m.nama_lengkap || 'User'}</div>` : ''}
+        <div class="chat-text">${escHtml(m.pesan)}</div>
+        <div class="chat-time">${(m.created_at||'').substring(11,16)}</div>
+      </div>`;
+    }).join('');
+    // Scroll ke bawah jika sudah di bawah
+    if (prevScroll < 200) box.scrollTop = box.scrollHeight;
+  }
+
+  async function send() {
+    const inp = ge('chat-input');
+    const pesan = inp.value.trim();
+    if (!pesan) return;
+    if (!App.currentUser()) { App.toast('Harus login untuk mengirim pesan','warning'); App.showModal('modal-login'); return; }
+    inp.value = '';
+    try {
+      await Api.post('/chat', { pesan, id_room: currentRoom });
+      await fetchMessages();
+    } catch(e) { App.toast(e.message,'error'); }
+  }
+
+  function escHtml(s) {
+    return (s||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/\n/g,'<br>');
+  }
+
+  return { init, loadRoom, send };
+})();