dsh-remote-plugin 0.6.3 → 0.6.5

package/public/app.js

@@ -275,7 +275,7 @@ async function rpc(method, payload = {}) {
     body: JSON.stringify({ type: 'client-request', rpcId: uuid(), method, payload })
   }
   if (typeof AbortSignal !== 'undefined' && typeof AbortSignal.timeout === 'function') {
-    opts.signal = AbortSignal.timeout(20000)
+    opts.signal = AbortSignal.timeout(45000)
   }
   const res = await fetch(apiUrl('/api/' + method), opts)
   if (res.status === 401) throw new Error('AUTH')
@@ -709,16 +709,54 @@ const streams = {}
 state.streamsOk = { mux: false, host: false }
 let pollTimer = null
 let wsRetryTimer = null
+let connTickTimer = null
+let reconnectInfo = null
+
+function clearStreamTimers(ws) {
+  if (!ws) return
+  clearInterval(ws._hbTimer)
+  clearInterval(ws._staleTimer)
+  ws._hbTimer = null
+  ws._staleTimer = null
+}
+
+function clearConnTick() {
+  clearInterval(connTickTimer)
+  connTickTimer = null
+}
+
+function startConnTick() {
+  if (connTickTimer) return
+  connTickTimer = setInterval(() => {
+    updateConn()
+    if (!reconnectInfo || state.streamMode === 'poll' || !navigator.onLine ||
+        (streams.mux?.readyState === WebSocket.OPEN && streams.host?.readyState === WebSocket.OPEN)) {
+      clearConnTick()
+    }
+  }, 1000)
+}
+
+function setReconnect(delay) {
+  reconnectInfo = { at: Date.now() + delay }
+  startConnTick()
+  updateConn()
+}
+
+function clearReconnect() {
+  reconnectInfo = null
+  clearConnTick()
+}
 
 function openStreams() {
   if (!state.token) return
   if (state.streamMode === 'poll') stopPolling()
   state.streamMode = 'ws'
+  clearReconnect()
   openStream('mux', onMuxFrame, true)
   openStream('host', onHostFrame, false)
 }
 
