anotate ui phase 1

2025-10-18 16:37:13 +03:00
parent d136f9d79c
commit bc7095308a
26 changed files with 3616 additions and 80 deletions
--- a/TESTCASES/web/static/js/time_navigator.js
+++ b/TESTCASES/web/static/js/time_navigator.js
@@ -0,0 +1,146 @@
+/**
+ * TimeNavigator - Handles time navigation and data loading
+ */
+
+class TimeNavigator {
+    constructor(chartManager) {
+        this.chartManager = chartManager;
+        this.currentTime = null;
+        this.timeRange = '1d'; // Default 1 day range
+        
+        console.log('TimeNavigator initialized');
+    }
+    
+    /**
+     * Navigate to specific time
+     */
+    navigateToTime(timestamp) {
+        this.currentTime = timestamp;
+        console.log('Navigating to time:', new Date(timestamp));
+        
+        // Load data for this time range
+        this.loadDataRange(timestamp);
+        
+        // Sync charts
+        this.chartManager.syncTimeNavigation(timestamp);
+    }
+    
+    /**
+     * Navigate to current time
+     */
+    navigateToNow() {
+        const now = Date.now();
+        this.navigateToTime(now);
+    }
+    
+    /**
+     * Scroll forward in time
+     */
+    scrollForward(increment = null) {
+        if (!increment) {
+            increment = this.getIncrementForRange();
+        }
+        
+        const newTime = (this.currentTime || Date.now()) + increment;
+        this.navigateToTime(newTime);
+    }
+    
+    /**
+     * Scroll backward in time
+     */
+    scrollBackward(increment = null) {
+        if (!increment) {
+            increment = this.getIncrementForRange();
+        }
+        
+        const newTime = (this.currentTime || Date.now()) - increment;
+        this.navigateToTime(newTime);
+    }
+    
+    /**
+     * Set time range
+     */
+    setTimeRange(range) {
+        this.timeRange = range;
+        console.log('Time range set to:', range);
+        
+        // Reload data with new range
+        if (this.currentTime) {
+            this.loadDataRange(this.currentTime);
+        }
+    }
+    
+    /**
+     * Load data for time range
+     */
+    loadDataRange(centerTime) {
+        // Show loading indicator
+        const loadingEl = document.getElementById('chart-loading');
+        if (loadingEl) {
+            loadingEl.classList.remove('d-none');
+        }
+        
+        // Calculate start and end times based on range
+        const rangeMs = this.getRangeInMs(this.timeRange);
+        const startTime = centerTime - (rangeMs / 2);
+        const endTime = centerTime + (rangeMs / 2);
+        
+        // Fetch data
+        fetch('/api/chart-data', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({
+                symbol: window.appState.currentSymbol,
+                timeframes: window.appState.currentTimeframes,
+                start_time: new Date(startTime).toISOString(),
+                end_time: new Date(endTime).toISOString()
+            })
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.success) {
+                this.chartManager.updateCharts(data.chart_data);
+            } else {
+                window.showError('Failed to load chart data: ' + data.error.message);
+            }
+        })
+        .catch(error => {
+            window.showError('Network error: ' + error.message);
+        })
+        .finally(() => {
+            if (loadingEl) {
+                loadingEl.classList.add('d-none');
+            }
+        });
+    }
+    
+    /**
+     * Get increment for current range
+     */
+    getIncrementForRange() {
+        const rangeMs = this.getRangeInMs(this.timeRange);
+        return rangeMs / 10; // Move by 10% of range
+    }
+    
+    /**
+     * Convert range string to milliseconds
+     */
+    getRangeInMs(range) {
+        const units = {
+            '1h': 60 * 60 * 1000,
+            '4h': 4 * 60 * 60 * 1000,
+            '1d': 24 * 60 * 60 * 1000,
+            '1w': 7 * 24 * 60 * 60 * 1000
+        };
+        
+        return units[range] || units['1d'];
+    }
+    
+    /**
+     * Setup keyboard shortcuts
+     */
+    setupKeyboardShortcuts() {
+        // Keyboard shortcuts are handled in the main template
+        console.log('Keyboard shortcuts ready');
+    }
+}