Campus Visitor Logbook and Gate Pass Portal

Campus main gates still run on paper registers: the guard writes a name and phone number, tears off no pass, and nobody knows who is currently inside. During an emergency or an audit, reconstructing the day's visitors from handwriting is hopeless — and exit checks have nothing verifiable to check against. GateLog digitizes the desk end to end. The dashboard answers "who is inside right now" at a glance with footfall, inside-count, expected and overstay tiles plus an hourly chart and purpose breakdown. The log view makes every record searchable and filterable by status. The entry form captures ID proof and vehicle number, mints a pass ID, and renders a printable gate pass with a scan code — closing the loop that paper never could.

1. On load, the seeded log (a realistic day's entries) renders the dashboard: counts are aggregated by status from the records.
2. The hourly chart bins check-in times into hour slots; the purpose table groups and shares them.
3. The log view filters the same records by search text and status dropdown, rendering pass ID, visitor, purpose, times and a status pill per row.
4. Submitting the entry form validates the phone format, mints the next pass ID, stamps the current time, and prepends the record — dashboard counts update immediately.
5. The gate pass template renders with visitor details, validity window and scan code; the Print button uses a print stylesheet showing only the pass.
6. Views switch via URL hash across dashboard, log and entry screens.

Tech stack:

• HTML5, CSS3 (desk-portal theme + print stylesheet)
• Vanilla JavaScript (no frameworks)
• In-memory log store with aggregation functions
• URL-hash navigation (dashboard / log / entry)
• No backend, no dependencies — runs offline

• [Security dashboard] Today's footfall, currently-inside count, expected visits and overstay alerts as live tiles, computed from the log.
• [Hourly footfall chart] Bar visualization of check-ins by hour for the day, plus a visits-by-purpose breakdown table.
• [Currently-inside table] Every visitor who has not checked out, with elapsed time since entry.
• [Searchable visitor log] Text search across name, phone and purpose, plus status filters (Inside / Checked out / Expected).
• [New-entry form] Name, phone, ID type and number, purpose, person-to-meet, vehicle and validity window, with a photo-capture placeholder for the kiosk webcam.
• [Printable gate pass] A dashed-border pass template with all entry details and a scan-at-exit code, using a print stylesheet that hides everything else.
• [Overstay flagging] Visitors inside beyond their pass validity are surfaced as overstays on the dashboard.

• Complete single-file web app (dashboard, log, entry + pass views)
• Documented log-store and aggregation code
• Project report PDF (background, workflow analysis, data model, screenshots)
• PPT presentation for final review
• Viva Q&A preparation document (dashboard design, data model, print CSS, deployment path)
• User guide for running and demonstrating the portal

• Demo build keeps the log in memory; multi-desk sync and overnight persistence need the backend (listed as future scope).
• The scan code on the pass is illustrative — QR scanning at exit is future scope, not implemented.
• Photo capture is a placeholder panel; wiring a real webcam feed needs the kiosk hardware.
• ID numbers are logged as last-4-digits in the demo; a production build needs proper PII handling policy.