# akiroussama/absfj architecture

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

- Interactive diagram: https://gitdiagram.com/akiroussama/absfj
- Repository: https://github.com/akiroussama/absfj

## Overview

ABSFJ is a static public website presenting the association, its missions, events and photo archive. Visitors browse the page, explore event and gallery media, and can prepare a membership-request file for manual delivery; the site does not submit or store membership data remotely. The map reflects capabilities and relationships documented in the README. Source excerpts were unavailable, so implementation-level links beyond those documented are omitted.

Main entry points: [`index.html`](https://github.com/akiroussama/absfj/blob/main/index.html) (Association website), [`assets/js/main.js`](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js) (Page interactions), [`assets/css/style.css`](https://github.com/akiroussama/absfj/blob/main/assets/css/style.css) (Visual design), [`assets/js/i18n.js`](https://github.com/akiroussama/absfj/blob/main/assets/js/i18n.js) (Language support)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Site presentation"]
  node_page["Association website<br/>[index.html]"]
  node_styles["Visual design<br/>[style.css]"]
  node_translations["Language support<br/>[i18n.js]"]
  node_missions["Association missions<br/>[index.html]"]
  node_hero["Interactive diorama<br/>[hero-scene.js]"]
end

subgraph group_media["Events and media"]
  node_events["Event listings<br/>[index.html]"]
  node_gallery["Photo archive<br/>[index.html]"]
  node_photos["Event photographs"]
  node_postdata["Facebook post records"]
end

subgraph group_interaction["Visitor interactions"]
  node_app["Page interactions<br/>[main.js]"]
  node_filters["Content filters<br/>[main.js]"]
  node_lightbox["Photo lightbox<br/>[main.js]"]
  node_eventmodal["Event photo modals<br/>[main.js]"]
  node_theme["Theme preference<br/>[main.js]"]
  node_membership["Membership file form<br/>[main.js]"]
end

subgraph group_external["External services"]
  node_browserstorage[("Browser storage")]
  node_download["Visitor device"]
  node_facebook["Facebook page"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_page
node_page -->|"loads"| node_styles
node_page -->|"loads"| node_app
node_page -->|"loads"| node_hero
node_page -->|"loads"| node_translations
node_page -->|"presents"| node_missions
node_page -->|"presents"| node_events
node_page -->|"presents"| node_gallery
node_gallery -->|"shows"| node_photos
node_app -->|"updates"| node_filters
node_app -->|"opens"| node_lightbox
node_app -->|"opens"| node_eventmodal
node_app -->|"controls"| node_theme
node_theme -.->|"persists preference"| node_browserstorage
node_app -->|"handles"| node_membership
node_membership -->|"downloads file"| node_download
node_gallery -.->|"links to"| node_facebook

click node_page "https://github.com/akiroussama/absfj/blob/main/index.html"
click node_styles "https://github.com/akiroussama/absfj/blob/main/assets/css/style.css"
click node_translations "https://github.com/akiroussama/absfj/blob/main/assets/js/i18n.js"
click node_missions "https://github.com/akiroussama/absfj/blob/main/index.html"
click node_hero "https://github.com/akiroussama/absfj/blob/main/assets/js/hero-scene.js"
click node_events "https://github.com/akiroussama/absfj/blob/main/index.html"
click node_gallery "https://github.com/akiroussama/absfj/blob/main/index.html"
click node_photos "https://github.com/akiroussama/absfj/tree/main/assets/images/events"
click node_postdata "https://github.com/akiroussama/absfj/blob/main/ops/facebook-posts.json"
click node_app "https://github.com/akiroussama/absfj/blob/main/assets/js/main.js"
click node_filters "https://github.com/akiroussama/absfj/blob/main/assets/js/main.js"
click node_lightbox "https://github.com/akiroussama/absfj/blob/main/assets/js/main.js"
click node_eventmodal "https://github.com/akiroussama/absfj/blob/main/assets/js/main.js"
click node_theme "https://github.com/akiroussama/absfj/blob/main/assets/js/main.js"
click node_membership "https://github.com/akiroussama/absfj/blob/main/assets/js/main.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_styles,node_translations,node_missions,node_hero toneBlue
class node_events,node_gallery,node_photos,node_postdata toneAmber
class node_app,node_filters,node_lightbox,node_eventmodal,node_theme,node_membership toneMint
class node_browserstorage,node_download,node_facebook toneRose
class node_visitor toneIndigo
```

## Components

### Site presentation

- [Association website](https://github.com/akiroussama/absfj/blob/main/index.html): `index.html`
- [Visual design](https://github.com/akiroussama/absfj/blob/main/assets/css/style.css): `assets/css/style.css`
- [Language support](https://github.com/akiroussama/absfj/blob/main/assets/js/i18n.js): `assets/js/i18n.js`
- [Association missions](https://github.com/akiroussama/absfj/blob/main/index.html): `index.html`
- [Interactive diorama](https://github.com/akiroussama/absfj/blob/main/assets/js/hero-scene.js): `assets/js/hero-scene.js`

### Events and media

- [Event listings](https://github.com/akiroussama/absfj/blob/main/index.html): `index.html`
- [Photo archive](https://github.com/akiroussama/absfj/blob/main/index.html): `index.html`
- [Event photographs](https://github.com/akiroussama/absfj/tree/main/assets/images/events): `assets/images/events`
- [Facebook post records](https://github.com/akiroussama/absfj/blob/main/ops/facebook-posts.json): `ops/facebook-posts.json`

### Visitor interactions

- [Page interactions](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`
- [Content filters](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`
- [Photo lightbox](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`
- [Event photo modals](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`
- [Theme preference](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`
- [Membership file form](https://github.com/akiroussama/absfj/blob/main/assets/js/main.js): `assets/js/main.js`

### External services

- **Browser storage**
- **Visitor device**
- **Facebook page**

### Other components

- **Visitor**

## Connections

- Visitor → Association website: opens
- Association website → Visual design: loads
- Association website → Page interactions: loads
- Association website → Interactive diorama: loads
- Association website → Language support: loads
- Association website → Association missions: presents
- Association website → Event listings: presents
- Association website → Photo archive: presents
- Photo archive → Event photographs: shows
- Page interactions → Content filters: updates
- Page interactions → Photo lightbox: opens
- Page interactions → Event photo modals: opens
- Page interactions → Theme preference: controls
- Theme preference → Browser storage: persists preference
- Page interactions → Membership file form: handles
- Membership file form → Visitor device: downloads file
- Photo archive → Facebook page: links to