---
title: AttendAI Pro
emoji: 🛡️
colorFrom: blue
colorTo: indigo
sdk: docker
pinned: false
---


# 🎓 AttendAI Pro — Smart AI-Based Anti-Proxy Attendance System

**Version:** 2.0.0 | **Production-Ready** | **Zero Demo Data Policy**

> A fully production-ready, AI-powered, anti-proxy attendance platform for colleges, universities, and organizations worldwide. Every data point is real — no mock data, no placeholder content.

---

## 🌐 Live Entry Points

| Portal | URL | Description |
|--------|-----|-------------|
| **Landing Page** | `index.html` | Role selection & marketing page |
| **Student Login** | `student-login.html` | Google OAuth for students |
| **Teacher Login** | `teacher-login.html` | Google OAuth for faculty |
| **Admin Panel** | `admin-panel.html` | Full system control |
| **Student Dashboard** | `student-dashboard.html` | After student login |
| **Teacher Dashboard** | `teacher-dashboard.html` | After teacher login |

---

## ✅ Completed Features

### Authentication
- [x] **Google OAuth 2.0 only** — No email/password login exists
- [x] **Role-based access control** — Student, Teacher, Admin roles strictly enforced
- [x] **Pre-registration required** — System never auto-creates users
- [x] **Unauthorized email rejection** — Clear denial message with email shown
- [x] **JWT session management** — 8-hour session timeout
- [x] **Audit logging** — Every login attempt logged with timestamp

### Student Portal
- [x] Mobile-first, minimal dashboard
- [x] QR code scanner (camera-based + manual code entry)
- [x] 4-step attendance flow: QR → Roll Number → Face + GPS → Confirmation
- [x] Roll number cross-validation against database profile
- [x] Live selfie capture for face verification
- [x] Real-time GPS location capture
- [x] Geofence validation (configurable radius, default 100m)
- [x] Duplicate attendance prevention
- [x] Attendance history with filter (all/month/week)
- [x] Attendance trend chart (Chart.js)
- [x] Below-75% attendance warning
- [x] Fraud alert notifications

### Teacher Dashboard
- [x] Sidebar navigation with all sections
- [x] **QR Session Management** — Create, rotate (60s), end sessions
- [x] Auto-rotating QR codes every 60 seconds
- [x] Geofence configuration with GPS capture
- [x] **Live Overview** — Real-time stats: Present, Absent, Total, %
- [x] Roll-wise attendance grid (color-coded: green/red/yellow)
- [x] Live activity feed (updates every 15s)
- [x] Present/Absent split view
- [x] Full attendance table with GPS, face score, fraud flags
- [x] Fraud alerts with resolve functionality
- [x] Student roster view
- [x] Analytics: session charts, status distribution, at-risk students
- [x] Report generation (preview + CSV export + print)
- [x] Session history table

### Admin / Developer Panel
- [x] Secure admin-only auth wall (Google OAuth)
- [x] **User Management** — Add, enable/disable, delete users
- [x] Role assignment (student/teacher/admin)
- [x] User search and filter by role
- [x] CSV user export
- [x] Session monitoring with force-end capability
- [x] Full attendance records with multi-filter
- [x] Bulk CSV attendance export
- [x] Fraud Detection Center with resolve
- [x] **Audit Logs** — Every action logged with user, action, status
- [x] System Configuration (QR interval, geofence, thresholds, OAuth)
- [x] Global Analytics (daily trend, user distribution, fraud summary)
- [x] Live session monitor

### AI Fraud Detection
- [x] Device fingerprinting (detects same-device multi-submission)
- [x] GPS validation (geofence breach = fraud flag)
- [x] QR token expiry enforcement (60-second rotation)
- [x] Duplicate attendance blocking
- [x] Fraud alert creation and teacher notification
- [x] Roll number vs. login email cross-validation
- [x] Behavioral pattern logging
- [x] At-risk student prediction (below 75% threshold)

