Files
spore-website/public/index.html

697 lines
38 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SPORE - Sprocket Orchestration Engine</title>
<link rel="stylesheet" href="styles.css">
<!-- Prism.js for syntax highlighting -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet">
</head>
<body>
<header>
<div class="container">
<div class="header-content">
<div class="brand">
<h1>SPORE</h1>
<p class="tagline">Sprocket Orchestration Engine</p>
</div>
<button class="burger" id="menu-toggle" aria-label="Menu" aria-controls="site-nav" aria-expanded="false">
<span></span><span></span><span></span>
</button>
</div>
</div>
<nav id="site-nav" class="site-nav">
<div class="container">
<a href="#overview">Overview</a>
<a href="#spore">Core</a>
<a href="#gateway">Gateway</a>
<a href="#registry">Registry</a>
<a href="#ui">UI</a>
<a href="#apps">Apps</a>
<a href="#deployment">Deployment</a>
<a href="#docs">Docs</a>
</div>
</nav>
</header>
<main>
<section id="overview" class="hero">
<div class="container">
<img src="assets/spore.png" alt="SPORE" class="hero-image">
<p>A totally based cluster engine for ESP8266 microcontrollers with automatic node discovery, health monitoring, and over-the-air updates. Built for real-time control of distributed embedded systems.</p>
</div>
<p class="subtitle">
</section>
<section id="spore" class="content-section">
<div class="container">
<h2>Core</h2>
<p class="subtitle">Cluster engine firmware for ESP8266 microcontrollers</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore" target="_blank" rel="noopener">Repository: spore</a></p>
<div class="feature-grid">
<div class="feature-card">
<h3>Auto Discovery</h3>
<p>UDP-based node discovery with automatic cluster membership</p>
</div>
<div class="feature-card">
<h3>Health Monitoring</h3>
<p>Real-time node status tracking with resource monitoring and automatic failover</p>
</div>
<div class="feature-card">
<h3>Event System</h3>
<p>Local and cluster-wide event publishing/subscription with WebSocket and UDP streaming API</p>
</div>
<div class="feature-card">
<h3>OTA Updates</h3>
<p>Seamless firmware updates across the cluster via HTTP API</p>
</div>
<div class="feature-card">
<h3>Service Registry</h3>
<p>Dynamic API endpoint discovery and registration for custom services</p>
</div>
<div class="feature-card">
<h3>Task Scheduler</h3>
<p>Cooperative multitasking system for background operations</p>
</div>
</div>
<div class="content-block">
<h3>Quick Start</h3>
<pre><code class="language-cpp">#include &lt;Arduino.h&gt;
#include "spore/Spore.h"
#include "spore/Service.h"
#include "spore/core/ApiServer.h"
#include "spore/core/TaskManager.h"
class HelloService : public Service {
public:
HelloService() {}
const char* getName() const override { return "HelloService"; }
void registerEndpoints(ApiServer& api) override {
api.registerEndpoint("/api/hello", HTTP_GET, [](AsyncWebServerRequest* req) {
req->send(200, "application/json", "{\"message\":\"hello\"}");
});
}
void registerTasks(TaskManager& taskManager) override {
taskManager.registerTask("heartbeat", 1000, [this]() { this->heartbeat(); });
}
private:
void heartbeat() {
// e.g., blink LED, publish telemetry, etc.
}
};
Spore spore({
{"app", "my_app"},
{"role", "controller"}
});
void setup() {
spore.setup();
spore.registerService(new HelloService());
spore.begin();
}
void loop() {
spore.loop();
}</code></pre>
</div>
<div class="content-block">
<h3>Technical Specifications</h3>
<ul>
<li><strong>Supported Hardware:</strong> ESP-01/ESP-01S (1MB Flash), Wemos D1 (4MB Flash)</li>
<li><strong>Discovery Protocol:</strong> Discovery and heartbeat via UDP broadcast</li>
<li><strong>API Interface:</strong> RESTful HTTP + WebSocket and UDP streaming</li>
<li><strong>Dependencies:</strong> ESPAsyncWebServer, ArduinoJson</li>
<li><strong>Framework:</strong> Arduino with PlatformIO build system</li>
</ul>
</div>
</div>
</section>
<section id="gateway" class="content-section alt">
<div class="container">
<h2>Gateway</h2>
<p class="subtitle">Gateway service providing UDP-based node discovery, cluster management, and API endpoints</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore-gateway" target="_blank" rel="noopener">Repository: spore-gateway</a></p>
<div class="feature-grid">
<div class="feature-card">
<h3>Node Discovery</h3>
<p>UDP-based discovery listens for heartbeat messages from SPORE nodes on port 4210 with automatic cluster membership</p>
</div>
<div class="feature-card">
<h3>Cluster Management</h3>
<p>Real-time node status tracking, primary node selection, and automatic failover for high availability</p>
</div>
<div class="feature-card">
<h3>WebSocket Server</h3>
<p>Real-time cluster updates and event broadcasting to all connected WebSocket clients</p>
</div>
<div class="feature-card">
<h3>MQTT Integration</h3>
<p>Subscribe to all MQTT topics and forward messages to WebSocket clients for unified event streaming</p>
</div>
<div class="feature-card">
<h3>Rollout System</h3>
<p>Orchestrated firmware updates across multiple nodes with parallel processing and progress tracking</p>
</div>
<div class="feature-card">
<h3>Proxy API</h3>
<p>Generic proxy calls to SPORE node capabilities with automatic failover and load balancing</p>
</div>
</div>
<div class="content-block">
<h3>Architecture & Integration</h3>
<p>SPORE Gateway acts as the central orchestrator for the SPORE cluster, bridging the gap between SPORE nodes and the UI. It integrates seamlessly with the SPORE ecosystem and external systems through multiple protocols.</p>
</div>
<div class="content-block">
<h3>Core Components</h3>
<ul>
<li><strong>UDP Discovery:</strong> Listens on port 4210 for node heartbeats and maintains cluster membership in real-time</li>
<li><strong>HTTP API Server:</strong> RESTful endpoints for cluster management, node control, and firmware operations</li>
<li><strong>WebSocket Server:</strong> Broadcasts cluster updates, events, and rollout progress to all connected clients</li>
<li><strong>MQTT Client:</strong> Optional integration to subscribe to MQTT brokers and forward messages via WebSocket</li>
<li><strong>Registry Proxy:</strong> Integrates with spore-registry for firmware storage and retrieval</li>
<li><strong>Failover Logic:</strong> Automatic primary node switching when nodes go offline</li>
</ul>
</div>
<div class="content-block">
<h3>MQTT Integration</h3>
<p>Enable MQTT integration to stream events from external IoT devices and systems:</p>
<pre><code class="language-bash"># Start gateway with MQTT integration
./spore-gateway -mqtt tcp://localhost:1883
# With authentication
MQTT_USER=username MQTT_PASSWORD=password \
./spore-gateway -mqtt tcp://broker.example.com:1883</code></pre>
<p>When enabled, the gateway subscribes to all MQTT topics (#) and forwards messages to connected WebSocket clients, allowing the UI to display both SPORE cluster events and external MQTT events in real-time.</p>
</div>
<div class="content-block">
<h3>Rollout Orchestration</h3>
<p>The rollout system manages parallel firmware updates across multiple SPORE nodes:</p>
<ul>
<li><strong>Automatic Node Discovery:</strong> Identifies matching nodes based on firmware labels and current versions</li>
<li><strong>Parallel Processing:</strong> Updates multiple nodes simultaneously using goroutines</li>
<li><strong>Real-time Progress:</strong> WebSocket broadcasts show update status for each node</li>
<li><strong>Error Recovery:</strong> Continues rollout even if individual nodes fail</li>
<li><strong>Registry Integration:</strong> Seamless integration with spore-registry for firmware storage</li>
</ul>
</div>
<div class="content-block">
<h3>Technology Stack</h3>
<ul>
<li><strong>Language:</strong> Go (Golang)</li>
<li><strong>Framework:</strong> Standard library net/http with Go 1.22 ServeMux</li>
<li><strong>WebSocket:</strong> gorilla/websocket for real-time communication</li>
<li><strong>MQTT:</strong> Eclipse Paho MQTT client library</li>
<li><strong>Logging:</strong> Structured logging with logrus</li>
<li><strong>Concurrency:</strong> Goroutines and channels for parallel operations</li>
</ul>
</div>
</div>
</section>
<section id="registry" class="content-section">
<div class="container">
<h2>Registry</h2>
<p class="subtitle">Storage backend and update server for managing versioned firmware binaries</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore-registry" target="_blank" rel="noopener">Repository: spore-registry</a></p>
<div class="feature-grid">
<div class="feature-card">
<h3>Hierarchical Storage</h3>
<p>Firmware binaries stored in hierarchical structure: registry/{name}/{version}/firmware.bin with semantic versioning support</p>
</div>
<div class="feature-card">
<h3>SQLite Metadata</h3>
<p>Metadata storage with labels for flexible querying, version management, and deployment tracking</p>
</div>
<div class="feature-card">
<h3>REST API</h3>
<p>Simple HTTP endpoints for upload, listing, download, and update operations with full CRUD support</p>
</div>
<div class="feature-card">
<h3>Rollout Integration</h3>
<p>Seamlessly integrated with Gateway for orchestrated firmware deployment across cluster nodes</p>
</div>
<div class="feature-card">
<h3>Version Management</h3>
<p>Semantic versioning support with unique name-version constraints and version history tracking</p>
</div>
<div class="feature-card">
<h3>Label System</h3>
<p>Flexible key-value labels for organizing and querying firmware by app, role, or custom attributes</p>
</div>
</div>
<div class="content-block">
<h3>Architecture & Role</h3>
<p>SPORE Registry serves as the central firmware storage and management system for the SPORE ecosystem. It provides versioned storage for firmware binaries, enabling the Gateway to orchestrate firmware rollouts across cluster nodes. The registry integrates seamlessly with the Gateway's rollout system, providing the firmware binaries needed for over-the-air updates.</p>
</div>
<div class="content-block">
<h3>Storage Structure</h3>
<p>Firmware is stored hierarchically in the file system:</p>
<pre><code class="language-text">registry/
├── base/
│ ├── 1.0.0/
│ │ └── firmware.bin
│ └── 1.1.0/
│ └── firmware.bin
└── sensor/
└── 2.0.0/
└── firmware.bin</code></pre>
<p>This structure allows easy organization and access to firmware versions by name and version number.</p>
</div>
<div class="content-block">
<h3>Integration with Gateway</h3>
<p>The registry is tightly integrated with the Gateway's rollout system:</p>
<ul>
<li><strong>Firmware Lookup:</strong> Gateway queries the registry to find matching firmware for deployment</li>
<li><strong>Label Matching:</strong> Firmware can be organized with labels (app, role, target) for automated deployment</li>
<li><strong>Version Tracking:</strong> Registry maintains version history for rollback and audit purposes</li>
<li><strong>Binary Distribution:</strong> Gateway proxies firmware downloads to nodes during rollout</li>
<li><strong>Deployment Automation:</strong> Full integration with Gateway's rollout orchestration for cluster-wide updates</li>
</ul>
</div>
<div class="content-block">
<h3>Usage Examples</h3>
<pre><code class="language-bash"># Upload firmware
curl -X POST http://localhost:3002/firmware \
-F "metadata={\"name\":\"base\",\"version\":\"1.0.0\",\"labels\":{\"app\":\"base\"}}" \
-F "firmware=@firmware.bin"
# List firmware
curl http://localhost:3002/firmware
# Download firmware
curl http://localhost:3002/firmware/base/1.0.0 -o firmware.bin
# Health check
curl http://localhost:3002/health</code></pre>
</div>
<div class="content-block">
<h3>Environment Configuration</h3>
<p>The registry supports the following configuration via environment variables:</p>
<ul>
<li><strong>PORT:</strong> Server port (default: 3002)</li>
<li><strong>DB_PATH:</strong> Database file path (default: ./registry.db)</li>
<li><strong>REGISTRY_PATH:</strong> Firmware storage directory (default: registry)</li>
<li><strong>MAX_UPLOAD_SIZE:</strong> Maximum upload size in bytes (default: 32MB)</li>
</ul>
</div>
<div class="content-block">
<h3>Technology Stack</h3>
<ul>
<li><strong>Language:</strong> Go (Golang)</li>
<li><strong>Database:</strong> SQLite for metadata storage</li>
<li><strong>Storage:</strong> File system for firmware binaries</li>
<li><strong>API:</strong> HTTP REST API with standard library net/http</li>
</ul>
</div>
</div>
</section>
<section id="ui" class="content-section alt">
<div class="container">
<h2>UI</h2>
<p class="subtitle">Zero-configuration web interface for cluster monitoring and management</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore-ui" target="_blank" rel="noopener">Repository: spore-ui</a></p>
<div class="screenshot-grid">
<div class="screenshot">
<img src="assets/cluster.png" alt="Cluster monitoring view">
<p>Real-time cluster member overview with auto-discovery</p>
</div>
<div class="screenshot">
<img src="assets/events.png" alt="Events visualization">
<p>Real-time event flow visualization with interactive graph</p>
</div>
<div class="screenshot">
<img src="assets/events-messages.png" alt="Event messages">
<p>Live event message viewer for topic inspection</p>
</div>
<div class="screenshot">
<img src="assets/topology.png" alt="Network topology visualization">
<p>Network topology visualization with node relationships</p>
</div>
<div class="screenshot">
<img src="assets/monitoring.png" alt="Node monitoring dashboard">
<p>Detailed system metrics and task monitoring</p>
</div>
<div class="screenshot">
<img src="assets/firmware.png" alt="Firmware management interface">
<p>Clusterwide over-the-air firmware updates</p>
</div>
</div>
<div class="content-block">
<h3>Features</h3>
<ul>
<li>Cluster monitoring with real-time status updates</li>
<li>Events visualization showing real-time event flow as an interactive force-directed graph</li>
<li>Event tracking with animated golden dots showing data flow through cluster topics</li>
<li>Node details including running tasks and available endpoints</li>
<li>Direct HTTP API access to all nodes in the cluster</li>
<li>Over-the-air firmware updates for entire cluster</li>
<li>WebSocket terminal for direct node interaction</li>
<li>UDP auto-discovery eliminates hardcoded IP addresses</li>
<li>Responsive design for all devices</li>
</ul>
</div>
<div class="content-block">
<h3>Technology Stack</h3>
<ul>
<li><strong>Backend:</strong> Express.js, Node.js</li>
<li><strong>Frontend:</strong> Vanilla JavaScript, CSS3, HTML5</li>
<li><strong>Architecture:</strong> Custom component-based framework</li>
</ul>
</div>
</div>
</section>
<section id="apps" class="content-section alt">
<div class="container">
<h2>Apps</h2>
<p class="subtitle">Application suite built on SPORE</p>
<div class="content-block">
<p>Explore applications that extend SPORE.</p>
<ul>
<li><a href="#ledlab">LEDLab</a> — Real-time LED matrix animation streaming and visual preset editor</li>
</ul>
</div>
</div>
</section>
<section id="ledlab" class="content-section">
<div class="container">
<h2>LEDLab</h2>
<p class="subtitle">Real-time LED matrix animation streaming and visual preset editor</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore-ledlab" target="_blank" rel="noopener">Repository: spore-ledlab</a></p>
<div class="screenshot-grid">
<div class="screenshot">
<img src="assets/ledlab.png" alt="LEDLab interface">
<p>Multi-node management with live canvas preview</p>
</div>
<div class="screenshot">
<img src="assets/editor.png" alt="Preset editor">
<p>Visual preset editor with building blocks</p>
</div>
</div>
<div class="content-block">
<h3>Firmware Requirements</h3>
<p>LEDLab requires SPORE nodes running the <strong>PixelStreamController</strong> firmware, which handles UDP-based RGB data streaming to NeoPixel strips and matrices. The firmware subscribes to <code>udp/raw</code> cluster events and converts incoming hex-encoded pixel data into real-time LED animations.</p>
<p>Key firmware features include support for both strip and matrix configurations, serpentine (zig-zag) wiring patterns, and configurable pixel counts, brightness, and matrix dimensions. The controller automatically remaps pixel coordinates for proper matrix display.</p>
<p>See <a href="https://git.dcentral.systems/iot/spore/src/branch/main/examples/pixelstream/README.md" target="_blank" rel="noopener">PixelStream documentation</a> for more information.</p>
</div>
<div class="content-block">
<h3>Capabilities</h3>
<ul>
<li>Multi-node management with individual control</li>
<li>Real-time canvas preview for each node</li>
<li>10+ built-in animation presets (rainbow, lava lamp, aurora, etc.)</li>
<li>Visual preset editor with reusable building blocks</li>
<li>Live parameter control with instant feedback</li>
<li>Import/export custom presets as JSON</li>
<li>Auto-discovery of SPORE nodes on network</li>
<li>Configurable FPS (1-60) and matrix dimensions</li>
<li>Requires SPORE nodes running PixelStreamController</li>
</ul>
</div>
<div class="content-block">
<h3>Building Blocks</h3>
<div class="building-blocks">
<div>
<strong>Shapes:</strong> Circle, Rectangle, Triangle, Blob, Point, Line
</div>
<div>
<strong>Patterns:</strong> Trail, Radial, Spiral
</div>
<div>
<strong>Colors:</strong> Solid, Gradient, Palette, Rainbow
</div>
<div>
<strong>Animations:</strong> Move, Rotate, Pulse, Oscillate, Fade
</div>
</div>
</div>
</div>
</section>
<section id="deployment" class="content-section alt">
<div class="container">
<h2>Deployment</h2>
<p class="subtitle">Complete deployment configurations for running the SPORE stack</p>
<p class="repo-link"><a href="https://git.dcentral.systems/iot/spore-deployment" target="_blank" rel="noopener">Repository: spore-deployment</a></p>
<div class="feature-grid">
<div class="feature-card">
<h3>Docker Compose</h3>
<p>Simple deployment with docker-compose for development and production with one command: <code>docker compose up -d</code></p>
</div>
<div class="feature-card">
<h3>Nomad Orchestration</h3>
<p>Production-ready deployment with HashiCorp Nomad for multi-node clustering, rolling updates, and advanced resource management</p>
</div>
<div class="feature-card">
<h3>Complete Stack</h3>
<p>All SPORE services included: mosquitto MQTT broker, gateway, registry, UI, and LEDLab with proper networking and volumes</p>
</div>
<div class="feature-card">
<h3>MQTT Integration</h3>
<p>Built-in Mosquitto broker for message routing and event streaming with WebSocket support</p>
</div>
<div class="feature-card">
<h3>Data Persistence</h3>
<p>All data persisted in local directories for registry data, MQTT data, and firmware storage</p>
</div>
<div class="feature-card">
<h3>Health Monitoring</h3>
<p>Built-in service discovery, health checks, and real-time status monitoring for all services</p>
</div>
</div>
<div class="content-block">
<h3>Quick Start</h3>
<pre><code class="language-bash"># Clone the deployment repository
git clone https://git.dcentral.systems/iot/spore-deployment.git
cd spore-deployment
# Start all services with Docker Compose
docker compose up -d
# Or start with Nomad (production)
make nomad-start
make nomad-job-run</code></pre>
</div>
<div class="content-block">
<h3>Services</h3>
<ul>
<li><strong>mosquitto</strong> - MQTT broker (port 1883, WebSocket 9001)</li>
<li><strong>spore-gateway</strong> - Node discovery and WebSocket gateway (port 3001, UDP 4210)</li>
<li><strong>spore-registry</strong> - Firmware registry service (port 8090)</li>
<li><strong>spore-ledlab</strong> - LED animation studio (port 8080)</li>
<li><strong>spore-ui</strong> - Web UI for cluster management (port 3000)</li>
</ul>
</div>
<div class="content-block">
<h3>Access Points</h3>
<p>Once deployed, access the services at:</p>
<ul>
<li><strong>Web UI:</strong> http://localhost:3000</li>
<li><strong>LED Lab:</strong> http://localhost:8080</li>
<li><strong>Registry API:</strong> http://localhost:8090</li>
<li><strong>Gateway API:</strong> http://localhost:3001</li>
<li><strong>MQTT Broker:</strong> tcp://localhost:1883</li>
<li><strong>Nomad UI:</strong> http://localhost:4646 (Nomad deployments only)</li>
</ul>
</div>
</div>
</section>
<section id="docs" class="content-section">
<div class="container">
<h2>Documentation</h2>
</div>
<div class="doc-grid">
<div class="doc-card">
<h3>SPORE Core</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/Architecture.md" target="_blank" rel="noopener">Architecture Guide</a> - System design and implementation</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/API.md" target="_blank" rel="noopener">API Reference</a> - Complete REST API documentation</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/Development.md" target="_blank" rel="noopener">Development Guide</a> - Build, deployment, configuration</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/TaskManagement.md" target="_blank" rel="noopener">Task Management</a> - Background task system</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/ClusterBroadcast.md" target="_blank" rel="noopener">Cluster Broadcast</a> - Event distribution protocol</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/docs/StreamingAPI.md" target="_blank" rel="noopener">Streaming API</a> - WebSocket integration</li>
</ul>
</div>
<div class="doc-card">
<h3>SPORE UI</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/README.md" target="_blank" rel="noopener">Getting Started</a> - Installation and setup</li>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/docs/Events.md" target="_blank" rel="noopener">Events View</a> - Real-time event visualization</li>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/docs/DISCOVERY.md" target="_blank" rel="noopener">UDP Auto Discovery</a> - Network discovery protocol</li>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/api/openapi.yaml" target="_blank" rel="noopener">API Spec</a> - Backend API reference (OpenAPI)</li>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/docs/FRAMEWORK_README.md" target="_blank" rel="noopener">Component Framework</a> - Custom UI architecture</li>
</ul>
</div>
<div class="doc-card">
<h3>SPORE Gateway</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore-gateway/src/branch/main/README.md" target="_blank" rel="noopener">Getting Started</a> - Installation and usage</li>
<li><a href="https://git.dcentral.systems/iot/spore-gateway/src/branch/main/docs/MQTT.md" target="_blank" rel="noopener">MQTT Integration</a> - MQTT message forwarding</li>
<li><a href="https://git.dcentral.systems/iot/spore-gateway/src/branch/main/docs/Rollout.md" target="_blank" rel="noopener">Rollout Process</a> - Firmware rollout orchestration</li>
<li><a href="https://git.dcentral.systems/iot/spore-gateway/src/branch/main/api/openapi.yaml" target="_blank" rel="noopener">API Spec</a> - Gateway API reference (OpenAPI)</li>
</ul>
</div>
<div class="doc-card">
<h3>SPORE Registry</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore-registry/src/branch/main/README.md" target="_blank" rel="noopener">Getting Started</a> - Installation and usage</li>
<li><a href="https://git.dcentral.systems/iot/spore-registry/src/branch/main/docs/ARCHITECTURE.md" target="_blank" rel="noopener">Architecture</a> - System design and structure</li>
<li><a href="https://git.dcentral.systems/iot/spore-registry/src/branch/main/api/openapi.yaml" target="_blank" rel="noopener">API Spec</a> - Registry API reference (OpenAPI)</li>
<li><a href="https://git.dcentral.systems/iot/spore-ui/src/branch/main/docs/FIRMWARE_REGISTRY_INTEGRATION.md" target="_blank" rel="noopener">UI Integration</a> - Registry integration with UI</li>
</ul>
</div>
<div class="doc-card">
<h3>SPORE LEDLab</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore-ledlab/src/branch/main/README.md" target="_blank" rel="noopener">Quick Start</a> - Installation and usage</li>
<li><a href="https://git.dcentral.systems/iot/spore-ledlab/src/branch/main/PRESET_EDITOR.md" target="_blank" rel="noopener">Preset Editor</a> - Visual animation builder</li>
<li><a href="https://git.dcentral.systems/iot/spore-ledlab/src/branch/main/presets/examples" target="_blank" rel="noopener">Custom Presets</a> - JSON format and examples</li>
<li><a href="https://git.dcentral.systems/iot/spore-ledlab/src/branch/main/presets/building-blocks.js" target="_blank" rel="noopener">Building Blocks</a> - Reusable components</li>
<li><a href="https://git.dcentral.systems/iot/spore-ledlab/src/branch/main/MULTI_NODE_UPDATE.md" target="_blank" rel="noopener">Multi-Node Management</a> - Cluster control</li>
<li><a href="https://git.dcentral.systems/iot/spore/src/branch/main/examples/pixelstream/README.md" target="_blank" rel="noopener">PixelStream Controller</a> - Required SPORE node firmware</li>
</ul>
</div>
<div class="doc-card">
<h3>SPORE Deployment</h3>
<ul>
<li><a href="https://git.dcentral.systems/iot/spore-deployment/src/branch/main/README.md" target="_blank" rel="noopener">Getting Started</a> - Complete deployment guide</li>
<li><a href="https://git.dcentral.systems/iot/spore-deployment/src/branch/main/nomad/README.md" target="_blank" rel="noopener">Nomad Deployment</a> - Production orchestration</li>
<li><a href="https://git.dcentral.systems/iot/spore-deployment/src/branch/main/docker-compose.yml" target="_blank" rel="noopener">Docker Compose</a> - Development configuration</li>
</ul>
</div>
</div>
<div class="container">
<div class="getting-started">
<h3>Getting Started</h3>
<div class="start-grid">
<div class="start-card">
<h4>SPORE Core</h4>
<pre><code># Build and flash firmware
./ctl.sh build target esp01
./ctl.sh flash target esp01</code></pre>
</div>
<div class="start-card">
<h4>SPORE Gateway</h4>
<pre><code># Build and start
go mod tidy
go build
./spore-gateway
# With MQTT integration
./spore-gateway -mqtt tcp://localhost:1883</code></pre>
</div>
<div class="start-card">
<h4>SPORE Registry</h4>
<pre><code># Build and start
go mod download
go run main.go
# Or build and run
go build -o spore-registry
./spore-registry</code></pre>
</div>
<div class="start-card">
<h4>SPORE UI</h4>
<pre><code># Install and start
npm install
npm start
# Open browser
http://localhost:3001</code></pre>
</div>
<div class="start-card">
<h4>SPORE LEDLab</h4>
<pre><code># Install and start
npm install
npm start
# Open browser
http://localhost:3000</code></pre>
</div>
<div class="start-card">
<h4>SPORE Deployment</h4>
<pre><code># Docker Compose (dev)
docker compose up -d
# Nomad (production)
make nomad-start
make nomad-job-run</code></pre>
</div>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<p>SPORE - Sprocket Orchestration Engine</p>
<p>
Source:
<a href="https://git.dcentral.systems/iot/spore" target="_blank" rel="noopener">spore</a> ·
<a href="https://git.dcentral.systems/iot/spore-gateway" target="_blank" rel="noopener">spore-gateway</a> ·
<a href="https://git.dcentral.systems/iot/spore-registry" target="_blank" rel="noopener">spore-registry</a> ·
<a href="https://git.dcentral.systems/iot/spore-ui" target="_blank" rel="noopener">spore-ui</a> ·
<a href="https://git.dcentral.systems/iot/spore-ledlab" target="_blank" rel="noopener">spore-ledlab</a> ·
<a href="https://git.dcentral.systems/iot/spore-deployment" target="_blank" rel="noopener">spore-deployment</a>
</p>
</div>
</footer>
<!-- Lightbox Overlay for screenshots -->
<div id="lightbox" class="lightbox" aria-hidden="true" role="dialog">
<div class="lightbox-backdrop" data-close></div>
<figure class="lightbox-content">
<img id="lightbox-image" alt="Expanded screenshot" />
<figcaption id="lightbox-caption"></figcaption>
<button class="lightbox-close" type="button" title="Close" aria-label="Close" data-close>×</button>
</figure>
</div>
<script src="script.js"></script>
<!-- Prism.js for syntax highlighting -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.30.0/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.30.0/plugins/autoloader/prism-autoloader.min.js"></script>
</body>
</html>