mickael/dd-timer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 9 Wiki Activity
0afc53fc1a
dd-timer/docs/plans/2026-03-27-v1.2.0-implementation.md

23 KiB
Raw Blame History

v1.2.0 Implementation Plan — Accouplement, Sidebar, Réappro ♂/♀

For Claude: REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task.

Goal: Ajouter un onglet Accouplement dédié, une sidebar de navigation overlay, intégrer les stats dans le dashboard, et ajouter les contraintes ♂/♀ dans la réappro.

Architecture: Tout le code est dans src/index.html (monolithique). On modifie le CSS, le HTML, et le JS inline. Pas de framework. Rendu impératif via innerHTML. État central dans S, persisté via save().

Tech Stack: Vanilla JS, CSS custom properties, Electron IPC.

Fichier principal: /mnt/c/Users/micka/Desktop/dd-timer/src/index.html

Task 1 : Retrait des bébés des enclos + migration

But : Supprimer le système de bébés des enclos et migrer les données existantes vers S.archivedStats.

Files:

  • Modify: src/index.html

Step 1 : Migration des données au chargement

Dans la fonction load() ou juste après le chargement de S, ajouter une migration one-shot :

// Migration v1.2.0 : archiver les babyHistory des enclos
if(!S._migratedBabies120){
  S.enclos.forEach(enc=>{
    if(enc.babyHistory&&enc.babyHistory.length){
      if(!S.archivedStats)S.archivedStats={babies:[],totalMax:0};
      if(!S.archivedStats.babies)S.archivedStats.babies=[];
      enc.babyHistory.forEach(b=>{
        S.archivedStats.babies.push({...b,enclosName:enc.name||('Enclos '+(S.enclos.indexOf(enc)+1))});
        S.archivedStats.totalMax=(S.archivedStats.totalMax||0)+Math.min(5,Math.floor((b.ddCount||2)/2));
      });
    }
  });
  S._migratedBabies120=true;
  save();
}

Step 2 : Supprimer le code des bébés dans les enclos

Supprimer ou commenter les fonctions et le code suivant :

  • isBabyUnlocked() (ligne ~2095)
  • updateBabyBtnState() (ligne ~2101)
  • maxBabiesForEnclos() (ligne ~2115)
  • currentBabiesCount() (ligne ~2118)
  • openBabyModal() (ligne ~2127)
  • closeBabyModal() (ligne ~2134)
  • modalBack(), modalNext(), renderModalStep() (lignes ~2138-2250)
  • selectModalGen(), selectModalRaceByIdx(), selectModalRace(), changeCount() (lignes ~2250-2285)
  • renderBabies() (ligne ~2015)
  • renderBabyHistory() (ligne ~2049)
  • switchSubTab() (ligne ~2001)
  • removeBaby() (ligne ~2079)
  • clearSessionBabies() (ligne ~2087)
  • Le HTML du modal bébé (lignes ~352-369)

Step 3 : Nettoyer renderContent pour les enclos

Dans renderContent() (ligne ~1465), retirer les sous-onglets "elevage"/"history" et le bouton bébé du rendu des enclos.

Step 4 : Commit

feat: retire bébés des enclos, migre données vers archivedStats

Task 2 : Onglet Accouplement — données et constante

But : Créer la structure de données et le lookup inversé pour les accouplements.

Files:

  • Modify: src/index.html

Step 1 : Ajouter 'accouplement' dans SPECIAL_TABS

Ligne ~698 :

const SPECIAL_TABS=['dashboard','appro','inventaire','accouplement','workflows'];
// Note : 'stats' retiré (sera dans le dashboard)

Step 2 : Créer le lookup inversé BREEDING_BY_PARENTS

Après BREEDING_RECIPES (ligne ~677) :

// Lookup inversé : "ParentA|ParentB" → babyRace
const BREEDING_BY_PARENTS={};
Object.entries(BREEDING_RECIPES).forEach(([baby,[a,b]])=>{
  BREEDING_BY_PARENTS[a+'|'+b]=baby;
  if(a!==b) BREEDING_BY_PARENTS[b+'|'+a]=baby;
});

// Lookup : pour un parent donné, quels partenaires sont possibles ?
const COMPATIBLE_PARTNERS={};
Object.entries(BREEDING_RECIPES).forEach(([baby,[a,b]])=>{
  if(!COMPATIBLE_PARTNERS[a])COMPATIBLE_PARTNERS[a]=[];
  COMPATIBLE_PARTNERS[a].push({partner:b,baby,gen:RACE_GEN[baby]});
  if(a!==b){
    if(!COMPATIBLE_PARTNERS[b])COMPATIBLE_PARTNERS[b]=[];
    COMPATIBLE_PARTNERS[b].push({partner:a,baby,gen:RACE_GEN[baby]});
  }
});

