selector and web

Webapp/views/partials/characters-inventories.ejs

@@ -0,0 +1,30 @@
+<% if (characters.length === 0) { %>
+  <section class="panel">
+    <p class="empty">Aucun personnage trouvé pour ce compte.</p>
+  </section>
+<% } else { %>
+  <% characters.forEach(function(character) { %>
+    <section class="panel character-inventory-block">
+      <div class="character-inventory-head">
+        <div>
+          <h2><%= character.display_name %></h2>
+          <p class="muted character-meta">
+            Niveau <%= character.level %>
+            · <%= character.classLabel %>
+            · <%= character.raceLabel %>
+            · <%= fmt.formatMoney(character.money) %> money
+          </p>
+        </div>
+        <% if (character.isActive) { %>
+          <span class="tag tag-online">Personnage actif</span>
+        <% } %>
+      </div>
+
+      <%- include('inventory-panel', {
+        playerInventory: character.playerInventory,
+        panelTitle: null,
+        embedded: true
+      }) %>
+    </section>
+  <% }); %>
+<% } %>

Webapp/views/partials/inventory-panel.ejs

@@ -0,0 +1,99 @@
+<section class="panel inventory-panel<%= typeof embedded !== 'undefined' && embedded ? ' inventory-panel-embedded' : '' %>">
+  <% if (typeof embedded === 'undefined' || !embedded) { %>
+  <div class="panel-header">
+    <h2><%= typeof panelTitle !== 'undefined' && panelTitle ? panelTitle : 'Inventaire' %></h2>
+    <% if (!playerInventory.isEmpty) { %>
+      <span class="badge"><%= playerInventory.totalItems %> objet(s)</span>
+    <% } %>
+  </div>
+  <% } else if (!playerInventory.isEmpty) { %>
+    <div class="inventory-embedded-meta">
+      <span class="badge"><%= playerInventory.totalItems %> objet(s)</span>
+    </div>
+  <% } %>
+
+  <% if (!db.hasInventoryTable()) { %>
+    <p class="empty">Table inventaire absente. Redémarrez le serveur Hytale pour appliquer la migration personnages.</p>
+  <% } else if (playerInventory.isEmpty) { %>
+    <p class="empty">Inventaire vide. Les objets sont enregistrés à la déconnexion du personnage en jeu.</p>
+  <% } else { %>
+    <div class="inventory-sections">
+      <% playerInventory.sections.forEach(function(section) { %>
+        <div class="inventory-section inventory-section--<%= section.key %>">
+          <div class="inventory-section-head">
+            <h3><%= section.label %></h3>
+            <span class="muted"><%= section.used %> / <%= section.capacity %></span>
+          </div>
+          <div class="inventory-grid cols-<%= section.cols %>">
+            <% section.cells.forEach(function(item) { %>
+              <% if (item) { %>
+                <div class="inventory-slot filled" title="<%= item.name %> · <%= item.itemId %>">
+                  <img
+                    class="slot-icon"
+                    src="<%= item.iconUrl %>"
+                    alt="<%= item.name %>"
+                    loading="lazy"
+                    onerror="this.onerror=null;this.src='/icons/unknown.svg';"
+                  >
+                  <span class="slot-name"><%= item.name %></span>
+                  <% if (item.quantity > 1) { %>
+                    <span class="slot-qty">×<%= item.quantity %></span>
+                  <% } %>
+                  <% if (item.durability) { %>
+                    <span class="slot-dur"><%= item.durability %></span>
+                  <% } %>
+                </div>
+              <% } else { %>
+                <div class="inventory-slot empty" aria-hidden="true"></div>
+              <% } %>
+            <% }); %>
+          </div>
+        </div>
+      <% }); %>
+    </div>
+
+    <details class="inventory-list">
+      <summary>Liste détaillée</summary>
+      <table class="table">
+        <thead>
+          <tr>
+            <th>Section</th>
+            <th>Emplacement</th>
+            <th>Objet</th>
+            <th>Qté</th>
+            <th>Durabilité</th>
+          </tr>
+        </thead>
+        <tbody>
+          <% playerInventory.sections.forEach(function(section) { %>
+            <% section.cells.forEach(function(item, index) { %>
+              <% if (item) { %>
+                <tr>
+                  <td><%= section.label %></td>
+                  <td><%= index + 1 %></td>
+                  <td>
+                    <div class="item-row">
+                      <img
+                        class="item-row-icon"
+                        src="<%= item.iconUrl %>"
+                        alt=""
+                        loading="lazy"
+                        onerror="this.onerror=null;this.src='/icons/unknown.svg';"
+                      >
+                      <div>
+                        <span class="player-name"><%= item.name %></span>
+                        <small class="muted"><%= item.itemId %></small>
+                      </div>
+                    </div>
+                  </td>
+                  <td><%= item.quantity %></td>
+                  <td><%= item.durability || '—' %></td>
+                </tr>
+              <% } %>
+            <% }); %>
+          <% }); %>
+        </tbody>
+      </table>
+    </details>
+  <% } %>
+</section>

Webapp/views/players/profile.ejs

@@ -2,7 +2,7 @@
 
 <%- include('../partials/page-header', { title: player.display_name, subtitle: 'Profil joueur' }) %>
 
-<%- include('../partials/player-card', { player, group, comingSoon }) %>
+<%- include('../partials/player-card', { player, group, comingSoon: false }) %>
 
 <p class="back-link"><a class="link" href="/players">← Retour à la liste</a></p>
 

Webapp/views/profile/account.ejs

@@ -11,9 +11,14 @@
 
 <%- include('../partials/player-card', { player, group, comingSoon: false }) %>
 
-<section class="panel coming-soon">
-  <h2>À venir</h2>
-  <p>Inventaire, historique de combat et gestion avancée du compte seront ajoutés prochainement.</p>
+<section class="panel">
+  <div class="panel-header">
+    <h2>Mes personnages</h2>
+    <span class="badge"><%= characters.length %></span>
+  </div>
+  <p class="muted section-intro">Inventaire sauvegardé à la déconnexion de chaque personnage en jeu.</p>
 </section>
 
+<%- include('../partials/characters-inventories', { characters }) %>
+
 <%- include('../partials/page-end') %>