# Extraction du rendu UI (render) ## Objectif Réduire `web/js/ui.js` pour respecter les règles ESLint : - max 250 lignes par fichier - max 40 lignes par fonction ## Réalisé - **no-shadow** : variables `phase` / `weather` dans `updateStatus` renommées en `timePhase` / `weatherVal` ; `mapLevel` dans `fullRender` renommé en `currentMapLevel`. - **Imports inutilisés** : suppression des imports devenus inutiles après utilisation des modules world-map et grid (zoo, conveyor, economy, placement, texts-fr, api-client) ; suppression de la constante `EGG_EMOJI` non utilisée. - **Réutilisation des modules** : `render()` utilise désormais `renderWorldMap(ctx)` de `ui-world-map.js` et `renderGrid(ctx)` de `ui-grid.js` au lieu des anciennes fonctions locales (environ 900 lignes supprimées). - **Refs** : `selectedTokenId`, `emptyCellChoice`, `lastActionWasDrop`, `sellZoneJustDropped` sont passés en refs pour être partagés avec les handlers (grid, sell zone) et les modules. # Extraction du rendu UI (render) ## Objectif Réduire `web/js/ui.js` pour respecter les règles ESLint : - max 250 lignes par fichier - max 40 lignes par fonction ## Réalisé - **no-shadow** : variables `phase` / `weather` dans `updateStatus` renommées en `timePhase` / `weatherVal` ; `mapLevel` dans `fullRender` renommé en `currentMapLevel`. - **Imports inutilisés** : suppression des imports devenus inutiles après utilisation des modules world-map et grid (zoo, conveyor, economy, placement, texts-fr, api-client) ; suppression de la constante `EGG_EMOJI` non utilisée. - **Réutilisation des modules** : `render()` utilise désormais `renderWorldMap(ctx)` de `ui-world-map.js` et `renderGrid(ctx)` de `ui-grid.js` au lieu des anciennes fonctions locales (environ 900 lignes supprimées). - **Refs** : `selectedTokenId`, `emptyCellChoice`, `lastActionWasDrop`, `sellZoneJustDropped` sont passés en refs pour être partagés avec les handlers (grid, sell zone) et les modules. - **Extraction en modules** : - `ui-render-dom.js` : `buildUIDOM`, `createTabsStructure`, `updateStatusBody`, `createUpdateStatus`, `createFullRender`, `updateWorldMapUpgradeAndCounters`, `buildFinishContexts`, `finishBuildUIDOM` ; `formatQuestListHtml` pour garder `updateStatusBody` sous 40 lignes ; `finishBuildUIDOM` prend un objet `opts` (max-params) et délègue les contextes à `buildFinishContexts`. - `ui-render-dom-panels.js` : `buildWorldMapWrap`, `buildWorldMapUpgradeZone`, `buildWorldMapTruckDropZone`, `buildWorldMapActions`, `buildWorldMapSection`, `buildPlotUpgradeZone`, `buildGridSection`, `attachSellZoneListeners`, `handleSellZoneClick` ; import de `handleWorldMapTruckDrop` et `handleSellZoneDrop` depuis `ui-render-dom-drops.js`. - `ui-render-dom-drops.js` (nouveau) : handlers de drop pour la carte du monde (camion) et la sell zone ; `handleWorldMapTruckDrop`, `handleSellZoneDrop` exportés ; sous-handlers `handleTruckDropBaby`, `handleTruckDropAnimal`, `handleTruckDropEgg`, `applyNurseryDrop`, `applyReceptionDrop`, `applyGridCellSell` pour rester sous 40 lignes et réduire la complexité. - `ui-render-gamebar.js` : `buildGameBar` et helpers (title, status bar, view switcher, music, auto mode, prestige/restart, quest dropdown) ; import de `buildAutoProfilePicker` depuis `ui-render-gamebar-picker.js`. - `ui-render-gamebar-picker.js` (nouveau) : `buildAutoProfilePicker` avec `buildAutoProfilePickerFamilyStep` et `buildAutoProfilePickerSpecStep` pour respecter max-lines-per-function et max-lines du fichier gamebar. - `ui.js` : `EMOJI_BY_COLOR`, `animalEmoji`, `buildRenderSetup(opts)`, `render(root, opts)` qui appelle `buildUIDOM(root, setup)` ; fichier et fonctions sous les limites. - **Imports nettoyés** : `getPlotUpgradeCost` retiré de panels ; `t` retiré de ui-render-dom ; imports inutilisés retirés de ui-render-gamebar (getSkillLevel, getVisitorCount, getTimePhase, doPrestige, playSound, errorMessage, questDescription, timePhaseLabel, weatherLabel, GameConfig ; textes et auto-mode-profiles conservés dans le picker). ## État actuel - **ESLint** : 0 erreur sur les fichiers modifiés. Les warnings (complexity, etc.) restants sont hors périmètre de cette extraction. - **Fichiers** : `ui.js`, `ui-render-dom.js`, `ui-render-dom-panels.js`, `ui-render-dom-drops.js`, `ui-render-gamebar.js`, `ui-render-gamebar-picker.js` respectent max-lines (250) et max-lines-per-function (40).