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