website/README.md

# OmégaKube — Site Web

Site vitrine officiel d'OmégaKube — plateforme de création d'expériences Role Play immersives : bots Discord personnalisés, maps Fortnite UEFN, graphisme et consulting.

---

## 🏗️ Architecture

```
website/
├── index.html                        # Page d'accueil
├── .htaccess                         # Config Apache (404, redirections)
├── pages/
│   ├── services.html                 # Nos services
│   ├── realisations.html             # Portfolio complet
│   ├── faq.html                      # Questions fréquentes
│   ├── mentions-legales.html
│   ├── cgv.html
│   └── 404.php                       # Page 404 (CSS/JS inline, fonctionne depuis n'importe quel chemin)
├── components/
│   ├── header.html                   # Navbar (data-include)
│   ├── footer.html                   # Footer + réseaux sociaux (data-include)
│   ├── background.html               # Fond géométrique animé
│   ├── contact.html                  # Formulaire de contact réutilisable
│   └── favicons.html
├── assets/
│   ├── css/
│   │   ├── main.css                  # Styles globaux (thème dark/light, composants)
│   │   ├── 404.css                   # Styles page 404
│   │   └── legal.css                 # Styles pages légales
│   ├── js/
│   │   ├── main.js                   # Script partagé : thème, includes, social links, feather
│   │   ├── home.js                   # Accueil : portfolio, team carousel, partners, easter egg
│   │   └── pages/
│   │       ├── realisations.js       # Portfolio + modal projet + galerie
│   │       ├── services.js           # Onglets services
│   │       ├── services-process.js   # Animation timeline processus
│   │       ├── legal.js              # Pages légales
│   │       └── 404.js                # Easter egg page 404 (Game of Life)
│   ├── data/
│   │   ├── projects.json             # ⭐ Projets (images, stats, tech, social)
│   │   ├── team.json                 # ⭐ Membres de l'équipe
│   │   ├── partners.json             # ⭐ Partenaires
│   │   ├── services.json             # Détail des services
│   │   └── faq.json                  # Questions / réponses FAQ
│   ├── images/
│   │   ├── projects/                 # Images des projets
│   │   │   ├── kuby/                 # imgk-1.png, ...
│   │   │   ├── victorias-vice-1/     # imgvv1-1.jpg, ...
│   │   │   ├── vicy/
│   │   │   ├── site-omega/
│   │   │   └── branding-omega-kube/
│   │   ├── team/                     # Photos membres : {id_discord}.png
│   │   ├── partners/                 # Logos partenaires : {name}.png
│   │   └── favicon/
│   ├── fonts/                        # OmegaLarge, OmegaSmall, Montserrat
│   └── php/
│       └── send_mail.php             # Formulaire de contact (JSON POST)
```

---

## ⚙️ Configuration rapide

### 1. Réseaux sociaux — un seul endroit

Dans `assets/js/main.js`, modifier l'objet `window.OK_SOCIAL` :

```js
window.OK_SOCIAL = {
  discord:   'https://discord.gg/FwvNkvu5dy',
  fortnite:  'https://www.fortnite.com/@omega_kube_team'
  twitter:   'https://x.com/Omegakube',
  instagram: 'https://www.instagram.com/omegakube/',
  youtube:   'https://www.youtube.com/@OmegaKube',
  tiktok:    'https://www.tiktok.com/@omegakube',
  facebook:  '',
  bluesky:   '',
  email:     'contact@omegakube.fr'
};
```

Tous les liens du site (footer, contact, modals) se mettent à jour automatiquement.

---

### 2. Ajouter / modifier un projet

Éditer `assets/data/projects.json` :

```json
{
  "id": 6,
  "category": "bot",           // "bot" | "map" | "graphisme"
  "title": "Nom du projet",
  "desc": "Description complète...",
  "gradient": "linear-gradient(135deg, #5E2040, #8b3a62)",
  "year": "2025",
  "duration": "2 mois",
  "images": "assets/images/projects/nom-du-projet/",
  "files": [
    "trailer.mp4",                           // vidéo locale
    "https://youtube.com/watch?v=VIDEO_ID",  // URL YouTube complète
    "yt:VIDEO_ID",                           // shortcode YouTube
    "img-1.png",
    "img-2.jpg"
  ],
  "features": ["Feature 1", "Feature 2"],
  "tech": [
    { "name": "Python", "icon": "code" }
  ],
  "stats": [
    { "icon": "users", "value": "500+", "label": "Utilisateurs" }
  ],
  "social": {
    "discord": "https://discord.gg/...",
    "twitter": "",
    "instagram": ""
  }
}
```

Déposer les images dans `assets/images/projects/nom-du-projet/`.

---

### 3. Ajouter un membre de l'équipe

Éditer `assets/data/team.json`. Photo optionnelle : `assets/images/team/{id_discord}.png`.

```json
{
  "id": "123456789",           // ID Discord = nom du fichier photo
  "name": "Pseudo",
  "role": "Rôle",
  "avatar": "P",               // Lettre fallback si pas de photo
  "bio": "...",
  "stats": [...],
  "skills": ["Skill 1"],
  "social": {
    "discord": "",
    "twitter": "",
    "github": ""
  }
}
```

---

### 4. Ajouter un partenaire

Éditer `assets/data/partners.json`. Logo optionnel : `assets/images/partners/{name}.png`.

```json
{
  "name": "nom-slug",           // = nom du fichier logo
  "displayName": "Nom Affiché",
  "description": "Courte description",
  "longDesc": "Description complète pour la modal",
  "gradient": "linear-gradient(...)",
  "since": "2025",
  "services": ["Service rendu"],
  "stats": [
    { "icon": "users", "value": "100+", "label": "Membres" }
  ],
  "social": {
    "discord": "",
    "website": "",
    "twitter": ""
  }
}
```

---

### 5. FAQ

Éditer `assets/data/faq.json` — ajouter des catégories ou questions :

```json
{
  "id": "ma-categorie",
  "icon": "help-circle",        // icône Feather Icons
  "title": "Ma catégorie",
  "questions": [
    { "q": "La question ?", "a": "La réponse." }
  ]
}
```

---

## 🌐 Déploiement

- **Serveur** : PHP requis uniquement pour `404.php` et `send_mail.php`
- **Contact** : configurer l'adresse email dans `assets/php/send_mail.php` (`$to`)
- **Apache** : le `.htaccess` gère la 404 et désactive le listing de dossiers
- **Thème** : dark par défaut, toggle persisté en `localStorage`

---

## 🥚 Easter Eggs

- **PC** : taper le Konami Code `↑ ↑ ↓ ↓ ← → ← → B A`
- **Mobile** : 10 taps rapides sur le logo navbar ou le logo footer
- **Page 404** : 10 taps sur le "404" → Game of Life de Conway

---

## 🛠️ Stack technique

| Technologie | Usage |
|---|---|
| HTML5 / CSS3 | Structure et styles, thème dark/light |
| JavaScript ES6+ | Logique, composants, données JSON |
| PHP | Formulaire de contact, page 404 |
| Feather Icons | Icônes (CDN) |
| Montserrat | Police secondaire |
| OmegaLarge / OmegaSmall | Polices custom OmégaKube |

---

## 👥 Contribution

Pour contribuer au projet:

1. Créer une branche feature (`git checkout -b feature/xyz`)
2. Faire vos modifications
3. Commiter avec des messages clairs (`git commit -m "Add xyz feature"`)
4. Pusher et créer une Pull Request

---

## ⚖️ License & Mentions légales

Consulter [pages/mentions-legales.html](pages/mentions-legales.html) et [pages/cgv.html](pages/cgv.html).

---
**Version du site web**: 1.5.2.17
**Dernière mise à jour**: Avril 2026
**Mainteneur**: KIRITO_KMA / L'équipe OmégaKube