| <!DOCTYPE html> |
| <html lang="ro"> |
| <head> |
| <link rel="icon" type="image/svg+xml" href="favicon.svg"> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> |
| <title>SGE | Login</title> |
| <link rel="stylesheet" href="style.css"> |
| <script src="errors.js"></script> |
| <style> |
| body { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100dvh; padding:20px 14px; } |
| .login-wrap { width:100%; max-width:360px; } |
| |
| |
| .role-fields-wrap { position:relative; overflow:hidden; } |
| .fields { |
| display:none; opacity:0; |
| border:1px solid var(--glass-border); border-top:none; |
| padding:22px 18px; |
| } |
| .fields.show { |
| display:block; |
| animation:fieldFadeIn 0.25s ease forwards; |
| } |
| @keyframes fieldFadeIn { |
| from { opacity:0; transform:translateY(7px); } |
| to { opacity:1; transform:translateY(0); } |
| } |
| |
| |
| .onboard-overlay { |
| position:fixed; inset:0; z-index:10000; |
| background:var(--black); |
| display:flex; flex-direction:column; |
| align-items:center; justify-content:center; |
| padding:28px 20px; |
| } |
| .onboard-overlay.hide { |
| animation:fadeOut 0.5s ease forwards; |
| pointer-events:none; |
| } |
| @keyframes fadeOut { to { opacity:0; visibility:hidden; } } |
| |
| .onboard-wrap { width:100%; max-width:360px; } |
| .onboard-title { |
| font-family:'Cormorant Garamond',serif; |
| font-size:26px; letter-spacing:3px; text-align:center; |
| margin-bottom:6px; |
| } |
| .onboard-sub { |
| font-size:10px; color:var(--white-dim); letter-spacing:1px; |
| text-align:center; line-height:2; margin-bottom:28px; |
| } |
| .onboard-q { margin-bottom:20px; } |
| .onboard-q .q-label { |
| font-size:9px; letter-spacing:3px; color:var(--white-dim); |
| margin-bottom:10px; |
| } |
| .onboard-choice-row { display:flex; gap:8px; } |
| .onboard-choice { |
| flex:1; background:var(--glass); |
| border:1px solid var(--glass-border); |
| color:var(--white-dim); padding:12px 8px; |
| font-family:'DM Mono',monospace; font-size:9px; letter-spacing:2px; |
| cursor:pointer; transition:all 0.2s; text-align:center; |
| } |
| .onboard-choice:hover { border-color:rgba(255,255,255,0.25); color:var(--white); } |
| .onboard-choice.selected { background:var(--white); color:var(--black); border-color:var(--white); } |
| .onboard-input { |
| width:100%; background:rgba(255,255,255,0.04); |
| border:1px solid rgba(255,255,255,0.09); |
| color:var(--white); padding:12px 14px; |
| font-family:'DM Mono',monospace; font-size:12px; |
| outline:none; margin-bottom:8px; |
| transition:border-color 0.2s; |
| } |
| .onboard-input:focus { border-color:rgba(255,255,255,0.3); } |
| .onboard-input::placeholder { color:var(--white-faint); font-size:11px; } |
| .onboard-skip { |
| font-size:9px; color:var(--white-faint); letter-spacing:1px; |
| text-align:center; cursor:pointer; margin-top:8px; |
| text-decoration:underline; text-underline-offset:3px; |
| } |
| .onboard-skip:hover { color:var(--white-dim); } |
| </style> |
| </head> |
| <body> |
|
|
| |
| <div class="onboard-overlay" id="onboard-overlay" style="display:none;"> |
| <div class="onboard-wrap"> |
| <img src="logo.svg" style="width:38px;height:38px;display:block;margin:0 auto 18px;opacity:0.7;"> |
| <div class="onboard-title">Bine ai venit la SGE</div> |
| <div class="onboard-sub"> |
| Câteva întrebări rapide ca să personalizăm<br>experiența ta. Durează 30 de secunde. |
| </div> |
|
|
| |
| <div class="onboard-q"> |
| <div class="q-label">Q1 — CE TEMĂ PREFERI?</div> |
| <div class="onboard-choice-row"> |
| <button class="onboard-choice selected" id="ob-dark" onclick="obSelect('theme','dark',this)">DARK MODE</button> |
| <button class="onboard-choice" id="ob-light" onclick="obSelect('theme','light',this)">LIGHT MODE</button> |
| </div> |
| </div> |
|
|
| |
| <div class="onboard-q"> |
| <div class="q-label">Q2 — CE EȘTI?</div> |
| <div class="onboard-choice-row"> |
| <button class="onboard-choice" id="ob-elev" onclick="obSelect('rol','elev',this)">ELEV</button> |
| <button class="onboard-choice" id="ob-prof" onclick="obSelect('rol','profesor',this)">PROFESOR</button> |
| <button class="onboard-choice" id="ob-other" onclick="obSelect('rol','other',this)">ALTUL</button> |
| </div> |
| </div> |
|
|
| |
| <div class="onboard-q"> |
| <div class="q-label">Q3 — ADRESEAZĂ-NE O ÎNTREBARE (OPȚIONAL)</div> |
| <input class="onboard-input" id="ob-name" placeholder="Nume și prenume (opțional)"> |
| <input class="onboard-input" id="ob-phone" placeholder="Număr de telefon (opțional)" inputmode="tel"> |
| <input class="onboard-input" id="ob-intrebare" placeholder="Întrebarea ta..."> |
| </div> |
|
|
| <button class="btn-primary" style="width:100%;letter-spacing:3px;" onclick="finishOnboard()">CONTINUĂ →</button> |
| <div class="onboard-skip" onclick="skipOnboard()">Sari peste →</div> |
| </div> |
| </div> |
|
|
| |
| <div class="loader-overlay" id="login-loader"> |
| <div class="loader"> |
| <div class="inner one"></div> |
| <div class="inner two"></div> |
| <div class="inner three"></div> |
| </div> |
| <div class="loader-text" id="loader-text">SGE</div> |
| </div> |
|
|
| <div class="login-wrap" id="login-wrap" style="opacity:0"> |
|
|
| <div class="login-header fade-in"> |
| <img src="logo.svg" alt="SGE"> |
| <h1>SGE</h1> |
| <p>Sistem de Gestiune Educațională</p> |
| </div> |
|
|
| <div class="server-status fade-in-2"> |
| <span class="status-dot online"></span> |
| <span id="srv-status-text">SERVER ACTIV</span> |
| </div> |
|
|
| |
| <div style="text-align:right;margin-bottom:8px;" class="fade-in-2"> |
| <button onclick="toggleTheme()" style="background:transparent;border:1px solid var(--glass-border);color:var(--white-dim);padding:4px 10px;font-family:'DM Mono',monospace;font-size:8px;letter-spacing:2px;cursor:pointer;" id="theme-btn">☀ LIGHT</button> |
| </div> |
|
|
| <div class="fade-in-3"> |
| <div class="role-tabs" id="role-tabs"> |
| <button class="role-tab active" id="tab-elev" onclick="switchRole('elev',this)"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><circle cx="12" cy="7" r="4"/><path d="M4 21c0-4 3.58-7 8-7s8 3 8 7"/></svg> |
| ELEV |
| </button> |
| <button class="role-tab" id="tab-profesor" onclick="switchRole('profesor',this)"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><rect x="3" y="3" width="18" height="13" rx="1"/><path d="M8 21h8M12 16v5"/></svg> |
| PROFESOR |
| </button> |
| <button class="role-tab" id="tab-admin" onclick="switchRole('admin',this)"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg> |
| ADMIN |
| </button> |
| </div> |
|
|
| <div id="fields-wrap"> |
| |
| <div class="fields show" id="f-elev"> |
| <div class="field"> |
| <label>Identificator Elev</label> |
| <select id="elev-id" onchange="checkElevPin()"> |
| <option value="">— selectează —</option> |
| </select> |
| </div> |
| <div id="pin-field" class="field" style="display:none;"> |
| <label>Cod VPass</label> |
| <input type="password" id="elev-pin" maxlength="6" placeholder="——————" inputmode="numeric" autocomplete="current-password"> |
| </div> |
| <div id="btn-login-wrap" style="margin-top:14px;display:none;"> |
| <button class="btn-primary" style="width:100%;letter-spacing:3px;" onclick="doLogin()">AUTENTIFICARE</button> |
| </div> |
| <button class="btn-signup" id="btn-signup" onclick="goSignup()">ÎNREGISTRARE →</button> |
| <div class="signup-hint" id="signup-hint">Contul tău nu are încă o parolă.<br>Apasă ÎNREGISTRARE pentru a-l activa.</div> |
| <div style="text-align:center;margin-top:12px;display:none;" id="reset-link-wrap"> |
| <a href="reset.html" style="font-size:9px;color:var(--white-dim);letter-spacing:1px;text-decoration:none;">Am uitat parola →</a> |
| </div> |
| </div> |
|
|
| |
| <div class="fields" id="f-profesor"> |
| <div class="field"> |
| <label>Identificator Profesor</label> |
| <select id="prof-id"><option value="">— selectează —</option></select> |
| </div> |
| <div class="field"> |
| <label>Cod de Acces</label> |
| <input type="password" id="prof-pin" maxlength="6" placeholder="——————" inputmode="numeric"> |
| </div> |
| <div style="margin-top:16px;"> |
| <button class="btn-primary" style="width:100%;letter-spacing:3px;" onclick="doLogin()">AUTENTIFICARE</button> |
| </div> |
| </div> |
|
|
| |
| <div class="fields" id="f-admin"> |
| <div class="field"> |
| <label>Parolă Administrator</label> |
| <input type="password" id="admin-pass" placeholder="—————————————" autocomplete="off"> |
| </div> |
| <div style="margin-top:16px;"> |
| <button class="btn-primary" style="width:100%;letter-spacing:3px;" onclick="doLogin()">AUTENTIFICARE</button> |
| </div> |
| <div style="margin-top:10px;font-size:9px;color:var(--white-faint);letter-spacing:1px;text-align:center;"> |
| Sesiunea admin nu este persistentă |
| </div> |
| </div> |
| </div> |
|
|
| <div class="alert error" id="err-msg" style="margin-top:10px;"></div> |
| </div> |
|
|
| <div class="footer-mini fade-in-4"> |
| SGE ©2026 — Victor Roșca<br> |
| Telenești, Moldova |
| </div> |
| </div> |
|
|
| <script type="module"> |
| import { initializeApp } from "https://www.gstatic.com/firebasejs/10.12.0/firebase-app.js"; |
| import { getFirestore, collection, getDocs, doc, getDoc, addDoc, serverTimestamp } |
| from "https://www.gstatic.com/firebasejs/10.12.0/firebase-firestore.js"; |
| |
| const cfg = { |
| apiKey:"AIzaSyB9--Onx3-_YjD-YzblhZjaWSVVqTQJ1lU", |
| authDomain:"vservers1.firebaseapp.com", projectId:"vservers1", |
| storageBucket:"vservers1.firebasestorage.app", |
| messagingSenderId:"42433037358", appId:"1:42433037358:web:fde70fec79542428b60bbf" |
| }; |
| const app = initializeApp(cfg); |
| const db = getFirestore(app); |
| window._db=db; window._doc=doc; window._getDoc=getDoc; |
| window._addDoc=addDoc; window._col=collection; window._sts=serverTimestamp; |
| |
| |
| const vsRole = sessionStorage.getItem('vs_role'); |
| if (vsRole === 'elev') { |
| if(localStorage.getItem('sge_maintenance')==='1'){window.location.href='503.html';} |
| else{window.location.href='elev-dashboard.html';} |
| } else if (vsRole === 'profesor') { |
| if(localStorage.getItem('sge_maintenance')==='1'){window.location.href='503.html';} |
| else{window.location.href='profesor-dashboard.html';} |
| } |
| |
| |
| const ltEl = document.getElementById('loader-text'); |
| ltEl.textContent = 'SGE'; |
| |
| window._elevMap = {}; |
| |
| try { |
| const snap = await getDocs(collection(db,'elevi')); |
| const sel = document.getElementById('elev-id'); |
| const elevi = []; |
| snap.forEach(d => { |
| elevi.push({id:d.id,...d.data()}); |
| window._elevMap[d.id] = d.data(); |
| }); |
| elevi.sort((a,b)=>(a.pozitie||0)-(b.pozitie||0)); |
| elevi.forEach(e => { |
| const o = document.createElement('option'); |
| o.value = e.id; |
| o.textContent = `${String(e.pozitie||'').padStart(2,'0')}. ${e.nume}`; |
| sel.appendChild(o); |
| }); |
| } catch(e) { console.error('err-001',e); } |
| |
| try { |
| const snap = await getDocs(collection(db,'profesori')); |
| const sel = document.getElementById('prof-id'); |
| snap.forEach(d => { |
| const o = document.createElement('option'); |
| o.value = d.id; |
| o.textContent = `${d.data().nume} — ${d.data().materie||''}`; |
| sel.appendChild(o); |
| }); |
| } catch(e) {} |
| |
| |
| await new Promise(r=>setTimeout(r,300)); |
| document.getElementById('login-loader').classList.add('hide'); |
| document.getElementById('login-wrap').style.opacity='1'; |
| document.getElementById('login-wrap').style.transition='opacity 0.4s ease'; |
| |
| |
| if (!localStorage.getItem('sge_onboarded')) { |
| document.getElementById('onboard-overlay').style.display='flex'; |
| } |
| |
| |
| applyPrefs(); |
| </script> |
|
|
| <script> |
| let role = 'elev'; |
| const ADMIN_PASS = '122012'; |
| let _switching = false; |
| let _obData = { theme:'dark', rol:null }; |
| |
| |
| function obSelect(key, val, btn) { |
| _obData[key] = val; |
| const group = btn.parentElement.querySelectorAll('.onboard-choice'); |
| group.forEach(b => b.classList.remove('selected')); |
| btn.classList.add('selected'); |
| } |
| |
| async function finishOnboard() { |
| localStorage.setItem('sge_pref_theme', _obData.theme); |
| if (_obData.rol && _obData.rol !== 'other') { |
| localStorage.setItem('sge_pref_rol', _obData.rol); |
| } |
| localStorage.setItem('sge_onboarded','1'); |
| |
| |
| const name = document.getElementById('ob-name').value.trim(); |
| const phone = document.getElementById('ob-phone').value.trim(); |
| const intrebare = document.getElementById('ob-intrebare').value.trim(); |
| if (name || phone || intrebare) { |
| try { |
| await window._addDoc(window._col(window._db,'notificari'), { |
| tip: 'onboard_question', |
| elevNume: name || '(anonim)', |
| telefon: phone || '—', |
| mesaj: intrebare || '—', |
| rol: _obData.rol || '?', |
| citita: false, |
| timestamp: window._sts() |
| }); |
| } catch(e) {} |
| } |
| |
| document.getElementById('onboard-overlay').classList.add('hide'); |
| setTimeout(() => { |
| document.getElementById('onboard-overlay').style.display='none'; |
| }, 500); |
| applyPrefs(); |
| } |
| |
| function skipOnboard() { |
| localStorage.setItem('sge_onboarded','1'); |
| document.getElementById('onboard-overlay').classList.add('hide'); |
| setTimeout(() => document.getElementById('onboard-overlay').style.display='none', 500); |
| } |
| |
| |
| function applyPrefs() { |
| const theme = localStorage.getItem('sge_pref_theme') || 'dark'; |
| const prefRol = localStorage.getItem('sge_pref_rol'); |
| |
| if (theme === 'light') { |
| document.body.classList.add('light-mode'); |
| document.getElementById('theme-btn').textContent = '☽ DARK'; |
| } else { |
| document.body.classList.remove('light-mode'); |
| document.getElementById('theme-btn').textContent = '☀ LIGHT'; |
| } |
| |
| |
| if (prefRol === 'elev') { |
| document.getElementById('tab-elev').style.display=''; |
| |
| } |
| } |
| |
| function toggleTheme() { |
| const isLight = document.body.classList.toggle('light-mode'); |
| localStorage.setItem('sge_pref_theme', isLight ? 'light' : 'dark'); |
| document.getElementById('theme-btn').textContent = isLight ? '☽ DARK' : '☀ LIGHT'; |
| } |
| |
| |
| function switchRole(r, btn) { |
| if (_switching || r === role) return; |
| _switching = true; |
| |
| const currentEl = document.getElementById('f-' + role); |
| const nextEl = document.getElementById('f-' + r); |
| |
| document.querySelectorAll('.role-tab').forEach(b => b.classList.remove('active')); |
| btn.classList.add('active'); |
| hideError('err-msg'); |
| |
| |
| currentEl.style.transition = 'opacity 0.2s ease, transform 0.2s ease'; |
| currentEl.style.opacity = '0'; |
| currentEl.style.transform = 'translateY(-6px)'; |
| |
| setTimeout(() => { |
| currentEl.classList.remove('show'); |
| currentEl.style.cssText = ''; |
| |
| role = r; |
| nextEl.classList.add('show'); |
| |
| setTimeout(() => { _switching = false; }, 280); |
| }, 200); |
| } |
| |
| function checkElevPin() { |
| const id = document.getElementById('elev-id').value; |
| const elev = window._elevMap && window._elevMap[id]; |
| const hasPin = elev && elev.pin != null; |
| document.getElementById('pin-field').style.display = hasPin ? 'block' : 'none'; |
| document.getElementById('btn-login-wrap').style.display = hasPin ? 'block' : 'none'; |
| document.getElementById('btn-signup').classList.toggle('show', !hasPin && !!id); |
| document.getElementById('signup-hint').classList.toggle('show', !hasPin && !!id); |
| document.getElementById('reset-link-wrap').style.display = hasPin ? 'block' : 'none'; |
| hideError('err-msg'); |
| } |
| |
| function goSignup() { |
| const id = document.getElementById('elev-id').value; |
| const elev = window._elevMap && window._elevMap[id]; |
| if (!id || !elev) { showError('err-msg','err-002'); return; } |
| sessionStorage.setItem('su_elevId', id); |
| sessionStorage.setItem('su_name', elev.nume); |
| sessionStorage.setItem('su_vpass', elev.vpassId); |
| window.location.href = 'signup.html'; |
| } |
| |
| async function doLogin() { |
| hideError('err-msg'); |
| const loader = document.getElementById('login-loader'); |
| loader.classList.remove('hide'); |
| loader.style.opacity='1'; loader.style.visibility='visible'; |
| document.getElementById('loader-text').textContent = 'AUTENTIFICARE'; |
| await delay(300); |
| |
| try { |
| if (role === 'elev') { |
| const id = document.getElementById('elev-id').value; |
| const pin = document.getElementById('elev-pin').value; |
| if (!id) { showError('err-msg','err-002'); return; } |
| if (pin.length<6) { showError('err-msg','err-022'); return; } |
| const snap = await window._getDoc(window._doc(window._db,'elevi',id)); |
| if (!snap.exists()) { showError('err-msg','err-002'); return; } |
| const data = snap.data(); |
| if (data.pin == null) { showError('err-msg','err-004'); return; } |
| if (data.pin !== pin) { |
| showError('err-msg','err-003'); |
| fetch('/api/log',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({tip:'err_pass',vpass:data.vpassId||id,role:'elev'})}).catch(()=>{}); |
| return; |
| } |
| sessionStorage.setItem('vs_role','elev'); |
| sessionStorage.setItem('vs_uid', id); |
| sessionStorage.setItem('vs_name', data.nume); |
| sessionStorage.setItem('vs_vpass',data.vpassId||id); |
| fetch('/api/log',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({tip:'login',vpass:data.vpassId||id,name:data.nume,role:'elev'})}).catch(()=>{}); |
| document.getElementById('loader-text').textContent='ACCES ACORDAT'; |
| await delay(400); |
| window.location.href='elev-dashboard.html'; |
| |
| } else if (role === 'profesor') { |
| const id = document.getElementById('prof-id').value; |
| const pin = document.getElementById('prof-pin').value; |
| if (!id) { showError('err-msg','err-002'); return; } |
| if (pin.length<6) { showError('err-msg','err-022'); return; } |
| const snap = await window._getDoc(window._doc(window._db,'profesori',id)); |
| if (!snap.exists() || snap.data().pin !== pin) { |
| showError('err-msg','err-003'); |
| fetch('/api/log',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({tip:'err_pass',vpass:id,role:'profesor'})}).catch(()=>{}); |
| return; |
| } |
| sessionStorage.setItem('vs_role','profesor'); |
| sessionStorage.setItem('vs_uid', id); |
| sessionStorage.setItem('vs_name', snap.data().nume); |
| sessionStorage.setItem('vs_materie',snap.data().materie||''); |
| fetch('/api/log',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({tip:'login',vpass:id,name:snap.data().nume,role:'profesor'})}).catch(()=>{}); |
| document.getElementById('loader-text').textContent='ACCES ACORDAT'; |
| await delay(400); |
| if(localStorage.getItem('sge_maintenance')==='1'){window.location.href='503.html';} |
| else{window.location.href='profesor-dashboard.html';} |
| |
| } else { |
| if (document.getElementById('admin-pass').value !== ADMIN_PASS) { |
| showError('err-msg','err-020'); return; |
| } |
| sessionStorage.setItem('vs_role','admin'); |
| document.getElementById('loader-text').textContent='ACCES ACORDAT'; |
| await delay(400); |
| window.location.href='admin-dashboard.html'; |
| } |
| } catch(e) { |
| showError('err-msg','err-001'); |
| } finally { |
| loader.classList.add('hide'); |
| } |
| } |
| |
| document.addEventListener('keydown', e => { if (e.key==='Enter') doLogin(); }); |
| function delay(ms) { return new Promise(r=>setTimeout(r,ms)); } |
| </script> |
|
|
| <a href="vhelp.html" class="vhelp-fab" title="VHelp"> |
| <svg viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,0.9)" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> |
| <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/> |
| <circle cx="9" cy="10" r="0.5" fill="rgba(255,255,255,0.9)"/> |
| <circle cx="12" cy="10" r="0.5" fill="rgba(255,255,255,0.9)"/> |
| <circle cx="15" cy="10" r="0.5" fill="rgba(255,255,255,0.9)"/> |
| </svg> |
| </a> |
| </body> |
| </html> |
|
|
