# redjanvisitacion/elecom_web architecture

> Architecture diagram of the GitHub repository redjanvisitacion/elecom_web, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-29). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/redjanvisitacion/elecom_web
- Repository: https://github.com/redjanvisitacion/elecom_web

## Overview

ELECOM is a web-based election administration and student voting system. Students sign in, access an election, review candidates, submit a ballot, and view voting status or results; administrators manage election configuration, candidates, voters, networks, reports, and backups. The Django URL table maps these capabilities into a central views layer, with frontend scripts issuing API requests. Face verification and image hosting are external integrations. The README and sampled backend views are sparse, so internal service-to-model wiring beyond explicit routes and client requests is not shown.

Main entry points: [`backend/core/urls.py`](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/urls.py) (HTTP routes), [`backend/core/views.py`](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/views.py) (Request handlers), [`frontend/org_elecom/elecom_components/elecom_js/elecom_login.js`](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_components/elecom_js/elecom_login.js) (Login and recovery), [`frontend/org_elecom/elecom_user/user_components/user_js/user_dashboard.js`](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_dashboard.js) (Student dashboard)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web clients"]
  node_login_ui["Login and recovery<br/>[elecom_login.js]"]
  node_student_home["Student dashboard<br/>[user_dashboard.js]"]
  node_voting_ui["Ballot and vote<br/>[user_election.js]"]
  node_admin_ui["Admin tools"]
  node_candidate_search["Candidate search<br/>[search_results.js]"]
  node_results_ui["Student results<br/>[user_results.js]"]
  node_backup_ui["Backup and restore"]
  node_network_ui["Network authorization"]
end

subgraph group_backend["Django application"]
  node_url_map["HTTP routes<br/>[urls.py]"]
  node_views["Request handlers<br/>[views.py]"]
  node_face_service["Face verification service<br/>[facepp_service.py]"]
  node_uploads["Image upload service"]
end

subgraph group_data["Election data"]
  node_auth_models["Account records<br/>[models.py]"]
  node_voting_models["Election records<br/>[models.py]"]
  node_database[("Relational database")]
end

subgraph group_integrations["External integrations"]
  node_facepp["Face++ API"]
  node_cloudinary["Cloudinary"]
end

node_student(("Student"))
node_admin(("Administrator"))

node_student -->|"signs in"| node_login_ui
node_admin -->|"signs in"| node_login_ui
node_login_ui -->|"requests auth"| node_url_map
node_student -->|"opens dashboard"| node_student_home
node_student_home -->|"requests pages"| node_url_map
node_student -->|"casts ballot"| node_voting_ui
node_voting_ui -->|"requests ballot"| node_url_map
node_student -->|"views results"| node_results_ui
node_results_ui -->|"requests results"| node_url_map
node_admin -->|"manages elections"| node_admin_ui
node_admin_ui -->|"requests admin APIs"| node_url_map
node_admin -->|"searches candidates"| node_candidate_search
node_candidate_search -->|"requests candidates"| node_url_map
node_admin -->|"manages backups"| node_backup_ui
node_backup_ui -->|"requests backups"| node_url_map
node_admin -->|"manages networks"| node_network_ui
node_network_ui -->|"requests network APIs"| node_url_map
node_url_map -->|"dispatches requests"| node_views
node_views -->|"accesses accounts"| node_auth_models
node_views -->|"accesses elections"| node_voting_models
node_auth_models -->|"persists records"| node_database
node_voting_models -->|"persists records"| node_database
node_views -->|"requests verification"| node_face_service
node_face_service -.->|"calls API"| node_facepp
node_views -->|"requests uploads"| node_uploads
node_uploads -.->|"stores media"| node_cloudinary

