Baie d'Antalaha : diorama 3D animé jour et nuit

js/config.js · 4.1 Ko

/* ==========================================================================
 * js/config.js — CONSTANTES GLOBALES ET OUTILS COMMUNS
 * --------------------------------------------------------------------------
 * Ce fichier est chargé en PREMIER (après Zdog). Il crée l'espace de noms
 * global « Baie » dans lequel tous les autres fichiers rangent leurs
 * fonctions (pas de modules ES dans ce bac à sable : on utilise un objet
 * global et des fonctions auto-appelées, appelées IIFE).
 *
 * RAPPEL DU SYSTÈME DE COORDONNÉES DE ZDOG
 *   x : vers la droite
 *   y : vers le BAS (monter = diminuer y, donc les hauteurs sont NÉGATIVES)
 *   z : vers le spectateur (z positif = plus près de nous)
 *   Rotations en radians ; Zdog.TAU = un tour complet (≈ 6,283).
 *
 * Ici, le niveau de la mer est y = 0. Le soleil, par exemple, est à y ≈ -100.
 * ========================================================================== */

window.Baie = window.Baie || {};

(function () {
  'use strict';

  // ---- Réglages généraux du diorama ----------------------------------------
  Baie.CONFIG = {
    rayonMer: 170,          // rayon du disque de mer (le « socle » du diorama)
    largeurScene: 380,      // largeur « logique » qui doit tenir dans le canevas
    hauteurScene: 300,      // hauteur « logique »
    decalageVertical: 52,   // descend la scène pour centrer la rotation

    // La vue ne peut pas être trop à plat (la mer deviendrait une simple ligne)
    // ni passer sous la mer : on limite l'inclinaison (rotate.x).
    inclinaisonMin: -1.1,   // vue plongeante (sans déborder du cadre)
    inclinaisonMax: -0.2,   // presque à plat
    vueDepart: { x: -0.38, y: -0.5 },
    rotationLente: 0.12,    // radians par seconde si l'option est cochée

    heureDepart: 9.5,       // heure affichée au chargement (9 h 30)
    dureeJournee: 110,      // secondes réelles pour 24 h quand le temps défile
    deltaMax: 0.1,          // on borne le temps d'une image à 0,1 s (voir main.js)
    seuilMobile: 560,       // en dessous de cette largeur d'écran : qualité réduite
  };

  // ---- Qualité : on allège la scène sur téléphone --------------------------
  // Moins de rangées de vagues, moins de palmiers, etc. => moins de calculs
  // à chaque image, donc une animation fluide même sur un petit appareil.
  var mobile = (window.innerWidth || 1024) < Baie.CONFIG.seuilMobile;

  Baie.MOBILE = mobile;
  Baie.QUALITE = mobile
    ? { espacementMer: 22, pointsMer: 11, palmiers: 4, nuages: 3, oiseaux: 3, etoiles: 24 }
    : { espacementMer: 16, pointsMer: 15, palmiers: 6, nuages: 5, oiseaux: 6, etoiles: 50 };

  // ---- Outil : forcer l'ordre de dessin ------------------------------------
  /**
   * Zdog dessine les formes de la plus LOINTAINE à la plus PROCHE en
   * comparant une valeur appelée « sortValue » (liée à z). Pour un grand sol
   * plat ou une mer, cette valeur est trompeuse : le centre est au milieu de
   * la scène, donc des objets situés « derrière » seraient dessinés AVANT
   * la mer et disparaîtraient dessous !
   *
   * Solution : on remplace la méthode updateSortValue de CETTE forme (sur
   * l'instance uniquement) pour retrancher un grand nombre. Elle passe ainsi
   * toujours avant les autres, tout en gardant son ordre relatif avec ses voisines.
   *
   * @param {Zdog.Anchor} forme    Forme ou groupe à envoyer au fond.
   * @param {number}      decalage Nombre NÉGATIF et grand (ex. -1000000 = tout au fond).
   */
  Baie.tirerVersLeFond = function (forme, decalage) {
    // La méthode d'origine, héritée du prototype de la classe de la forme.
    var origine = Object.getPrototypeOf(forme).updateSortValue;
    forme.updateSortValue = function () {
      origine.call(this);          // calcule la vraie valeur…
      this.sortValue += decalage;  // …puis la décale très loin derrière
    };
  };

  // ---- Outil : borner un nombre --------------------------------------------
  /** Renvoie `v` ramené entre `min` et `max`. */
  Baie.borner = function (v, min, max) {
    return v < min ? min : (v > max ? max : v);
  };
})();