OptionsChart

Sleeping

App Files Files Community

topsecrettraders commited on Jan 8

Commit

021ae66

verified ·

1 Parent(s): 08b7277

Update app.py

Browse files

Files changed (1) hide show

app.py +56 -69

app.py CHANGED Viewed

@@ -48,9 +48,12 @@ INDEX_MAP = {
 def get_root_symbol(desc: str, symbol: str) -> str:
     """Extracts root symbol (e.g. 'RELIANCE', 'CRUDEOIL') from description."""
     try:
         parts = desc.strip().split(' ')
         return parts[0].upper()
     except:
         if ':' in symbol:
             return symbol.split(':')[1]
         return symbol
@@ -75,7 +78,7 @@ def update_master_db():
             header=0, on_bad_lines='skip', storage_options=headers
         )
-        # 2. Download MCX F&O
         url_mcx = "https://public.fyers.in/sym_details/MCX_COM.csv"
         df_mcx = pd.read_csv(
             url_mcx, usecols=[0, 1, 8, 9, 13],
@@ -105,6 +108,7 @@ def update_master_db():
                 if root in INDEX_MAP:
                     spot_sym = INDEX_MAP[root]
                 elif sym.startswith("MCX"):
                     spot_sym = "MCX"
                 else:
                     spot_sym = f"NSE:{root}-EQ"
@@ -124,7 +128,9 @@ def update_master_db():
                 parts = desc.strip().split(' ')
                 if len(parts) >= 2:
                     try:
                         val = parts[-2]
                         val_clean = val.replace('.', '', 1)
                         if val_clean.isdigit():
                             strike = float(val)
@@ -139,12 +145,14 @@ def update_master_db():
         # Final Sort
         final_db = {}
         for root, data in temp_db.items():
             sorted_items = sorted(data["items"], key=lambda x: (x['e'], x['k']))
             final_db[root] = { "spot": data["spot"], "items": sorted_items }
         MASTER_DB = final_db
         SEARCH_INDEX = sorted(list(MASTER_DB.keys()))
         with open(CACHE_FILE, "w") as f:
             json.dump(final_db, f)
@@ -163,6 +171,7 @@ def startup_event():
     global MASTER_DB, SEARCH_INDEX
     if os.path.exists(CACHE_FILE):
         try:
             with open(CACHE_FILE, "r") as f:
                 MASTER_DB = json.load(f)
             SEARCH_INDEX = sorted(list(MASTER_DB.keys()))
@@ -197,6 +206,7 @@ def home(access_token: Optional[str] = Cookie(None)):
         </div>
         """)
     return HTMLResponse(HTML_TEMPLATE.replace("{{USER_TOKEN}}", access_token))
 @app.get("/callback")
@@ -226,7 +236,7 @@ def logout():
 @app.get("/favicon.ico")
 def favicon():
-    return Response(status_code=204)
 # --- API ---
@@ -234,6 +244,7 @@ def favicon():
 def get_status():
     return JSONResponse(SYSTEM_STATUS)
 @app.get("/api/init")
 def legacy_init():
     return JSONResponse([])
@@ -244,7 +255,9 @@ def search_symbol(q: str = Query(..., min_length=1)):
         return JSONResponse([])
     query = q.upper()
     results = [x for x in SEARCH_INDEX if x.startswith(query)]
     if len(results) < 10:
         results += [x for x in SEARCH_INDEX if query in x and x not in results]
@@ -273,7 +286,7 @@ HTML_TEMPLATE = """
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>PRO CHAIN (Full)</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;800&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
     <style>
@@ -287,42 +300,36 @@ HTML_TEMPLATE = """
         * { box-sizing: border-box; }
         body { margin: 0; background: var(--bg); color: var(--text-main); font-family: 'Inter', sans-serif; height: 100vh; display: flex; flex-direction: column; overflow: hidden; }
-        /* HEADER */
-        .top-nav { padding: 0 15px; background: #fff; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; height: 60px; z-index: 10; flex-shrink: 0; }
-        .btn { background: #fff; border: 1px solid var(--border); padding: 8px 14px; font-size: 12px; border-radius: 6px; cursor: pointer; font-weight: 700; display: flex; gap: 8px; align-items: center; transition:0.2s; white-space:nowrap; }
         .btn:hover { border-color: var(--accent); color: var(--accent); background:#f0f7ff; }
-        .search-box { position: relative; width: 250px; margin-right: 15px; }
-        .search-input { width: 100%; padding: 10px 12px; border: 2px solid var(--border); border-radius: 6px; font-family: 'JetBrains Mono', monospace; font-weight: bold; font-size: 14px; outline: none; }
         .search-input:focus { border-color: var(--accent); }
-        .search-dropdown { position: absolute; top: 100%; left: 0; width: 100%; background: white; border: 1px solid var(--border); border-top: none; max-height: 250px; overflow-y: auto; display: none; box-shadow: 0 10px 20px rgba(0,0,0,0.1); border-radius: 0 0 6px 6px; z-index: 100; }
         .search-item { padding: 10px 15px; cursor: pointer; border-bottom: 1px solid #eee; font-size: 13px; font-weight: 600; }
         .search-item:hover { background: #f0f7ff; color: var(--accent); }
-        /* MAIN GRID */
-        .grid-layout { display: flex; height: calc(100vh - 60px); width: 100%; }
-        /* OPTION CHAIN */
-        .chain-panel { flex: 1; display: flex; flex-direction: column; position: relative; min-width: 0; }
-        .chain-header { display: grid; grid-template-columns: 1fr 140px 1fr; padding: 10px 0; background: #f8f9fa; border-bottom: 1px solid var(--border); font-size: 11px; font-weight: 700; text-align: center; color: var(--text-sub); }
         .chain-body { flex: 1; overflow-y: auto; background: #fff; }
-        .row { display: grid; grid-template-columns: 1fr 140px 1fr; border-bottom: 1px solid #f0f0f0; height: 45px; align-items: center; font-family: 'JetBrains Mono'; font-size: 12px; }
         .row.atm { background: var(--atm-bg); border-top: 1px solid var(--accent); border-bottom: 1px solid var(--accent); }
-        .mid-col { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
         .visual-bar { position: absolute; top: 6px; bottom: 6px; z-index: 0; border-radius: 4px; transition: 0.3s; opacity: 0.8; }
-        .strike-txt { z-index: 2; font-weight: 800; font-size: 14px; }
         .delta-txt { z-index: 2; font-size: 10px; font-weight: 600; background: rgba(255,255,255,0.7); padding: 0 4px; border-radius: 3px; }
-        .side-col { padding: 0 12px; display: flex; justify-content: space-between; color: #666; font-size: 11px; }
-        /* FUTURES PANEL */
-        .fut-panel { width: 300px; background: var(--panel); border-left: 1px solid var(--border); display: flex; flex-direction: column; overflow-y: auto; }
-        .fut-card { padding: 15px; background: #fff; border-bottom: 1px solid var(--border); }
         .meter-bg { height: 6px; background: #eee; border-radius: 3px; display: flex; overflow: hidden; margin-top: 5px; }
-        /* MODAL */
         .modal { position: fixed; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.4); z-index: 1000; display: none; justify-content: center; align-items: center; }
         .modal-box { background: #fff; width: 400px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 20px; max-height: 80vh; display:flex; flex-direction:column;}
         .modal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 15px; overflow-y: auto; }
@@ -337,22 +344,6 @@ HTML_TEMPLATE = """
         @keyframes blink { 0% { opacity: 0.5; } 50% { opacity: 1; } 100% { opacity: 0.5; } }
         .live { animation: blink 1s infinite; background: var(--green) !important; }
         .spin-icon { animation: spin 1s linear infinite; }
-        /* --- MOBILE TWEAKS --- */
-        @media (max-width: 768px) {
-            /* Force vertical stack on mobile to give chain full width */
-            .grid-layout { flex-direction: column; }
-            /* Chain takes 65% height */
-            .chain-panel { flex: none; height: 65%; border-bottom: 1px solid var(--border); }
-            /* Futures takes rest */
-            .fut-panel { width: 100%; flex: 1; border-left: none; }
-            /* Allow Header to scroll horizontally if crowded */
-            .top-nav { overflow-x: auto; gap: 10px; padding: 0 10px; }
-            .search-box { width: 180px; flex-shrink: 0; }
-        }
     </style>
 </head>
 <body>
@@ -373,43 +364,47 @@ HTML_TEMPLATE = """
 </div>
 <div class="top-nav">
-    <div class="search-box">
-        <input type="text" class="search-input" id="searchInp" placeholder="SEARCH..." autocomplete="off">
-        <div class="search-dropdown" id="searchRes"></div>
-    </div>
-    <div style="display:flex; align-items:center; gap:10px;">
         <button class="btn" onclick="refreshDB()" id="refreshBtn">
             <svg id="refIcon" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path></svg>
         </button>
         <div style="text-align:right;">
-            <div style="font-size:9px; font-weight:700; color:#888;" id="spotLabel">SPOT</div>
-            <div id="spotPrice" style="font-family:'JetBrains Mono'; font-weight:800; font-size:14px;">0.00</div>
         </div>
         <button class="btn" onclick="document.getElementById('expModal').style.display='flex'">
-            <span id="selExpTxt">EXP</span>
         </button>
         <button class="btn" onclick="location.href='/logout'" style="border-color:var(--red); color:var(--red);">LOGOUT</button>
-        <div id="statusDot" style="width:10px; height:10px; background:#ccc; border-radius:50%; flex-shrink:0;"></div>
     </div>
 </div>
 <div class="grid-layout">
     <div class="chain-panel">
         <div class="chain-header">
-            <div>CALL OI</div>
-            <div>NET (P-C)</div>
-            <div>PUT OI</div>
         </div>
         <div class="chain-body" id="chainBody">
-            <div style="padding:40px; text-align:center; color:#999; font-weight:600;">USE SEARCH TO LOAD</div>
         </div>
     </div>
-    <div class="fut-panel" id="futBody"></div>
 </div>
 <script>
@@ -425,7 +420,6 @@ HTML_TEMPLATE = """
     let POLLER = null;
     let IS_POLLING = false;
     let SEARCH_TIMER = null;
-    let SCROLLED_ONCE = false;
     window.onload = () => {
         if(AUTH_TOKEN.indexOf("{{") !== -1) { alert("Auth Error"); return; }
@@ -456,7 +450,7 @@ HTML_TEMPLATE = """
     }
     async function refreshDB() {
-        if(!confirm("Force Download Master Data?")) return;
         document.getElementById('loader').style.display = 'flex';
         await fetch('/api/refresh');
         checkStatus();
@@ -480,7 +474,6 @@ HTML_TEMPLATE = """
         document.getElementById('searchRes').style.display = 'none';
         document.getElementById('loaderMsg').innerText = "LOADING CHAIN...";
         document.getElementById('loader').style.display = 'flex';
-        SCROLLED_ONCE = false; // Reset scroll flag
         try {
             const res = await fetch(`/api/chain?symbol=${root}`);
@@ -491,10 +484,11 @@ HTML_TEMPLATE = """
             CHAIN_DATA = data.items;
             SPOT_SYM = data.spot;
             FUT_SYMS = CHAIN_DATA.filter(x => x.t === 'FUT').sort((a,b) => a.e - b.e).slice(0, 3);
             if(SPOT_SYM === "MCX" && FUT_SYMS.length > 0) {
-                SPOT_SYM = FUT_SYMS[0].s;
             }
             document.getElementById('spotLabel').innerText = (SPOT_SYM.includes('INDEX') || SPOT_SYM.includes('-EQ')) ? "SPOT" : "FUT REF";
@@ -530,7 +524,6 @@ HTML_TEMPLATE = """
     function selectExp(ts) {
         ACTIVE_EXP = ts;
-        SCROLLED_ONCE = false;
         updateExpText(ts);
         closeModal();
         buildChain();
@@ -562,6 +555,7 @@ HTML_TEMPLATE = """
             </div>
         `).join('');
         restartPoller();
     }
@@ -580,24 +574,17 @@ HTML_TEMPLATE = """
             if(SPOT_PRICE > 0) {
                 const kList = Array.from(document.querySelectorAll('.row')).map(r => parseFloat(r.dataset.k));
-                // Find closest strike
                 let closestK = kList[0], minDiff = 999999;
                 kList.forEach(k => {
                    const diff = Math.abs(SPOT_PRICE - k);
                    if(diff < minDiff) { minDiff = diff; closestK = k; }
                 });
-                // Highlight ATM
                 document.querySelectorAll('.atm').forEach(e => e.classList.remove('atm'));
                 const atmRow = document.getElementById(`row-${closestK}`);
                 if(atmRow) {
                     atmRow.classList.add('atm');
-                    // AUTO SCROLL TO ATM (Center of Screen) - Runs once per selection
-                    if(!SCROLLED_ONCE) {
-                        atmRow.scrollIntoView({block: "center", behavior: "auto"});
-                        SCROLLED_ONCE = true;
-                    }
                 }
                 const centerIdx = kList.indexOf(closestK);

 def get_root_symbol(desc: str, symbol: str) -> str:
     """Extracts root symbol (e.g. 'RELIANCE', 'CRUDEOIL') from description."""
     try:
+        # MCX often has description "CRUDEOIL 19 JAN 6000 CE"
+        # NSE often has "RELIANCE 24 JAN..."
         parts = desc.strip().split(' ')
         return parts[0].upper()
     except:
+        # Fallback to symbol parsing
         if ':' in symbol:
             return symbol.split(':')[1]
         return symbol
             header=0, on_bad_lines='skip', storage_options=headers
         )
+        # 2. Download MCX F&O (Correct URL is MCX_COM.csv)
         url_mcx = "https://public.fyers.in/sym_details/MCX_COM.csv"
         df_mcx = pd.read_csv(
             url_mcx, usecols=[0, 1, 8, 9, 13],
                 if root in INDEX_MAP:
                     spot_sym = INDEX_MAP[root]
                 elif sym.startswith("MCX"):
+                    # MCX has no "Index Spot", usually we track the Future
                     spot_sym = "MCX"
                 else:
                     spot_sym = f"NSE:{root}-EQ"
                 parts = desc.strip().split(' ')
                 if len(parts) >= 2:
                     try:
+                        # Logic: "NIFTY 23 JAN 21500 CE" -> 21500 is 2nd last
                         val = parts[-2]
+                        # Remove one decimal point to check isdigit
                         val_clean = val.replace('.', '', 1)
                         if val_clean.isdigit():
                             strike = float(val)
         # Final Sort
         final_db = {}
         for root, data in temp_db.items():
+            # Sort by Expiry (asc) then Strike (asc)
             sorted_items = sorted(data["items"], key=lambda x: (x['e'], x['k']))
             final_db[root] = { "spot": data["spot"], "items": sorted_items }
         MASTER_DB = final_db
         SEARCH_INDEX = sorted(list(MASTER_DB.keys()))
+        # Save cache
         with open(CACHE_FILE, "w") as f:
             json.dump(final_db, f)
     global MASTER_DB, SEARCH_INDEX
     if os.path.exists(CACHE_FILE):
         try:
+            print(">>> STARTUP: Loading Cache...")
             with open(CACHE_FILE, "r") as f:
                 MASTER_DB = json.load(f)
             SEARCH_INDEX = sorted(list(MASTER_DB.keys()))
         </div>
         """)
+    # Inject token
     return HTMLResponse(HTML_TEMPLATE.replace("{{USER_TOKEN}}", access_token))
 @app.get("/callback")
 @app.get("/favicon.ico")
 def favicon():
+    return Response(status_code=204) # No content, stops 404 errors
 # --- API ---
 def get_status():
     return JSONResponse(SYSTEM_STATUS)
+# COMPATIBILITY ROUTE: Returns empty list to stop 404s on old clients
 @app.get("/api/init")
 def legacy_init():
     return JSONResponse([])
         return JSONResponse([])
     query = q.upper()
+    # 1. Starts with
     results = [x for x in SEARCH_INDEX if x.startswith(query)]
+    # 2. Contains (if few results)
     if len(results) < 10:
         results += [x for x in SEARCH_INDEX if query in x and x not in results]
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+    <title>PRO CHAIN (V2)</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;800&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
     <style>
         * { box-sizing: border-box; }
         body { margin: 0; background: var(--bg); color: var(--text-main); font-family: 'Inter', sans-serif; height: 100vh; display: flex; flex-direction: column; overflow: hidden; }
+        .top-nav { padding: 0 20px; background: #fff; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; height: 60px; z-index: 10; }
+        .btn { background: #fff; border: 1px solid var(--border); padding: 8px 16px; font-size: 12px; border-radius: 6px; cursor: pointer; font-weight: 700; display: flex; gap: 8px; align-items: center; transition:0.2s; white-space:nowrap; }
         .btn:hover { border-color: var(--accent); color: var(--accent); background:#f0f7ff; }
+        .search-box { position: relative; width: 300px; margin-right: 20px; }
+        .search-input { width: 100%; padding: 10px 15px; border: 2px solid var(--border); border-radius: 6px; font-family: 'JetBrains Mono', monospace; font-weight: bold; font-size: 14px; outline: none; transition: 0.3s; }
         .search-input:focus { border-color: var(--accent); }
+        .search-dropdown { position: absolute; top: 100%; left: 0; width: 100%; background: white; border: 1px solid var(--border); border-top: none; max-height: 300px; overflow-y: auto; display: none; box-shadow: 0 10px 20px rgba(0,0,0,0.1); border-radius: 0 0 6px 6px; }
         .search-item { padding: 10px 15px; cursor: pointer; border-bottom: 1px solid #eee; font-size: 13px; font-weight: 600; }
         .search-item:hover { background: #f0f7ff; color: var(--accent); }
+        .grid-layout { display: flex; height: calc(100vh - 60px); }
+        .chain-panel { flex: 1; display: flex; flex-direction: column; position: relative; }
+        .chain-header { display: grid; grid-template-columns: 1fr 180px 1fr; padding: 10px 0; background: #f8f9fa; border-bottom: 1px solid var(--border); font-size: 11px; font-weight: 700; text-align: center; color: var(--text-sub); }
         .chain-body { flex: 1; overflow-y: auto; background: #fff; }
+        .row { display: grid; grid-template-columns: 1fr 180px 1fr; border-bottom: 1px solid #f0f0f0; height: 40px; align-items: center; font-family: 'JetBrains Mono'; font-size: 12px; }
         .row.atm { background: var(--atm-bg); border-top: 1px solid var(--accent); border-bottom: 1px solid var(--accent); }
+        .mid-col { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; border-left: 1px solid var(--border); border-right: 1px solid var(--border); cursor: crosshair; }
         .visual-bar { position: absolute; top: 6px; bottom: 6px; z-index: 0; border-radius: 4px; transition: 0.3s; opacity: 0.8; }
+        .strike-txt { z-index: 2; font-weight: 800; font-size: 13px; }
         .delta-txt { z-index: 2; font-size: 10px; font-weight: 600; background: rgba(255,255,255,0.7); padding: 0 4px; border-radius: 3px; }
+        .side-col { padding: 0 15px; display: flex; justify-content: space-between; color: #666; font-size: 11px; }
+        .fut-panel { width: 280px; background: var(--panel); border-left: 1px solid var(--border); display: flex; flex-direction: column; }
+        .fut-card { padding: 12px; background: #fff; border-bottom: 1px solid var(--border); }
         .meter-bg { height: 6px; background: #eee; border-radius: 3px; display: flex; overflow: hidden; margin-top: 5px; }
         .modal { position: fixed; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.4); z-index: 1000; display: none; justify-content: center; align-items: center; }
         .modal-box { background: #fff; width: 400px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 20px; max-height: 80vh; display:flex; flex-direction:column;}
         .modal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 15px; overflow-y: auto; }
         @keyframes blink { 0% { opacity: 0.5; } 50% { opacity: 1; } 100% { opacity: 0.5; } }
         .live { animation: blink 1s infinite; background: var(--green) !important; }
         .spin-icon { animation: spin 1s linear infinite; }
     </style>
 </head>
 <body>
 </div>
 <div class="top-nav">
+    <div style="display:flex; align-items:center;">
+        <div class="search-box">
+            <input type="text" class="search-input" id="searchInp" placeholder="SEARCH (e.g., NIFTY, CRUDE)..." autocomplete="off">
+            <div class="search-dropdown" id="searchRes"></div>
+        </div>
         <button class="btn" onclick="refreshDB()" id="refreshBtn">
             <svg id="refIcon" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path></svg>
+            RELOAD DB
         </button>
+    </div>
+    <div style="display:flex; gap:20px; align-items:center;">
         <div style="text-align:right;">
+            <div style="font-size:10px; font-weight:700; color:#888;" id="spotLabel">SPOT</div>
+            <div id="spotPrice" style="font-family:'JetBrains Mono'; font-weight:800; font-size:16px;">0.00</div>
         </div>
         <button class="btn" onclick="document.getElementById('expModal').style.display='flex'">
+            <span style="color:#888">EXP:</span> <span id="selExpTxt">SELECT</span>
         </button>
         <button class="btn" onclick="location.href='/logout'" style="border-color:var(--red); color:var(--red);">LOGOUT</button>
+        <div id="statusDot" style="width:10px; height:10px; background:#ccc; border-radius:50%;"></div>
     </div>
 </div>
 <div class="grid-layout">
     <div class="chain-panel">
         <div class="chain-header">
+            <div>CALL SELLERS (OI)</div>
+            <div>NET FLOW (PUT-CALL)</div>
+            <div>PUT SELLERS (OI)</div>
         </div>
         <div class="chain-body" id="chainBody">
+            <div style="padding:40px; text-align:center; color:#999; font-weight:600;">USE SEARCH TO LOAD A SYMBOL</div>
         </div>
     </div>
+    <div class="fut-panel">
+        <div style="padding:15px; font-weight:700; border-bottom:1px solid var(--border); background:#fff;">FUTURES</div>
+        <div id="futBody"></div>
+    </div>
 </div>
 <script>
     let POLLER = null;
     let IS_POLLING = false;
     let SEARCH_TIMER = null;
     window.onload = () => {
         if(AUTH_TOKEN.indexOf("{{") !== -1) { alert("Auth Error"); return; }
     }
     async function refreshDB() {
+        if(!confirm("Download fresh Master Data? This takes ~10s.")) return;
         document.getElementById('loader').style.display = 'flex';
         await fetch('/api/refresh');
         checkStatus();
         document.getElementById('searchRes').style.display = 'none';
         document.getElementById('loaderMsg').innerText = "LOADING CHAIN...";
         document.getElementById('loader').style.display = 'flex';
         try {
             const res = await fetch(`/api/chain?symbol=${root}`);
             CHAIN_DATA = data.items;
             SPOT_SYM = data.spot;
+            // Sort futures: Filter items with type 'FUT'
             FUT_SYMS = CHAIN_DATA.filter(x => x.t === 'FUT').sort((a,b) => a.e - b.e).slice(0, 3);
             if(SPOT_SYM === "MCX" && FUT_SYMS.length > 0) {
+                SPOT_SYM = FUT_SYMS[0].s; // Use Near Future as Spot for MCX
             }
             document.getElementById('spotLabel').innerText = (SPOT_SYM.includes('INDEX') || SPOT_SYM.includes('-EQ')) ? "SPOT" : "FUT REF";
     function selectExp(ts) {
         ACTIVE_EXP = ts;
         updateExpText(ts);
         closeModal();
         buildChain();
             </div>
         `).join('');
+        window.scrolled = false;
         restartPoller();
     }
             if(SPOT_PRICE > 0) {
                 const kList = Array.from(document.querySelectorAll('.row')).map(r => parseFloat(r.dataset.k));
                 let closestK = kList[0], minDiff = 999999;
                 kList.forEach(k => {
                    const diff = Math.abs(SPOT_PRICE - k);
                    if(diff < minDiff) { minDiff = diff; closestK = k; }
                 });
                 document.querySelectorAll('.atm').forEach(e => e.classList.remove('atm'));
                 const atmRow = document.getElementById(`row-${closestK}`);
                 if(atmRow) {
                     atmRow.classList.add('atm');
+                    if(!window.scrolled) { atmRow.scrollIntoView({block:'center'}); window.scrolled = true; }
                 }
                 const centerIdx = kList.indexOf(closestK);