Add Hide All / Show All button for indicators

- Add visibility-toggle button next to Clear All button
- Button toggles between 'Hide All' and 'Show All' text
- Hides/shows all indicators with single click
- Uses event delegation to handle button clicks in container
This commit is contained in:
DiTus
2026-02-26 20:38:26 +01:00
parent 5059a7a8b6
commit 659571cbc5

View File

@ -119,6 +119,9 @@ export function renderIndicatorPanel() {
const favoriteIds = new Set(userPresets.favorites || []);
const allVisible = activeIndicators.length > 0 ? activeIndicators.every(ind => ind.visible !== false) : false;
const visibilityBtnText = allVisible ? 'Hide All' : 'Show All';
container.innerHTML = `
<div class="indicator-panel">
<!-- Search Bar -->
@ -162,6 +165,7 @@ export function renderIndicatorPanel() {
<div class="indicator-section active">
<div class="section-title">
${activeIndicators.length} Active
${activeIndicators.length > 0 ? `<button class="visibility-toggle">${visibilityBtnText}</button>` : ''}
${activeIndicators.length > 0 ? `<button class="clear-all">Clear All</button>` : ''}
</div>
${activeIndicators.slice().reverse().map(ind => renderActiveIndicator(ind)).join('')}
@ -392,6 +396,15 @@ function setupEventListeners() {
return;
}
// Visibility toggle (Hide All / Show All) button
const visibilityToggleBtn = e.target.closest('.visibility-toggle');
if (visibilityToggleBtn) {
if (window.toggleAllIndicatorsVisibility) {
window.toggleAllIndicatorsVisibility();
}
return;
}
// Expand/collapse button
const expandBtn = e.target.closest('.indicator-btn.expand');
if (expandBtn) {
@ -481,6 +494,17 @@ window.clearAllIndicators = function() {
drawIndicatorsOnChart();
}
window.toggleAllIndicatorsVisibility = function() {
const allVisible = activeIndicators.every(ind => ind.visible !== false);
activeIndicators.forEach(ind => {
ind.visible = !allVisible;
});
drawIndicatorsOnChart();
renderIndicatorPanel();
}
function removeIndicatorById(id) {
const idx = activeIndicators.findIndex(a => a.id === id);
if (idx < 0) return;