first commit
This commit is contained in:
+192
@@ -0,0 +1,192 @@
|
||||
/* ============================================================
|
||||
js/auth.js — Login / Logout / Role management v2.1
|
||||
============================================================ */
|
||||
|
||||
window.appAuth = { loggedIn: false, nama: '', role: '' };
|
||||
|
||||
window.checkAuthState = async function () {
|
||||
try {
|
||||
var res = await fetch('php/check_auth.php', { cache: 'no-store' });
|
||||
var data = await res.json();
|
||||
window.appAuth.loggedIn = !!data.loggedIn;
|
||||
window.appAuth.nama = data.nama || '';
|
||||
window.appAuth.role = data.role || '';
|
||||
} catch (e) {
|
||||
window.appAuth = { loggedIn: false, nama: '', role: '' };
|
||||
}
|
||||
window.renderAuthBar();
|
||||
if (!window.appAuth.loggedIn) {
|
||||
window.openLoginModal();
|
||||
}
|
||||
};
|
||||
|
||||
/* ── Render auth area di navbar ── */
|
||||
window.renderAuthBar = function () {
|
||||
var area = document.getElementById('auth-area');
|
||||
if (!area) return;
|
||||
area.innerHTML = '';
|
||||
|
||||
/* Clean up old nav buttons */
|
||||
var navMenus = document.getElementById('nav-menus');
|
||||
if (navMenus) {
|
||||
['btn-pesan-nav','btn-laporan-mgr-nav'].forEach(function(id) {
|
||||
var el = document.getElementById(id);
|
||||
if (el) el.remove();
|
||||
});
|
||||
}
|
||||
|
||||
if (!window.appAuth.loggedIn) {
|
||||
/* Show Masuk button */
|
||||
var btnMasuk = document.createElement('button');
|
||||
btnMasuk.className = 'nav-btn';
|
||||
btnMasuk.id = 'btn-masuk-nav';
|
||||
btnMasuk.innerHTML = '<i class="fa-solid fa-right-to-bracket"></i> Masuk';
|
||||
btnMasuk.onclick = window.openLoginModal;
|
||||
area.appendChild(btnMasuk);
|
||||
} else {
|
||||
/* Role chip */
|
||||
var chip = document.createElement('span');
|
||||
var isPimpinan = window.appAuth.role === 'pimpinan_daerah';
|
||||
chip.className = 'role-chip ' + (isPimpinan ? 'pimpinan' : 'pengurus');
|
||||
chip.innerHTML = isPimpinan
|
||||
? '<i class="fa-solid fa-crown"></i> Pimpinan'
|
||||
: '<i class="fa-solid fa-mosque"></i> Pengurus';
|
||||
area.appendChild(chip);
|
||||
|
||||
var name = document.createElement('span');
|
||||
name.className = 'auth-name';
|
||||
name.textContent = window.appAuth.nama;
|
||||
area.appendChild(name);
|
||||
|
||||
/* Pengurus: add Pesan & Laporan buttons to nav-menus */
|
||||
if (window.appAuth.role === 'pengurus_masjid' && navMenus) {
|
||||
var btnMsg = document.createElement('button');
|
||||
btnMsg.className = 'nav-btn msg-btn';
|
||||
btnMsg.id = 'btn-pesan-nav';
|
||||
btnMsg.innerHTML = '<i class="fa-solid fa-message"></i> Pesan <span class="lumina-badge" id="nav-badge-pesan" style="display:none; background:var(--lumina-primary);"></span>';
|
||||
btnMsg.onclick = window.openPesanPanel;
|
||||
navMenus.appendChild(btnMsg);
|
||||
|
||||
var btnLap = document.createElement('button');
|
||||
btnLap.className = 'nav-btn mgr-btn';
|
||||
btnLap.id = 'btn-laporan-mgr-nav';
|
||||
btnLap.innerHTML = '<i class="fa-solid fa-clipboard-list"></i> Laporan <span class="lumina-badge" id="nav-badge-laporan" style="display:none; background:var(--lumina-error);"></span>';
|
||||
btnLap.onclick = window.openLaporanPanel;
|
||||
navMenus.appendChild(btnLap);
|
||||
}
|
||||
|
||||
var btnLogout = document.createElement('button');
|
||||
btnLogout.className = 'nav-btn logout-btn';
|
||||
btnLogout.id = 'btn-logout-nav';
|
||||
btnLogout.innerHTML = '<i class="fa-solid fa-arrow-right-from-bracket"></i> Keluar';
|
||||
btnLogout.onclick = window.doLogout;
|
||||
area.appendChild(btnLogout);
|
||||
}
|
||||
|
||||
window.updateToolbarForRole();
|
||||
|
||||
if (window.pollLaporanNotification) window.pollLaporanNotification();
|
||||
if (window.pollPesanNotification) window.pollPesanNotification();
|
||||
};
|
||||
|
||||
|
||||
/* ── Role-based toolbar control ── */
|
||||
window.updateToolbarForRole = function () {
|
||||
var editBtn = document.getElementById('luminaModeEdit');
|
||||
var menuKeluarga = document.getElementById('menu-tambah-keluarga');
|
||||
var menuIbadah = document.getElementById('menu-tambah-ibadah');
|
||||
|
||||
var isPengurus = window.appAuth && window.appAuth.loggedIn && window.appAuth.role === 'pengurus_masjid';
|
||||
|
||||
if (isPengurus) {
|
||||
if (editBtn) editBtn.style.display = 'block';
|
||||
if (menuKeluarga) menuKeluarga.style.display = 'flex';
|
||||
if (menuIbadah) menuIbadah.style.display = 'flex';
|
||||
} else {
|
||||
if (editBtn) editBtn.style.display = 'none';
|
||||
if (menuKeluarga) menuKeluarga.style.display = 'none';
|
||||
if (menuIbadah) menuIbadah.style.display = 'none';
|
||||
if (window.appState && window.appState.mode === 'edit') window.setMode('view');
|
||||
}
|
||||
};
|
||||
|
||||
/* ── Open login modal ── */
|
||||
window.openLoginModal = function () {
|
||||
var overlay = document.getElementById('modal-login');
|
||||
if (!overlay) return;
|
||||
document.getElementById('login-username').value = '';
|
||||
document.getElementById('login-password').value = '';
|
||||
document.getElementById('login-error').textContent = '';
|
||||
overlay.style.display = 'flex';
|
||||
document.getElementById('login-username').focus();
|
||||
// Do not allow closing
|
||||
};
|
||||
|
||||
/* ── Login submit ── */
|
||||
window.doLogin = async function (e) {
|
||||
e.preventDefault();
|
||||
var btn = document.getElementById('btn-submit-login');
|
||||
var errEl = document.getElementById('login-error');
|
||||
var uname = document.getElementById('login-username').value.trim();
|
||||
var pass = document.getElementById('login-password').value;
|
||||
|
||||
if (!uname || !pass) {
|
||||
errEl.textContent = 'Username dan password wajib diisi.';
|
||||
errEl.style.display = 'block';
|
||||
return;
|
||||
}
|
||||
btn.disabled = true; btn.textContent = 'Masuk...';
|
||||
errEl.textContent = '';
|
||||
errEl.style.display = 'none';
|
||||
|
||||
try {
|
||||
var res = await fetch('php/login.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
||||
body: new URLSearchParams({ username: uname, password: pass })
|
||||
});
|
||||
var data = await res.json();
|
||||
if (data.success) {
|
||||
window.appAuth = { loggedIn: true, nama: data.nama, role: data.role };
|
||||
document.getElementById('modal-login').style.display = 'none';
|
||||
window.renderAuthBar();
|
||||
window.loadAllData();
|
||||
window.showToast('Selamat datang, ' + data.nama + '!', 'success');
|
||||
} else {
|
||||
errEl.textContent = data.error || 'Login gagal.';
|
||||
errEl.style.display = 'block';
|
||||
}
|
||||
} catch (err) {
|
||||
errEl.textContent = 'Koneksi gagal: ' + err.message;
|
||||
errEl.style.display = 'block';
|
||||
} finally {
|
||||
btn.disabled = false; btn.innerHTML = 'Masuk Sekarang <i class="fa-solid fa-arrow-right"></i>';
|
||||
}
|
||||
};
|
||||
|
||||
/* ── Logout ── */
|
||||
window.doLogout = async function () {
|
||||
await fetch('php/logout.php', { cache: 'no-store' });
|
||||
window.appAuth = { loggedIn: false, nama: '', role: '' };
|
||||
window.renderAuthBar();
|
||||
if (window.appState && window.appState.mode === 'edit') window.setMode('view');
|
||||
window.loadAllData();
|
||||
window.openLoginModal();
|
||||
window.showToast('Anda telah keluar.', 'info');
|
||||
};
|
||||
|
||||
/* ── Toggle Password Visibility ── */
|
||||
window.togglePassword = function () {
|
||||
var passInput = document.getElementById('login-password');
|
||||
var eyeIcon = document.getElementById('login-password-eye');
|
||||
if (passInput.type === 'password') {
|
||||
passInput.type = 'text';
|
||||
eyeIcon.classList.remove('fa-eye');
|
||||
eyeIcon.classList.add('fa-eye-slash');
|
||||
} else {
|
||||
passInput.type = 'password';
|
||||
eyeIcon.classList.remove('fa-eye-slash');
|
||||
eyeIcon.classList.add('fa-eye');
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user