# selobanvill/hci-test-1 architecture

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

- Interactive diagram: https://gitdiagram.com/selobanvill/hci-test-1
- Repository: https://github.com/selobanvill/hci-test-1

## Overview

Glitchwayve is a student-facing campus dashboard for Interweave and Glitch Tower. A signed-in student uses its navigation and quick access to view building-specific services and records, search for services, rooms, or offices, and start actions such as bookings or appointments. The dashboard also presents recent activity and announcements. The README describes the page, styling, and application logic; the sampled script confirms Supabase-backed queries and record updates. The single-file logic excerpt is partial, so links for unsampled features are limited to README evidence.

Main entry points: [`script.js`](https://github.com/selobanvill/hci-test-1/blob/main/script.js) (Dashboard and navigation), [`index.html`](https://github.com/selobanvill/hci-test-1/blob/main/index.html) (Page structure), [`style.css`](https://github.com/selobanvill/hci-test-1/blob/main/style.css) (Themes and responsive layout)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_presentation["Dashboard presentation"]
  node_page["Page structure<br/>[index.html]"]
  node_visuals["Themes and responsive layout<br/>[style.css]"]
end

subgraph group_experience["Student experience"]
  node_dashboard["Dashboard and navigation<br/>[script.js]"]
  node_service_discovery["Service discovery and search<br/>[script.js]"]
  node_student_records["Requests and activity<br/>[script.js]"]
  node_campus_actions["Bookings and appointments<br/>[script.js]"]
  node_announcements["Announcements<br/>[script.js]"]
end

subgraph group_data["Application data"]
  node_supabase[("Supabase data service")]
end

node_student(("Signed-in student"))

node_student -->|"uses"| node_page
node_page -->|"hosts"| node_dashboard
node_page -->|"styled by"| node_visuals
node_student -->|"views activity"| node_dashboard
node_student -->|"searches"| node_service_discovery
node_student -->|"starts actions"| node_campus_actions
node_dashboard -->|"shows records"| node_student_records
node_dashboard -->|"shows"| node_announcements
node_service_discovery -->|"queries"| node_supabase
node_student_records -->|"reads and updates"| node_supabase
node_campus_actions -->|"stores records"| node_supabase
node_announcements -->|"queries"| node_supabase

click node_page "https://github.com/selobanvill/hci-test-1/blob/main/index.html"
click node_dashboard "https://github.com/selobanvill/hci-test-1/blob/main/script.js"
click node_visuals "https://github.com/selobanvill/hci-test-1/blob/main/style.css"
click node_service_discovery "https://github.com/selobanvill/hci-test-1/blob/main/script.js"
click node_student_records "https://github.com/selobanvill/hci-test-1/blob/main/script.js"
click node_campus_actions "https://github.com/selobanvill/hci-test-1/blob/main/script.js"
click node_announcements "https://github.com/selobanvill/hci-test-1/blob/main/script.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_page,node_visuals toneBlue
class node_dashboard,node_service_discovery,node_student_records,node_campus_actions,node_announcements toneAmber
class node_supabase toneMint
class node_student toneIndigo
```

## Components

### Dashboard presentation

- [Page structure](https://github.com/selobanvill/hci-test-1/blob/main/index.html): `index.html`
- [Themes and responsive layout](https://github.com/selobanvill/hci-test-1/blob/main/style.css): `style.css`

### Student experience

- [Dashboard and navigation](https://github.com/selobanvill/hci-test-1/blob/main/script.js): `script.js`
- [Service discovery and search](https://github.com/selobanvill/hci-test-1/blob/main/script.js): `script.js`
- [Requests and activity](https://github.com/selobanvill/hci-test-1/blob/main/script.js): `script.js`
- [Bookings and appointments](https://github.com/selobanvill/hci-test-1/blob/main/script.js): `script.js`
- [Announcements](https://github.com/selobanvill/hci-test-1/blob/main/script.js): `script.js`

### Application data

- **Supabase data service**

### Other components

- **Signed-in student**

## Connections

- Signed-in student → Page structure: uses (evidence: `README.txt`)
- Page structure → Dashboard and navigation: hosts (evidence: `README.txt`)
- Page structure → Themes and responsive layout: styled by (evidence: `README.txt`)
- Signed-in student → Dashboard and navigation: views activity (evidence: `README.txt`)
- Signed-in student → Service discovery and search: searches (evidence: `README.txt`)
- Signed-in student → Bookings and appointments: starts actions (evidence: `README.txt`)
- Dashboard and navigation → Requests and activity: shows records (evidence: `README.txt`)
- Dashboard and navigation → Announcements: shows (evidence: `script.js`)
- Service discovery and search → Supabase data service: queries (evidence: `script.js`)
- Requests and activity → Supabase data service: reads and updates (evidence: `script.js`)
- Bookings and appointments → Supabase data service: stores records (evidence: `README.txt`)
- Announcements → Supabase data service: queries (evidence: `script.js`)