Step 3 : Initialiser S.accouplements

Dans le chargement de S (après load()) :

if(!S.accouplements) S.accouplements=[];

Step 4 : Commit

feat: ajoute structures données accouplement et lookup inversé

Task 3 : Onglet Accouplement — rendu UI

But : Interface complète de l'onglet accouplement.

Files:

  • Modify: src/index.html (CSS + JS)

Step 1 : CSS pour l'onglet accouplement

Ajouter dans la section <style> (avant </style>, ligne ~313) :

/* Accouplement */
.accoup-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.accoup-card{background:var(--bg2);border:2px solid var(--border);border-radius:var(--r);padding:10px;cursor:pointer;text-align:center;width:100px;transition:border-color .2s,transform .15s}
.accoup-card:hover{border-color:var(--text);transform:translateY(-2px)}
.accoup-card.selected{border-color:var(--ok);box-shadow:0 0 12px rgba(40,232,136,.25)}
.accoup-result{display:flex;align-items:center;gap:20px;justify-content:center;flex-wrap:wrap;padding:20px 0}
.accoup-arrow{font-size:2rem;color:var(--muted)}
.accoup-inputs{display:flex;gap:16px;align-items:center;justify-content:center;flex-wrap:wrap;padding:16px 0}
.accoup-input-group{display:flex;flex-direction:column;align-items:center;gap:6px}
.accoup-input-group label{font-size:.82rem;color:var(--muted)}
.accoup-input-group input{width:70px;background:var(--bg2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px;font:700 1rem 'Nunito',sans-serif;text-align:center}
.accoup-gen-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;justify-content:center}
.accoup-gen-tab{padding:4px 12px;border-radius:8px;font-size:.78rem;font-weight:700;cursor:pointer;border:1px solid var(--border);background:var(--bg2);color:var(--muted);transition:all .2s}
.accoup-gen-tab.active{background:var(--ok);color:#fff;border-color:var(--ok)}

Step 2 : État local de l'onglet

const accoupState={parent1:null,parent2:null,filterGen:null,couples:'',babies:''};

Step 3 : Fonction renderAccouplement()

function renderAccouplement(){
  const c=document.getElementById('enclos-content');
  c.removeAttribute('data-enc');

  const allRaces=Object.keys(RACE_GEN).sort((a,b)=>(RACE_GEN[a]-RACE_GEN[b])||a.localeCompare(b));
  const gens=[...new Set(Object.values(RACE_GEN))].sort((a,b)=>a-b);

  // Si parent1 sélectionné, filtrer les partenaires compatibles
  let availableRaces=allRaces;
  if(accoupState.parent1){
    const partners=COMPATIBLE_PARTNERS[accoupState.parent1]||[];
    availableRaces=partners.map(p=>p.partner);
  }

  // Filtrer par gen
  const fg=accoupState.parent1?null:accoupState.filterGen;
  const filtered=fg?availableRaces.filter(r=>RACE_GEN[r]===fg):availableRaces;

  // Déduire le bébé
  let baby=null,babyGen=null;
  if(accoupState.parent1&&accoupState.parent2){
    baby=BREEDING_BY_PARENTS[accoupState.parent1+'|'+accoupState.parent2]||null;
    if(baby)babyGen=RACE_GEN[baby];
  }

  // Gen tabs (uniquement si pas de parent1 sélectionné)
  let genTabs='';
  if(!accoupState.parent1){
    genTabs=`<div class="accoup-gen-tabs">
      <div class="accoup-gen-tab ${!fg?'active':''}" onclick="accoupState.filterGen=null;renderAccouplement()">Toutes</div>
      ${gens.map(g=>`<div class="accoup-gen-tab ${fg===g?'active':''}" style="${fg===g?'background:'+GEN_COLORS[g]+';border-color:'+GEN_COLORS[g]:''}" onclick="accoupState.filterGen=${g};renderAccouplement()">Gen ${g}</div>`).join('')}
    </div>`;
  }

  let html=`<div style="font-family:'Cinzel',serif;font-size:.8rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);margin-bottom:12px">Accouplement</div>`;

  // Étape 1 ou 2 : sélection parent
  const stepLabel=accoupState.parent1?'Sélectionne le Parent 2':'Sélectionne le Parent 1';
  const selectedParent1=accoupState.parent1;

  if(selectedParent1){
    const gc1=GEN_COLORS[RACE_GEN[selectedParent1]]||'#888';
    html+=`<div class="card" style="border-color:${gc1}">
      <div style="display:flex;align-items:center;gap:12px;margin-bottom:10px">
        <span class="card-title" style="margin:0">Parent 1</span>
        <button class="btn btn-ghost" style="padding:4px 12px;font-size:.8rem" onclick="accoupState.parent1=null;accoupState.parent2=null;renderAccouplement()">✕ Changer</button>
      </div>
      <div style="display:flex;align-items:center;gap:10px">
        ${getDDImage(selectedParent1)}
        <div>
          <div style="font-weight:800;color:var(--text)">${selectedParent1}</div>
          <span style="background:${gc1};color:#fff;font-size:.65rem;font-weight:800;padding:1px 6px;border-radius:8px">Gen ${RACE_GEN[selectedParent1]}</span>
        </div>
      </div>
    </div>`;
  }

  // Résultat si les deux parents sont sélectionnés
  if(baby){
    const gcb=GEN_COLORS[babyGen]||'#888';
    const gc2=GEN_COLORS[RACE_GEN[accoupState.parent2]]||'#888';
    html+=`<div class="card" style="border-color:${gc2}">
      <span class="card-title">Parent 2 — ${accoupState.parent2}</span>
      <div style="display:flex;align-items:center;gap:10px">
        ${getDDImage(accoupState.parent2)}
        <div>
          <div style="font-weight:800;color:var(--text)">${accoupState.parent2}</div>
          <span style="background:${gc2};color:#fff;font-size:.65rem;font-weight:800;padding:1px 6px;border-radius:8px">Gen ${RACE_GEN[accoupState.parent2]}</span>
        </div>
        <button class="btn btn-ghost" style="padding:4px 12px;font-size:.8rem" onclick="accoupState.parent2=null;renderAccouplement()">✕ Changer</button>
      </div>
    </div>`;

    html+=`<div class="card" style="border-color:${gcb}">
      <span class="card-title">Bébé à naître</span>
      <div class="accoup-result">
        ${getDDImage(accoupState.parent1)}
        <span class="accoup-arrow">+</span>
        ${getDDImage(accoupState.parent2)}
        <span class="accoup-arrow">➜</span>
        <div style="text-align:center">
          ${getDDImage(baby)}
          <div style="font-weight:800;color:var(--text);margin-top:4px">${baby}</div>
          <span style="background:${gcb};color:#fff;font-size:.65rem;font-weight:800;padding:1px 6px;border-radius:8px">Gen ${babyGen}</span>
        </div>
      </div>
      <div class="accoup-inputs">
        <div class="accoup-input-group">
          <label>Couples accouplés</label>
          <input type="number" min="1" value="${accoupState.couples}" placeholder="—"
            oninput="accoupState.couples=this.value"
            onfocus="this.dataset.prev=this.value;this.value=''"
            onblur="if(this.value==='')this.value=this.dataset.prev">
        </div>
        <div class="accoup-input-group">
          <label>Bébés obtenus</label>
          <input type="number" min="0" value="${accoupState.babies}" placeholder="—"
            oninput="accoupState.babies=this.value"
            onfocus="this.dataset.prev=this.value;this.value=''"
            onblur="if(this.value==='')this.value=this.dataset.prev">
        </div>
      </div>
      <div style="text-align:center;padding-top:8px">
        <button class="btn btn-start" style="padding:10px 28px;font-size:.95rem" onclick="enregistrerAccouplement()">
          ✅ Enregistrer
        </button>
      </div>
    </div>`;
  }else{
    // Grille de sélection
    html+=`<div class="card">
      <span class="card-title">${stepLabel}</span>
      ${genTabs}
      <div class="accoup-grid">
        ${filtered.map(race=>{
          const gc=GEN_COLORS[RACE_GEN[race]]||'#888';
          return`<div class="accoup-card" onclick="selectAccoupParent('${race.replace(/'/g,"\\'")}')" title="${race}">
            ${getDDImage(race)}
            <div style="font-weight:700;font-size:.75rem;color:var(--text);margin-top:4px;line-height:1.1">${race}</div>
            <span style="background:${gc};color:#fff;font-size:.6rem;font-weight:800;padding:1px 5px;border-radius:6px">Gen ${RACE_GEN[race]}</span>
          </div>`;
        }).join('')}
      </div>
    </div>`;
  }

  c.innerHTML=html;
}

