128 lines
4.4 KiB
HTML
128 lines
4.4 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 (WASM)</title>
|
|
<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; }
|
|
.sidebar { width: 260px; 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 .lang-toggle { margin: 12px 0; font-size: 12px; }
|
|
.sidebar .lang-toggle a { display: inline; font-size: 12px; padding: 2px 6px; }
|
|
.sidebar .logout { margin-top: auto; padding-top: 16px; border-top: 1px solid #eee; }
|
|
.sidebar .logout a { font-size: 12px; color: #999; }
|
|
.sidebar .logout a:hover { color: #cc0000; }
|
|
.content { flex: 1; padding: 40px; max-width: 960px; }
|
|
.content.loading { opacity: 0.5; }
|
|
.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; }
|
|
.hidden { display: none; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<div class="sidebar">
|
|
<h1>Momentry Docs</h1>
|
|
<div id="module-list"></div>
|
|
<div class="logout">
|
|
<a href="#" id="logout-btn">Logout</a>
|
|
</div>
|
|
</div>
|
|
<div class="content" id="content">
|
|
<p>Loading...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
import init, { render_markdown, module_list } from './pkg/doc_wasm.js';
|
|
|
|
const API = '';
|
|
let currentModule = null;
|
|
let modules = [];
|
|
|
|
async function loadDoc(name) {
|
|
const el = document.getElementById('content');
|
|
el.classList.add('loading');
|
|
try {
|
|
const resp = await fetch(`/doc/modules/${name}.md`);
|
|
if (!resp.ok) throw new Error(`HTTP ${resp.status}`);
|
|
const md = await resp.text();
|
|
el.innerHTML = render_markdown(md);
|
|
el.classList.remove('loading');
|
|
// highlight active module
|
|
document.querySelectorAll('.sidebar a.module-link').forEach(a => a.classList.remove('active'));
|
|
const 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">Failed to load: ${e.message}</p>`;
|
|
el.classList.remove('loading');
|
|
}
|
|
}
|
|
|
|
async function checkAuth() {
|
|
const resp = await fetch(`${API}/api/v1/auth/login`, {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify({username:'demo',password:'demo'})
|
|
});
|
|
return resp.ok;
|
|
}
|
|
|
|
async function initApp() {
|
|
await init();
|
|
|
|
// Parse module list
|
|
modules = JSON.parse(module_list());
|
|
const listEl = document.getElementById('module-list');
|
|
modules.forEach(([name, cn, en]) => {
|
|
const a = document.createElement('a');
|
|
a.className = 'module-link';
|
|
a.dataset.module = name;
|
|
a.textContent = `${cn} - ${en}`;
|
|
a.onclick = (e) => { e.preventDefault(); loadDoc(name); };
|
|
listEl.appendChild(a);
|
|
});
|
|
|
|
// Logout
|
|
document.getElementById('logout-btn').onclick = async (e) => {
|
|
e.preventDefault();
|
|
await fetch(`${API}/api/v1/auth/logout`, {method:'POST'});
|
|
window.location.reload();
|
|
};
|
|
|
|
// Load initial module from hash or default
|
|
const hash = location.hash.slice(1);
|
|
if (hash) {
|
|
loadDoc(hash);
|
|
} else {
|
|
loadDoc('01_auth');
|
|
}
|
|
}
|
|
|
|
// Handle browser back/forward
|
|
window.onpopstate = () => {
|
|
const hash = location.hash.slice(1);
|
|
if (hash) loadDoc(hash);
|
|
};
|
|
|
|
initApp();
|
|
</script>
|
|
</body>
|
|
</html>
|