### Security
- [x] No passwords in the system (Google OAuth only)
- [x] Backend token verification flow
- [x] Session expiry (8 hours)
- [x] Role isolation (student can't access teacher routes)
- [x] All sensitive actions logged
- [x] CORS-safe client-side architecture
- [x] Zero demo/mock data policy enforced

---

## 🏗️ Architecture

```
Frontend (Static SPA)
├── index.html              — Landing & role selection
├── student-login.html      — Student Google OAuth
├── teacher-login.html      — Teacher Google OAuth
├── admin-panel.html        — Admin Google OAuth + full control
├── student-dashboard.html  — Mobile-first student interface
├── teacher-dashboard.html  — Teacher real-time control center
│
├── css/
│   ├── main.css            — Complete design system
│   ├── landing.css         — Landing page styles
│   ├── auth.css            — Auth page styles
│   ├── student.css         — Student dashboard styles
│   ├── teacher.css         — Teacher dashboard styles
│   └── admin.css           — Admin panel styles
│
└── js/
    └── config.js           — App config, API helper, Auth state, Utils

Database (Table API)
├── users                   — All registered users (students, teachers, admins)
├── sessions                — Attendance sessions with QR tokens
├── attendance              — All attendance records with verification data
├── fraud_alerts            — AI-detected fraud events
└── system_logs             — Full audit trail
```

---

## 🗄️ Data Models

### Users Table
| Field | Type | Description |
|-------|------|-------------|
| id | text | UUID |
| email | text | Google account email |
| name | text | Full name |
| role | text | student/teacher/admin |
| roll_number | text | Student roll number |
| department | text | Department |
| institution | text | Institution name |
| is_active | bool | Account status |
| face_data | text | Face descriptor (JSON) |
| last_login | datetime | Last login timestamp |

### Sessions Table
| Field | Type | Description |
|-------|------|-------------|
| id | text | UUID |
| teacher_id | text | Teacher user ID |
| subject | text | Subject name |
| qr_code | text | Current 8-char rotating token |
| qr_expires_at | datetime | QR expiry (60s rotation) |
| geofence_lat/lng | number | Classroom GPS coordinates |
| geofence_radius | number | Allowed radius in meters |
| is_active | bool | Session status |

### Attendance Table
| Field | Type | Description |
|-------|------|-------------|
| id | text | UUID |
| session_id | text | Related session |
| student_id | text | Student user ID |
| roll_number | text | Verified roll number |
| status | text | present/absent/late/fraudulent |
| marked_at | datetime | Exact timestamp |
| gps_lat/lng | number | Student GPS at marking time |
| face_match_score | number | AI confidence 0-1 |
| device_fingerprint | text | Browser/device hash |
| fraud_flags | array | List of detected issues |
| verified | bool | Final verification status |

---

## 🚀 Setup Instructions

### 1. Configure Google OAuth

1. Go to [Google Cloud Console](https://console.cloud.google.com/)
2. Create a project → Enable "Google Identity Services"
3. Create OAuth 2.0 Client ID (Web Application)
4. Add your domain to authorized origins
5. Copy the Client ID and paste in `js/config.js`:

```javascript
const APP_CONFIG = {
  googleClientId: 'YOUR_REAL_CLIENT_ID.apps.googleusercontent.com',
  // ...
};
```

### 2. Add First Admin User

Use the Table API or Admin Panel to insert the first admin:

```json
{
  "id": "admin-001",
  "email": "admin@yourinstitution.com",
  "name": "System Administrator",
  "role": "admin",
  "is_active": true
}
```

### 3. Add Teachers & Students

Through the Admin Panel → User Management → Add User

Students **must** have:
- Valid institutional email matching their Google account
- Unique roll number
- Active status

### 4. Deploy

Use the **Publish tab** to deploy your project publicly with one click.

---

## 🔒 Security Notes

- **Never share admin credentials** — all logins are via Google OAuth
- **QR codes expire in 60 seconds** — screenshot sharing is impossible
- **GPS geofencing** prevents remote attendance marking
- **All actions are audit-logged** — full accountability
- **Device fingerprinting** prevents multi-device fraud
- **No demo data** — system only shows real entries from real users

---

## 📋 Next Steps / Recommended Enhancements

- [ ] Integrate real face-api.js facial recognition with stored face descriptors
- [ ] Add Firebase/WebSocket for true real-time push updates
- [ ] Email notifications for fraud alerts and low attendance
- [ ] Mobile app (React Native) for native QR scanning
- [ ] Batch student import via CSV upload
- [ ] Multi-institution / multi-tenant support
- [ ] Advanced ML model for behavioral fraud detection
- [ ] Push notifications via Web Push API
- [ ] Automated attendance reports via email schedule
- [ ] Integration with LMS systems (Moodle, Canvas)

---

## 🛠️ Technology Stack

| Layer | Technology |
|-------|-----------|
| Frontend | Vanilla JS (React-compatible architecture) |
| Styling | Custom CSS Design System |
| Charts | Chart.js 4.x |
| QR Generation | qrcode.js |
| QR Scanning | html5-qrcode |
| Face Detection | face-api.js |
| Authentication | Google Identity Services (OAuth 2.0) |
| Database | RESTful Table API |
| GPS | Browser Geolocation API |
| Security | JWT sessions, device fingerprinting |

---

*AttendAI Pro — Built for real-world production. Zero tolerance for proxy attendance.*