234 lines
9.6 KiB
HTML
234 lines
9.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-TW">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Momentry API Docs</title>
|
|
<script src="https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js"></script>
|
|
<script>mermaid.initialize({startOnLoad:false,theme:'base',themeVariables:{primaryColor:'#e8f4fd',primaryBorderColor:'#4a90d9',primaryTextColor:'#333',lineColor:'#4a90d9',secondaryColor:'#fef3e2',secondaryBorderColor:'#d9a84a',tertiaryColor:'#e8f8e8'}});</script>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; color: #333; }
|
|
#app { display: flex; min-height: 100vh; }
|
|
html, body { height: 100%; }
|
|
.sidebar { width: 260px; min-height: 100vh; background: #fff; border-right: 1px solid #ddd; padding: 20px; display: flex; flex-direction: column; }
|
|
.sidebar h1 { font-size: 18px; margin-bottom: 16px; }
|
|
.sidebar a { display: block; padding: 6px 0; color: #0066cc; text-decoration: none; font-size: 14px; cursor: pointer; }
|
|
.sidebar a:hover { color: #003d80; }
|
|
.sidebar .active { font-weight: 600; color: #003d80; }
|
|
.sidebar .logout { margin-top: auto; padding-top: 16px; border-top: 1px solid #eee; position: sticky; bottom: 20px; }
|
|
.sidebar .logout a { font-size: 13px; color: #cc0000; cursor: pointer; font-weight: 600; }
|
|
.sidebar .logout a:hover { color: #990000; text-decoration: underline; }
|
|
.content { flex: 1; padding: 40px; max-width: 960px; }
|
|
.content table { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 14px; }
|
|
.content th, .content td { border: 1px solid #ddd; padding: 8px 12px; text-align: left; }
|
|
.content th { background: #f0f0f0; font-weight: 600; }
|
|
.content code { background: #f0f0f0; padding: 2px 6px; border-radius: 3px; font-size: 13px; }
|
|
.content pre { background: #f8f8f8; border: 1px solid #ddd; border-radius: 6px; padding: 12px; overflow-x: auto; margin: 12px 0; }
|
|
.content pre code { background: none; padding: 0; }
|
|
.content h1 { font-size: 24px; margin: 24px 0 12px; }
|
|
.content h2 { font-size: 20px; margin: 20px 0 10px; color: #222; }
|
|
.content h3 { font-size: 16px; margin: 16px 0 8px; color: #444; }
|
|
.content p { line-height: 1.6; margin: 8px 0; }
|
|
.content a { color: #0066cc; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<div class="sidebar" id="sidebar">
|
|
<h1>Momentry Docs</h1>
|
|
<div id="module-list"></div>
|
|
<div class="logout">
|
|
<a id="logout-btn">Logout</a>
|
|
</div>
|
|
</div>
|
|
<div class="content" id="content">
|
|
<p>Loading...</p>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
const MODULES = [
|
|
["01_auth","安全認證","Authentication"],
|
|
["02_health","健康檢查","Health"],
|
|
["03_register","檔案註冊","File Registration"],
|
|
["04_lookup","檔案屬性查詢","File Lookup"],
|
|
["05_process","處理流程","Processing"],
|
|
["06_search","搜尋功能","Search"],
|
|
["07_identity","身份識別","Identity"],
|
|
["08_identity_agent","智能身份綁定","Smart Identity Binding"],
|
|
["08_media","串流與截圖","Streaming & Thumbnails"],
|
|
["09_tmdb","TMDb 整合","TMDb Integration"],
|
|
["10_pipeline","生產線","Pipeline"],
|
|
["12_agent","智慧代理","AI Agents"],
|
|
["13_config","系統設定","System Config"],
|
|
];
|
|
|
|
const el = document.getElementById('content');
|
|
let wasm_render = null;
|
|
|
|
let wasm_exports = null;
|
|
|
|
async function initWasm() {
|
|
const resp = await fetch('/doc-wasm/pkg/md_wasm_bg.wasm');
|
|
if (!resp.ok) throw new Error('WASM fetch failed: ' + resp.status);
|
|
const bytes = await resp.arrayBuffer();
|
|
|
|
// Import object: __wbindgen_init_externref_table will be called from __wbindgen_start
|
|
// after instantiation, so we close over a variable that will be set later
|
|
let exports = null;
|
|
const importObj = {
|
|
'./md_wasm_bg.js': {
|
|
__wbindgen_init_externref_table: function() {
|
|
const table = exports.__wbindgen_externrefs;
|
|
const offset = table.grow(4);
|
|
table.set(0, undefined);
|
|
table.set(offset + 0, undefined);
|
|
table.set(offset + 1, null);
|
|
table.set(offset + 2, true);
|
|
table.set(offset + 3, false);
|
|
},
|
|
}
|
|
};
|
|
|
|
const wasm = await WebAssembly.instantiate(bytes, importObj);
|
|
exports = wasm.instance.exports;
|
|
wasm_exports = exports;
|
|
|
|
// Call start function to initialize (triggers __wbindgen_init_externref_table)
|
|
if (exports.__wbindgen_start) {
|
|
exports.__wbindgen_start();
|
|
}
|
|
}
|
|
|
|
function md2html(md) {
|
|
if (!wasm_exports) return '<p>WASM not loaded</p>';
|
|
const encoder = new TextEncoder();
|
|
const buf = encoder.encode(md);
|
|
const malloc = wasm_exports.__wbindgen_malloc;
|
|
const free = wasm_exports.__wbindgen_free;
|
|
const memory = wasm_exports.memory;
|
|
|
|
const ptr = malloc(buf.length, 1);
|
|
const mem = new Uint8Array(memory.buffer);
|
|
mem.set(buf, ptr);
|
|
|
|
const result = wasm_exports.render(ptr, buf.length);
|
|
const rptr = result[0];
|
|
const rlen = result[1];
|
|
const ret = new TextDecoder().decode(new Uint8Array(memory.buffer, rptr, rlen));
|
|
free(rptr, rlen, 1);
|
|
// Convert mermaid code blocks: <pre><code class="language-mermaid">...</code></pre> → <pre class="mermaid">...</pre>
|
|
var h = ret.replace(/<table>/g, '<table class="table">');
|
|
h = h.replace(/<pre><code class="language-mermaid">([\s\S]*?)<\/code><\/pre>/g, '<pre class="mermaid">$1</pre>');
|
|
return h;
|
|
}
|
|
|
|
async function loadDoc(name) {
|
|
el.innerHTML = '<p>Loading...</p>';
|
|
try {
|
|
const resp = await fetch('/doc-wasm/modules/' + name + '.md');
|
|
if (!resp.ok) throw new Error('HTTP ' + resp.status + ' fetching /doc-wasm/modules/' + name + '.md');
|
|
const md = await resp.text();
|
|
if (!wasm_exports) throw new Error('WASM not loaded');
|
|
el.innerHTML = md2html(md);
|
|
if (typeof mermaid !== 'undefined') mermaid.run({nodes:[el.querySelector('.mermaid')].filter(Boolean)});
|
|
document.querySelectorAll('.sidebar a.module-link').forEach(function(a) { a.classList.remove('active'); });
|
|
var link = document.querySelector('.sidebar a[data-module="' + name + '"]');
|
|
if (link) link.classList.add('active');
|
|
history.pushState(null, '', '#' + name);
|
|
} catch(e) {
|
|
el.innerHTML = '<p style="color:red">Error: ' + e.message + '</p><pre>'+e.stack+'</pre>';
|
|
}
|
|
}
|
|
|
|
async function loginUser(user, pass) {
|
|
var resp = await fetch('/api/v1/auth/login', {
|
|
method:'POST', headers:{'Content-Type':'application/json'},
|
|
body: JSON.stringify({username:user, password:pass})
|
|
});
|
|
return resp.ok;
|
|
}
|
|
|
|
function showLoginForm() {
|
|
el.innerHTML = '<div style="max-width:360px;margin:80px auto;background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,0.08);padding:40px;text-align:center">' +
|
|
'<h1 style="font-size:24px;margin-bottom:24px">Momentry Docs</h1>' +
|
|
'<form onsubmit="doLogin();return false">' +
|
|
'<input type="text" id="login-user" placeholder="Username" value="demo" style="width:100%;padding:10px;margin-bottom:12px;border:1px solid #ddd;border-radius:6px;font-size:14px">' +
|
|
'<input type="password" id="login-pass" placeholder="Password" value="" style="width:100%;padding:10px;margin-bottom:12px;border:1px solid #ddd;border-radius:6px;font-size:14px">' +
|
|
'<div id="login-err" style="color:#cc0000;font-size:13px;margin-bottom:12px;display:none">Invalid credentials</div>' +
|
|
'<button type="submit" style="width:100%;padding:10px;background:#0066cc;color:#fff;border:none;border-radius:6px;font-size:16px;cursor:pointer">Login</button>' +
|
|
'</form>' +
|
|
'</div>';
|
|
}
|
|
window.doLogin = async function() {
|
|
var u = document.getElementById('login-user').value;
|
|
var p = document.getElementById('login-pass').value;
|
|
if (await loginUser(u, p)) {
|
|
document.getElementById('sidebar').style.display = 'flex';
|
|
initApp();
|
|
} else {
|
|
document.getElementById('login-err').style.display = 'block';
|
|
}
|
|
};
|
|
|
|
async function initApp() {
|
|
try {
|
|
el.innerHTML = '<p>Loading WASM...</p>';
|
|
await initWasm();
|
|
el.innerHTML = '<p>Building modules...</p>';
|
|
var listEl = document.getElementById('module-list');
|
|
listEl.innerHTML = '';
|
|
MODULES.forEach(function(m) {
|
|
var a = document.createElement('a');
|
|
a.className = 'module-link';
|
|
a.setAttribute('data-module', m[0]);
|
|
a.textContent = m[0] + ' ' + m[1];
|
|
a.onclick = function(e) { e.preventDefault(); loadDoc(m[0]); };
|
|
listEl.appendChild(a);
|
|
});
|
|
// Watch for logout disappearing
|
|
var lo = document.getElementById('logout-btn');
|
|
if (lo) {
|
|
var loObs = new MutationObserver(function() {
|
|
if (!document.getElementById('logout-btn')) {
|
|
document.getElementById('content').innerHTML += '<p style="color:orange">⚠️ logout removed from DOM</p>';
|
|
}
|
|
});
|
|
loObs.observe(document.body, {childList: true, subtree: true});
|
|
}
|
|
|
|
document.getElementById('sidebar').style.display = 'flex';
|
|
|
|
document.getElementById('logout-btn').onclick = async function(e) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
try {
|
|
await fetch('/api/v1/auth/logout', {method:'POST', credentials:'include'});
|
|
} catch(_) {}
|
|
// Clear client-side cookies
|
|
document.cookie.split(';').forEach(function(c) {
|
|
document.cookie = c.trim().split('=')[0] + '=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/';
|
|
});
|
|
document.getElementById('sidebar').style.display = 'none';
|
|
showLoginForm();
|
|
};
|
|
|
|
// Load initial module from hash or default
|
|
var hash = location.hash.slice(1);
|
|
await loadDoc(hash || '01_auth');
|
|
} catch(e) {
|
|
el.innerHTML = '<p style="color:red">Init error: ' + e.message + '</p><pre>'+e.stack+'</pre>';
|
|
}
|
|
}
|
|
|
|
async function init() {
|
|
// Hide sidebar until authenticated
|
|
document.getElementById('sidebar').style.display = 'none';
|
|
showLoginForm();
|
|
}
|
|
|
|
init();
|
|
</script>
|
|
</body>
|
|
</html>
|