# amarnasir632-bit/dsacms-frontend architecture

> Architecture diagram of the GitHub repository amarnasir632-bit/dsacms-frontend, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/amarnasir632-bit/dsacms-frontend
- Repository: https://github.com/amarnasir632-bit/dsacms-frontend

## Overview

DSACMS is an Arabic public library and content-management site for audio lectures, articles, and PDF books. Visitors browse or search the library, open material details, read or play content, and download or share it. Administrators manage materials, categories, and lecture schedules; the Sheikh role also manages questions and answers. Cloudflare Worker endpoints provide the API and use D1 for persistent data. The frontend module relationships are only partly evidenced in the supplied excerpts, so edges are limited to documented interactions and visible Worker behavior.

Main entry points: [`assets/js/core/api.js`](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/core/api.js) (API client), [`_worker.js`](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/_worker.js) (Worker API), [`assets/js/pages/detail.js`](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/detail.js) (Detail rendering), [`pages/dashboard.html`](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/dashboard.html) (Admin dashboard)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_public["Public library"]
  node_home["Home<br/>[index.html]"]
  node_search["Search and browse<br/>[search.html]"]
  node_detail["Material detail"]
  node_lectures["Lecture schedule<br/>[lectures.html]"]
  node_questions["Questions and answers<br/>[questions.html]"]
  node_about["Sheikh profile<br/>[about.html]"]
end

subgraph group_frontend["Browser interface"]
  node_home_view["Home rendering<br/>[home.js]"]
  node_search_view["Search rendering<br/>[search.js]"]
  node_detail_view["Detail rendering<br/>[detail.js]"]
  node_lecture_view["Schedule rendering<br/>[lectures.js]"]
  node_api_client["API client<br/>[api.js]"]
  node_dashboard["Admin dashboard<br/>[dashboard.html]"]
  node_login["Login page<br/>[login.html]"]
end

subgraph group_backend["API and management"]
  node_worker_api["Worker API<br/>[_worker.js]"]
  node_d1[("D1 database")]
end

subgraph group_content["Content services"]
  node_download["Download proxy<br/>[download.mjs]"]
  node_media_store[("Media links and storage")]
end

subgraph group_discovery["Site discovery"]
  node_sitemap["Dynamic sitemap<br/>[sitemap.js]"]
end

node_visitor(("Visitor"))
node_admin(("Administrator"))
node_sheikh(("Sheikh"))

node_visitor -->|"opens"| node_home
node_visitor -->|"searches"| node_search
node_visitor -->|"views"| node_detail
node_visitor -->|"views"| node_lectures
node_visitor -->|"submits questions"| node_questions
node_visitor -->|"reads profile"| node_about
node_admin -->|"manages content"| node_dashboard
node_sheikh -->|"manages questions"| node_dashboard
node_home -.->|"renders via"| node_home_view
node_search -.->|"renders via"| node_search_view
node_detail -.->|"renders via"| node_detail_view
node_lectures -.->|"renders via"| node_lecture_view
node_home_view -.->|"loads materials"| node_api_client
node_search_view -.->|"requests results"| node_api_client
node_detail_view -.->|"loads material"| node_api_client
node_lecture_view -.->|"loads schedule"| node_api_client
node_dashboard -.->|"manages records"| node_api_client
node_login -.->|"authenticates"| node_api_client
node_api_client -.->|"calls API"| node_worker_api
node_worker_api -->|"reads and writes"| node_d1
node_worker_api -->|"serves media"| node_media_store
node_detail_view -->|"downloads files"| node_download
node_sitemap -->|"fetches materials"| node_worker_api

click node_home "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/index.html"
click node_search "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/search.html"
click node_detail "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/content-detail.html"
click node_lectures "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/lectures.html"
click node_questions "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/questions.html"
click node_about "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/about.html"
click node_home_view "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/home.js"
click node_search_view "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/search.js"
click node_detail_view "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/detail.js"
click node_lecture_view "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/lectures.js"
click node_api_client "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/core/api.js"
click node_dashboard "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/dashboard.html"
click node_login "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/login.html"
click node_worker_api "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/_worker.js"
click node_download "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/api/download.mjs"
click node_sitemap "https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/functions/api/sitemap.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_home,node_search,node_detail,node_lectures,node_questions,node_about toneBlue
class node_home_view,node_search_view,node_detail_view,node_lecture_view,node_api_client,node_dashboard,node_login toneAmber
class node_worker_api,node_d1 toneMint
class node_download,node_media_store toneRose
class node_sitemap,node_visitor,node_admin,node_sheikh toneIndigo
```

## Components

### Public library

- [Home](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/index.html): `index.html`
- [Search and browse](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/search.html): `pages/search.html`
- [Material detail](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/content-detail.html): `pages/content-detail.html`
- [Lecture schedule](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/lectures.html): `pages/lectures.html`
- [Questions and answers](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/questions.html): `pages/questions.html`
- [Sheikh profile](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/about.html): `pages/about.html`

### Browser interface

- [Home rendering](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/home.js): `assets/js/pages/home.js`
- [Search rendering](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/search.js): `assets/js/pages/search.js`
- [Detail rendering](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/detail.js): `assets/js/pages/detail.js`
- [Schedule rendering](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/pages/lectures.js): `assets/js/pages/lectures.js`
- [API client](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/assets/js/core/api.js): `assets/js/core/api.js`
- [Admin dashboard](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/dashboard.html): `pages/dashboard.html`
- [Login page](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/pages/login.html): `pages/login.html`

### API and management

- [Worker API](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/_worker.js): `_worker.js`
- **D1 database**

### Content services

- [Download proxy](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/api/download.mjs): `api/download.mjs`
- **Media links and storage**

### Site discovery

- [Dynamic sitemap](https://github.com/amarnasir632-bit/dsacms-frontend/blob/main/functions/api/sitemap.js): `functions/api/sitemap.js`

### Other components

- **Visitor**
- **Administrator**
- **Sheikh**

## Connections

- Visitor → Home: opens (evidence: `README.md`)
- Visitor → Search and browse: searches (evidence: `README.md`)
- Visitor → Material detail: views (evidence: `README.md`)
- Visitor → Lecture schedule: views (evidence: `README.md`)
- Visitor → Questions and answers: submits questions (evidence: `README.md`)
- Visitor → Sheikh profile: reads profile (evidence: `README.md`)
- Administrator → Admin dashboard: manages content (evidence: `README.md`)
- Sheikh → Admin dashboard: manages questions (evidence: `README.md`)
- Home → Home rendering: renders via
- Search and browse → Search rendering: renders via
- Material detail → Detail rendering: renders via
- Lecture schedule → Schedule rendering: renders via
- Home rendering → API client: loads materials
- Search rendering → API client: requests results
- Detail rendering → API client: loads material
- Schedule rendering → API client: loads schedule
- Admin dashboard → API client: manages records
- Login page → API client: authenticates
- API client → Worker API: calls API
- Worker API → D1 database: reads and writes (evidence: `_worker.js`)
- Worker API → Media links and storage: serves media (evidence: `_worker.js`)
- Detail rendering → Download proxy: downloads files (evidence: `README.md`)
- Dynamic sitemap → Worker API: fetches materials (evidence: `functions/api/sitemap.js`)