Step 4 : Fonctions d'interaction

function selectAccoupParent(race){
  if(!accoupState.parent1){
    accoupState.parent1=race;
    accoupState.parent2=null;
  }else{
    accoupState.parent2=race;
  }
  accoupState.couples='';
  accoupState.babies='';
  renderAccouplement();
}

function enregistrerAccouplement(){
  const couples=parseInt(accoupState.couples)||0;
  const babies=parseInt(accoupState.babies)||0;
  if(couples<=0){alert('Renseigne le nombre de couples.');return;}
  const baby=BREEDING_BY_PARENTS[accoupState.parent1+'|'+accoupState.parent2];
  if(!baby)return;

  if(!S.accouplements)S.accouplements=[];
  S.accouplements.push({
    parentA:accoupState.parent1,
    parentB:accoupState.parent2,
    baby,
    gen:RACE_GEN[baby],
    couples,
    babiesObtained:babies,
    date:Date.now()
  });
  save();

  // Reset
  accoupState.parent1=null;
  accoupState.parent2=null;
  accoupState.couples='';
  accoupState.babies='';
  renderAccouplement();
}

Step 5 : Router dans renderContent()

Ligne ~1465, ajouter le cas :

if(S.activeId==='accouplement'){renderAccouplement();return;}

Step 6 : Ajouter l'onglet dans renderTabs()

