Update app.py

app.py

@@ -100,7 +100,6 @@ def calculate_polr(bids, asks, mid):
     """
     Path of Least Resistance:
     Simulates eating volume on both sides. 
-    Returns the price path where liquidity is thinnest.
     """
     if not bids or not asks: return []
 
@@ -109,9 +108,9 @@ def calculate_polr(bids, asks, mid):
 
     path_points = []
     
-    # We simulate volume stepping from 0.1 BTC up to 20 BTC
-    # This represents "Time" or "Intensity" on the X-axis of the projection
-    volume_steps = [i * 0.5 for i in range(1, 41)] # 0.5, 1.0 ... 20.0
+    # MODIFIED: Reduced count to 15 distinct lines for performance/clarity
+    # Spaced out volume steps to capture depth
+    volume_steps = [i * 1.5 for i in range(1, 16)] 
     
     current_time = time.time()
     
@@ -139,29 +138,21 @@ def calculate_polr(bids, asks, mid):
         bid_cost_dist = mid - target_bid_price
 
         # 3. Compare Resistance
-        # If moving up 10$ costs 5 BTC, but moving down 10$ costs 20 BTC,
-        # The path of least resistance is UP (it's thinner).
-        
-        # Here we compare the DISTANCE moved for the SAME volume.
-        # If for 5 BTC, Price moves UP $10 and DOWN $2. 
-        # The UP side is "thinner" (less resistance to price change), so price "slips" up.
-        
-        projected_p = mid
-        
-        # Avoid division by zero or tiny spreads
         if bid_cost_dist <= 0: bid_cost_dist = 0.01
         if ask_cost_dist <= 0: ask_cost_dist = 0.01
 
-        # Logic: Price goes where the book is thinner (Distance is LARGER for same volume)
+        projected_p = mid
         if ask_cost_dist > bid_cost_dist:
-             # It takes LESS liquidity to move UP (Price moved further for same vol)
-             projected_p = target_ask_price
+             # UP is harder, Down is easier -> Price goes UP (slip is normally against liquidity, but POLR suggests price follows ease)
+             # Actually, conventionally POLR means price goes where resistance is lowest.
+             # If Ask side is THICK (High dist), and Bid side is THIN (Low dist), price falls.
+             # Logic revised for visualization: We project where price SLIPS to.
+             projected_p = target_ask_price 
         else:
              projected_p = target_bid_price
         
-        # Add slight smoothing/dampening so it connects to current price
         path_points.append({
-            't': current_time + (i * 2), # Spread points out every 2 seconds into future
+            'index': i, # Mark the horizon index
             'p': projected_p
         })
 
@@ -400,7 +391,7 @@ HTML_PAGE = f"""
 
     <div id="p-chart" class="panel">
         <div class="chart-header">
-            PRICE (BLUE) // <span class="c-purp">LEAST RESISTANCE (PURPLE)</span> // <span style="color:var(--yellow)">PRED (YELLOW)</span>
+            PRICE (BLUE) // <span class="c-purp">POLR RIVER (PURPLE FADE)</span> // <span style="color:var(--yellow)">PRED (YELLOW)</span>
         </div>
         <div id="tv-price" style="flex: 1; width: 100%;"></div>
     </div>
@@ -478,14 +469,33 @@ HTML_PAGE = f"""
         }};
 
         const priceChart = LightweightCharts.createChart(document.getElementById('tv-price'), chartOpts);
-        const priceSeries = priceChart.addLineSeries({{ color: '#2979ff', lineWidth: 2, title: 'Price' }}); 
         
-        // Yellow Line: Mathematical Micro-Price
-        const predSeries = priceChart.addLineSeries({{ color: '#ffeb3b', lineWidth: 2, lineStyle: 2, title: 'Math Forecast' }});
+        // --- POLR RIVER INITIALIZATION ---
+        // We create an array of series. Index 0 = Nearest Term, Index N = Long Term
+        const polrLines = [];
+        const polrCount = 15; // Matches backend
         
