feat: Convert HTML documentation to markdown and add web format
- Convert all HTML documentation files to markdown format in /docs folder - Add markdown links to HTML documentation pages - Update all aitbc.io references to aitbc.bubuit.net - Create HTML web format versions of key documentation files - Update documentation index to show both HTML and web format options - Add flowchart documentation explaining CLI job submission process
This commit is contained in:
oib
496
website/docs/components-md.html
Normal file
496
website/docs/components-md.html
Normal file
@@ -0,0 +1,496 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>AITBC System Components - Documentation</title>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
<style>
|
||||
:root {
|
||||
--primary-color: #2563eb;
|
||||
--secondary-color: #1e40af;
|
||||
--success-color: #10b981;
|
||||
--text-dark: #1f2937;
|
||||
--text-light: #6b7280;
|
||||
--bg-light: #f9fafb;
|
||||
--bg-white: #ffffff;
|
||||
--border-color: #e5e7eb;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
|
||||
line-height: 1.6;
|
||||
color: var(--text-dark);
|
||||
background: var(--bg-white);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
header {
|
||||
background: var(--text-dark);
|
||||
color: white;
|
||||
padding: 1rem 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.nav-links a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.nav-links a:hover {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
padding: 1rem 0;
|
||||
color: var(--text-light);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.breadcrumb a {
|
||||
color: var(--text-light);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.breadcrumb a:hover {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.doc-header {
|
||||
padding: 3rem 0;
|
||||
background: var(--bg-light);
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.doc-header h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.doc-header p {
|
||||
font-size: 1.2rem;
|
||||
color: var(--text-light);
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.content-section {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.content-section h2 {
|
||||
font-size: 1.8rem;
|
||||
margin-bottom: 1.5rem;
|
||||
color: var(--text-dark);
|
||||
border-bottom: 2px solid var(--border-color);
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.content-section h3 {
|
||||
font-size: 1.4rem;
|
||||
margin: 2rem 0 1rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.content-section p {
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.components-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 2rem;
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.component-card {
|
||||
background: var(--bg-white);
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
||||
transition: transform 0.3s, box-shadow 0.3s;
|
||||
}
|
||||
|
||||
.component-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 30px rgba(0,0,0,0.12);
|
||||
}
|
||||
|
||||
.component-icon {
|
||||
font-size: 2.5rem;
|
||||
color: var(--primary-color);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.component-card h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.component-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: var(--success-color);
|
||||
font-weight: 600;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
.component-status.live::before {
|
||||
content: "●";
|
||||
color: var(--success-color);
|
||||
}
|
||||
|
||||
.component-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.component-link:hover {
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.architecture-diagram {
|
||||
background: var(--bg-light);
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
margin: 2rem 0;
|
||||
text-align: center;
|
||||
font-family: monospace;
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-dark);
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.quick-links {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 1rem;
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.quick-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 1rem;
|
||||
background: var(--bg-light);
|
||||
border-radius: 8px;
|
||||
text-decoration: none;
|
||||
color: var(--text-dark);
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.quick-link:hover {
|
||||
background: var(--primary-color);
|
||||
color: white;
|
||||
transform: translateX(5px);
|
||||
}
|
||||
|
||||
.quick-link i {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.back-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
margin-bottom: 2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.back-button:hover {
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
footer {
|
||||
background: var(--text-dark);
|
||||
color: white;
|
||||
padding: 2rem 0;
|
||||
text-align: center;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.nav-links {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.doc-header h1 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav class="container">
|
||||
<a href="../index.html" class="logo">AITBC</a>
|
||||
<ul class="nav-links">
|
||||
<li><a href="../index.html">Home</a></li>
|
||||
<li><a href="index.html">Documentation</a></li>
|
||||
<li><a href="mailto:aitbc@bubuit.net">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="container">
|
||||
<!-- Breadcrumb -->
|
||||
<div class="breadcrumb">
|
||||
<a href="index.html">Documentation</a>
|
||||
<span>›</span>
|
||||
<span>Components</span>
|
||||
</div>
|
||||
|
||||
<!-- Back Button -->
|
||||
<a href="index.html" class="back-button">
|
||||
<i class="fas fa-arrow-left"></i>
|
||||
Back to Documentation
|
||||
</a>
|
||||
|
||||
<!-- Header -->
|
||||
<div class="doc-header">
|
||||
<h1>AITBC System Components</h1>
|
||||
<p>Overview of all components in the AITBC platform, their status, and documentation links.</p>
|
||||
</div>
|
||||
|
||||
<!-- Core Components -->
|
||||
<section class="content-section">
|
||||
<h2>Core Components</h2>
|
||||
<div class="components-grid">
|
||||
<!-- Blockchain Node -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-cube"></i>
|
||||
</div>
|
||||
<h3>Blockchain Node</h3>
|
||||
<p>PoA/PoS consensus with REST/WebSocket RPC, real-time gossip layer, and comprehensive observability. Production-ready with devnet tooling.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="blockchain-node-md.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Coordinator API -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-server"></i>
|
||||
</div>
|
||||
<h3>Coordinator API</h3>
|
||||
<p>FastAPI service for job submission, miner registration, and receipt management. SQLite persistence with comprehensive endpoints.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="coordinator-api-md.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Marketplace Web -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-store"></i>
|
||||
</div>
|
||||
<h3>Marketplace Web</h3>
|
||||
<p>Vite/TypeScript marketplace with offer/bid functionality, stats dashboard, and mock/live data toggle. Production UI ready.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="marketplace-web-md.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Explorer Web -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-search"></i>
|
||||
</div>
|
||||
<h3>Explorer Web</h3>
|
||||
<p>Full-featured blockchain explorer with blocks, transactions, addresses, and receipts tracking. Responsive design with live data.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="explorer-web.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Wallet Daemon -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-wallet"></i>
|
||||
</div>
|
||||
<h3>Wallet Daemon</h3>
|
||||
<p>Encrypted keystore with Argon2id + XChaCha20-Poly1305, REST/JSON-RPC APIs, and receipt verification capabilities.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="wallet-daemon.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Trade Exchange -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-exchange-alt"></i>
|
||||
</div>
|
||||
<h3>Trade Exchange</h3>
|
||||
<p>Bitcoin-to-AITBC exchange with QR payments, user management, and real-time trading. Buy tokens with BTC instantly.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="trade-exchange-md.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Pool Hub -->
|
||||
<div class="component-card">
|
||||
<div class="component-icon">
|
||||
<i class="fas fa-swimming-pool"></i>
|
||||
</div>
|
||||
<h3>Pool Hub</h3>
|
||||
<p>Miner registry with scoring engine, Redis/PostgreSQL backing, and comprehensive metrics. Live matching API deployed.</p>
|
||||
<div class="component-status live">Live</div>
|
||||
<a href="pool-hub.html" class="component-link">
|
||||
Learn More <i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Architecture Overview -->
|
||||
<section class="content-section">
|
||||
<h2>Architecture Overview</h2>
|
||||
<p>The AITBC platform consists of 7 core components working together to provide a complete AI blockchain computing solution:</p>
|
||||
|
||||
<div class="architecture-diagram">
|
||||
┌─────────────┐ ┌──────────────┐ ┌─────────────┐
|
||||
│ Clients │────▶│ Coordinator │────▶│ Blockchain │
|
||||
│ │ │ API │ │ Node │
|
||||
└─────────────┘ └──────────────┘ └─────────────┘
|
||||
│ │ │
|
||||
▼ ▼ ▼
|
||||
┌─────────────┐ ┌──────────────┐ ┌─────────────┐
|
||||
│ Wallet │ │ Pool Hub │ │ Miners │
|
||||
│ Daemon │ │ │ │ │
|
||||
└─────────────┘ └──────────────┘ └─────────────┘
|
||||
</div>
|
||||
|
||||
<h3>Infrastructure Layer</h3>
|
||||
<ul>
|
||||
<li><strong>Blockchain Node</strong> - Distributed ledger with PoA/PoS consensus</li>
|
||||
<li><strong>Coordinator API</strong> - Job orchestration and management</li>
|
||||
<li><strong>Wallet Daemon</strong> - Secure wallet management</li>
|
||||
</ul>
|
||||
|
||||
<h3>Application Layer</h3>
|
||||
<ul>
|
||||
<li><strong>Marketplace Web</strong> - GPU compute marketplace</li>
|
||||
<li><strong>Trade Exchange</strong> - Token trading platform</li>
|
||||
<li><strong>Explorer Web</strong> - Blockchain explorer</li>
|
||||
<li><strong>Pool Hub</strong> - Miner coordination service</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<!-- Quick Links -->
|
||||
<section class="content-section">
|
||||
<h2>Quick Links</h2>
|
||||
<div class="quick-links">
|
||||
<a href="https://aitbc.bubuit.net/Exchange/" target="_blank" class="quick-link">
|
||||
<i class="fas fa-exchange-alt"></i>
|
||||
<span>Trade Exchange</span>
|
||||
</a>
|
||||
<a href="https://aitbc.bubuit.net/marketplace/" target="_blank" class="quick-link">
|
||||
<i class="fas fa-store"></i>
|
||||
<span>Marketplace</span>
|
||||
</a>
|
||||
<a href="https://aitbc.bubuit.net/explorer/" target="_blank" class="quick-link">
|
||||
<i class="fas fa-search"></i>
|
||||
<span>Explorer</span>
|
||||
</a>
|
||||
<a href="https://aitbc.bubuit.net/api/docs" target="_blank" class="quick-link">
|
||||
<i class="fas fa-code"></i>
|
||||
<span>API Docs</span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Status Legend -->
|
||||
<section class="content-section">
|
||||
<h2>Status Legend</h2>
|
||||
<ul>
|
||||
<li><span class="component-status live">● Live</span> - Production ready and deployed</li>
|
||||
<li><span class="component-status" style="color: var(--warning-color);">● Beta</span> - In testing, limited availability</li>
|
||||
<li><span class="component-status" style="color: var(--text-light);">● Development</span> - Under active development</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<!-- Deployment Information -->
|
||||
<section class="content-section">
|
||||
<h2>Deployment Information</h2>
|
||||
<p>All components are containerized and can be deployed using Docker Compose:</p>
|
||||
<pre style="background: #1f2937; color: #f9fafb; padding: 1.5rem; border-radius: 8px; overflow-x: auto;">
|
||||
# Deploy all components
|
||||
docker-compose up -d
|
||||
|
||||
# Check status
|
||||
docker-compose ps
|
||||
|
||||
# View logs
|
||||
docker-compose logs -f</pre>
|
||||
</section>
|
||||
|
||||
<!-- Support -->
|
||||
<section class="content-section">
|
||||
<h2>Support</h2>
|
||||
<p>For component-specific issues:</p>
|
||||
<ul>
|
||||
<li>Check individual documentation pages</li>
|
||||
<li>Visit the <a href="https://gitea.bubuit.net/oib/aitbc" target="_blank">GitHub repository</a></li>
|
||||
<li>Contact: <a href="mailto:aitbc@bubuit.net">aitbc@bubuit.net</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© 2025 AITBC. All rights reserved.</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user