john-okeefe
ea5ad7a41b
This commit updates the web frontend TypeScript modules: Core modules: - admin.ts: Admin panel functionality and user management - analytics.ts: Analytics dashboard and data visualization - api-explorer.ts: Interactive API documentation explorer - api.ts: Core API client with request/response handling - collections.ts: Book collection management UI - conflicts.ts: Sync conflict resolution interface - custom-section-builder.ts: Dynamic section builder for UI - docs.ts: Documentation viewer and navigation - dom.ts: DOM manipulation utilities and helpers - header.ts: Application header with navigation - library.ts: Library view and book grid management - linking.ts: Device-book linking interface - password_validation.ts: Client-side password strength validation - queue.ts: Device sync queue management UI - search.ts: Full-text search with Lunr integration - storage.ts: Local storage and cache management - theme.ts: Theme management and CSS variable updates - themeDropdown.ts: Theme selector dropdown component - toast.ts: Toast notification system - woodPaneling.ts: Visual theme effects - woodPanelingInit.ts: Visual effects initialization Type definitions: - api.d.ts: Updated TypeScript definitions for API responses These updates enhance the frontend with improved functionality for book management, device synchronization, and user experience.
95 lines
2.8 KiB
TypeScript
95 lines
2.8 KiB
TypeScript
function toggleSidebar(): void {
|
|
const sidebar = document.getElementById("docs-sidebar");
|
|
const overlay = document.getElementById("docs-overlay");
|
|
|
|
if (sidebar && overlay) {
|
|
sidebar.classList.toggle("translate-x-0");
|
|
sidebar.classList.toggle("-translate-x-full");
|
|
overlay.classList.toggle("hidden");
|
|
}
|
|
}
|
|
|
|
function initializeDocsSearch(): void {
|
|
const searchInput = document.getElementById(
|
|
"docs-search",
|
|
) as HTMLInputElement;
|
|
const searchResults = document.getElementById("docs-search-results");
|
|
|
|
if (!searchInput || !searchResults) return;
|
|
|
|
let docsSearchTimeout: ReturnType<typeof setTimeout> | null = null;
|
|
|
|
searchInput.addEventListener("input", () => {
|
|
const query = searchInput.value.trim();
|
|
|
|
if (docsSearchTimeout) {
|
|
clearTimeout(docsSearchTimeout);
|
|
}
|
|
|
|
if (query.length < 2) {
|
|
searchResults.innerHTML = "";
|
|
searchResults.classList.add("hidden");
|
|
return;
|
|
}
|
|
|
|
docsSearchTimeout = setTimeout(() => {
|
|
performDocsSearch(query);
|
|
}, 300);
|
|
});
|
|
}
|
|
|
|
function performDocsSearch(query: string): void {
|
|
const searchResults = document.getElementById("docs-search-results");
|
|
if (!searchResults) return;
|
|
|
|
if (!(window as any).lunr) {
|
|
console.warn("Lunr.js not loaded");
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const idx = (window as any).lunrIndex;
|
|
if (!idx) {
|
|
searchResults.innerHTML =
|
|
'<p class="p-2 text-sm" style="color: var(--text-secondary)">Search index not loaded</p>';
|
|
searchResults.classList.remove("hidden");
|
|
return;
|
|
}
|
|
|
|
const results = idx.search(query);
|
|
|
|
if (results.length === 0) {
|
|
searchResults.innerHTML =
|
|
'<p class="p-2 text-sm" style="color: var(--text-secondary)">No results found</p>';
|
|
} else {
|
|
searchResults.innerHTML = results
|
|
.slice(0, 10)
|
|
.map((result: { ref: string }) => {
|
|
const doc = (window as any).docsData?.[result.ref];
|
|
if (!doc) return "";
|
|
|
|
return `
|
|
<a href="${result.ref}" class="block p-2 hover:bg-opacity-50 transition-colors" style="background-color: var(--bg-secondary)">
|
|
<p class="font-medium text-sm" style="color: var(--text-primary)">${doc.title || result.ref}</p>
|
|
${doc.section ? `<p class="text-xs" style="color: var(--text-secondary)">${doc.section}</p>` : ""}
|
|
</a>
|
|
`;
|
|
})
|
|
.join("");
|
|
}
|
|
|
|
searchResults.classList.remove("hidden");
|
|
} catch (error) {
|
|
console.error("Search error:", error);
|
|
searchResults.innerHTML =
|
|
'<p class="p-2 text-sm" style="color: var(--text-secondary)">Search error</p>';
|
|
searchResults.classList.remove("hidden");
|
|
}
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
initializeDocsSearch();
|
|
});
|
|
|
|
(window as any).toggleSidebar = toggleSidebar;
|