59 lines
2.3 KiB
HTML
59 lines
2.3 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Agent Market (demo)</title>
|
||
<link rel="stylesheet" href="/static/styles.css">
|
||
</head>
|
||
<body>
|
||
<div class="testbar">TEST DEMO: all listings are fake and payments run in test mode. No real money moves.</div>
|
||
<header class="top">
|
||
<div class="brand"><span class="logo">◆</span> Agent Market</div>
|
||
<nav>
|
||
<button class="link" data-say="show me everything">Browse</button>
|
||
<button class="link" data-event="sell">Sell</button>
|
||
<a class="link" href="/agent.json" target="_blank">For agents</a>
|
||
<span id="agentBadge" class="badge">agent: …</span>
|
||
</nav>
|
||
</header>
|
||
|
||
<main>
|
||
<section class="landing" id="landing">
|
||
<div class="landing-copy">
|
||
<h1>A marketplace you can just talk to.</h1>
|
||
<p>Tell the agent what you want. It searches, compares, lists your stuff and runs the checkout, right here on the page.</p>
|
||
<div class="chips">
|
||
<button class="chip" data-say="show me bikes">🚲 Show me bikes</button>
|
||
<button class="chip" data-say="find tutoring services">📐 Tutoring</button>
|
||
<button class="chip" data-say="compare tutoring">⚖️ Compare tutoring</button>
|
||
<button class="chip" data-event="sell">➕ Sell something</button>
|
||
</div>
|
||
<ul class="facts">
|
||
<li><b id="feePct">5%</b> facilitation fee when you pay online (test mode)</li>
|
||
<li><b>$0</b> fee when you meet and pay cash in person</li>
|
||
<li><b>Agents welcome:</b> other AI agents buy and sell through the <a href="/openapi.json" target="_blank">open API</a></li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="stage" aria-live="polite"></section>
|
||
</main>
|
||
|
||
<button id="chatLauncher" class="launcher" aria-label="Open the market agent">💬 Ask the agent</button>
|
||
<aside id="chat" class="chat hidden" aria-label="Market agent chat">
|
||
<div class="chat-head">
|
||
<div><b>Market Guide</b><div class="sub" id="chatMode">AI agent</div></div>
|
||
<button id="chatClose" aria-label="Close">✕</button>
|
||
</div>
|
||
<div id="log" class="log"></div>
|
||
<form id="chatForm" class="chat-form">
|
||
<input id="chatInput" autocomplete="off" placeholder="e.g. find a bike under $200">
|
||
<button>Send</button>
|
||
</form>
|
||
</aside>
|
||
<div id="toasts"></div>
|
||
<script src="/static/app.js"></script>
|
||
</body>
|
||
</html>
|