summaryrefslogtreecommitdiff
path: root/static/api-docs.html
diff options
context:
space:
mode:
Diffstat (limited to 'static/api-docs.html')
-rw-r--r--static/api-docs.html956
1 files changed, 956 insertions, 0 deletions
diff --git a/static/api-docs.html b/static/api-docs.html
new file mode 100644
index 0000000..07e02ac
--- /dev/null
+++ b/static/api-docs.html
@@ -0,0 +1,956 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>API Documentation - TaskFlow</title>
+ <link rel="stylesheet" href="api-docs-styles.css">
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+ <nav class="navbar">
+ <div class="nav-container">
+ <a href="landing.html" class="nav-logo">TaskFlow</a>
+ <ul class="nav-menu">
+ <li><a href="landing.html#features" class="nav-link">Features</a></li>
+ <li><a href="landing.html#pricing" class="nav-link">Pricing</a></li>
+ <li><a href="about.html" class="nav-link">About</a></li>
+ <li><a href="blog.html" class="nav-link">Blog</a></li>
+ <li><a href="contact.html" class="nav-link">Contact</a></li>
+ </ul>
+ <div class="nav-actions">
+ <a href="login.html" class="btn btn-ghost">Sign In</a>
+ <button class="btn btn-primary">Start Free Trial</button>
+ </div>
+ </div>
+ </nav>
+
+ <div class="docs-layout">
+ <aside class="sidebar">
+ <div class="sidebar-content">
+ <div class="sidebar-header">
+ <h3>API Documentation</h3>
+ <div class="api-version">v1.0</div>
+ </div>
+
+ <nav class="sidebar-nav">
+ <div class="nav-section">
+ <h4>Getting Started</h4>
+ <ul>
+ <li><a href="#overview" class="nav-item">Overview</a></li>
+ <li><a href="#authentication" class="nav-item">Authentication</a></li>
+ <li><a href="#rate-limits" class="nav-item">Rate Limits</a></li>
+ <li><a href="#errors" class="nav-item">Error Handling</a></li>
+ </ul>
+ </div>
+
+ <div class="nav-section">
+ <h4>Authentication</h4>
+ <ul>
+ <li><a href="#auth-login" class="nav-item">Login</a></li>
+ <li><a href="#auth-refresh" class="nav-item">Refresh Token</a></li>
+ <li><a href="#auth-logout" class="nav-item">Logout</a></li>
+ </ul>
+ </div>
+
+ <div class="nav-section">
+ <h4>Contact</h4>
+ <ul>
+ <li><a href="#contact-submit" class="nav-item">Submit Contact Form</a></li>
+ </ul>
+ </div>
+
+ <div class="nav-section">
+ <h4>Status</h4>
+ <ul>
+ <li><a href="#status-overall" class="nav-item">Overall Status</a></li>
+ <li><a href="#status-services" class="nav-item">Services Status</a></li>
+ <li><a href="#status-metrics" class="nav-item">Metrics</a></li>
+ <li><a href="#status-incidents" class="nav-item">Incidents</a></li>
+ <li><a href="#status-maintenance" class="nav-item">Maintenance</a></li>
+ <li><a href="#status-uptime" class="nav-item">Uptime History</a></li>
+ <li><a href="#status-subscribe" class="nav-item">Subscribe</a></li>
+ </ul>
+ </div>
+
+ <div class="nav-section">
+ <h4>Resources</h4>
+ <ul>
+ <li><a href="#sdks" class="nav-item">SDKs</a></li>
+ <li><a href="#postman" class="nav-item">Postman Collection</a></li>
+ <li><a href="#changelog" class="nav-item">Changelog</a></li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ </aside>
+
+ <main class="main-content">
+ <div class="content-container">
+ <section id="overview" class="doc-section">
+ <h1>TaskFlow API Documentation</h1>
+ <p class="lead">
+ Welcome to the TaskFlow API documentation. Our REST API allows you to integrate TaskFlow's
+ project management capabilities into your applications.
+ </p>
+
+ <div class="info-card">
+ <div class="info-header">
+ <h3>Base URL</h3>
+ </div>
+ <div class="code-block">
+ <code>https://api.taskflow.com/v1</code>
+ <button class="copy-btn" data-copy="https://api.taskflow.com/v1">Copy</button>
+ </div>
+ </div>
+
+ <div class="features-grid">
+ <div class="feature-card">
+ <div class="feature-icon">🔒</div>
+ <h4>Secure</h4>
+ <p>OAuth 2.0 and API key authentication with HTTPS encryption</p>
+ </div>
+ <div class="feature-card">
+ <div class="feature-icon">⚡</div>
+ <h4>Fast</h4>
+ <p>Global CDN with average response times under 200ms</p>
+ </div>
+ <div class="feature-card">
+ <div class="feature-icon">📊</div>
+ <h4>Reliable</h4>
+ <p>99.9% uptime SLA with comprehensive monitoring</p>
+ </div>
+ <div class="feature-card">
+ <div class="feature-icon">🔄</div>
+ <h4>RESTful</h4>
+ <p>Standard HTTP methods with JSON request/response format</p>
+ </div>
+ </div>
+ </section>
+
+ <section id="authentication" class="doc-section">
+ <h2>Authentication</h2>
+ <p>
+ TaskFlow API uses Bearer token authentication. Include your API token in the
+ <code>Authorization</code> header of your requests.
+ </p>
+
+ <div class="code-example">
+ <div class="code-header">
+ <span>Request Headers</span>
+ </div>
+ <div class="code-block">
+ <pre><code>Authorization: Bearer YOUR_API_TOKEN
+Content-Type: application/json</code></pre>
+ <button class="copy-btn" data-copy="Authorization: Bearer YOUR_API_TOKEN&#10;Content-Type: application/json">Copy</button>
+ </div>
+ </div>
+
+ <div class="alert alert-info">
+ <div class="alert-icon">â„šī¸</div>
+ <div class="alert-content">
+ <strong>Getting Your API Token:</strong> You can generate API tokens from your
+ <a href="#" class="alert-link">account settings</a> page after signing in.
+ </div>
+ </div>
+ </section>
+
+ <section id="rate-limits" class="doc-section">
+ <h2>Rate Limits</h2>
+ <p>
+ API requests are rate limited to ensure fair usage and system stability.
+ </p>
+
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Plan</th>
+ <th>Requests per minute</th>
+ <th>Requests per hour</th>
+ <th>Burst limit</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><span class="plan-badge free">Free</span></td>
+ <td>60</td>
+ <td>1,000</td>
+ <td>100</td>
+ </tr>
+ <tr>
+ <td><span class="plan-badge pro">Pro</span></td>
+ <td>300</td>
+ <td>10,000</td>
+ <td>500</td>
+ </tr>
+ <tr>
+ <td><span class="plan-badge enterprise">Enterprise</span></td>
+ <td>1,000</td>
+ <td>50,000</td>
+ <td>2,000</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h3>Rate Limit Headers</h3>
+ <p>Every API response includes rate limit information in the headers:</p>
+
+ <div class="code-example">
+ <div class="code-header">
+ <span>Response Headers</span>
+ </div>
+ <div class="code-block">
+ <pre><code>X-RateLimit-Limit: 300
+X-RateLimit-Remaining: 299
+X-RateLimit-Reset: 1640995200</code></pre>
+ <button class="copy-btn" data-copy="X-RateLimit-Limit: 300&#10;X-RateLimit-Remaining: 299&#10;X-RateLimit-Reset: 1640995200">Copy</button>
+ </div>
+ </div>
+ </section>
+
+ <section id="errors" class="doc-section">
+ <h2>Error Handling</h2>
+ <p>
+ TaskFlow API uses conventional HTTP response codes to indicate success or failure of requests.
+ </p>
+
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Status Code</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><span class="status-code success">200</span></td>
+ <td>OK - Request successful</td>
+ </tr>
+ <tr>
+ <td><span class="status-code success">201</span></td>
+ <td>Created - Resource created successfully</td>
+ </tr>
+ <tr>
+ <td><span class="status-code client-error">400</span></td>
+ <td>Bad Request - Invalid request parameters</td>
+ </tr>
+ <tr>
+ <td><span class="status-code client-error">401</span></td>
+ <td>Unauthorized - Invalid or missing authentication</td>
+ </tr>
+ <tr>
+ <td><span class="status-code client-error">403</span></td>
+ <td>Forbidden - Insufficient permissions</td>
+ </tr>
+ <tr>
+ <td><span class="status-code client-error">404</span></td>
+ <td>Not Found - Resource not found</td>
+ </tr>
+ <tr>
+ <td><span class="status-code client-error">429</span></td>
+ <td>Too Many Requests - Rate limit exceeded</td>
+ </tr>
+ <tr>
+ <td><span class="status-code server-error">500</span></td>
+ <td>Internal Server Error - Server error</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h3>Error Response Format</h3>
+ <div class="code-example">
+ <div class="code-header">
+ <span>Error Response</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "error": {
+ "code": "VALIDATION_ERROR",
+ "message": "Invalid email format",
+ "details": {
+ "field": "email",
+ "value": "invalid-email"
+ }
+ }
+}</code></pre>
+ <button class="copy-btn" data-copy='{"error":{"code":"VALIDATION_ERROR","message":"Invalid email format","details":{"field":"email","value":"invalid-email"}}}'>Copy</button>
+ </div>
+ </div>
+ </section>
+
+ <section id="auth-login" class="doc-section">
+ <h2>Authentication Endpoints</h2>
+
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method post">POST</span>
+ <span class="path">/auth/login</span>
+ </div>
+ <p>Authenticate a user and receive access tokens.</p>
+
+ <h4>Request Body</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>JSON</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "email": "user@example.com",
+ "password": "securepassword123"
+}</code></pre>
+ <button class="copy-btn" data-copy='{"email":"user@example.com","password":"securepassword123"}'>Copy</button>
+ </div>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
+ "refresh_token": "def502004a8b7e...",
+ "token_type": "Bearer",
+ "expires_in": 3600,
+ "user": {
+ "id": "user_123",
+ "email": "user@example.com",
+ "name": "John Doe"
+ }
+}</code></pre>
+ <button class="copy-btn" data-copy='{"access_token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...","refresh_token":"def502004a8b7e...","token_type":"Bearer","expires_in":3600,"user":{"id":"user_123","email":"user@example.com","name":"John Doe"}}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="auth-refresh" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method post">POST</span>
+ <span class="path">/auth/refresh</span>
+ </div>
+ <p>Refresh an expired access token using a refresh token.</p>
+
+ <h4>Request Body</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>JSON</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "refresh_token": "def502004a8b7e..."
+}</code></pre>
+ <button class="copy-btn" data-copy='{"refresh_token":"def502004a8b7e..."}'>Copy</button>
+ </div>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
+ "token_type": "Bearer",
+ "expires_in": 3600
+}</code></pre>
+ <button class="copy-btn" data-copy='{"access_token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...","token_type":"Bearer","expires_in":3600}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="auth-logout" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method post">POST</span>
+ <span class="path">/auth/logout</span>
+ </div>
+ <p>Invalidate the current access token and refresh token.</p>
+
+ <h4>Headers</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>Required</span>
+ </div>
+ <div class="code-block">
+ <pre><code>Authorization: Bearer YOUR_ACCESS_TOKEN</code></pre>
+ <button class="copy-btn" data-copy="Authorization: Bearer YOUR_ACCESS_TOKEN">Copy</button>
+ </div>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "message": "Successfully logged out"
+}</code></pre>
+ <button class="copy-btn" data-copy='{"message":"Successfully logged out"}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="contact-submit" class="doc-section">
+ <h2>Contact Endpoints</h2>
+
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method post">POST</span>
+ <span class="path">/contact</span>
+ </div>
+ <p>Submit a contact form message.</p>
+
+ <h4>Request Body</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>JSON</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "firstName": "John",
+ "lastName": "Doe",
+ "email": "john.doe@example.com",
+ "phone": "+1-555-123-4567",
+ "company": "Acme Corp",
+ "subject": "general",
+ "priority": "medium",
+ "message": "I'm interested in learning more about TaskFlow for my team.",
+ "newsletter": true,
+ "privacy": true
+}</code></pre>
+ <button class="copy-btn" data-copy='{"firstName":"John","lastName":"Doe","email":"john.doe@example.com","phone":"+1-555-123-4567","company":"Acme Corp","subject":"general","priority":"medium","message":"I am interested in learning more about TaskFlow for my team.","newsletter":true,"privacy":true}'>Copy</button>
+ </div>
+ </div>
+
+ <h4>Parameters</h4>
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Required</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>firstName</code></td>
+ <td>string</td>
+ <td><span class="required">Yes</span></td>
+ <td>Contact's first name</td>
+ </tr>
+ <tr>
+ <td><code>lastName</code></td>
+ <td>string</td>
+ <td><span class="required">Yes</span></td>
+ <td>Contact's last name</td>
+ </tr>
+ <tr>
+ <td><code>email</code></td>
+ <td>string</td>
+ <td><span class="required">Yes</span></td>
+ <td>Valid email address</td>
+ </tr>
+ <tr>
+ <td><code>phone</code></td>
+ <td>string</td>
+ <td><span class="optional">No</span></td>
+ <td>Phone number</td>
+ </tr>
+ <tr>
+ <td><code>company</code></td>
+ <td>string</td>
+ <td><span class="optional">No</span></td>
+ <td>Company name</td>
+ </tr>
+ <tr>
+ <td><code>subject</code></td>
+ <td>enum</td>
+ <td><span class="required">Yes</span></td>
+ <td>general, support, sales, billing, feature, partnership, other</td>
+ </tr>
+ <tr>
+ <td><code>priority</code></td>
+ <td>enum</td>
+ <td><span class="optional">No</span></td>
+ <td>low, medium, high, urgent (default: low)</td>
+ </tr>
+ <tr>
+ <td><code>message</code></td>
+ <td>string</td>
+ <td><span class="required">Yes</span></td>
+ <td>Message content (max 1000 characters)</td>
+ </tr>
+ <tr>
+ <td><code>newsletter</code></td>
+ <td>boolean</td>
+ <td><span class="optional">No</span></td>
+ <td>Subscribe to newsletter (default: false)</td>
+ </tr>
+ <tr>
+ <td><code>privacy</code></td>
+ <td>boolean</td>
+ <td><span class="required">Yes</span></td>
+ <td>Privacy policy agreement</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "id": "contact_123456",
+ "message": "Contact form submitted successfully",
+ "ticket_id": "TF-2025-001234",
+ "estimated_response_time": "24 hours"
+}</code></pre>
+ <button class="copy-btn" data-copy='{"id":"contact_123456","message":"Contact form submitted successfully","ticket_id":"TF-2025-001234","estimated_response_time":"24 hours"}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-overall" class="doc-section">
+ <h2>Status Endpoints</h2>
+
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status</span>
+ </div>
+ <p>Get overall system status and key metrics.</p>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "status": "operational",
+ "description": "All systems are operating normally",
+ "uptime": 99.95,
+ "responseTime": 245,
+ "activeIncidents": 0,
+ "scheduledMaintenance": 0,
+ "lastUpdated": "2025-08-07T15:30:00Z"
+}</code></pre>
+ <button class="copy-btn" data-copy='{"status":"operational","description":"All systems are operating normally","uptime":99.95,"responseTime":245,"activeIncidents":0,"scheduledMaintenance":0,"lastUpdated":"2025-08-07T15:30:00Z"}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-services" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status/services</span>
+ </div>
+ <p>Get status of individual services.</p>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>[
+ {
+ "id": "api",
+ "name": "API Gateway",
+ "description": "Core API services",
+ "status": "operational",
+ "responseTime": 180,
+ "uptime": 99.98
+ },
+ {
+ "id": "web",
+ "name": "Web Application",
+ "description": "TaskFlow web interface",
+ "status": "operational",
+ "responseTime": 120,
+ "uptime": 99.95
+ }
+]</code></pre>
+ <button class="copy-btn" data-copy='[{"id":"api","name":"API Gateway","description":"Core API services","status":"operational","responseTime":180,"uptime":99.98},{"id":"web","name":"Web Application","description":"TaskFlow web interface","status":"operational","responseTime":120,"uptime":99.95}]'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-metrics" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status/metrics</span>
+ </div>
+ <p>Get detailed performance metrics.</p>
+
+ <h4>Query Parameters</h4>
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Default</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>range</code></td>
+ <td>enum</td>
+ <td>24h</td>
+ <td>Time range: 1h, 6h, 24h, 7d</td>
+ </tr>
+ <tr>
+ <td><code>metric</code></td>
+ <td>enum</td>
+ <td>all</td>
+ <td>Specific metric: responseTime, volume, errors</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "range": "24h",
+ "responseTime": {
+ "average": 245,
+ "p95": 380,
+ "p99": 520,
+ "data": [
+ {
+ "timestamp": "2025-08-07T14:00:00Z",
+ "value": 240
+ }
+ ]
+ },
+ "volume": {
+ "total": 1250000,
+ "average": 868,
+ "data": [
+ {
+ "timestamp": "2025-08-07T14:00:00Z",
+ "value": 850
+ }
+ ]
+ }
+}</code></pre>
+ <button class="copy-btn" data-copy='{"range":"24h","responseTime":{"average":245,"p95":380,"p99":520,"data":[{"timestamp":"2025-08-07T14:00:00Z","value":240}]},"volume":{"total":1250000,"average":868,"data":[{"timestamp":"2025-08-07T14:00:00Z","value":850}]}}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-incidents" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status/incidents</span>
+ </div>
+ <p>Get current and recent incidents.</p>
+
+ <h4>Query Parameters</h4>
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Default</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>status</code></td>
+ <td>enum</td>
+ <td>all</td>
+ <td>Filter by status: investigating, identified, monitoring, resolved</td>
+ </tr>
+ <tr>
+ <td><code>limit</code></td>
+ <td>integer</td>
+ <td>10</td>
+ <td>Number of incidents to return (max 50)</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>[
+ {
+ "id": "incident_123",
+ "title": "Intermittent API Timeouts",
+ "description": "Some users may experience slow response times when accessing the API.",
+ "status": "investigating",
+ "severity": "minor",
+ "startTime": "2025-08-07T13:30:00Z",
+ "endTime": null,
+ "affectedServices": ["api", "web"],
+ "updates": [
+ {
+ "timestamp": "2025-08-07T13:30:00Z",
+ "status": "investigating",
+ "message": "We are investigating reports of slow API response times."
+ }
+ ]
+ }
+]</code></pre>
+ <button class="copy-btn" data-copy='[{"id":"incident_123","title":"Intermittent API Timeouts","description":"Some users may experience slow response times when accessing the API.","status":"investigating","severity":"minor","startTime":"2025-08-07T13:30:00Z","endTime":null,"affectedServices":["api","web"],"updates":[{"timestamp":"2025-08-07T13:30:00Z","status":"investigating","message":"We are investigating reports of slow API response times."}]}]'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-maintenance" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status/maintenance</span>
+ </div>
+ <p>Get scheduled maintenance windows.</p>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>[
+ {
+ "id": "maintenance_456",
+ "title": "Database Maintenance Window",
+ "description": "Scheduled maintenance to upgrade database servers.",
+ "startTime": "2025-08-08T02:00:00Z",
+ "endTime": "2025-08-08T04:00:00Z",
+ "affectedServices": ["database", "api"],
+ "impact": "Brief service interruptions may occur",
+ "status": "scheduled"
+ }
+]</code></pre>
+ <button class="copy-btn" data-copy='[{"id":"maintenance_456","title":"Database Maintenance Window","description":"Scheduled maintenance to upgrade database servers.","startTime":"2025-08-08T02:00:00Z","endTime":"2025-08-08T04:00:00Z","affectedServices":["database","api"],"impact":"Brief service interruptions may occur","status":"scheduled"}]'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-uptime" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method get">GET</span>
+ <span class="path">/status/uptime</span>
+ </div>
+ <p>Get historical uptime data.</p>
+
+ <h4>Query Parameters</h4>
+ <div class="table-container">
+ <table class="api-table">
+ <thead>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Default</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><code>days</code></td>
+ <td>integer</td>
+ <td>90</td>
+ <td>Number of days to return (max 365)</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>[
+ {
+ "date": "2025-08-07",
+ "uptime": 100.0
+ },
+ {
+ "date": "2025-08-06",
+ "uptime": 99.95
+ }
+]</code></pre>
+ <button class="copy-btn" data-copy='[{"date":"2025-08-07","uptime":100.0},{"date":"2025-08-06","uptime":99.95}]'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="status-subscribe" class="doc-section">
+ <div class="endpoint">
+ <div class="endpoint-header">
+ <span class="method post">POST</span>
+ <span class="path">/status/subscribe</span>
+ </div>
+ <p>Subscribe to status page notifications.</p>
+
+ <h4>Request Body</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>JSON</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "email": "user@example.com",
+ "notifications": ["incidents", "maintenance"],
+ "services": ["api", "web"]
+}</code></pre>
+ <button class="copy-btn" data-copy='{"email":"user@example.com","notifications":["incidents","maintenance"],"services":["api","web"]}'>Copy</button>
+ </div>
+ </div>
+
+ <h4>Response</h4>
+ <div class="code-example">
+ <div class="code-header">
+ <span>200 OK</span>
+ </div>
+ <div class="code-block">
+ <pre><code>{
+ "id": "subscription_789",
+ "message": "Successfully subscribed to status notifications",
+ "email": "user@example.com",
+ "confirmationSent": true
+}</code></pre>
+ <button class="copy-btn" data-copy='{"id":"subscription_789","message":"Successfully subscribed to status notifications","email":"user@example.com","confirmationSent":true}'>Copy</button>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="sdks" class="doc-section">
+ <h2>SDKs & Tools</h2>
+ <p>Official SDKs and tools to help you integrate with TaskFlow API.</p>
+
+ <div class="sdk-grid">
+ <div class="sdk-card">
+ <div class="sdk-header">
+ <div class="sdk-icon">🟨</div>
+ <h4>JavaScript SDK</h4>
+ </div>
+ <p>Official JavaScript/TypeScript SDK for browser and Node.js applications.</p>
+ <div class="sdk-actions">
+ <a href="#" class="btn btn-secondary">Documentation</a>
+ <a href="#" class="btn btn-ghost">GitHub</a>
+ </div>
+ </div>
+
+ <div class="sdk-card">
+ <div class="sdk-header">
+ <div class="sdk-icon">🐍</div>
+ <h4>Python SDK</h4>
+ </div>
+ <p>Official Python SDK with full API coverage and async support.</p>
+ <div class="sdk-actions">
+ <a href="#" class="btn btn-secondary">Documentation</a>
+ <a href="#" class="btn btn-ghost">PyPI</a>
+ </div>
+ </div>
+
+ <div class="sdk-card">
+ <div class="sdk-header">
+ <div class="sdk-icon">🔷</div>
+ <h4>Go SDK</h4>
+ </div>
+ <p>Official Go SDK with comprehensive error handling and context support.</p>
+ <div class="sdk-actions">
+ <a href="#" class="btn btn-secondary">Documentation</a>
+ <a href="#" class="btn btn-ghost">GitHub</a>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="postman" class="doc-section">
+ <h3>Postman Collection</h3>
+ <p>Import our Postman collection to quickly test API endpoints.</p>
+
+ <div class="postman-card">
+ <div class="postman-content">
+ <div class="postman-icon">📮</div>
+ <div>
+ <h4>TaskFlow API Collection</h4>
+ <p>Complete collection with all endpoints, examples, and environment variables.</p>
+ </div>
+ </div>
+ <a href="#" class="btn btn-primary">Import Collection</a>
+ </div>
+ </section>
+
+ <section id="changelog" class="doc-section">
+ <h2>Changelog</h2>
+ <div class="changelog">
+ <div class="changelog-item">
+ <div class="changelog-date">
+ <div class="changelog-version">v1.0.0</div>
+ <div class="changelog-timestamp">August 7, 2025</div>
+ </div>
+ <div class="changelog-content">
+ <h4>Initial API Release</h4>
+ <ul>
+ <li>Authentication endpoints (login, refresh, logout)</li>
+ <li>Contact form submission</li>
+ <li>Status page endpoints</li>
+ <li>Rate limiting implementation</li>
+ <li>Comprehensive error handling</li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </section>
+ </div>
+ </main>
+ </div>
+
+ <div class="toast" id="toast">
+ <div class="toast-content">
+ <span class="toast-icon">✓</span>
+ <span class="toast-message"></span>
+ </div>
+ </div>
+
+ <script src="api-docs-script.js"></script>
+</body>
+</html>