Dans renderTabs() (ligne ~1341), ajouter un onglet "Accouplement" dans les special tabs, avec icône 💑.

Step 7 : Commit

feat: ajoute onglet Accouplement avec sélection parents et enregistrement

Task 4 : Intégrer les stats dans le Dashboard + section Paramètres

But : Déplacer les stats et les settings dans le dashboard. Supprimer l'onglet Stats.

Files:

  • Modify: src/index.html

Step 1 : Retirer 'stats' de SPECIAL_TABS

Déjà fait dans Task 2 Step 1.

Step 2 : Modifier renderDashboard()

Après le contenu actuel du dashboard (grille des enclos), ajouter :

  1. Section Stats globales : Reprendre le contenu de renderStats() (lignes ~2306-2427) mais en tant que section du dashboard plutôt qu'onglet séparé. Adapter pour inclure les données de S.accouplements en plus de S.archivedStats.

  2. Section Paramètres : Déplacer le sélecteur de son (lignes ~1421-1433), le toggle notifs (lignes ~1435-1449) et le bouton ntfy (lignes ~1451-1457) depuis le header de renderTabs() vers une card "Paramètres" en bas du dashboard.

Calcul des stats depuis S.accouplements :

// Agréger accouplements dans les stats
const accoupBabies={};
let accoupTotal=0,accoupCouples=0;
(S.accouplements||[]).forEach(a=>{
  accoupBabies[a.baby]=(accoupBabies[a.baby]||0)+a.babiesObtained;
  accoupTotal+=a.babiesObtained;
  accoupCouples+=a.couples;
});

Step 3 : Retirer les settings du header dans renderTabs()

Supprimer les lignes ~1421-1457 (sound select, notif btn, ntfy btn) de renderTabs().

Step 4 : Supprimer renderStats()

Supprimer renderStats() (lignes ~2306-2427) et resetStats() (lignes ~2290-2304) — le code est intégré dans le dashboard.

Step 5 : Commit

feat: intègre stats et paramètres dans le dashboard, retire onglet Stats

Task 5 : Sidebar navigation

But : Ajouter un menu hamburger avec sidebar overlay.

Files:

  • Modify: src/index.html (CSS + HTML + JS)

Step 1 : CSS de la sidebar

/* Sidebar */
.sidebar-toggle{position:fixed;top:12px;left:12px;z-index:1100;background:var(--bg3);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1.3rem;padding:6px 10px;cursor:pointer;transition:background .2s;line-height:1}
.sidebar-toggle:hover{background:var(--bg4)}
.sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1200;opacity:0;pointer-events:none;transition:opacity .25s}
.sidebar-overlay.open{opacity:1;pointer-events:all}
.sidebar{position:fixed;top:0;left:-280px;width:270px;height:100%;background:var(--bg2);border-right:1px solid var(--border);z-index:1300;transition:left .25s;padding:60px 0 20px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.sidebar.open{left:0}
.sidebar-item{display:flex;align-items:center;gap:10px;padding:10px 20px;color:var(--muted);font-size:.88rem;font-weight:600;cursor:pointer;transition:background .15s,color .15s;border-left:3px solid transparent}
.sidebar-item:hover{background:var(--bg3);color:var(--text)}
.sidebar-item.active{color:var(--text);border-left-color:var(--ok);background:var(--bg3)}
.sidebar-sep{height:1px;background:var(--border);margin:8px 16px}
.sidebar-label{padding:8px 20px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);opacity:.6}

