- Fix all js errors.
This commit is contained in:
parent
a823f319c3
commit
42f5ce609c
3 changed files with 49 additions and 33 deletions
|
|
@ -1,12 +1,16 @@
|
|||
<div class="chat-layout" x-data="chatApp()" x-cloak>
|
||||
|
||||
<div class="chat-layout" id="chat-app">
|
||||
<div id="connectionStatus" class="connection-status disconnected"></div>
|
||||
<main id="messages"></main>
|
||||
|
||||
<footer>
|
||||
<div class="suggestions-container" id="suggestions"></div>
|
||||
<div class="input-container">
|
||||
<input id="messageInput" type="text" placeholder="Message..." autofocus />
|
||||
<input
|
||||
id="messageInput"
|
||||
type="text"
|
||||
placeholder="Message..."
|
||||
autofocus
|
||||
/>
|
||||
<button id="voiceBtn" title="Voice">🎤</button>
|
||||
<button id="sendBtn" title="Send">↑</button>
|
||||
</div>
|
||||
|
|
@ -16,8 +20,11 @@
|
|||
<div>Context</div>
|
||||
<div id="contextPercentage">0%</div>
|
||||
<div class="context-progress">
|
||||
<div class="context-progress-bar" id="contextProgressBar" style="width:0%"></div>
|
||||
<div
|
||||
class="context-progress-bar"
|
||||
id="contextProgressBar"
|
||||
style="width: 0%"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,41 +11,42 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<nav x-data="{ current: 'chat' }">
|
||||
<nav id="main-nav">
|
||||
<div class="logo">⚡ General Bots</div>
|
||||
<a
|
||||
href="#chat"
|
||||
@click.prevent="current = 'chat'; window.switchSection('chat')"
|
||||
:class="{ active: current === 'chat' }"
|
||||
<a href="#chat" class="nav-link active" data-section="chat"
|
||||
>💬 Chat</a
|
||||
>
|
||||
|
||||
<a
|
||||
href="#drive"
|
||||
@click.prevent="current = 'drive'; window.switchSection('drive')"
|
||||
:class="{ active: current === 'drive' }"
|
||||
>📁 Drive</a
|
||||
>
|
||||
<a
|
||||
href="#tasks"
|
||||
@click.prevent="current = 'tasks'; window.switchSection('tasks')"
|
||||
:class="{ active: current === 'tasks' }"
|
||||
>✓ Tasks</a
|
||||
>
|
||||
<a
|
||||
href="#mail"
|
||||
@click.prevent="current = 'mail'; window.switchSection('mail')"
|
||||
:class="{ active: current === 'mail' }"
|
||||
>✉ Mail</a
|
||||
>
|
||||
<a href="#drive" class="nav-link" data-section="drive">📁 Drive</a>
|
||||
<a href="#tasks" class="nav-link" data-section="tasks">✓ Tasks</a>
|
||||
<a href="#mail" class="nav-link" data-section="mail">✉ Mail</a>
|
||||
</nav>
|
||||
|
||||
<div id="main-content">
|
||||
<!-- Sections will be loaded dynamically -->
|
||||
</div>
|
||||
|
||||
<!-- Load Layout Script first, then Alpine - module scripts are loaded dynamically -->
|
||||
<!-- Load scripts -->
|
||||
<script src="js/layout.js"></script>
|
||||
<script src="js/alpine.js"></script>
|
||||
<script>
|
||||
// Simple navigation state management without Alpine
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const nav = document.getElementById("main-nav");
|
||||
const links = nav.querySelectorAll(".nav-link");
|
||||
|
||||
links.forEach((link) => {
|
||||
link.addEventListener("click", (e) => {
|
||||
e.preventDefault();
|
||||
const section = link.dataset.section;
|
||||
|
||||
// Update active state
|
||||
links.forEach((l) => l.classList.remove("active"));
|
||||
link.classList.add("active");
|
||||
|
||||
// Switch section
|
||||
window.switchSection(section);
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -132,7 +132,15 @@ async function switchSection(section) {
|
|||
}
|
||||
|
||||
window.history.pushState({}, "", `#${section}`);
|
||||
Alpine.initTree(mainContent);
|
||||
|
||||
// Start Alpine on first load, then just init the tree for new sections
|
||||
if (typeof window.startAlpine === "function") {
|
||||
window.startAlpine();
|
||||
delete window.startAlpine;
|
||||
} else if (window.Alpine) {
|
||||
window.Alpine.initTree(mainContent);
|
||||
}
|
||||
|
||||
const inputEl = document.getElementById("messageInput");
|
||||
if (inputEl) {
|
||||
inputEl.focus();
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue