Logo 3D animé pour un site d'association

js/config.js · 2.9 Ko

/* ==========================================================================
 * js/config.js — RÉGLAGES DU LOGO (à modifier librement !)
 * --------------------------------------------------------------------------
 * Ce fichier ne contient AUCUNE logique : seulement des valeurs que vous
 * pouvez changer pour personnaliser le logo (tailles, vitesses, couleurs).
 *
 * Rappel du système de coordonnées de Zdog (très important) :
 *   - x : vers la DROITE        (x positif = à droite)
 *   - y : vers le BAS           (y positif = en bas ! l'inverse des maths)
 *   - z : vers le SPECTATEUR    (z positif = plus près de vous)
 *   - Les rotations sont en RADIANS. Zdog.TAU = 6,283… = un tour complet.
 *       TAU / 4 = quart de tour (90°), TAU / 8 = huitième de tour (45°).
 *
 * Organisation : on place tout dans un objet global unique « AppLogo »
 * (un « espace de noms ») car les modules ES ne sont pas disponibles ici.
 * ========================================================================== */

// On crée l'espace de noms s'il n'existe pas encore.
window.AppLogo = window.AppLogo || {};

(function () {
  'use strict'; // mode strict : le navigateur signale plus d'erreurs de code

  // ---- Réglages de la scène ------------------------------------------------

  AppLogo.REGLAGES = {
    // Hauteur « logique » de la scène en unités Zdog. Le zoom est calculé pour
    // que cette hauteur tienne toujours dans le canevas, quelle que soit sa taille.
    hauteurScene: 190,

    // Balancement automatique : amplitude maximale en radians (0,9 ≈ 51°).
    amplitudeBalancement: 0.9,

    // Vitesse de base du balancement (radians de phase par seconde).
    vitesseBalancement: 0.9,

    // Inclinaison verticale « de repos » du logo (petit clin d'œil 3D).
    inclinaisonRepos: 0.12,

    // Après un glissement, on attend ce nombre de secondes avant de relancer
    // le mouvement automatique (pour laisser l'utilisateur admirer le logo).
    delaiReprise: 1.5,

    // Vitesse du retour en douceur vers le mouvement automatique (plus grand = plus vif).
    douceurRetour: 3,
  };

  // ---- Thèmes de couleurs --------------------------------------------------
  // Chaque thème donne une couleur à chaque pièce du logo.
  // Les couleurs sont des chaînes CSS : '#RRGGBB', 'rgb(…)', 'hsl(…)', etc.

  AppLogo.THEMES = {
    ocean: {
      nom: 'Océan',
      fond: '#0b4f6c',    // grand losange à l'arrière
      anneau: '#2ec4b6',  // contour du losange à l'avant
      lettre: '#fdf6e3',  // la lettre A
      soleil: '#ffbf3c',  // petit soleil au-dessus du A
    },
    vanille: {
      nom: 'Vanille',
      fond: '#6b3e1e',
      anneau: '#e8b45a',
      lettre: '#fff7e0',
      soleil: '#f4a300',
    },
    girofle: {
      nom: 'Girofle',
      fond: '#7a1f2b',
      anneau: '#f08a5d',
      lettre: '#fff1e6',
      soleil: '#ffd166',
    },
  };
})();