-function openStream(kind, handler, refreshOnOpen) {
+function openStream(kind, handler, refreshOnOpen, isRestore) {
   if (!state.token) return
   let base
   if (state.server) {
@@ -731,11 +769,28 @@ function openStream(kind, handler, refreshOnOpen) {
   const ws = new WebSocket(`${base}/api/events.${kind}?token=${encodeURIComponent(state.token)}&client=${clientMark}`)
   try { streams[kind]?.close() } catch {}
   streams[kind] = ws
+  ws._attempt = 0
+  ws._lastMsgAt = 0
+  ws._isRestore = !!isRestore
   ws.onopen = () => {
     state.streamsOk[kind] = true
     state.errCount = 0
+    ws._attempt = 0
+    ws._lastMsgAt = Date.now()
+    clearStreamTimers(ws)
+    // 应用层心跳: 25s 发纯文本 ping, 防 NAT/WiFi 切换后的 WS 半开假活
+    ws._hbTimer = setInterval(() => {
+      try { if (ws.readyState === WebSocket.OPEN) ws.send('ping') } catch {}
+    }, 25000)
+    // 60s 没有任何消息(含 pong/业务帧)就主动断开, 触发指数退避重连
+    ws._staleTimer = setInterval(() => {
+      if (ws.readyState === WebSocket.OPEN && Date.now() - (ws._lastMsgAt || 0) > 60000) {
+        try { ws.close() } catch {}
+      }
+    }, 10000)
     // 重连成功：切回 WS 并停止轮询
     if (state.streamMode === 'poll') { stopPolling(); state.streamMode = 'ws' }
+    if (streams.mux?.readyState === WebSocket.OPEN && streams.host?.readyState === WebSocket.OPEN) clearReconnect()
     updateConn()
     // mux 每次(重)连接都会重放“仍待处理”的审批/提问基线:
     // 先清空旧列表, 避免“桌面已自定义回答, 手机漏收 question/resolved”后永久残留。
@@ -747,6 +802,7 @@ function openStream(kind, handler, refreshOnOpen) {
     if (refreshOnOpen) refreshAll()
   }
   ws.onmessage = (msg) => {
+    ws._lastMsgAt = Date.now()
     state.streamsOk[kind] = true
     state.errCount = 0
     updateConn()
@@ -756,16 +812,34 @@ function openStream(kind, handler, refreshOnOpen) {
     } catch {}
   }
   ws.onclose = () => {
+    clearStreamTimers(ws)
     state.streamsOk[kind] = false
     state.errCount++
     updateConn()
-    if (state.streamMode === 'poll') return
+    if (!navigator.onLine) { clearReconnect(); return }
+    if (state.streamMode === 'poll') {
+      // 降级轮询期间: 恢复尝试失败也用退避, 避免 30s 固定间隔内空转
+      if (ws._isRestore && streams[kind] === ws) {
+        const attempt = ws._attempt || 0
+        ws._attempt = attempt + 1
+        const baseDelay = Math.min(1200 * Math.pow(2, attempt), 30000)
+        const delay = Math.round(baseDelay * (0.8 + Math.random() * 0.4))
+        setTimeout(() => openStream(kind, handler, refreshOnOpen, true), delay)
+      }
+      return
+    }
     // 连续失败 3 次 -> 降级为轮询
     if (state.errCount >= 3) { enterPollMode(); return }
     // 多服务器: 连续掉线若干次就重测速, 自动换到当前可达的最快地址
     if (state.servers.length && state.errCount % 5 === 0) setTimeout(() => selectFastestServer({ silent: true }), 300)
-    // 无条件重连; 页面被挂起时定时器暂停, visibilitychange 会再触发一次
-    if (streams[kind] === ws) setTimeout(() => openStream(kind, handler, refreshOnOpen), 1200)
+    // 指数退避 + 20% 抖动: min(1200 * 2^attempt, 30000)
+    const attempt = ws._attempt || 0
+    ws._attempt = attempt + 1
+    const baseDelay = Math.min(1200 * Math.pow(2, attempt), 30000)
+    const delay = Math.round(baseDelay * (0.8 + Math.random() * 0.4))
+    setReconnect(delay)
+    // 页面被挂起时定时器暂停, visibilitychange 会再触发一次
+    if (streams[kind] === ws) setTimeout(() => openStream(kind, handler, refreshOnOpen), delay)
   }
   ws.onerror = () => { try { ws.close() } catch {} }
 }
@@ -838,8 +912,8 @@ async function pollKind(kind) {
 function tryRestoreWs() {
   if (state.streamMode !== 'poll' || !state.token) return
   // 轮询继续跑，等 WS 真正 onopen 后再切回，避免重连窗口丢事件
-  openStream('mux', onMuxFrame, true)
-  openStream('host', onHostFrame, false)
+  openStream('mux', onMuxFrame, true, true)
+  openStream('host', onHostFrame, false, true)
 }
 
 /* 回前台恢复: 强制重排修复 MIUI WebView 后台切回时 sticky 顶栏不绘制的问题 */
@@ -876,6 +950,23 @@ setInterval(() => {
 setInterval(() => {
   if (document.visibilityState === 'visible' && state.servers.length) selectFastestServer({ silent: true })
 }, 300000)
+
+/* 网络感知: 离线立刻关 WS + 显示离线, 在线立即重连 */
+window.addEventListener('offline', () => {
+  clearReconnect()
+  try { streams.mux?.close() } catch {}
+  try { streams.host?.close() } catch {}
+  if (state.streamMode === 'poll') stopPolling()
+  updateConn()
+})
+window.addEventListener('online', () => {
+  if (!state.token) { updateConn(); return }
+  state.errCount = 0
+  clearReconnect()
+  openStreams()
+  updateConn()
+})
+
 function onMuxFrame(full) {
   const f = full.payload
   if (!f) return
@@ -1180,8 +1271,19 @@ async function loadHistory(reset) {
   } catch (e) {
     state.history.loading = false
     if (e.message === 'AUTH') { authFailure(); return }
-    if (restoreCachedHistory()) toast(t('history.cacheFallback'), 'ok')
-    else toast(t('history.loadFailed', { msg: e.message }), 'err')
+    if (restoreCachedHistory()) {
+      toast(t('history.cacheFallback'), 'ok')
+      return
+    }
+    const msg = e.message || t('err.dshError')
+    const box = $('history')
+    if (box && (reset || !state.history.visible.length)) {
+      box.innerHTML = `<div class="empty"><div>${esc(t('history.loadFailed', { msg }))}</div><button type="button" class="mini-btn" id="btn-history-retry" style="margin-top:10px">${esc(t('history.retry'))}</button></div>`
+      const retry = $('btn-history-retry')
+      if (retry) retry.addEventListener('click', () => loadHistory(true))
+    } else {
+      toast(t('history.loadFailed', { msg }), 'err')
+    }
     return
   }
 
@@ -1404,7 +1506,7 @@ function blockHtml(b) {
   if (!b || typeof b !== 'object') return `<p>${esc(String(b))}</p>`
   if ((b.type === 'tool-call' || b.type === 'tool-result') && LS.get('showTools', '1') === '0') return ''
   switch (b.type) {
-    case 'text': return `<div>${renderMarkdown(b.text ?? '')}</div>`
+    case 'text': return `<div class="md">${window.mdToHtml ? window.mdToHtml(b.text ?? '') : esc(b.text ?? '')}</div>`
     case 'image': return `<img alt="${t('block.image')}" src="data:${esc(b.mediaType || 'image/png')};base64,${esc(b.data || '')}">`
     case 'thinking':
     case 'reasoning':
@@ -1418,20 +1520,6 @@ function blockHtml(b) {
   }
 }
 
-function renderMarkdown(text) {
-  const parts = String(text ?? '').split(/```/)
-  let out = ''
-  for (let i = 0; i < parts.length; i++) {
-    if (i % 2 === 1) out += `<pre>${esc(parts[i])}</pre>`
-    else out += esc(parts[i])
-      .replace(/`([^`]+)`/g, '<code>$1</code>')
-      .replace(/\*\*([^*]+)\*\*/g, '<b>$1</b>')
-      .replace(/(?:^|\n)(#{1,4})\s+([^\n]+)/g, (m, h, t) => `\n<b>${t}</b>`)
-      .replace(/\n/g, '<br>')
-  }
-  return out
-}
-
 function safeJson(v) {
   try { return typeof v === 'string' ? v : JSON.stringify(v, null, 2) }
   catch { return String(v) }
@@ -2544,6 +2632,33 @@ function notify(title, body) {
   } catch {}
 }
 
+async function sendTestNotification() {
+  if (!CAP?.isNativePlatform?.()) {
+    toast(t('settings.testNotifyUnavailable'), 'err')
+    return
+  }
+  const L = CAP.Plugins?.LocalNotifications
+  if (!L?.schedule) {
+    toast(t('settings.testNotifyUnavailable'), 'err')
+    return
+  }
+  const ok = await ensureNotify()
+  if (!ok) { toast(t('settings.notifyDenied'), 'err'); return }
+  try {
+    await L.schedule({
+      notifications: [{
+        id: 8899,
+        title: 'DSH Remote',
+        body: '测试通知 · Test',
+        schedule: { at: new Date(Date.now() + 3000) }
+      }]
+    })
+    toast(t('settings.testNotifySent'), 'ok')
+  } catch (e) {
+    toast(t('settings.testNotifyFailed', { msg: e?.message || '' }), 'err')
+  }
+}
+
 /* ---------------- 后台轮询（Android 前台服务） ---------------- */
 function bgBridge() { return window.NativeBackground }
 function bgBase() { return (state.server || location.origin || '').replace(/\/+$/, '') }
@@ -2646,38 +2761,25 @@ function deletePreset(id) {
   toast(t('presets.deleted'), 'ok')
 }
 
-/* ---------------- 峰谷计费提醒(每天 9/12/14/18 点本地通知) ---------------- */
-const PEAK_REMIND_NOTIFS = [
-  { id: 8801, hour: 9, periodKey: 'peak0912', enterKey: 'enterPeak' },
-  { id: 8802, hour: 12, periodKey: 'off1214', enterKey: 'enterOff' },
-  { id: 8803, hour: 14, periodKey: 'peak1418', enterKey: 'enterPeak' },
-  { id: 8804, hour: 18, periodKey: 'off1809', enterKey: 'enterOff' },
-]
+/* ---------------- 峰谷计费提醒(前台服务进程内定时, 绕开 MIUI 后台限制) ---------------- */
 function peakRemindOn() { return LS.get('peakRemind', '0') === '1' }
 
 async function schedulePeakReminders() {
   if (!CAP?.isNativePlatform?.()) return false
-  const L = CAP.Plugins?.LocalNotifications
-  if (!L?.schedule) return false
+  const b = bgBridge()
+  if (!b?.startPeakReminder) return false
   try {
-    await L.schedule({
-      notifications: PEAK_REMIND_NOTIFS.map(n => ({
-        id: n.id,
-        title: 'DSH Remote',
-        body: `${t('peakRemind.' + n.enterKey)} · ${t('peakRemind.' + n.periodKey)}`,
-        schedule: { every: 'day', on: { hour: n.hour, minute: 0 } },
-      }))
-    })
+    b.startPeakReminder()
     return true
   } catch { return false }
 }
 
 async function cancelPeakReminders() {
   if (!CAP?.isNativePlatform?.()) return false
-  const L = CAP.Plugins?.LocalNotifications
-  if (!L?.cancel) return false
+  const b = bgBridge()
+  if (!b?.stopPeakReminder) return false
   try {
-    await L.cancel({ notifications: PEAK_REMIND_NOTIFS.map(n => ({ id: n.id })) })
+    b.stopPeakReminder()
     return true
   } catch { return false }
 }
@@ -2716,16 +2818,36 @@ function updateConn() {
   const ms = state.serverLatency[state.server]
   const curGroup = cur ? cur.group : state.activeGroup
   const curLabel = cur ? (cur.note || cur.url) : (state.server || t('speed.origin'))
+  const titleBase = t('conn.titleGroup', { group: curGroup, url: curLabel, ms: Number.isFinite(ms) ? ms + 'ms' : '—' })
+  if (!navigator.onLine) {
+    el.textContent = t('conn.offline')
+    el.className = 'topbar-btn conn-badge off'
+    el.title = titleBase
+    return
+  }
   if (state.streamMode === 'poll') {
     el.textContent = t('conn.poll')
     el.className = 'topbar-btn conn-badge off'
-    el.title = t('conn.pollTitle') + ' · ' + t('conn.titleGroup', { group: curGroup, url: curLabel, ms: Number.isFinite(ms) ? ms + 'ms' : '—' })
+    el.title = t('conn.pollTitle') + ' · ' + titleBase
     return
   }
   const ok = !!state.streamsOk?.mux
+  if (!ok && reconnectInfo) {
+    const remain = Math.max(0, Math.ceil((reconnectInfo.at - Date.now()) / 1000))
+    el.textContent = remain > 0 ? t('conn.reconnectIn', { n: remain }) : t('conn.reconnecting')
+    el.className = 'topbar-btn conn-badge off'
+    el.title = t('conn.reconnecting') + ' · ' + titleBase
+    return
+  }
+  if (!ok && state.errCount > 0) {
+    el.textContent = t('conn.failed')
+    el.className = 'topbar-btn conn-badge off'
+    el.title = titleBase
+    return
+  }
   el.textContent = ok ? t('conn.on') : t('conn.off')
   el.className = 'topbar-btn conn-badge ' + (ok ? 'on' : 'off')
-  el.title = t('conn.titleGroup', { group: curGroup, url: curLabel, ms: Number.isFinite(ms) ? ms + 'ms' : '—' })
+  el.title = titleBase
 }
 
 function autosize(el) {
@@ -2784,7 +2906,7 @@ async function decodeQrDataUrl(dataUrl) {
 /** App 内扫码: 官方 Camera 拍照/相册 + jsQR 本地解码(无 Google ML Kit/GMS 依赖, 国内可用)。
  *  冗余路径 1: 系统相机扫 dshremote:// 二维码直接唤起 App(见 bindNativeLinks);
  *  冗余路径 2: 设置页手动粘贴令牌。 */
-async function scanPair() {
+async function scanPair(source) {
   if (!CAP?.isNativePlatform?.()) {
     toast(t('scan.browserHint'), 'err')
     return
@@ -2792,17 +2914,17 @@ async function scanPair() {
   const camera = CAP.Plugins?.Camera
   if (!camera?.getPhoto) { toast(t('scan.unsupported'), 'err'); return }
   try {
-    const perm = await camera.requestPermissions?.({ permissions: ['camera'] })
-    if (perm && perm.camera !== 'granted') { toast(t('scan.permissionDenied'), 'err'); return }
+    // 显式指定来源绕过 PROMPT: 小米/HyperOS 的 PROMPT 选择器会错乱(选拍照开相册/选相册开相机)
+    if (source === 'CAMERA') {
+      const perm = await camera.requestPermissions?.({ permissions: ['camera'] })
+      if (perm && perm.camera !== 'granted') { toast(t('scan.permissionDenied'), 'err'); return }
+    }
     const photo = await camera.getPhoto({
       resultType: 'dataUrl',
-      source: 'PROMPT', // 拍照 / 从相册选择都行, 相册可扫截图
+      source: source === 'PHOTOS' ? 'PHOTOS' : 'CAMERA',
       quality: 85,
       correctOrientation: true,
       saveToGallery: false,
-      promptLabelHeader: t('scan.promptHeader'),
-      promptLabelPhoto: t('scan.promptPhoto'),
-      promptLabelPicture: t('scan.promptGallery'),
     })
     if (!photo?.dataUrl) { toast(t('scan.noPhoto'), 'err'); return }
     const raw = await decodeQrDataUrl(photo.dataUrl)
@@ -3020,7 +3142,8 @@ function bindUi() {
     if (group) { showSettingsPage(group.dataset.settingsGroup); return }
     if (e.target.closest('[data-settings-back]')) { showSettingsHome(); return }
   })
-  $('btn-scan-pair').addEventListener('click', scanPair)
+  $('btn-scan-camera').addEventListener('click', () => scanPair('CAMERA'))
+  $('btn-scan-gallery').addEventListener('click', () => scanPair('PHOTOS'))
   $('btn-change-token').addEventListener('click', () => {
     const input = prompt(t('token.prompt'), state.token)
     if (input && input.trim()) { state.token = input.trim(); LS.set('token', input.trim()); $('token-desc').textContent = t('token.saved'); toast(t('token.savedReconnect'), 'ok'); openStreams(); refreshAll(); syncBgConfig() }
@@ -3076,6 +3199,7 @@ function bindUi() {
     }
     LS.set('peakRemind', e.target.checked ? '1' : '0')
   })
+  $('btn-test-notify').addEventListener('click', sendTestNotification)
   // 已开启则启动时重新调度, 防止系统清理后丢失
   if (peakRemindOn() && CAP?.isNativePlatform?.()) schedulePeakReminders()
   applyBgConfigFromNative()

package/public/desktop/desktop.css

@@ -103,6 +103,16 @@ a.ds-btn { text-decoration: none; }
 .ds-msg.user { align-self: flex-end; background: var(--dsr-accent-soft); border: 1px solid var(--dsr-accent-line); color: var(--dsr-accent-strong); }
 .ds-msg.assistant { align-self: flex-start; background: var(--dsr-panel); border: 1px solid var(--dsr-line); color: var(--dsr-text); }
 .ds-msg .role { font-size: 10px; color: var(--dsr-muted); margin-bottom: 3px; }
+.ds-msg p { margin: 4px 0; }
+.ds-msg p:first-child { margin-top: 0; } .ds-msg p:last-child { margin-bottom: 0; }
+.ds-msg ul, .ds-msg ol { margin: 4px 0; padding-left: 20px; }
+.ds-msg li { margin: 2px 0; }
+.ds-msg h1, .ds-msg h2, .ds-msg h3 { margin: 8px 0 4px; line-height: 1.3; font-weight: 700; }
+.ds-msg h1 { font-size: 1.3em; } .ds-msg h2 { font-size: 1.18em; } .ds-msg h3 { font-size: 1.05em; }
+.ds-msg blockquote { margin: 6px 0; padding: 2px 10px; border-left: 3px solid var(--dsr-accent-2); color: var(--dsr-muted); }
+.ds-msg a { color: inherit; text-decoration: underline; word-break: break-all; }
+.ds-msg code { font-family: ui-monospace, monospace; font-size: .9em; background: var(--dsr-accent-soft); padding: 0 4px; border-radius: 4px; }
+.ds-msg pre { margin: 6px 0; background: var(--dsr-code-bg); border-radius: 8px; padding: 8px 10px; overflow-x: auto; font-size: 12px; max-height: 220px; overflow-y: auto; }
 .ds-tool { align-self: flex-start; max-width: min(78%, 680px); width: fit-content; box-sizing: border-box; background: var(--dsr-bg-2); border: 1px solid var(--dsr-line); border-radius: 10px; padding: 8px 11px; font-size: 12px; }
 .ds-tool summary { cursor: pointer; color: var(--dsr-muted); }
 .ds-tool pre { margin: 6px 0 0; white-space: pre-wrap; word-break: break-all; font-size: 11px; color: var(--dsr-text); }

package/public/desktop/desktop.html

@@ -354,6 +354,7 @@
         'ds.feedbackRateLimited': '提交太频繁，请 5 分钟后再试', 'ds.feedbackSubmitFailed': '提交失败：{msg}', 'ds.feedbackNetworkError': '网络错误',
         'ds.questionTitle': '回答问题', 'ds.ignore': '忽略', 'ds.submit': '提交',
         'ds.connOn': '已连接', 'ds.connOff': '未连接', 'ds.connIng': '连接中',
+        'ds.connReconnecting': '重连中…', 'ds.connReconnectIn': '重连中 {n}s', 'ds.connOffline': '离线', 'ds.connFailed': '连接失败',
         'ds.connPollTitle': '当前网络不支持实时推送，已降级为轮询（延迟数秒）',
         'ds.currentServer': '{group} · {url}', 'ds.origin': '当前页面',
         'ds.toastSent': '已发送', 'ds.toastCopied': '令牌已复制', 'ds.toastAuth': '令牌无效',
@@ -448,6 +449,7 @@
         'ds.feedbackRateLimited': 'Too frequent, try again in 5 minutes', 'ds.feedbackSubmitFailed': 'Submit failed: {msg}', 'ds.feedbackNetworkError': 'Network error',
         'ds.questionTitle': 'Answer question', 'ds.ignore': 'Ignore', 'ds.submit': 'Submit',
         'ds.connOn': 'Connected', 'ds.connOff': 'Offline', 'ds.connIng': 'Connecting',
+        'ds.connReconnecting': 'Reconnecting…', 'ds.connReconnectIn': 'Reconnecting {n}s', 'ds.connOffline': 'Offline', 'ds.connFailed': 'Connection failed',
         'ds.connPollTitle': 'Realtime push is unavailable on this network; degraded to polling (a few seconds delay)',
         'ds.currentServer': '{group} · {url}', 'ds.origin': 'this page',
         'ds.toastSent': 'Sent', 'ds.toastCopied': 'Token copied', 'ds.toastAuth': 'Invalid token',
@@ -511,6 +513,7 @@
     }
   </script>
   <script src="i18n.js"></script>
+  <script src="../md.js"></script>
   <script src="desktop.js"></script>
 </body>
 </html>

package/public/desktop/desktop.js

@@ -66,6 +66,8 @@ const state = {
 const streams = {}
 let pollTimer = null
 let wsRetryTimer = null
+let connTickTimer = null
+let reconnectInfo = null
 
 function esc(s) { return String(s ?? '').replace(/[&<>"]/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' }[c])) }
 function short(id) { return '…' + String(id).slice(-8) }
@@ -803,14 +805,50 @@ function deleteGroup(name) {
 }
 
 /* ---------------- 事件流 (WebSocket + 轮询降级) ---------------- */
+function clearStreamTimers(ws) {
+  if (!ws) return
+  clearInterval(ws._hbTimer)
+  clearInterval(ws._staleTimer)
+  ws._hbTimer = null
+  ws._staleTimer = null
+}
+
+function clearConnTick() {
+  clearInterval(connTickTimer)
+  connTickTimer = null
+}
+
+function startConnTick() {
+  if (connTickTimer) return
+  connTickTimer = setInterval(() => {
+    updateConn()
+    if (!reconnectInfo || state.streamMode === 'poll' || !navigator.onLine ||
+        (streams.mux?.readyState === WebSocket.OPEN && streams.host?.readyState === WebSocket.OPEN)) {
+      clearConnTick()
+    }
+  }, 1000)
+}
+
+function setReconnect(delay) {
+  reconnectInfo = { at: Date.now() + delay }
+  startConnTick()
+  updateConn()
+}
+
+function clearReconnect() {
+  reconnectInfo = null
+  clearConnTick()
+}
+
 function openStreams() {
   if (!state.token) return
   if (state.streamMode === 'poll') stopPolling()
   state.streamMode = 'ws'
+  clearReconnect()
   openStream('mux', onMuxFrame, true)
   openStream('host', onHostFrame, false)
 }
-function openStream(kind, handler, refreshOnOpen) {
+function openStream(kind, handler, refreshOnOpen, isRestore) {
   if (!state.token) return
   let base
   if (state.server) base = state.server.replace(/^http/, 'ws')
@@ -818,28 +856,64 @@ function openStream(kind, handler, refreshOnOpen) {
   const ws = new WebSocket(`${base}/api/events.${kind}?token=${encodeURIComponent(state.token)}&client=web`)
   try { streams[kind]?.close() } catch {}
   streams[kind] = ws
+  ws._attempt = 0
+  ws._lastMsgAt = 0
+  ws._isRestore = !!isRestore
   ws.onopen = () => {
     state.streamsOk[kind] = true
     state.errCount = 0
+    ws._attempt = 0
+    ws._lastMsgAt = Date.now()
+    clearStreamTimers(ws)
+    // 应用层心跳: 25s 发纯文本 ping, 防 NAT/WiFi 切换后的 WS 半开假活
+    ws._hbTimer = setInterval(() => {
+      try { if (ws.readyState === WebSocket.OPEN) ws.send('ping') } catch {}
+    }, 25000)
+    // 60s 没有任何消息(含 pong/业务帧)就主动断开, 触发指数退避重连
+    ws._staleTimer = setInterval(() => {
+      if (ws.readyState === WebSocket.OPEN && Date.now() - (ws._lastMsgAt || 0) > 60000) {
+        try { ws.close() } catch {}
+      }
+    }, 10000)
     if (state.streamMode === 'poll') { stopPolling(); state.streamMode = 'ws' }
+    if (streams.mux?.readyState === WebSocket.OPEN && streams.host?.readyState === WebSocket.OPEN) clearReconnect()
     updateConn()
     if (kind === 'mux') { state.approvals = []; state.questions = []; renderNotifStack() }
     if (refreshOnOpen) refreshSessions()
   }
   ws.onmessage = (msg) => {
+    ws._lastMsgAt = Date.now()
     state.streamsOk[kind] = true
     state.errCount = 0
     updateConn()
     try { handler(JSON.parse(msg.data)) } catch {}
   }
   ws.onclose = () => {
+    clearStreamTimers(ws)
     state.streamsOk[kind] = false
     state.errCount++
     updateConn()
-    if (state.streamMode === 'poll') return
+    if (!navigator.onLine) { clearReconnect(); return }
+    if (state.streamMode === 'poll') {
+      // 降级轮询期间: 恢复尝试失败也用退避, 避免 30s 固定间隔内空转
+      if (ws._isRestore && streams[kind] === ws) {
+        const attempt = ws._attempt || 0
+        ws._attempt = attempt + 1
+        const baseDelay = Math.min(1200 * Math.pow(2, attempt), 30000)
+        const delay = Math.round(baseDelay * (0.8 + Math.random() * 0.4))
+        setTimeout(() => openStream(kind, handler, refreshOnOpen, true), delay)
+      }
+      return
+    }
     if (state.errCount >= 3) { enterPollMode(); return }
     if (state.servers.length && state.errCount % 5 === 0) setTimeout(() => selectFastestServer({ silent: true }), 300)
-    if (streams[kind] === ws) setTimeout(() => openStream(kind, handler, refreshOnOpen), 1200)
+    // 指数退避 + 20% 抖动: min(1200 * 2^attempt, 30000)
+    const attempt = ws._attempt || 0
+    ws._attempt = attempt + 1
+    const baseDelay = Math.min(1200 * Math.pow(2, attempt), 30000)
+    const delay = Math.round(baseDelay * (0.8 + Math.random() * 0.4))
+    setReconnect(delay)
+    if (streams[kind] === ws) setTimeout(() => openStream(kind, handler, refreshOnOpen), delay)
   }
   ws.onerror = () => { try { ws.close() } catch {} }
 }
@@ -911,9 +985,32 @@ async function pollKind(kind) {
 function tryRestoreWs() {
   if (state.streamMode !== 'poll' || !state.token) return
   // 轮询继续跑，等 WS 真正 onopen 后再切回，避免重连窗口丢事件
-  openStream('mux', onMuxFrame, true)
-  openStream('host', onHostFrame, false)
+  openStream('mux', onMuxFrame, true, true)
+  openStream('host', onHostFrame, false, true)
 }
+
+/* 网络感知: 离线立刻关 WS + 显示离线, 在线立即重连 */
+window.addEventListener('offline', () => {
+  clearReconnect()
+  try { streams.mux?.close() } catch {}
+  try { streams.host?.close() } catch {}
+  if (state.streamMode === 'poll') stopPolling()
+  updateConn()
+})
+window.addEventListener('online', () => {
+  if (!state.token) { updateConn(); return }
+  state.errCount = 0
+  clearReconnect()
+  openStreams()
+  updateConn()
+})
+document.addEventListener('visibilitychange', () => {
+  if (document.visibilityState === 'visible' && state.token &&
+      (streams.mux?.readyState !== WebSocket.OPEN || streams.host?.readyState !== WebSocket.OPEN)) {
+    openStreams()
+  }
+})
+
 function onMuxFrame(full) {
   const f = full.payload
   if (!f) return
@@ -1060,7 +1157,7 @@ function shouldShowEvent(type) { return INTERESTING_EVENTS.has(type) }
 function safeJson(v) { try { return JSON.stringify(v, null, 2) } catch { return String(v) } }
 function blockHtml(b) {
   if (!b) return ''
-  if (b.type === 'text') return `<span>${esc(b.text ?? '')}</span>`
+  if (b.type === 'text') return `<div class="md">${window.mdToHtml ? window.mdToHtml(b.text ?? '') : esc(b.text ?? '')}</div>`
   if (b.type === 'reasoning') return `<span style="opacity:.75">${esc(b.text ?? '')}</span>`
   if (b.type === 'tool-call') return `<div>🔧 ${esc(b.name || '')}</div>`
   if (b.type === 'tool-result') return `<div>📦</div>`
@@ -1230,7 +1327,11 @@ async function sendMessage() {
   if (!text || !state.current) return
   if (await runSlashCommand(text)) { input.value = ''; return }
   input.value = ''
-  const v = await safeRpc('session.prompt', { sessionId: state.current, text }, '')
+  const v = await safeRpc('session.prompt', {
+    sessionId: state.current,
+    mode: 'queue',
+    content: [{ type: 'text', text }]
+  }, '')
   if (v) toast(t('ds.toastSent'), 'ok')
 }
 
@@ -1473,19 +1574,42 @@ function updateConn() {
   const cur = state.servers.find(s => s.url === state.server)
   const group = cur ? cur.group : state.activeGroup
   const label = cur ? (cur.note || cur.url) : (state.server || t('ds.origin'))
+  const serverText = t('ds.currentServer', { group, url: label })
+  if (!navigator.onLine) {
+    el.textContent = t('ds.connOffline')
+    el.className = 'ds-conn off'
+    el.title = serverText
+    $('server-badge').textContent = serverText
+    return
+  }
   if (state.streamMode === 'poll') {
     el.textContent = '●'
     el.className = 'ds-conn off'
     el.title = t('ds.connPollTitle')
-    $('server-badge').textContent = t('ds.currentServer', { group, url: label })
+    $('server-badge').textContent = serverText
     return
   }
   const any = Object.values(state.streamsOk).some(Boolean)
   const all = state.streamsOk.mux && state.streamsOk.host
+  if (!all && reconnectInfo) {
+    const remain = Math.max(0, Math.ceil((reconnectInfo.at - Date.now()) / 1000))
+    el.textContent = remain > 0 ? t('ds.connReconnectIn', { n: remain }) : t('ds.connReconnecting')
+    el.className = 'ds-conn ing'
+    el.title = t('ds.connReconnecting') + ' · ' + serverText
+    $('server-badge').textContent = serverText
+    return
+  }
+  if (!all && state.errCount > 0 && !any) {
+    el.textContent = t('ds.connFailed')
+    el.className = 'ds-conn off'
+    el.title = serverText
+    $('server-badge').textContent = serverText
+    return
+  }
   el.textContent = '●'
   el.className = 'ds-conn ' + (all ? 'on' : any ? 'ing' : '')
   el.title = all ? t('ds.connOn') : any ? t('ds.connIng') : t('ds.connOff')
-  $('server-badge').textContent = t('ds.currentServer', { group, url: label })
+  $('server-badge').textContent = serverText
 }
 
 /* ---------------- 初始化 ---------------- */