diff --git a/ui/suite/desktop.html b/ui/suite/desktop.html index c30dd62..435b7d7 100644 --- a/ui/suite/desktop.html +++ b/ui/suite/desktop.html @@ -1,536 +1,629 @@ - + + + + + General Bots Desktop - - - - BUILD V3 - Web Desktop Environment + + + + + - - - - - + + + + + - - - - + + - .bg-svg { display: none !important; } + + +
- - - - - /* Bottom Taskbar */ - .toolbar { - height: 50px; - background: var(--surface); - border-top: 1px solid var(--border); - display: flex; - align-items: center; - padding: 0 8px; - z-index: 100; - position: relative; - } - - #taskbar-apps { - display: flex; - flex: 1; - height: 100%; - align-items: center; - gap: 0px; - } - - .toolbar-time { - font-family: 'Fira Code', monospace; - font-size: 14px; - color: var(--text-secondary, #3b3b3b); - text-align: right; - line-height: 1.4; - padding: 0 10px; - margin-left: auto; - } - - /* Taskbar Items generated by WindowManager */ - .taskbar-item { - width: 40px; - height: 40px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: all 0.15s ease; - border-bottom: 2px solid transparent; - } - - .taskbar-item:hover { - background: var(--bg-hover, #f8f8f8); - } - - .taskbar-item.active { - border-bottom-color: var(--primary, #84d669); - background: linear-gradient(to bottom, transparent 50%, var(--primary-alpha-10, rgba(132, 214, 105, 0.1)) 100%); - } - - - - - -
- -
- - - - -
- -
-
- // DASHBOARD - > - // E-COMMERCE APP DEVELOPMENT +
+ + + + +
+ + + +
+ + +
+
+
+
+ + + +
+ Vibe +
+ +
+
+ + + + +
+ Tasks +
+ +
+
+ + + +
+ Chat +
+ +
+
+ + + + +
+ Terminal +
+ +
+
+ + + +
+ Explorer +
+ +
+
+ + + + +
+ Editor +
+ +
+
+ + + + +
+ Browser +
+
-
- - -
- - - - - -
-
- -
-
- - - -
- Vibe -
- -
-
- - - - -
- Tasks -
- -
-
- - - -
- Chat -
- -
-
- - - - -
- Terminal -
- -
-
- - - -
- Explorer -
- -
-
- - - - -
- Editor -
- -
-
- - - - -
- Browser -
+ +
+
+
-
-
- - -
-
- -
-
-
-
-
00:00
-
01/01/2026
+
+
+
+
00:00
+
01/01/2026
+
-
-
+ +
-
- - - + // Auto-open Chat window maximized on desktop load + if (window.wm) { + try { + const response = await fetch( + "/suite/partials/chat.html", + ); + if (response.ok) { + const htmlContent = await response.text(); + window.wm.open("chat", "Chat", htmlContent); + // Maximize the chat window after opening + setTimeout(() => { + window.wm.toggleMaximize("chat"); + }, 100); + } + } catch (err) { + console.error("Failed to auto-open chat:", err); + } + } + }); - \ No newline at end of file + // Listen to HTMX afterRequest event + document.body.addEventListener("htmx:afterRequest", function (evt) { + const target = evt.detail.elt; + + // Check if the click came from a desktop icon + if (target.classList.contains("desktop-icon")) { + const appId = target.getAttribute("data-app-id"); + const title = target.getAttribute("data-app-title"); + const htmlContent = evt.detail.xhr.response; + + // Tell WindowManager to open it + if (window.wm) { + window.wm.open(appId, title, htmlContent); + } + } + + // Ensure Theme dropdown is re-injected if wiped + if (window.ThemeManager) { + const container = document.getElementById( + "themeSelectorContainer", + ); + if (container && !container.hasChildNodes()) { + // Quick and dirty way to re-init + window.ThemeManager.init(); + } + } + }); + + // Simple Clock implementation matching the screenshot bottom right corner + setInterval(() => { + const now = new Date(); + document.getElementById("clock-time").textContent = + now.toLocaleTimeString([], { + hour: "2-digit", + minute: "2-digit", + }); + document.getElementById("clock-date").textContent = + now.toLocaleDateString(); + }, 1000); + + + diff --git a/ui/suite/js/window-manager.js b/ui/suite/js/window-manager.js index d3f1192..8cc18ca 100644 --- a/ui/suite/js/window-manager.js +++ b/ui/suite/js/window-manager.js @@ -131,6 +131,12 @@ if (typeof window.WindowManager === "undefined") { windowEl.style.zIndex = this.zIndexCounter++; } + // Update document title + const windowObj = this.openWindows.find((w) => w.id === id); + if (windowObj) { + document.title = `${windowObj.title} - General Bots`; + } + // Highlight taskbar icon if (this.taskbarApps) { const icons = this.taskbarApps.querySelectorAll(".taskbar-icon"); @@ -156,7 +162,10 @@ if (typeof window.WindowManager === "undefined") { this.openWindows = this.openWindows.filter((w) => w.id !== id); if (this.activeWindowId === id) { this.activeWindowId = null; - // Optionally focus the next highest z-index window + // Reset title to default when all windows are closed + if (this.openWindows.length === 0) { + document.title = "General Bots Desktop"; + } } } @@ -220,7 +229,7 @@ if (typeof window.WindowManager === "undefined") { const minibarHeight = 28; windowEl.style.width = "100%"; - windowEl.style.height = `calc(100% - ${taskbarHeight}px - ${minibarHeight}px)`; + windowEl.style.height = `calc(100% - ${minibarHeight}px)`; windowEl.style.top = `${minibarHeight}px`; windowEl.style.left = "0px"; windowObj.isMaximized = true;