-        // Purple Line: Path of Least Resistance (Lowest Volume)
-        const polrSeries = priceChart.addLineSeries({{ color: '#d500f9', lineWidth: 3, lineStyle: 0, title: 'Least Resistance' }});
+        for(let i=0; i<polrCount; i++) {{
+            // Calculate opacity: Nearest = 1.0, Furthest = 0.1
+            const opacity = 1.0 - (i / (polrCount + 2)); 
+            const color = `rgba(213, 0, 249, ${{opacity.toFixed(2)}})`; // Purple fade
+            
+            polrLines.push(
+                priceChart.addLineSeries({{
+                    color: color,
+                    lineWidth: 1,
+                    crosshairMarkerVisible: false,
+                    lastValueVisible: false,
+                    priceLineVisible: false,
+                    title: '' 
+                }})
+            );
+        }}
+        // --------------------------------
 
+        const priceSeries = priceChart.addLineSeries({{ color: '#2979ff', lineWidth: 2, title: 'Price' }}); 
+        const predSeries = priceChart.addLineSeries({{ color: '#ffeb3b', lineWidth: 2, lineStyle: 2, title: 'Math Forecast' }});
+        
         const candleChart = LightweightCharts.createChart(document.getElementById('tv-candles'), {{
             ...chartOpts, 
             timeScale: {{ timeVisible: true, secondsVisible: false }}
@@ -533,19 +543,6 @@ HTML_PAGE = f"""
             }}
         }}).observe(document.body);
 
-        ['tv-price', 'tv-candles', 'tv-net', 'sidebar-vol', 'sidebar-density'].forEach(id => {{
-            new ResizeObserver(e => {{
-                 const t = document.getElementById(id);
-                 if (t.clientWidth && t.clientHeight) {{
-                    if(id === 'tv-price') priceChart.applyOptions({{ width: t.clientWidth, height: t.clientHeight }});
-                    if(id === 'tv-candles') candleChart.applyOptions({{ width: t.clientWidth, height: t.clientHeight }});
-                    if(id === 'tv-net') netChart.applyOptions({{ width: t.clientWidth, height: t.clientHeight }});
-                    if(id === 'sidebar-vol') volChart.applyOptions({{ width: t.clientWidth, height: t.clientHeight }});
-                    if(id === 'sidebar-density') denChart.applyOptions({{ width: t.clientWidth, height: t.clientHeight }});
-                 }}
-            }}).observe(document.getElementById(id));
-        }});
-
         function connect() {{
             const ws = new WebSocket((location.protocol === 'https:' ? 'wss' : 'ws') + '://' + location.host + '/ws');
             
@@ -580,16 +577,19 @@ HTML_PAGE = f"""
                         dom.score.style.color = rho > 0 ? "var(--green)" : (rho < 0 ? "var(--red)" : "var(--text-main)");
                     }}
 
-                    // 2. Purple Line (Path of Least Resistance)
+                    // 2. Purple River (POLR)
+                    // We update each line individually based on the received array
                     if (data.polr && data.polr.length) {{
-                        // Attach start of POLR to current price to make it seamless
-                        const polrData = [
-                            {{ time: lastTime, value: lastP }},
-                            ...data.polr.map(d => ({{ time: Math.floor(d.t), value: d.p }}))
-                        ];
-                        // Deduplicate times
-                        const uniquePolr = [...new Map(polrData.map(i => [i.time, i])).values()];
-                        polrSeries.setData(uniquePolr);
+                        // We use .update() here to build the history of the prediction lines
+                        // corresponding to the current time tick
+                        data.polr.forEach((point, index) => {{
+                            if (index < polrLines.length) {{
+                                polrLines[index].update({{
+                                    time: lastTime, 
+                                    value: point.p
+                                }});
+                            }}
+                        }});
                     }}
                 }}