07f3a87328
Website docs (website/docs/): - Delete 6 stale -md.html duplicates - Rename docs-clients/miners/developers → clients/miners/developers.html - Unify header/nav across all 15 pages (new .site-header pattern) - Fix 34 dead href=# links with real targets - Upgrade Font Awesome v4→v6 in index.html - Replace search stub with live client-side search (15-page index) - Extract all inline CSS into shared docs.css (+630 lines) - Extract inline theme JS into shared theme.js - Strip inline style= attributes from 10+ pages - Add .announce-banner, .source-links, .search-results CSS classes - Add Markdown Source links to clients/miners/developers pages - Update components.html title to Architecture & Components - Move browser-wallet.html to website/wallet/, leave redirect - Update all dates to February 2026 Website root: - Delete 6 root-level duplicate HTML files (160KB saved) - Rewire index.html and 404.html links Root README.md: - Fix 8 broken doc links to new numbered folder structure - Update copyright to 2026 .gitignore + .example files: - Gitignore private files: .aitbc.yaml, .env, deploy scripts, GPU scripts, service scripts, infra configs, .windsurf/, website README - Create 7 .example files for GitHub users with sanitized templates - Untrack 47 previously committed private files Live server: - Push all website files to aitbc-cascade:/var/www/html/ - Clean stale admin.html and index.nginx-debian.html
220 lines
7.5 KiB
HTML
220 lines
7.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Explorer Web - AITBC Documentation</title>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||
<link rel="stylesheet" href="css/docs.css">
|
||
</head>
|
||
<body>
|
||
<!-- Header -->
|
||
<header class="site-header">
|
||
<div class="container">
|
||
<div class="header-inner">
|
||
<a href="/" class="brand">
|
||
<i class="fas fa-cube"></i>
|
||
<span>AITBC</span>
|
||
</a>
|
||
<nav class="header-nav">
|
||
<a href="/">Home</a>
|
||
<a href="/explorer/">Explorer</a>
|
||
<a href="/Exchange/">Exchange</a>
|
||
<a href="/docs/index.html" class="active">Docs</a>
|
||
<button id="theme-toggle" class="theme-toggle" title="Toggle theme"><i class="fas fa-sun"></i></button>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<div class="container">
|
||
<!-- Breadcrumb -->
|
||
<div class="breadcrumb">
|
||
<a href="index.html">Documentation</a>
|
||
<span>›</span>
|
||
<a href="components.html">Components</a>
|
||
<span>›</span>
|
||
<span>Explorer Web</span>
|
||
</div>
|
||
|
||
<!-- Back Button -->
|
||
<a href="components.html" class="back-button">
|
||
<i class="fas fa-arrow-left"></i>
|
||
Back to Components
|
||
</a>
|
||
|
||
<!-- Header -->
|
||
<div class="doc-header">
|
||
<h1><i class="fas fa-search"></i> Explorer Web</h1>
|
||
<p>Full-featured blockchain explorer with blocks, transactions, addresses, and receipts tracking. Responsive design with live data.</p>
|
||
<span class="status-badge">● Live</span>
|
||
</div>
|
||
|
||
<!-- Overview -->
|
||
<section class="content-section">
|
||
<h2>Overview</h2>
|
||
<p>The AITBC Explorer Web provides a comprehensive view of the blockchain, allowing users to track blocks, transactions, addresses, and AI computation receipts in real-time.</p>
|
||
|
||
<h3>Key Features</h3>
|
||
<ul>
|
||
<li>Real-time block and transaction tracking</li>
|
||
<li>Address balance and transaction history</li>
|
||
<li>AI computation receipt verification</li>
|
||
<li>Search functionality for blocks, transactions, and addresses</li>
|
||
<li>Responsive design for all devices</li>
|
||
<li>Live data updates via WebSocket</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<!-- Architecture -->
|
||
<section class="content-section">
|
||
<h2>Architecture</h2>
|
||
<p>The explorer is built as a modern single-page application:</p>
|
||
|
||
<div class="feature-grid">
|
||
<div class="feature-card">
|
||
<h4><i class="fas fa-paint-brush"></i> Frontend</h4>
|
||
<p>React with TypeScript for type safety</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h4><i class="fas fa-plug"></i> API Integration</h4>
|
||
<p>Direct blockchain RPC API connection</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<h4><i class="fas fa-sync"></i> Real-time Updates</h4>
|
||
<p>WebSocket for live block updates</p>
|
||
</div>
|
||
<div class="feature-card">
|
||
<i class="fas fa-mobile-alt"></i> Responsive</h4>
|
||
<p>Mobile-first responsive design</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Features -->
|
||
<section class="content-section">
|
||
<h2>Features</h2>
|
||
|
||
<h3>Block Explorer</h3>
|
||
<ul>
|
||
<li>Latest blocks list with timestamps</li>
|
||
<li>Detailed block view with transactions</li>
|
||
<li>Block validation status</li>
|
||
<li>Block size and gas metrics</li>
|
||
</ul>
|
||
|
||
<h3>Transaction Tracker</h3>
|
||
<ul>
|
||
<li>Transaction details and status</li>
|
||
<li>Input/output addresses</li>
|
||
<li>Gas fees and confirmations</li>
|
||
<li>Transaction mempool status</li>
|
||
</ul>
|
||
|
||
<h3>Address Viewer</h3>
|
||
<ul>
|
||
<li>Address balance and history</li>
|
||
<li>Transaction list per address</li>
|
||
<li>QR code generation</li>
|
||
<li>Address labeling</li>
|
||
</ul>
|
||
|
||
<h3>AI Receipt Explorer</h3>
|
||
<ul>
|
||
<li>Computation receipt details</li>
|
||
<li>ZK-proof verification</li>
|
||
<li>Job metadata and results</li>
|
||
<li>Miner rewards tracking</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<!-- API Integration -->
|
||
<section class="content-section">
|
||
<h2>API Integration</h2>
|
||
<p>The explorer connects directly to the blockchain node RPC API:</p>
|
||
|
||
<pre><code>// Get latest blocks
|
||
GET /rpc/get_latest_blocks?limit=50
|
||
|
||
// Get block by height
|
||
GET /rpc/get_block/{height}
|
||
|
||
// Get transaction by hash
|
||
GET /rpc/get_transaction/{hash}
|
||
|
||
// Get address info
|
||
GET /rpc/get_address/{address}
|
||
|
||
// WebSocket subscription
|
||
ws://localhost:9081/ws
|
||
{
|
||
"method": "subscribe",
|
||
"params": ["new_blocks", "new_transactions"]
|
||
}</code></pre>
|
||
</section>
|
||
|
||
<!-- Deployment -->
|
||
<section class="content-section">
|
||
<h2>Deployment</h2>
|
||
|
||
<h3>Docker Deployment</h3>
|
||
<pre><code># Build explorer image
|
||
docker build -t aitbc/explorer-web .
|
||
|
||
# Run with nginx
|
||
docker run -d \
|
||
-p 80:80 \
|
||
-e API_URL=http://blockchain-node:9080 \
|
||
-e WS_URL=ws://blockchain-node:9081 \
|
||
aitbc/explorer-web</code></pre>
|
||
|
||
<h3>Configuration</h3>
|
||
<pre><code># Environment variables
|
||
API_URL=http://localhost:9080
|
||
WS_URL=ws://localhost:9081
|
||
NETWORK_NAME=mainnet
|
||
CACHE_TTL=300</code></pre>
|
||
</section>
|
||
|
||
<!-- Development -->
|
||
<section class="content-section">
|
||
<h2>Development</h2>
|
||
|
||
<h3>Local Development</h3>
|
||
<pre><code># Install dependencies
|
||
npm install
|
||
|
||
# Start development server
|
||
npm run dev
|
||
|
||
# Build for production
|
||
npm run build
|
||
|
||
# Run tests
|
||
npm test</code></pre>
|
||
|
||
<h3>Project Structure</h3>
|
||
<pre><code>explorer-web/
|
||
├── src/
|
||
│ ├── components/ # React components
|
||
│ ├── pages/ # Page components
|
||
│ ├── hooks/ # Custom hooks
|
||
│ ├── services/ # API services
|
||
│ └── utils/ # Utilities
|
||
├── public/
|
||
├── package.json
|
||
└── Dockerfile</code></pre>
|
||
</section>
|
||
</div>
|
||
</main>
|
||
|
||
<footer>
|
||
<div class="container">
|
||
<p>© 2026 AITBC. All rights reserved.</p>
|
||
</div>
|
||
</footer>
|
||
<script src="js/theme.js"></script>
|
||
</body>
|
||
</html>
|