const nav=['Home','Markets','Watchlist','Opportunities','Trading Research','AI Analyst','Alerts','Reports','Subscription','Settings'];
function shell(){document.getElementById('app').innerHTML=`<div class="shell"><aside class="side"><div class="brand">● StratOS</div><p class="muted">Research workspace</p>${nav.map((n,i)=>`<a class="nav ${i===0?'active':''}" data-nav="${n}" href="#">${n}</a>`).join('')}<a class="nav" id="logout">Log out</a></aside><main class="main" id="content"><div class="top"><span>Workspace / Home</span><span class="muted">EN · 简体中文</span></div><h1>Good morning</h1><p class="muted">Your unified research workspace.</p><div class="grid"><div class="card"><b>ETH-USDT</b><p class="muted">Market analysis</p></div><div class="card"><b>BTC-USDT</b><p class="muted">Market analysis</p></div><div class="card"><b>Trading Research</b><p class="muted">Coming soon</p></div></div></main></div>`;document.getElementById('logout').onclick=async()=>{await fetch('https://api-staging.cc818.icu/api/auth/sign-out',{method:'POST',credentials:'include'});localStorage.removeItem('token');landing()};document.querySelectorAll('[data-nav]').forEach(a=>a.onclick=e=>{e.preventDefault();if(a.dataset.nav==='Markets')marketsView();else document.getElementById('content').innerHTML='<h1>'+a.dataset.nav+'</h1><div class="card"><p class="muted">Coming soon</p></div>'})}
async function marketsView(){const c=document.getElementById('content');c.innerHTML='<h1>Markets</h1><div class="card">Loading market data…</div>';try{const j=await (await fetch('https://api-staging.cc818.icu/api/markets?limit=25')).json();c.innerHTML='<h1>Markets</h1><p class="muted">Top crypto assets · Public data · Provider fallback enabled</p><div class="card" style="overflow:auto"><table style="width:100%;border-collapse:collapse"><thead><tr><th align="left">Asset</th><th align="right">Price</th><th align="right">24h</th><th>Provider</th><th>Status</th><th>Action</th></tr></thead><tbody>'+j.items.map(x=>`<tr><td>${x.name}<br><span class="muted">${x.symbol}</span></td><td align="right">${x.price==null?'—':x.price.toLocaleString()}</td><td align="right">${x.change24h==null?'—':x.change24h.toFixed(2)+'%'}</td><td>${x.provider||'Unavailable'}</td><td>${x.data_quality}</td><td><button class="btn secondary" data-symbol="${x.symbol}">View</button></td></tr>`).join('')+'</tbody></table></div>';c.querySelectorAll('[data-symbol]').forEach(b=>b.onclick=()=>assetView(b.dataset.symbol))}catch{c.innerHTML='<h1>Markets</h1><div class="card">Market data unavailable</div>'}}
async function assetView(sym){const c=document.getElementById('content');c.innerHTML='<h1>'+sym+'</h1><div class="card">Loading…</div>';const j=await (await fetch('https://api-staging.cc818.icu/api/markets/'+sym)).json();c.innerHTML=`<h1>${j.name||sym}</h1><p class="muted">${sym} · ${j.provider||'Unavailable'} · ${j.data_quality}</p><div class="grid"><div class="card"><b>Current price</b><h2>${j.price==null?'—':j.price.toLocaleString()}</h2></div><div class="card"><b>Market regime</b><h2>${j.regime||'Not available'}</h2></div><div class="card"><b>Direction</b><h2>${j.direction||'Not available'}</h2></div></div><div class="card" style="margin-top:16px"><h2>Technical Indicators</h2><p class="muted">Indicators will be enabled when sufficient closed-candle data is available.</p></div>`}
function landing(){document.getElementById('app').innerHTML=`<header class="top"><div class="brand">● StratOS</div><div><button class="btn secondary" id="lang">中文</button> <button class="btn" id="signin">Sign in</button></div></header><section class="hero"><div><p class="muted">AI-POWERED RESEARCH</p><h1>Research smarter.<br>Trade safer.</h1><p class="muted">A clean workspace for market intelligence, research and opportunities.</p><button class="btn" id="start">Get started</button></div><div class="card"><h2>Build your workspace</h2><p class="muted">Markets, watchlists, alerts and research in one place.</p><button class="btn secondary" id="register">Create account</button></div></section>`;signin.onclick=login;start.onclick=register.onclick=register}
function login(){document.getElementById('app').innerHTML=`<header class="top"><div class="brand">● StratOS</div></header><section class="hero"><div><p class="muted">WELCOME BACK</p><h1>Sign in</h1><form id="f"><input name="email" type="email" placeholder="Email" required style="padding:12px;width:100%;margin:8px 0"><input name="password" type="password" placeholder="Password" required style="padding:12px;width:100%;margin:8px 0"><button class="btn">Sign in</button></form><p id="msg" class="muted"></p><a href="#" id="reg">Create account</a> · <a href="#">Forgot password?</a></div></section>`;reg.onclick=register;f.onsubmit=async e=>{e.preventDefault();const b=Object.fromEntries(new FormData(f));const r=await fetch('https://api-staging.cc818.icu/api/auth/sign-in/email',{method:'POST',credentials:'include',headers:{'content-type':'application/json'},body:JSON.stringify({...b,rememberMe:true})});if(r.ok){localStorage.token='cookie-session';shell()}else msg.textContent='Invalid email or password'}}
function register(){document.getElementById('app').innerHTML=`<header class="top"><div class="brand">● StratOS</div></header><section class="hero"><div><h1>Create account</h1><form id="f"><input name="name" placeholder="Name" required style="padding:12px;width:100%;margin:8px 0"><input name="email" type="email" placeholder="Email" required style="padding:12px;width:100%;margin:8px 0"><input name="password" type="password" placeholder="Password" required style="padding:12px;width:100%;margin:8px 0"><button class="btn">Register</button></form><p id="msg" class="muted"></p><a href="#" id="back">Sign in</a></div></section>`;back.onclick=login;f.onsubmit=async e=>{e.preventDefault();const b=Object.fromEntries(new FormData(f));const r=await fetch('https://api-staging.cc818.icu/api/auth/sign-up/email',{method:'POST',credentials:'include',headers:{'content-type':'application/json'},body:JSON.stringify(b)});msg.textContent=r.ok?'Account created. Please sign in.':'Registration failed'}}
localStorage.token?shell():landing();