click node_login_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_components/elecom_js/elecom_login.js"
click node_student_home "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_dashboard.js"
click node_voting_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_election.js"
click node_admin_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_elections.js"
click node_candidate_search "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/search_results.js"
click node_url_map "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/urls.py"
click node_views "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/views.py"
click node_face_service "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/facepp_service.py"
click node_uploads "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/cloudinary_upload.py"
click node_auth_models "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/elecom_auth/models.py"
click node_voting_models "https://github.com/redjanvisitacion/elecom_web/blob/main/backend/elecom_voting/models.py"
click node_results_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_results.js"
click node_backup_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_backup_restore.js"
click node_network_ui "https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/admin_network_authorize.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_login_ui,node_student_home,node_voting_ui,node_admin_ui,node_candidate_search,node_results_ui,node_backup_ui,node_network_ui toneBlue
class node_url_map,node_views,node_face_service,node_uploads toneAmber
class node_auth_models,node_voting_models,node_database toneMint
class node_facepp,node_cloudinary toneRose
class node_student,node_admin toneIndigo
```

## Components

### Web clients

- [Login and recovery](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_components/elecom_js/elecom_login.js): `frontend/org_elecom/elecom_components/elecom_js/elecom_login.js`
- [Student dashboard](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_dashboard.js): `frontend/org_elecom/elecom_user/user_components/user_js/user_dashboard.js`
- [Ballot and vote](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_election.js): `frontend/org_elecom/elecom_user/user_components/user_js/user_election.js`
- [Admin tools](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_elections.js): `frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_elections.js`
- [Candidate search](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/search_results.js): `frontend/org_elecom/elecom_admin/admin_components/admin_js/search_results.js`
- [Student results](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_user/user_components/user_js/user_results.js): `frontend/org_elecom/elecom_user/user_components/user_js/user_results.js`
- [Backup and restore](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_backup_restore.js): `frontend/org_elecom/elecom_admin/admin_components/admin_js/elecom_backup_restore.js`
- [Network authorization](https://github.com/redjanvisitacion/elecom_web/blob/main/frontend/org_elecom/elecom_admin/admin_components/admin_js/admin_network_authorize.js): `frontend/org_elecom/elecom_admin/admin_components/admin_js/admin_network_authorize.js`

### Django application

- [HTTP routes](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/urls.py): `backend/core/urls.py`
- [Request handlers](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/views.py): `backend/core/views.py`
- [Face verification service](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/facepp_service.py): `backend/core/facepp_service.py`
- [Image upload service](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/core/cloudinary_upload.py): `backend/core/cloudinary_upload.py`

### Election data

- [Account records](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/elecom_auth/models.py): `backend/elecom_auth/models.py`
- [Election records](https://github.com/redjanvisitacion/elecom_web/blob/main/backend/elecom_voting/models.py): `backend/elecom_voting/models.py`
- **Relational database**

### External integrations

- **Face++ API**
- **Cloudinary**

### Other components

- **Student**
- **Administrator**

## Connections

- Student → Login and recovery: signs in
- Administrator → Login and recovery: signs in
- Login and recovery → HTTP routes: requests auth
- Student → Student dashboard: opens dashboard
- Student dashboard → HTTP routes: requests pages
- Student → Ballot and vote: casts ballot
- Ballot and vote → HTTP routes: requests ballot
- Student → Student results: views results
- Student results → HTTP routes: requests results
- Administrator → Admin tools: manages elections
- Admin tools → HTTP routes: requests admin APIs
- Administrator → Candidate search: searches candidates
- Candidate search → HTTP routes: requests candidates
- Administrator → Backup and restore: manages backups
- Backup and restore → HTTP routes: requests backups
- Administrator → Network authorization: manages networks
- Network authorization → HTTP routes: requests network APIs
- HTTP routes → Request handlers: dispatches requests
- Request handlers → Account records: accesses accounts
- Request handlers → Election records: accesses elections
- Account records → Relational database: persists records
- Election records → Relational database: persists records
- Request handlers → Face verification service: requests verification
- Face verification service → Face++ API: calls API
- Request handlers → Image upload service: requests uploads
- Image upload service → Cloudinary: stores media