GeneralBots/botserver
2
1
Fork 0
Code Issues Pull requests Projects Releases 323 Packages Wiki Activity Actions

- Fix all js errors.

Browse source
This commit is contained in:
Rodrigo Rodriguez (Pragmatismo) 2025-11-20 14:40:15 -03:00
parent a823f319c3
commit 42f5ce609c
3 changed files with 49 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
web/desktop/chat/chat.html
View file

@ -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> <div id="connectionStatus" class="connection-status disconnected"></div>
<main id="messages"></main> <main id="messages"></main>
<footer> <footer>
<div class="suggestions-container" id="suggestions"></div> <div class="suggestions-container" id="suggestions"></div>
<div class="input-container"> <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="voiceBtn" title="Voice">🎤</button>
<button id="sendBtn" title="Send">↑</button> <button id="sendBtn" title="Send">↑</button>
</div> </div>
@ -16,8 +20,11 @@
<div>Context</div> <div>Context</div>
<div id="contextPercentage">0%</div> <div id="contextPercentage">0%</div>
<div class="context-progress"> <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>
</div>
</div>

53
web/desktop/index.html
View file

@ -11,41 +11,42 @@
</head> </head>
<body> <body>
<nav x-data="{ current: 'chat' }"> <nav id="main-nav">
<div class="logo">⚡ General Bots</div> <div class="logo">⚡ General Bots</div>
<a <a href="#chat" class="nav-link active" data-section="chat"
href="#chat"
@click.prevent="current = 'chat'; window.switchSection('chat')"
:class="{ active: current === 'chat' }"
>💬 Chat</a >💬 Chat</a
> >
<a href="#drive" class="nav-link" data-section="drive">📁 Drive</a>
<a <a href="#tasks" class="nav-link" data-section="tasks">✓ Tasks</a>
href="#drive" <a href="#mail" class="nav-link" data-section="mail">✉ Mail</a>
@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
>
</nav> </nav>
<div id="main-content"> <div id="main-content">
<!-- Sections will be loaded dynamically --> <!-- Sections will be loaded dynamically -->
</div> </div>
<!-- Load Layout Script first, then Alpine - module scripts are loaded dynamically --> <!-- Load scripts -->
<script src="js/layout.js"></script> <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> </body>
</html> </html>

10
web/desktop/js/layout.js
View file

@ -132,7 +132,15 @@ async function switchSection(section) {
} }
window.history.pushState({}, "", `#${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"); const inputEl = document.getElementById("messageInput");
if (inputEl) { if (inputEl) {
inputEl.focus(); inputEl.focus();