Fix indicator panel UI bugs
- Fixed expand button not working (added data-id attribute) - Removed duplicate empty Parameters section - Fixed preset rendering (incorrect variable reference preset→p) - Added resetIndicator function to reset params to defaults - Added removeIndicator function tied to Remove button - Fixed preset display bug causing reference error
This commit is contained in:
@ -238,7 +238,7 @@ function renderActiveIndicator(indicator) {
|
|||||||
<button class="indicator-btn favorite" onclick="event.stopPropagation(); window.toggleFavorite && window.toggleFavorite('${indicator.type}')" title="Add to favorites">
|
<button class="indicator-btn favorite" onclick="event.stopPropagation(); window.toggleFavorite && window.toggleFavorite('${indicator.type}')" title="Add to favorites">
|
||||||
${isFavorite ? '★' : '☆'}
|
${isFavorite ? '★' : '☆'}
|
||||||
</button>
|
</button>
|
||||||
<button class="indicator-btn expand ${isExpanded ? 'rotated' : ''}" title="Show settings">
|
<button class="indicator-btn expand ${isExpanded ? 'rotated' : ''}" data-id="${indicator.id}" title="Show settings">
|
||||||
${isExpanded ? '▼' : '▶'}
|
${isExpanded ? '▼' : '▶'}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@ -320,31 +320,6 @@ function renderIndicatorConfig(indicator, meta) {
|
|||||||
`).join('')}
|
`).join('')}
|
||||||
</div>
|
</div>
|
||||||
` : ''}
|
` : ''}
|
||||||
</div>
|
|
||||||
|
|
||||||
${meta?.inputs && meta.inputs.length > 0 ? `
|
|
||||||
<div class="config-section">
|
|
||||||
<div class="section-subtitle">Parameters</div>
|
|
||||||
${meta.inputs.map(input => `
|
|
||||||
${console.log("[DEBUG] Input:", input.name, "value:", indicator.params[input.name])}`
|
|
||||||
<label>${input.label}</label>
|
|
||||||
${input.type === 'select' ?
|
|
||||||
`<select onchange="window.updateIndicatorSetting && window.updateIndicatorSetting('${indicator.id}', '${input.name}', this.value)">
|
|
||||||
${input.options.map(o => `<option value="${o}" ${indicator.params[input.name] === o ? 'selected' : ''}>${o}</option>`).join('')}
|
|
||||||
</select>` :
|
|
||||||
`<input
|
|
||||||
type="number"
|
|
||||||
value="${indicator.params[input.name]}"
|
|
||||||
${input.min !== undefined ? `min="${input.min}"` : ''}
|
|
||||||
${input.max !== undefined ? `max="${input.max}"` : ''}
|
|
||||||
${input.step !== undefined ? `step="${input.step}"` : ''}
|
|
||||||
onchange="window.updateIndicatorSetting && window.updateIndicatorSetting('${indicator.id}', '${input.name}', parseFloat(this.value))"
|
|
||||||
>`
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
`).join('')}
|
|
||||||
</div>
|
|
||||||
` : ''}
|
|
||||||
|
|
||||||
<div class="config-section">
|
<div class="config-section">
|
||||||
<div class="section-subtitle">
|
<div class="section-subtitle">
|
||||||
@ -369,13 +344,13 @@ function renderIndicatorPresets(indicator, meta) {
|
|||||||
<div class="presets-list">
|
<div class="presets-list">
|
||||||
${presets.map(p => {
|
${presets.map(p => {
|
||||||
const isApplied = meta.inputs.every(input =>
|
const isApplied = meta.inputs.every(input =>
|
||||||
(indicator.params[input.name] === (preset.values?.[input.name] ?? input.default))
|
(indicator.params[input.name] === (p.values?.[input.name] ?? input.default))
|
||||||
);
|
);
|
||||||
|
|
||||||
return `
|
return `
|
||||||
<div class="preset-item ${isApplied ? 'applied' : ''}" data-preset="${preset.id}">
|
<div class="preset-item ${isApplied ? 'applied' : ''}" data-preset="${p.id}">
|
||||||
<span class="preset-label" onclick="window.applyPreset && window.applyPreset('${indicator.id}', '${preset.id}')">${preset.name}</span>
|
<span class="preset-label" onclick="window.applyPreset && window.applyPreset('${indicator.id}', '${p.id}')">${p.name}</span>
|
||||||
<button class="preset-delete" onclick="window.deletePreset && window.deletePreset('${preset.id}')">×</button>
|
<button class="preset-delete" onclick="window.deletePreset && window.deletePreset('${p.id}')">×</button>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}).join('')}
|
}).join('')}
|
||||||
@ -851,11 +826,36 @@ export function drawIndicatorsOnChart() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function resetIndicator(id) {
|
||||||
|
const indicator = activeIndicators.find(a => a.id === id);
|
||||||
|
if (!indicator) return;
|
||||||
|
|
||||||
|
const IndicatorClass = IR[indicator.type];
|
||||||
|
if (!IndicatorClass) return;
|
||||||
|
|
||||||
|
const instance = new IndicatorClass({ type: indicator.type, params: {}, name: '' });
|
||||||
|
const meta = instance.getMetadata();
|
||||||
|
if (!meta || !meta.inputs) return;
|
||||||
|
|
||||||
|
meta.inputs.forEach(input => {
|
||||||
|
indicator.params[input.name] = input.default;
|
||||||
|
});
|
||||||
|
|
||||||
|
renderIndicatorPanel();
|
||||||
|
drawIndicatorsOnChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeIndicator(id) {
|
||||||
|
removeIndicatorById(id);
|
||||||
|
}
|
||||||
|
|
||||||
// Export functions for module access
|
// Export functions for module access
|
||||||
export { addIndicator, removeIndicatorById };
|
export { addIndicator, removeIndicatorById };
|
||||||
|
|
||||||
// Legacy compatibility functions
|
// Legacy compatibility functions
|
||||||
window.renderIndicatorList = renderIndicatorPanel;
|
window.renderIndicatorList = renderIndicatorPanel;
|
||||||
|
window.resetIndicator = resetIndicator;
|
||||||
|
window.removeIndicator = removeIndicator;
|
||||||
window.toggleIndicator = addIndicator;
|
window.toggleIndicator = addIndicator;
|
||||||
window.showIndicatorConfig = function(id) {
|
window.showIndicatorConfig = function(id) {
|
||||||
const ind = activeIndicators.find(a => a.id === id);
|
const ind = activeIndicators.find(a => a.id === id);
|
||||||
|
|||||||
Reference in New Issue
Block a user