github/crossdesk-web-client
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[feat] refine layout design

Browse Source
This commit is contained in:
dijunkun
2025-11-09 17:10:45 +08:00
parent 1cb4dbcb96
commit 9607f6c83f
3 changed files with 88 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
web_client.js
View File

@@ -12,6 +12,7 @@ const elements = {
connectedPanel: document.getElementById("connected-panel"),
panelCollapsedBar: document.getElementById("panel-collapsed-bar"),
connectingOverlay: document.getElementById("connecting-overlay"),
connectingMessageText: document.getElementById("connecting-message-text"),
connectionStatusLed: document.getElementById("connection-status-led"),
connectionStatusIndicator: document.getElementById("connection-status-indicator"),
connectedStatusLed: document.getElementById("connected-status-led"),
@@ -142,6 +143,28 @@ function createPeerConnection() {
const isConnected = state === "connected";
updateStatusLed(elements.connectionStatusLed, isConnected, true);
updateStatusLed(elements.connectedStatusLed, isConnected, false);
// Show connection status overlay for disconnected or failed states
if (state === "disconnected" || state === "failed") {
if (elements.connectingOverlay && elements.connectingMessageText) {
// Update message text based on state
if (state === "disconnected") {
elements.connectingMessageText.textContent = "连接已断开...";
} else if (state === "failed") {
elements.connectingMessageText.textContent = "连接失败...";
}
elements.connectingOverlay.style.display = "flex";
}
} else if (state === "connected" || state === "checking" || state === "completed") {
// Hide overlay when connected or checking
if (elements.connectingOverlay) {
// Only hide if we're not in the initial connecting phase
// (initial connecting is handled by hideConnectingOverlayOnFirstFrame)
if (state === "connected" || state === "completed") {
elements.connectingOverlay.style.display = "none";
}
}
}
});
updateStatus(elements.iceState, peer.iceConnectionState);
const isConnected = peer.iceConnectionState === "connected";
@@ -305,6 +328,10 @@ function connect() {
if (elements.connectingOverlay) {
elements.connectingOverlay.style.display = "flex";
}
// Reset connecting message text
if (elements.connectingMessageText) {
elements.connectingMessageText.textContent = "连接中...";
}
sendJoinRequest();
}