Enter search criteria above and click "Search Items" to find inventory items.
diff --git a/static/inventory.js b/static/inventory.js
index fa4a9a8a..ccefa559 100644
--- a/static/inventory.js
+++ b/static/inventory.js
@@ -34,7 +34,7 @@ document.addEventListener('DOMContentLoaded', function() {
initializeEventListeners();
loadCharacterOptions();
- renderColumnToggles();
+ renderHiddenColumnsBar();
});
/**
@@ -504,28 +504,40 @@ function saveColumnVisibility() {
localStorage.setItem('inventoryColumnVisibility', JSON.stringify(columnVisibility));
}
-function renderColumnToggles() {
- const container = document.getElementById('columnToggles');
- if (!container) return;
- container.innerHTML = '';
- RESULT_COLUMNS.forEach(col => {
- const label = document.createElement('label');
- label.style.cssText = 'display:inline-flex;align-items:center;gap:2px;font-size:9px;margin-right:6px;cursor:pointer;';
- const cb = document.createElement('input');
- cb.type = 'checkbox';
- cb.checked = columnVisibility[col.key] !== false;
- cb.style.cssText = 'width:10px;height:10px;margin:0;';
- cb.addEventListener('change', () => {
- columnVisibility[col.key] = cb.checked;
+function renderHiddenColumnsBar() {
+ const bar = document.getElementById('hiddenColumnsBar');
+ const list = document.getElementById('hiddenColumnsList');
+ if (!bar || !list) return;
+
+ const hidden = RESULT_COLUMNS.filter(c => columnVisibility[c.key] === false);
+ if (hidden.length === 0) {
+ bar.style.display = 'none';
+ return;
+ }
+
+ bar.style.display = 'flex';
+ list.innerHTML = '';
+ hidden.forEach(col => {
+ const btn = document.createElement('button');
+ btn.textContent = `+ ${col.label}`;
+ btn.style.cssText = 'font-size:9px;padding:1px 5px;border:1px solid #999;background:#fff;cursor:pointer;border-radius:3px;margin-right:3px;';
+ btn.addEventListener('click', () => {
+ columnVisibility[col.key] = true;
saveColumnVisibility();
if (currentResultsData) displayResults(currentResultsData);
+ renderHiddenColumnsBar();
});
- label.appendChild(cb);
- label.appendChild(document.createTextNode(col.label));
- container.appendChild(label);
+ list.appendChild(btn);
});
}
+function hideColumn(key) {
+ columnVisibility[key] = false;
+ saveColumnVisibility();
+ if (currentResultsData) displayResults(currentResultsData);
+ renderHiddenColumnsBar();
+}
+
/**
* Display search results in the UI
*/
@@ -551,7 +563,7 @@ function displayResults(data) {
- ${visibleCols.map(c => `| ${c.label}${getSortIcon(c.sort)} | `).join('\n ')}
+ ${visibleCols.map(c => `${c.label}${getSortIcon(c.sort)}\u00d7 | `).join('\n ')}
@@ -577,14 +589,26 @@ function displayResults(data) {
searchResults.innerHTML = html;
- // Add click event listeners to sortable headers
- document.querySelectorAll('.sortable').forEach(header => {
- header.addEventListener('click', () => {
- const sortField = header.getAttribute('data-sort');
+ // Add click event listeners to sortable headers (click label to sort)
+ document.querySelectorAll('.sortable .th-label').forEach(label => {
+ label.style.cursor = 'pointer';
+ label.addEventListener('click', () => {
+ const sortField = label.closest('th').getAttribute('data-sort');
handleSort(sortField);
});
});
+ // Add click event listeners to hide buttons
+ document.querySelectorAll('.th-hide').forEach(btn => {
+ btn.addEventListener('click', (e) => {
+ e.stopPropagation();
+ hideColumn(btn.getAttribute('data-col'));
+ });
+ });
+
+ // Update hidden columns bar
+ renderHiddenColumnsBar();
+
// Initialize resizable columns
initResizableColumns();
}