Step 2 : HTML — ajouter le bouton et le conteneur sidebar

Juste après <body> (ou avant la section <header>) :

<button class="sidebar-toggle" onclick="toggleSidebar()" title="Menu">☰</button>
<div class="sidebar-overlay" id="sidebar-overlay" onclick="closeSidebar()"></div>
<nav class="sidebar" id="sidebar"></nav>

Step 3 : Ajouter un padding-left au header pour ne pas chevaucher le bouton hamburger

Ajouter padding-left:50px au header ou au conteneur principal.

Step 4 : JS — fonctions sidebar

function toggleSidebar(){
  const sb=document.getElementById('sidebar');
  const ov=document.getElementById('sidebar-overlay');
  const open=sb.classList.toggle('open');
  ov.classList.toggle('open',open);
  if(open)renderSidebar();
}
function closeSidebar(){
  document.getElementById('sidebar').classList.remove('open');
  document.getElementById('sidebar-overlay').classList.remove('open');
}
function sidebarNav(id){
  selectEnclos(id);
  closeSidebar();
}
function renderSidebar(){
  const sb=document.getElementById('sidebar');
  let html=`<div class="sidebar-item ${S.activeId==='dashboard'?'active':''}" onclick="sidebarNav('dashboard')">📊 Dashboard</div>`;
  html+=`<div class="sidebar-sep"></div>`;
  html+=`<div class="sidebar-label">Enclos</div>`;
  S.enclos.forEach((enc,i)=>{
    const label=enc.name||('Enclos '+(i+1));
    const isActive=S.activeId===enc.id;
    html+=`<div class="sidebar-item ${isActive?'active':''}" onclick="sidebarNav(${enc.id})">🐉 ${label}</div>`;
  });
  html+=`<div class="sidebar-sep"></div>`;
  html+=`<div class="sidebar-label">Outils</div>`;
  html+=`<div class="sidebar-item ${S.activeId==='accouplement'?'active':''}" onclick="sidebarNav('accouplement')">💑 Accouplement</div>`;
  html+=`<div class="sidebar-item ${S.activeId==='appro'?'active':''}" onclick="sidebarNav('appro')">🧬 Réappro</div>`;
  html+=`<div class="sidebar-item ${S.activeId==='inventaire'?'active':''}" onclick="sidebarNav('inventaire')">📦 Inventaire</div>`;
  html+=`<div class="sidebar-item ${S.activeId==='workflows'?'active':''}" onclick="sidebarNav('workflows')">📋 Workflows</div>`;
  sb.innerHTML=html;
}

Step 5 : Commit

feat: ajoute sidebar navigation overlay avec menu hamburger

Task 6 : Réappro ♂/♀

But : Ajouter les contraintes de genre dans l'arbre de réapprovisionnement.

Files:

  • Modify: src/index.html

Step 1 : Modifier calcAppro() pour assigner ♂/♀

Dans calcAppro() (ligne ~2507), modifier chaque étape pour indiquer le genre :

// Convention : parentA = ♂, parentB = ♀ (sauf si inversé par l'utilisateur)
const inverted=approState.inverted||{};
const[rawA,rawB]=BREEDING_RECIPES[race];
const isInv=inverted[race];
const a=isInv?rawB:rawA, b=isInv?rawA:rawB;
// a = ♂, b = ♀

// Pour les besoins : marquer le genre
if(!needs[a])needs[a]={total:0,m:0,f:0};
if(!needs[b])needs[b]={total:0,m:0,f:0};
needs[a].m=(needs[a].m||0)+couplesReal;
needs[a].total=(needs[a].total||0)+couplesReal;
needs[b].f=(needs[b].f||0)+couplesReal;
needs[b].total=(needs[b].total||0)+couplesReal;

Le needs actuel est un simple nombre (needs[race]=qty). Il faut le transformer en objet {total, m, f}.

Step 2 : Toggle d'inversion ♂/♀ par étape

