live updates wip

ANNOTATE/web/templates/components/control_panel.html

@@ -118,9 +118,52 @@
     // Symbol selection
     document.getElementById('symbol-select').addEventListener('change', function(e) {
         appState.currentSymbol = e.target.value;
+        
+        // Reload annotations for new symbol
+        reloadAnnotationsForSymbol(appState.currentSymbol);
+        
+        // Reload chart data
         loadInitialData();
     });
     
+    // Function to reload annotations when symbol changes
+    function reloadAnnotationsForSymbol(symbol) {
+        fetch('/api/get-annotations', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ symbol: symbol })
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.success) {
+                // Update app state with filtered annotations
+                appState.annotations = data.annotations;
+                
+                // Clear existing annotations from chart
+                if (appState.chartManager) {
+                    appState.chartManager.clearAllAnnotations();
+                    
+                    // Add new annotations to chart
+                    data.annotations.forEach(annotation => {
+                        appState.chartManager.addAnnotation(annotation);
+                    });
+                }
+                
+                // Update annotation list UI
+                if (typeof renderAnnotationsList === 'function') {
+                    renderAnnotationsList(appState.annotations);
+                }
+                
+                console.log(`Loaded ${data.count} annotations for ${symbol}`);
+            } else {
+                console.error('Failed to load annotations:', data.error);
+            }
+        })
+        .catch(error => {
+            console.error('Error loading annotations:', error);
+        });
+    }
+    
     // Timeframe checkboxes
     document.querySelectorAll('.form-check-input[id^="tf-"]').forEach(checkbox => {
         checkbox.addEventListener('change', function() {

ANNOTATE/web/templates/components/training_panel.html

@@ -376,7 +376,8 @@
             headers: { 'Content-Type': 'application/json' },
             body: JSON.stringify({
                 model_name: modelName,
-                annotation_ids: annotationIds
+                annotation_ids: annotationIds,
+                symbol: appState.currentSymbol  // CRITICAL: Filter by current symbol
             })
         })
             .then(response => response.json())
@@ -568,6 +569,38 @@
             });
     });
 
+    function updatePredictionHistory() {
+        const historyDiv = document.getElementById('prediction-history');
+        if (predictionHistory.length === 0) {
+            historyDiv.innerHTML = '<div class="text-muted">No predictions yet...</div>';
+            return;
+        }
+        
+        // Display last 5 predictions (most recent first)
+        const html = predictionHistory.slice(0, 5).map(pred => {
+            const time = new Date(pred.timestamp).toLocaleTimeString();
+            const actionColor = pred.action === 'BUY' ? 'text-success' : 
+                               pred.action === 'SELL' ? 'text-danger' : 'text-secondary';
+            const confidence = (pred.confidence * 100).toFixed(1);
+            const price = pred.predicted_price ? pred.predicted_price.toFixed(2) : '--';
+            
+            return `
+                <div class="d-flex justify-content-between align-items-center mb-1 pb-1 border-bottom">
+                    <div>
+                        <span class="${actionColor} fw-bold">${pred.action}</span>
+                        <span class="text-muted ms-1">${time}</span>
+                    </div>
+                    <div class="text-end">
+                        <div>${confidence}%</div>
+                        <div class="text-muted" style="font-size: 0.65rem;">$${price}</div>
+                    </div>
+                </div>
+            `;
+        }).join('');
+        
+        historyDiv.innerHTML = html;
+    }
+    
     function startSignalPolling() {
         signalPollInterval = setInterval(function () {
             // Poll for signals
@@ -580,6 +613,18 @@
                         document.getElementById('latest-confidence').textContent =
                             (latest.confidence * 100).toFixed(1) + '%';
 
+                        // Add to prediction history (keep last 5)
+                        predictionHistory.unshift({
+                            timestamp: latest.timestamp || new Date().toISOString(),
+                            action: latest.action,
+                            confidence: latest.confidence,
+                            predicted_price: latest.predicted_price
+                        });
+                        if (predictionHistory.length > 5) {
+                            predictionHistory = predictionHistory.slice(0, 5);
+                        }
+                        updatePredictionHistory();
+
                         // Update chart with signal markers
                         if (appState.chartManager) {
                             displaySignalOnChart(latest);