# paulphilippe08/agrisn architecture

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

- Interactive diagram: https://gitdiagram.com/paulphilippe08/agrisn
- Repository: https://github.com/paulphilippe08/agrisn

## Overview

AgriSn appears to be a static program-information and youth-application website. Visitors browse the page, submit an application, or ask the built-in FAQ chatbot questions. The sampled JavaScript supports navigation and visual effects, application validation and submission, and rule-based chatbot replies; source excerpts are incomplete, so uncertain HTML wiring and omitted behavior are not represented.

Main entry points: [`script.js`](https://github.com/paulphilippe08/agrisn/blob/main/script.js) (Application submission), [`index.html`](https://github.com/paulphilippe08/agrisn/blob/main/index.html) (Application form)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Program website"]
  node_page["Program page<br/>[index.html]"]
  node_presentation["Page styling<br/>[style.css]"]
  node_site_behavior["Navigation and effects<br/>[script.js]"]
end

subgraph group_apply["Applications"]
  node_application_form["Application form<br/>[index.html]"]
  node_validation["Form validation<br/>[script.js]"]
  node_submission["Application submission<br/>[script.js]"]
  node_formspree{{"Formspree"}}
  node_confirmation["Submission confirmation<br/>[script.js]"]
end

subgraph group_chat["FAQ chatbot"]
  node_chat_interface["Chat interface<br/>[index.html]"]
  node_chat_behavior["Chat interaction<br/>[script.js]"]
  node_faq_responder["FAQ responder<br/>[script.js]"]
end

node_visitor(("Visitor"))

node_visitor -->|"browses"| node_page
node_visitor -->|"fills"| node_application_form
node_application_form -->|"validates"| node_validation
node_validation -->|"enables"| node_submission
node_submission -->|"posts application"| node_formspree
node_formspree -->|"returns response"| node_submission
node_submission -->|"shows success"| node_confirmation
node_visitor -->|"asks questions"| node_chat_interface
node_chat_interface -->|"handles input"| node_chat_behavior
node_chat_behavior -->|"requests reply"| node_faq_responder
node_faq_responder -->|"returns reply"| node_chat_behavior
node_site_behavior -->|"updates interface"| node_page

click node_page "https://github.com/paulphilippe08/agrisn/blob/main/index.html"
click node_presentation "https://github.com/paulphilippe08/agrisn/blob/main/style.css"
click node_site_behavior "https://github.com/paulphilippe08/agrisn/blob/main/script.js"
click node_application_form "https://github.com/paulphilippe08/agrisn/blob/main/index.html"
click node_validation "https://github.com/paulphilippe08/agrisn/blob/main/script.js"
click node_submission "https://github.com/paulphilippe08/agrisn/blob/main/script.js"
click node_confirmation "https://github.com/paulphilippe08/agrisn/blob/main/script.js"
click node_chat_interface "https://github.com/paulphilippe08/agrisn/blob/main/index.html"
click node_chat_behavior "https://github.com/paulphilippe08/agrisn/blob/main/script.js"
click node_faq_responder "https://github.com/paulphilippe08/agrisn/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_presentation,node_site_behavior toneBlue
class node_application_form,node_validation,node_submission,node_formspree,node_confirmation toneAmber
class node_chat_interface,node_chat_behavior,node_faq_responder toneMint
class node_visitor toneIndigo
```

## Components

### Program website

- [Program page](https://github.com/paulphilippe08/agrisn/blob/main/index.html): `index.html`
- [Page styling](https://github.com/paulphilippe08/agrisn/blob/main/style.css): `style.css`
- [Navigation and effects](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`

### Applications

- [Application form](https://github.com/paulphilippe08/agrisn/blob/main/index.html): `index.html`
- [Form validation](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`
- [Application submission](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`
- **Formspree**
- [Submission confirmation](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`

### FAQ chatbot

- [Chat interface](https://github.com/paulphilippe08/agrisn/blob/main/index.html): `index.html`
- [Chat interaction](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`
- [FAQ responder](https://github.com/paulphilippe08/agrisn/blob/main/script.js): `script.js`

### Other components

- **Visitor**

## Connections

- Visitor → Program page: browses
- Visitor → Application form: fills
- Application form → Form validation: validates
- Form validation → Application submission: enables
- Application submission → Formspree: posts application
- Formspree → Application submission: returns response
- Application submission → Submission confirmation: shows success
- Visitor → Chat interface: asks questions
- Chat interface → Chat interaction: handles input
- Chat interaction → FAQ responder: requests reply
- FAQ responder → Chat interaction: returns reply
- Navigation and effects → Program page: updates interface