Ajouter dans approState :

approState.inverted={};  // race → boolean

Fonction :

function toggleApproGender(race){
  if(!approState.inverted)approState.inverted={};
  approState.inverted[race]=!approState.inverted[race];
  calcAppro();
}

Bouton dans le rendu de chaque étape (à côté du toggle reproducteur) :

<button class="btn btn-ghost" style="padding:4px 10px;font-size:.75rem"
  onclick="toggleApproGender('${race}')" title="Inverser ♂/♀">
  🔄 ♂↔♀
</button>

Step 3 : Affichage ♂/♀ sur les mini-cards

Modifier la fonction miniCard() dans calcAppro() pour accepter un paramètre genre :

function miniCard(name,qty,gen,gender){
  const gc=GEN_COLORS[gen||RACE_GEN[name]]||'#888';
  const genderBadge=gender==='m'?'<span style="color:#50a0ff;font-weight:800"> ♂</span>'
    :gender==='f'?'<span style="color:#ff64a0;font-weight:800"> ♀</span>':'';
  return`<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:70px">
    <div style="position:relative">${getDDImage(name)}
      <span style="position:absolute;top:-4px;right:-8px;background:${gc};color:#fff;font-size:0.65rem;font-weight:800;padding:1px 6px;border-radius:8px">Gen ${gen||RACE_GEN[name]}</span>
    </div>
    <span style="font-weight:800;font-size:0.78rem;color:var(--text);text-align:center;line-height:1.1;max-width:90px">${name}${genderBadge}</span>
    <span style="font-family:'Cinzel',serif;font-size:1.1rem;font-weight:700;color:${gc}">×${qty}</span>
  </div>`;
}

Appels : miniCard(s.parentA, s.couples, RACE_GEN[s.parentA], 'm') et miniCard(s.parentB, s.couples, RACE_GEN[s.parentB], 'f').

Step 4 : Résumé Gen 1 avec genres

Modifier le rendu des matières premières Gen 1 pour afficher ×4 ♂ et ×4 ♀ séparément :

gen1Needs.forEach(([name,data])=>{
  if(data.m>0) html+=miniCard(name,data.m,1,'m');
  if(data.f>0) html+=miniCard(name,data.f,1,'f');
});

Step 5 : Commit

feat: ajoute contraintes ♂/♀ dans réappro avec toggle d'inversion

Task 7 : Mise à jour du rendu des tabs + nettoyage final

But : S'assurer que les tabs affichent correctement les nouveaux onglets et nettoyer le code mort.

Files:

  • Modify: src/index.html

Step 1 : Mettre à jour renderTabs()

Ajouter l'onglet Accouplement (💑) dans la barre horizontale, entre Dashboard et les enclos ou entre Réappro et Inventaire. S'assurer que l'onglet Stats n'apparaît plus.

Step 2 : Mettre à jour renderContent()

Vérifier le routing complet :

function renderContent(){
  clearElCache();
  const c=document.getElementById('enclos-content');
  if(S.activeId==='dashboard'){renderDashboard();return;}
  if(S.activeId==='accouplement'){renderAccouplement();return;}
  if(S.activeId==='appro'){renderApprovisionnement();return;}
  if(S.activeId==='inventaire'){renderInventaire();return;}
  if(S.activeId==='workflows'){renderWorkflows();return;}
  // Sinon c'est un enclos
  const enc=activeEnclos();
  if(!enc)return;
  renderEnclos(enc);
}

Step 3 : Nettoyage

  • Supprimer tout code mort lié aux bébés dans les enclos
  • Supprimer le rendu de l'onglet Stats dans renderTabs()
  • Vérifier que save() persiste S.accouplements
  • Vérifier que la migration _migratedBabies120 fonctionne correctement

Step 4 : Mettre à jour le README (version 1.2.0)

Step 5 : Commit

feat: nettoyage final, routing mis à jour, v1.2.0 prêt

Ordre d'exécution

Task Dépendance Description
1 Aucune Retrait bébés + migration
2 Aucune Données accouplement + lookup
3 Task 2 UI onglet accouplement
4 Task 1 Stats dans dashboard + paramètres
5 Aucune Sidebar navigation
6 Aucune Réappro ♂/♀
7 Tasks 1-6 Nettoyage + routing final

Tasks 1, 2, 5, 6 sont indépendantes et peuvent être faites en parallèle. Task 3 dépend de 2. Task 4 dépend de 1. Task 7 finalise le tout.