174 lines
11 KiB
HTML
174 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<script src="./support.js"></script>
|
|
</head>
|
|
<body>
|
|
<x-dc>
|
|
<helmet>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Roboto+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
body { margin: 0; background: #0a0d14; font-family: 'Manrope', system-ui, sans-serif; }
|
|
* { box-sizing: border-box; }
|
|
a { color: #5b9dff; text-decoration: none; }
|
|
a:hover { color: #8ab8ff; }
|
|
::-webkit-scrollbar { width: 8px; }
|
|
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 4px; }
|
|
pre { margin: 0; }
|
|
</style>
|
|
</helmet>
|
|
|
|
<div style="position:relative; min-height:100vh; width:100%; background: radial-gradient(1100px 700px at 15% -10%, rgba(22,82,240,0.22), transparent 60%), #0a0d14; color:#EDEFF5;">
|
|
|
|
<header style="position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; padding:16px 48px; backdrop-filter:blur(20px); background:rgba(10,13,20,0.6); border-bottom:1px solid rgba(255,255,255,0.07);">
|
|
<div style="display:flex; align-items:center; gap:10px;">
|
|
<div style="width:30px; height:30px; border-radius:9px; background:linear-gradient(135deg,#1652F0,#4c8dff); box-shadow:0 0 20px rgba(22,82,240,0.6);"></div>
|
|
<div style="font-weight:800; font-size:17px; letter-spacing:-0.02em;">{{ brandName }}<span style="color:#5b9dff;">.</span></div>
|
|
</div>
|
|
<nav style="display:flex; align-items:center; gap:32px;">
|
|
<a href="./Landing.dc.html#features" style="font-size:13.5px; font-weight:600; color:#C7CCDA;">Features</a>
|
|
<a href="./Landing.dc.html#pricing" style="font-size:13.5px; font-weight:600; color:#C7CCDA;">Pricing</a>
|
|
<a href="./Landing.dc.html#faq" style="font-size:13.5px; font-weight:600; color:#C7CCDA;">FAQ</a>
|
|
<div style="font-size:13.5px; font-weight:700; color:#5b9dff;">API Docs</div>
|
|
</nav>
|
|
<a href="./Landing.dc.html" style="padding:9px 20px; border-radius:10px; font-size:13.5px; font-weight:700; background:linear-gradient(135deg,#1652F0,#4c8dff);">Get API key</a>
|
|
</header>
|
|
|
|
<div style="display:flex; max-width:1280px; margin:0 auto;">
|
|
<!-- SIDEBAR -->
|
|
<aside style="width:230px; flex:none; padding:36px 16px; position:sticky; top:68px; align-self:flex-start; height:calc(100vh - 68px); overflow-y:auto;">
|
|
<div style="font-size:11px; font-weight:700; color:#5B6377; letter-spacing:0.06em; padding:0 12px 8px;">GETTING STARTED</div>
|
|
<sc-for list="{{ sidebarTop }}" as="s" hint-placeholder-count="3">
|
|
<div onClick="{{ s.onClick }}" style="cursor:pointer; padding:9px 12px; border-radius:9px; font-size:13.5px; font-weight:600; color:{{ s.color }}; background:{{ s.bg }}; margin-bottom:2px;">{{ s.label }}</div>
|
|
</sc-for>
|
|
<div style="font-size:11px; font-weight:700; color:#5B6377; letter-spacing:0.06em; padding:16px 12px 8px;">ENDPOINTS</div>
|
|
<sc-for list="{{ sidebarEndpoints }}" as="s" hint-placeholder-count="6">
|
|
<div onClick="{{ s.onClick }}" style="cursor:pointer; display:flex; align-items:center; gap:8px; padding:9px 12px; border-radius:9px; font-size:13px; font-weight:600; color:{{ s.color }}; background:{{ s.bg }}; margin-bottom:2px;">
|
|
<span style="font-size:10px; font-weight:800; font-family:'Roboto Mono'; color:{{ s.methodColor }};">{{ s.method }}</span>
|
|
<span>{{ s.label }}</span>
|
|
</div>
|
|
</sc-for>
|
|
</aside>
|
|
|
|
<!-- CONTENT -->
|
|
<main style="flex:1; min-width:0; padding:36px 40px 100px;">
|
|
<h1 style="margin:0 0 10px; font-size:30px; font-weight:800; letter-spacing:-0.02em;">API Reference</h1>
|
|
<p style="margin:0 0 32px; color:#8B93A7; font-size:14.5px; max-width:640px; line-height:1.6;">Programmatic access to every trader and market metric in {{ brandName }}. All endpoints return JSON over HTTPS.</p>
|
|
|
|
<!-- Auth -->
|
|
<section style="margin-bottom:40px;">
|
|
<h2 style="font-size:19px; font-weight:800; margin:0 0 12px;">Authentication</h2>
|
|
<p style="color:#8B93A7; font-size:13.5px; line-height:1.7; margin:0 0 14px;">Pass your API key as a bearer token on every request. Keys are available from your account dashboard after signing up.</p>
|
|
<div style="border-radius:14px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); padding:18px 20px; font-family:'Roboto Mono'; font-size:13px; color:#C7CCDA; overflow-x:auto;">
|
|
<pre>curl https://api.predictalytics.io/v1/markets \
|
|
-H "Authorization: Bearer YOUR_API_KEY"</pre>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Rate limits -->
|
|
<section style="margin-bottom:40px;">
|
|
<h2 style="font-size:19px; font-weight:800; margin:0 0 12px;">Rate limits</h2>
|
|
<div style="display:grid; grid-template-columns:repeat(3,1fr); gap:14px;">
|
|
<sc-for list="{{ rateLimits }}" as="r" hint-placeholder-count="3">
|
|
<div style="border-radius:14px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); padding:16px 18px;">
|
|
<div style="font-size:12.5px; font-weight:700; color:#8B93A7; margin-bottom:6px;">{{ r.plan }}</div>
|
|
<div style="font-size:20px; font-weight:800; font-family:'Roboto Mono';">{{ r.limit }}</div>
|
|
</div>
|
|
</sc-for>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Endpoints -->
|
|
<sc-for list="{{ endpoints }}" as="ep" hint-placeholder-count="6">
|
|
<section id="{{ ep.id }}" style="margin-bottom:40px; scroll-margin-top:80px;">
|
|
<div style="display:flex; align-items:center; gap:12px; margin-bottom:10px;">
|
|
<span style="font-size:11px; font-weight:800; font-family:'Roboto Mono'; padding:4px 9px; border-radius:6px; background:{{ ep.methodBg }}; color:{{ ep.methodColor }};">{{ ep.method }}</span>
|
|
<span style="font-family:'Roboto Mono'; font-size:14.5px; font-weight:700; color:#EDEFF5;">{{ ep.path }}</span>
|
|
</div>
|
|
<p style="color:#8B93A7; font-size:13.5px; line-height:1.6; margin:0 0 14px;">{{ ep.desc }}</p>
|
|
|
|
<div style="display:grid; grid-template-columns:1fr 1fr; gap:14px;">
|
|
<div style="border-radius:14px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07); padding:16px 18px;">
|
|
<div style="font-size:11px; font-weight:700; color:#5B6377; text-transform:uppercase; margin-bottom:10px;">Parameters</div>
|
|
<sc-for list="{{ ep.params }}" as="p" hint-placeholder-count="2">
|
|
<div style="display:flex; align-items:baseline; gap:8px; margin-bottom:8px; font-size:12.5px;">
|
|
<span style="font-family:'Roboto Mono'; font-weight:700; color:#5b9dff;">{{ p.name }}</span>
|
|
<span style="color:#5B6377; font-size:11.5px;">{{ p.type }}</span>
|
|
<span style="color:#8B93A7;">{{ p.desc }}</span>
|
|
</div>
|
|
</sc-for>
|
|
</div>
|
|
<div style="border-radius:14px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); padding:16px 18px; font-family:'Roboto Mono'; font-size:12px; color:#C7CCDA; overflow-x:auto;">
|
|
<pre>{{ ep.example }}</pre>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</sc-for>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
</x-dc>
|
|
<script type="text/x-dc" data-dc-script data-props="{"$preview": {"width": 1440}, "brandName": {"editor": "text", "default": "Predictalytics", "tsType": "string"}}">
|
|
class Component extends DCLogic {
|
|
scrollTo(id) {
|
|
const el = document.getElementById(id);
|
|
if (el) el.scrollIntoView({ block: "start" });
|
|
}
|
|
|
|
renderVals() {
|
|
const brandName = this.props.brandName ?? "Predictalytics";
|
|
|
|
const endpoints = [
|
|
{ id: "get-markets", method: "GET", path: "/v1/markets", methodBg: "rgba(18,212,138,0.14)", methodColor: "#12D48A",
|
|
desc: "List all markets with current price, volume, and liquidity.",
|
|
params: [{ name: "category", type: "string", desc: "Filter by category" }, { name: "status", type: "string", desc: "active | resolved" }],
|
|
example: `{\n "id": "fed-sep-cut",\n "question": "Fed cuts rates...",\n "yesPrice": 71.4,\n "volume24h": 2840000\n}` },
|
|
{ id: "get-market", method: "GET", path: "/v1/markets/{id}", methodBg: "rgba(18,212,138,0.14)", methodColor: "#12D48A",
|
|
desc: "Get detailed data for a single market including order book and holders.",
|
|
params: [{ name: "id", type: "string", desc: "Market identifier" }],
|
|
example: `{\n "orderBook": { "bids": [...], "asks": [...] },\n "holders": [ { "trader": "0xA1...", "size": 420000 } ]\n}` },
|
|
{ id: "get-traders", method: "GET", path: "/v1/traders", methodBg: "rgba(18,212,138,0.14)", methodColor: "#12D48A",
|
|
desc: "Search and list traders with P&L, win rate, and traits.",
|
|
params: [{ name: "trait", type: "string", desc: "Bot | Arbitrage Trader | Resolution Farming" }, { name: "sort", type: "string", desc: "pnl | volume" }],
|
|
example: `{\n "handle": "quant_owl",\n "traits": ["Arbitrage Trader"],\n "winRate": 68.4\n}` },
|
|
{ id: "get-trader", method: "GET", path: "/v1/traders/{id}", methodBg: "rgba(18,212,138,0.14)", methodColor: "#12D48A",
|
|
desc: "Get a trader's full position history and connected wallets.",
|
|
params: [{ name: "id", type: "string", desc: "Trader handle or wallet" }],
|
|
example: `{\n "positions": [...],\n "connectedWallets": ["0x88Ac...2f01"]\n}` },
|
|
{ id: "post-alerts", method: "POST", path: "/v1/alerts", methodBg: "rgba(22,82,240,0.16)", methodColor: "#5b9dff",
|
|
desc: "Create an alert on a trader or market.",
|
|
params: [{ name: "target", type: "string", desc: "Trader or market id" }, { name: "condition", type: "string", desc: "price_move | new_position" }],
|
|
example: `{\n "id": "alert_881",\n "target": "arb_meridian",\n "condition": "new_position"\n}` },
|
|
{ id: "get-agent", method: "GET", path: "/v1/mcp/context", methodBg: "rgba(18,212,138,0.14)", methodColor: "#12D48A",
|
|
desc: "Enterprise only. MCP-compatible context feed for your own AI agent.",
|
|
params: [{ name: "scope", type: "string", desc: "markets | traders | both" }],
|
|
example: `{\n "mcp_version": "1.0",\n "resources": ["markets", "traders"]\n}` },
|
|
];
|
|
|
|
const sidebarTop = [
|
|
{ label: "Authentication", color: "#C7CCDA", bg: "transparent", onClick: () => this.scrollTo("auth") },
|
|
{ label: "Rate limits", color: "#C7CCDA", bg: "transparent", onClick: () => this.scrollTo("rate-limits") },
|
|
];
|
|
const sidebarEndpoints = endpoints.map((ep) => ({
|
|
label: ep.path, method: ep.method, methodColor: ep.methodColor, color: "#C7CCDA", bg: "transparent",
|
|
onClick: () => this.scrollTo(ep.id),
|
|
}));
|
|
|
|
const rateLimits = [
|
|
{ plan: "Free", limit: "20 / day" },
|
|
{ plan: "Basic", limit: "200 / day" },
|
|
{ plan: "Enterprise", limit: "2,000 / day" },
|
|
];
|
|
|
|
return { brandName, endpoints, sidebarTop, sidebarEndpoints, rateLimits };
|
|
}
|
|
}
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|