# MMS43 - Maison de la Mobilité Solidaire Haute-Loire

This repository contains the website for **MMS43** (Maison de la Mobilité Solidaire Haute-Loire), a solidarity mobility service in the Haute-Loire department of France.

## About MMS43

MMS43 is an organization that provides accessible mobility solutions for people who face transportation challenges. The platform offers a range of services to help individuals gain or maintain their mobility independence.

### Mobility Solutions

- **Transport Solidaire** - Solidarity transport services
- **Accompagnement Mobilité** - Mobility coaching and support
- **Location de Véhicules** - Vehicle rental services
- **Garage Solidaire** - Solidarity garage (affordable vehicle maintenance)
- **Auto-école Solidaire** - Solidarity driving school
- **Vélo-école** - Bicycle training school

## Technology Stack

- **Static Site Generator**: [Hugo](https://gohugo.io/)
- **Theme**: Custom theme (`mms43`)
- **Styling**: CSS with CSS variables for theming
- **Font**: Quicksand (Google Fonts)

## Project Structure

```
mms43/
├── content/           # Page content (Markdown files)
│   └── pages/         # Site pages
├── themes/mms43/      # Custom Hugo theme
│   ├── assets/        # CSS, images, videos
│   ├── layouts/       # Hugo templates
│   └── static/        # Static files
└── hugo.yaml          # Hugo configuration
```

## Features

- Responsive design (desktop, tablet, mobile)
- Dynamic contact forms with configurable fields
- Video integration
- Partner logos showcase
- Accessible navigation with mobile menu

## Development

### Prerequisites

- Hugo (extended version recommended)

### Running locally

```bash
hugo server -D
```

### Building for production

```bash
hugo --minify
```

## PARCOURSMOB Integration

This website is designed to be served by **PARCOURSMOB**, COOPGO's inclusive mobility platform. PARCOURSMOB acts as a reverse proxy that serves Hugo static files and dynamically hydrates journey search data.

### Architecture

```
┌─────────────┐     ┌──────────────┐     ┌─────────────┐
│   Browser   │────▶│  PARCOURSMOB │────▶│  Hugo Build │
│             │◀────│   (Go app)   │◀────│  (static)   │
└─────────────┘     └──────────────┘     └─────────────┘
                           │
                           ▼
                    ┌──────────────┐
                    │   APIs       │
                    │ - Transit    │
                    │ - Carpool    │
                    │ - Vehicles   │
                    │ - Knowledge  │
                    └──────────────┘
```

### Data Hydration

PARCOURSMOB injects search data into the page via the global variable `window.__PARCOURSMOB_DATA__`. This variable contains:

```javascript
window.__PARCOURSMOB_DATA__ = {
  searched: true,                    // Search was performed
  departure: { /* GeoJSON Feature */ },
  destination: { /* GeoJSON Feature */ },
  departure_date: "2024-01-15",
  departure_time: "08:30",
  results: {
    public_transit: {
      number: 3,
      results: [ /* OTP itineraries */ ]
    },
    carpools: {
      number: 2,
      results: [ /* RDEX/OCSS carpools */ ]
    },
    solidarity_drivers: {
      number: 5
    },
    organized_carpools: {
      number: 2
    },
    vehicles: {
      number: 3,
      results: [ /* Available vehicles */ ]
    },
    local_solutions: {
      number: 4,
      results: [ /* Knowledge base solutions */ ]
    }
  }
};
```

### Dynamic Pages

#### Search Page (`/recherche/`)

The search form sends the following parameters:
- `departure`: GeoJSON Feature of departure address (JSON stringified)
- `destination`: GeoJSON Feature of arrival address (JSON stringified)
- `departuredate`: Date in `YYYY-MM-DD` format
- `departuretime`: Time in `HH:MM` format

Address autocomplete uses the French government Address API (`api-adresse.data.gouv.fr`).

### Alpine.js Components

The site uses [Alpine.js](https://alpinejs.dev/) for client-side reactivity:

- `searchBlock()`: Search form management with autocomplete
- `rechercheApp()`: Results display and map interaction

### MapLibre Map

The map uses [MapLibre GL JS](https://maplibre.org/) with:
- Self-hosted PMTiles
- Custom markers for departure/arrival
- Journey display (decoded polylines)
- Geographic zones display (local solutions)

### Configuration

CTA (Call-to-Action) texts are configurable in the front matter of `/content/recherche/index.md`:

```yaml
contactCTA:
  transit: "To organize your trip..."
  carpool: "To organize your trip..."
  solidarity: "To organize your trip..."
  vehicles: "For more information..."
  localSolutions: "For more information..."
localSolutionsText: "Mobi'Pouce, on-demand transport..."
```

### Deployment

1. Build the Hugo site: `hugo --minify`
2. Configure PARCOURSMOB to serve the `public/` folder
3. PARCOURSMOB intercepts requests to `/recherche/` and injects data

## License

This project is licensed under the **AGPLv3** (GNU Affero General Public License v3.0).

Brand elements (logos, trademarks, visual identity) are the property of **Maison de la Mobilité Solidaire de Haute-Loire** and are not covered by the open-source license.