add go bench client
This commit is contained in:
Gilles Soulier
214
FRONTEND_CHANGES.md
Normal file
214
FRONTEND_CHANGES.md
Normal file
@@ -0,0 +1,214 @@
|
||||
# Modifications Frontend Appliquées
|
||||
|
||||
## Date : 2026-01-11
|
||||
|
||||
---
|
||||
|
||||
## ✅ Modifications complétées
|
||||
|
||||
### 1. Module HardwareRenderer (Action 3.1)
|
||||
|
||||
**Fichier créé** : `frontend/js/hardware-renderer.js`
|
||||
|
||||
Module centralisé pour le rendu hardware, exposant :
|
||||
- `renderMotherboardDetails(snapshot)` - Carte mère complète (16 champs)
|
||||
- `renderCPUDetails(snapshot)` - CPU avec multi-socket + signature + flags
|
||||
- `renderMemoryDetails(snapshot, deviceData)` - RAM/SWAP + slots DIMM
|
||||
- `renderStorageDetails(snapshot)` - Disques avec SMART
|
||||
- `renderGPUDetails(snapshot)` - Carte graphique
|
||||
- `renderNetworkDetails(snapshot)` - Interfaces réseau
|
||||
- `renderOSDetails(snapshot)` - Système d'exploitation
|
||||
- `renderProxmoxDetails(snapshot)` - Proxmox VE (nouveau)
|
||||
- `renderAudioDetails(snapshot)` - Audio hardware/software (nouveau)
|
||||
|
||||
**Intégration** :
|
||||
- ✅ Ajouté à `devices.html` et `device_detail.html`
|
||||
- ✅ Appelable via `window.HardwareRenderer.renderXxx()`
|
||||
- ⚠️ Migration partielle : `device_detail.js` ligne 91 utilise le module, reste à compléter (voir REFACTORING_PLAN.md)
|
||||
|
||||
---
|
||||
|
||||
### 2. Migration des icônes vers IconManager (Action 3.3)
|
||||
|
||||
**Fichier modifié** : `frontend/js/devices.js`
|
||||
|
||||
**Changement** :
|
||||
```javascript
|
||||
// AVANT (lignes 17-37)
|
||||
const SECTION_ICON_PATHS = {
|
||||
motherboard: 'icons/icons8-motherboard-94.png',
|
||||
cpu: 'icons/icons8-processor-94.png',
|
||||
// ... chemins PNG hardcodés
|
||||
};
|
||||
|
||||
function getSectionIcon(key, altText) {
|
||||
return `<img src="${src}" alt="${altText}" class="section-icon">`;
|
||||
}
|
||||
|
||||
// APRÈS
|
||||
const SECTION_ICON_NAMES = {
|
||||
motherboard: 'motherboard',
|
||||
cpu: 'cpu',
|
||||
ram: 'memory',
|
||||
// ... noms d'icônes FontAwesome
|
||||
};
|
||||
|
||||
function getSectionIcon(key, altText) {
|
||||
return `<span class="section-icon" data-icon="${iconName}" title="${altText}"></span>`;
|
||||
}
|
||||
```
|
||||
|
||||
**Ajout initialisation** (ligne 1295-1298) :
|
||||
```javascript
|
||||
detailsContainer.innerHTML = headerHtml + orderedSections;
|
||||
|
||||
// Initialize icons using IconManager
|
||||
if (window.IconManager) {
|
||||
window.IconManager.initializeIcons(detailsContainer);
|
||||
}
|
||||
```
|
||||
|
||||
**Résultat** :
|
||||
- ✅ Toutes les icônes de sections utilisent `data-icon` + IconManager
|
||||
- ✅ Compatibilité avec les packs d'icônes (FontAwesome, Icons8, emoji)
|
||||
- ✅ Coloration automatique selon le thème (SVG inline)
|
||||
|
||||
---
|
||||
|
||||
### 3. UI IP URL (Action 1.1)
|
||||
|
||||
**Fichier modifié** : `frontend/js/devices.js`
|
||||
|
||||
**Ajout section IP** (lignes 1122-1129) :
|
||||
```html
|
||||
<div class="header-row">
|
||||
<div>
|
||||
<div class="header-label">Adresse IP</div>
|
||||
<div class="header-value" id="ip-display-container">
|
||||
${renderIPDisplay(snapshot, device)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
|
||||
**Nouvelles fonctions** (lignes 1087-1172) :
|
||||
- `renderIPDisplay(snapshot, device)` - Affiche IP(s) non-loopback + bouton éditer
|
||||
- `editIPUrl()` - Affiche l'éditeur d'URL
|
||||
- `saveIPUrl()` - Sauvegarde l'URL via API (`PUT /api/devices/{id}`)
|
||||
- `cancelIPUrlEdit()` - Annule l'édition
|
||||
|
||||
**Fonctionnalités** :
|
||||
- ✅ Extraction des IP non-127.0.0.1 depuis `network_interfaces_json`
|
||||
- ✅ Affichage cliquable si URL définie (ouvre dans nouvel onglet)
|
||||
- ✅ Édition inline avec input + boutons Sauvegarder/Annuler
|
||||
- ✅ Auto-préfixe `http://` si manquant
|
||||
- ✅ Binding des boutons dans `bindDetailActions()` (lignes 1427-1430)
|
||||
|
||||
**Note** :
|
||||
⚠️ **Nécessite backend** : Le champ `device.ip_url` doit être retourné par l'API (voir TODO_BACKEND.md §1)
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Fichiers modifiés
|
||||
|
||||
| Fichier | Lignes avant | Lignes après | Changement |
|
||||
|---------|--------------|--------------|------------|
|
||||
| `frontend/js/hardware-renderer.js` | 0 (nouveau) | 700+ | Création module |
|
||||
| `frontend/js/devices.js` | 1953 | 2040+ | +87 lignes |
|
||||
| `frontend/js/device_detail.js` | 975 | 980 | +5 lignes (partiel) |
|
||||
| `frontend/devices.html` | 86 | 89 | +3 scripts |
|
||||
| `frontend/device_detail.html` | 230 | 233 | +3 scripts |
|
||||
|
||||
---
|
||||
|
||||
## 📝 Fichiers de documentation créés
|
||||
|
||||
1. **TODO_BACKEND.md** - Actions backend requises (schémas Pydantic, champs manquants)
|
||||
2. **REFACTORING_PLAN.md** - Plan détaillé migration vers HardwareRenderer
|
||||
3. **FRONTEND_CHANGES.md** (ce fichier) - Synthèse modifications frontend
|
||||
|
||||
---
|
||||
|
||||
## ⏭️ Prochaines actions (en attente)
|
||||
|
||||
### Action 2.1 - Bouton Recherche Web du modèle
|
||||
- Icône globe à côté du champ "Modèle"
|
||||
- Recherche paramétrable (Google/DuckDuckGo/Bing via Settings)
|
||||
- Ouverture nouvel onglet
|
||||
|
||||
### Action 2.2 - Amélioration multi-CPU
|
||||
- Grille tableau pour afficher plusieurs sockets
|
||||
- Parsing dmidecode type 4
|
||||
- ✅ **DÉJÀ IMPLÉMENTÉ dans HardwareRenderer.renderCPUDetails()** (lignes 60-150)
|
||||
|
||||
### Action 2.3 - Popups Raw Info
|
||||
- Tooltip au survol icône Mémoire → `raw_info.dmidecode` complet
|
||||
- Tooltip au survol icône Motherboard → détails BIOS
|
||||
- Placement intelligent (fixed position)
|
||||
|
||||
### Action 1.3 - Afficher Proxmox et Audio
|
||||
- Sections dédiées dans `device_detail.html`
|
||||
- ✅ **DÉJÀ IMPLÉMENTÉ dans HardwareRenderer** (fonctions `renderProxmoxDetails()` et `renderAudioDetails()`)
|
||||
- Reste à ajouter les `<div>` dans le HTML + appel des fonctions
|
||||
|
||||
### Action 4.1 - Uniformiser gestion erreurs
|
||||
- Remplacer `alert()` par `utils.showToast()`
|
||||
- Standardiser `try-catch`
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Tests recommandés
|
||||
|
||||
### Test 1 : IconManager
|
||||
1. Ouvrir `devices.html`
|
||||
2. Sélectionner un device
|
||||
3. Vérifier que les icônes de sections s'affichent (pas de `<img>` cassées)
|
||||
4. Aller dans Settings → changer de pack d'icônes
|
||||
5. Revenir → vérifier que les icônes ont changé
|
||||
|
||||
### Test 2 : IP URL (nécessite backend à jour)
|
||||
1. Ouvrir `devices.html`
|
||||
2. Sélectionner un device
|
||||
3. Vérifier l'affichage IP (non-127.0.0.1)
|
||||
4. Cliquer sur "Éditer lien IP"
|
||||
5. Saisir une URL (ex: `http://10.0.0.50:8080`)
|
||||
6. Cliquer "Sauvegarder"
|
||||
7. Vérifier que l'IP devient cliquable
|
||||
8. Cliquer → vérifier ouverture dans nouvel onglet
|
||||
|
||||
### Test 3 : HardwareRenderer
|
||||
1. Ouvrir console navigateur (F12)
|
||||
2. Taper : `HardwareRenderer`
|
||||
3. Vérifier que l'objet existe avec 9 méthodes
|
||||
|
||||
---
|
||||
|
||||
## ⚠️ Limitations actuelles
|
||||
|
||||
1. **Backend pas à jour** :
|
||||
- `device.ip_url` non retourné par API → bouton IP URL ne sauvegarde pas
|
||||
- Champs Proxmox/Audio non exposés → sections vides
|
||||
|
||||
2. **Migration HardwareRenderer partielle** :
|
||||
- `device_detail.js` : seule `renderMotherboardDetails()` migrée
|
||||
- `devices.js` : aucune fonction migrée (utilise encore code dupliqué)
|
||||
- **Impact** : Gain potentiel de -656 lignes non réalisé
|
||||
|
||||
3. **Icônes sections dans device_detail.html** :
|
||||
- Toujours en PNG hardcodé
|
||||
- Pas encore migré vers `data-icon`
|
||||
|
||||
---
|
||||
|
||||
## 📊 Statistiques
|
||||
|
||||
- **Lignes ajoutées** : ~800 (dont 700 dans hardware-renderer.js)
|
||||
- **Fonctions créées** : 12
|
||||
- **Fichiers créés** : 4 (1 JS + 3 MD)
|
||||
- **Fichiers modifiés** : 4
|
||||
- **Icônes migrées** : 18/18 dans devices.js
|
||||
- **Duplications supprimées** : 0 (migration partielle)
|
||||
|
||||
---
|
||||
|
||||
**Dernière mise à jour** : 2026-01-11 (session en cours)
|
||||
Reference in New Issue
Block a user