agentwake 1.0.0

package/web/app.js

@@ -0,0 +1,350 @@
+const APP_VERSION = "debug11";
+const statusEl = document.getElementById("status");
+const eventsEl = document.getElementById("events");
+const notificationBtn = document.getElementById("btn-notification");
+const installCheckBtn = document.getElementById("btn-install-check");
+const debugLogEl = document.getElementById("debug-log");
+
+let wsPath = "/ws";
+let wsRetryTimer = null;
+let wsConnected = false;
+let lastTimestamp = 0;
+const seenEventKeys = new Set();
+const debugLines = [];
+let swRegistration = null;
+let swRegisterError = null;
+
+function debugLog(message, meta) {
+  const ts = new Date().toISOString();
+  const payload = meta ? `${message} ${JSON.stringify(meta)}` : message;
+  const line = `[${ts}] ${payload}`;
+  console.log("[AgentWake]", message, meta || "");
+  debugLines.push(line);
+  if (debugLines.length > 80) {
+    debugLines.splice(0, debugLines.length - 80);
+  }
+  if (debugLogEl) {
+    debugLogEl.textContent = debugLines.join("\n");
+  }
+}
+
+function hapticFeedback() {
+  if (typeof navigator !== "undefined" && navigator.vibrate) {
+    try {
+      navigator.vibrate(50); // 50ms 轻微震动反馈
+    } catch (e) {
+      // 忽略可能产生的震动错误
+    }
+  }
+}
+
+function getEventFingerprint(evt) {
+  return `${evt.dedupeKey}#${evt.timestamp}`;
+}
+
+function setStatus(text) {
+  if (statusEl) {
+    statusEl.textContent = text;
+  }
+  debugLog("status", { text });
+}
+
+function appendEvent(evt) {
+  const fingerprint = getEventFingerprint(evt);
+  if (seenEventKeys.has(fingerprint)) {
+    debugLog("skip duplicate event", { fingerprint });
+    return;
+  }
+  seenEventKeys.add(fingerprint);
+  lastTimestamp = Math.max(lastTimestamp, Number(evt.timestamp || 0));
+  debugLog("append event", {
+    fingerprint,
+    source: evt.source,
+    title: evt.title,
+    timestamp: evt.timestamp,
+    lastTimestamp,
+  });
+
+  const node = document.createElement("div");
+  node.className = "event";
+  node.innerHTML = `<div><strong>${evt.title}</strong></div><div>${evt.body}</div><div class="meta">${new Date(evt.timestamp).toLocaleString()} · ${evt.source}</div>`;
+  if (eventsEl) {
+    eventsEl.prepend(node);
+  }
+}
+
+async function showSystemNotification(evt) {
+  if (typeof Notification !== "function") {
+    debugLog("notification api unavailable");
+    return;
+  }
+  if (Notification.permission !== "granted") {
+    debugLog("notification skipped", { permission: Notification.permission });
+    return;
+  }
+  if (swRegistration && typeof swRegistration.showNotification === "function") {
+    try {
+      await swRegistration.showNotification(evt.title, { body: evt.body, tag: "agentwake-web" });
+      debugLog("notification sent by sw", { title: evt.title });
+      return;
+    } catch (error) {
+      debugLog("sw showNotification failed", { error: String(error) });
+    }
+  }
+  try {
+    new Notification(evt.title, { body: evt.body });
+    debugLog("notification sent", { title: evt.title });
+  } catch (error) {
+    debugLog("notification construct failed", { error: String(error) });
+    setStatus("系统通知构造失败，请先安装 PWA 并启用 Push");
+  }
+}
+
+async function connectWs() {
+  const proto = location.protocol === "https:" ? "wss" : "ws";
+  const wsUrl = `${proto}://${location.host}${wsPath}`;
+  const ws = new WebSocket(wsUrl);
+  debugLog("ws connecting", { wsUrl });
+  setStatus(`WebSocket 连接中：${wsUrl}`);
+
+  ws.addEventListener("open", () => {
+    wsConnected = true;
+    debugLog("ws open", { wsUrl });
+    setStatus("WebSocket 已连接");
+    if (wsRetryTimer) {
+      clearTimeout(wsRetryTimer);
+      wsRetryTimer = null;
+    }
+  });
+
+  ws.addEventListener("error", (event) => {
+    debugLog("ws error", { wsUrl, type: event.type });
+    setStatus(`WebSocket 连接失败：${wsUrl}`);
+  });
+
+  ws.addEventListener("close", () => {
+    wsConnected = false;
+    debugLog("ws close", { wsUrl });
+    setStatus(`WebSocket 已断开，3秒后重连：${wsUrl}`);
+    if (!wsRetryTimer) {
+      wsRetryTimer = setTimeout(() => {
+        wsRetryTimer = null;
+        void connectWs();
+      }, 3000);
+    }
+  });
+
+  ws.addEventListener("message", (msg) => {
+    debugLog("ws message", {
+      wsUrl,
+      dataType: msg.data instanceof Blob ? "blob" : typeof msg.data,
+    });
+    if (msg.data instanceof Blob) {
+      msg.data
+        .text()
+        .then((text) => {
+          try {
+            debugLog("ws blob text", { length: text.length });
+            handleWsMessage(JSON.parse(text));
+          } catch (error) {
+            debugLog("ws blob parse failed", { error: String(error) });
+            setStatus("WebSocket 消息解析失败");
+          }
+        })
+        .catch((error) => {
+          debugLog("ws blob read failed", { error: String(error) });
+          setStatus("WebSocket 消息读取失败");
+        });
+      return;
+    }
+
+    try {
+      handleWsMessage(JSON.parse(String(msg.data)));
+    } catch (error) {
+      debugLog("ws message parse failed", { error: String(error) });
+      setStatus("WebSocket 消息解析失败");
+    }
+  });
+}
+
+function handleWsMessage(parsed) {
+  debugLog("handle ws message", { type: parsed?.type });
+  if (parsed.type === "hello") {
+    setStatus("WebSocket 握手成功");
+    return;
+  }
+
+  if (parsed.type === "notify-event") {
+    appendEvent(parsed.payload);
+    void showSystemNotification(parsed.payload);
+  }
+}
+
+async function pollEvents() {
+  const pollUrl = `/api/events?since=${lastTimestamp}`;
+  debugLog("poll start", { pollUrl, wsConnected, lastTimestamp });
+  try {
+    const resp = await fetch(pollUrl);
+    if (!resp.ok) {
+      debugLog("poll non-200", { status: resp.status });
+      return;
+    }
+    const data = await resp.json();
+    debugLog("poll success", { count: Array.isArray(data?.events) ? data.events.length : -1 });
+    if (!Array.isArray(data?.events)) {
+      debugLog("poll invalid payload");
+      return;
+    }
+
+    for (const evt of data.events) {
+      appendEvent(evt);
+      if (!wsConnected) {
+        void showSystemNotification(evt);
+      }
+    }
+    if (!wsConnected) {
+      setStatus(`WebSocket 未连接，轮询补偿中（已拉取 ${data.events.length} 条）`);
+    }
+  } catch {
+    debugLog("poll failed");
+    if (!wsConnected) {
+      setStatus("WebSocket 未连接，轮询也失败");
+    }
+  }
+}
+
+async function onRequestPermissionClick() {
+  const result = await Notification.requestPermission();
+  debugLog("notification permission", { result });
+  setStatus(`通知权限：${result}`);
+}
+
+async function setupServiceWorker() {
+  if (!("serviceWorker" in navigator)) {
+    debugLog("sw not supported");
+    return null;
+  }
+  try {
+    swRegistration = await navigator.serviceWorker.register("/sw.js");
+    swRegisterError = null;
+    debugLog("sw register success", { scope: swRegistration.scope });
+    return swRegistration;
+  } catch (error) {
+    swRegisterError = String(error);
+    debugLog("sw register failed", { error: String(error) });
+    return null;
+  }
+}
+
+async function onInstallCheckClick() {
+  const manifestResp = await fetch("/manifest.webmanifest", { cache: "no-store" }).catch(() => null);
+  const manifestOk = Boolean(manifestResp?.ok);
+  const isAndroid = /Android/i.test(navigator.userAgent || "");
+  const checklist = {
+    appVersion: APP_VERSION,
+    isSecureContext: window.isSecureContext,
+    protocol: location.protocol,
+    hasServiceWorkerApi: "serviceWorker" in navigator,
+    swRegistered: Boolean(swRegistration),
+    swRegisterError,
+    hasManifest: manifestOk,
+    isAndroid,
+  };
+  debugLog("installability check", checklist);
+
+  if (!window.isSecureContext) {
+    setStatus("安装失败主因：当前不是安全上下文（HTTPS 证书在手机上未受信任）");
+    return;
+  }
+  if (!manifestOk) {
+    setStatus("安装失败主因：manifest 无法访问");
+    return;
+  }
+  if (!("serviceWorker" in navigator)) {
+    setStatus("安装失败主因：浏览器不支持 Service Worker");
+    return;
+  }
+  if (!swRegistration) {
+    setStatus("安装失败主因：Service Worker 注册失败，请查看调试日志");
+    return;
+  }
+  if (isAndroid) {
+    setStatus("可手动安装：Chrome 菜单 ⋮ -> 安装应用/添加到主屏幕");
+    return;
+  }
+  setStatus("安装条件基本满足，可继续安装");
+}
+
+if (notificationBtn) {
+  notificationBtn.addEventListener("click", () => {
+    hapticFeedback();
+    void onRequestPermissionClick();
+  });
+} else {
+  debugLog("btn missing", { id: "btn-notification" });
+}
+
+if (installCheckBtn) {
+  installCheckBtn.addEventListener("click", () => {
+    hapticFeedback();
+    void onInstallCheckClick();
+  });
+} else {
+  debugLog("btn missing", { id: "btn-install-check" });
+}
+
+document.addEventListener("click", (event) => {
+  const target = event.target;
+  if (!(target instanceof Element)) {
+    return;
+  }
+  
+  if (target.tagName === "BUTTON" || target.closest("button")) {
+    hapticFeedback();
+  }
+
+  if (target.id === "btn-notification") {
+    debugLog("delegated click", { id: target.id });
+    void onRequestPermissionClick();
+  }
+  if (target.id === "btn-install-check") {
+    debugLog("delegated click", { id: target.id });
+    void onInstallCheckClick();
+  }
+});
+
+async function init() {
+  debugLog("init start", {
+    appVersion: APP_VERSION,
+    href: location.href,
+    protocol: location.protocol,
+    host: location.host,
+    notificationPermission: Notification.permission,
+  });
+  const runtime = await fetch("/api/runtime").then((r) => r.json()).catch(() => null);
+  debugLog("runtime loaded", { runtime });
+  if (runtime?.wsPath) {
+    wsPath = runtime.wsPath;
+    debugLog("wsPath updated", { wsPath });
+  }
+  void setupServiceWorker();
+  void connectWs();
+  setInterval(() => {
+    void pollEvents();
+  }, 2000);
+  void pollEvents();
+  debugLog("init done");
+}
+
+window.addEventListener("error", (event) => {
+  debugLog("window error", { message: event.message, filename: event.filename, lineno: event.lineno });
+});
+
+window.addEventListener("unhandledrejection", (event) => {
+  debugLog("unhandled rejection", { reason: String(event.reason) });
+});
+
+void init().catch((error) => {
+  debugLog("init failed", { error: String(error) });
+  setStatus("初始化失败，请查看调试日志");
+});

package/web/icons/icon-192.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 192" role="img" aria-label="AgentWake">
+  <rect width="192" height="192" rx="36" fill="#101827" />
+  <circle cx="96" cy="96" r="56" fill="#2563eb" />
+  <path d="M66 104h60l-30 36-30-36z" fill="#e5e7eb" />
+  <path d="M70 88a26 26 0 1 1 52 0" fill="none" stroke="#e5e7eb" stroke-width="10" stroke-linecap="round" />
+</svg>

package/web/icons/icon-512.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="img" aria-label="AgentWake">
+  <rect width="512" height="512" rx="96" fill="#101827" />
+  <circle cx="256" cy="256" r="150" fill="#2563eb" />
+  <path d="M176 280h160l-80 100-80-100z" fill="#e5e7eb" />
+  <path d="M186 238a70 70 0 1 1 140 0" fill="none" stroke="#e5e7eb" stroke-width="28" stroke-linecap="round" />
+</svg>

package/web/index.html

@@ -0,0 +1,117 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="theme-color" content="#101827" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <link rel="apple-touch-icon" href="/icons/icon-192.svg" />
+    <link rel="manifest" href="/manifest.webmanifest" />
+    <title>AgentWake Mobile</title>
+    <style>
+      :root {
+        --safe-top: env(safe-area-inset-top, 0px);
+        --safe-bottom: env(safe-area-inset-bottom, 0px);
+      }
+      body { 
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; 
+        margin: 0; 
+        padding: calc(16px + var(--safe-top)) 16px calc(16px + var(--safe-bottom)) 16px; 
+        background: #101827; 
+        color: #e5e7eb; 
+        -webkit-tap-highlight-color: transparent;
+        overscroll-behavior-y: none;
+      }
+      .card { 
+        background: #1f2937; 
+        border-radius: 12px; 
+        padding: 16px; 
+        margin-bottom: 16px; 
+        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+      }
+      .button-group {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+        margin-bottom: 12px;
+      }
+      button { 
+        background: #2563eb; 
+        color: white; 
+        border: 0; 
+        border-radius: 8px; 
+        padding: 12px 16px; 
+        font-size: 15px;
+        font-weight: 500;
+        cursor: pointer;
+        user-select: none;
+        flex: 1 1 auto;
+        min-height: 44px; /* iOS 推荐最小点击高度 */
+        transition: background 0.2s, transform 0.1s;
+      }
+      button:active {
+        background: #1d4ed8;
+        transform: scale(0.98);
+      }
+      #events { 
+        max-height: 50vh; 
+        overflow-y: auto; 
+        -webkit-overflow-scrolling: touch;
+        margin-top: 8px;
+      }
+      .event { 
+        border-bottom: 1px solid #374151; 
+        padding: 12px 0; 
+      }
+      .event:last-child {
+        border-bottom: none;
+      }
+      .meta { 
+        color: #9ca3af; 
+        font-size: 12px; 
+        margin-top: 4px;
+      }
+      #status {
+        font-size: 13px;
+        text-align: center;
+        margin-top: 12px;
+        padding: 8px;
+        background: #374151;
+        border-radius: 6px;
+      }
+      h2, h3 { margin-top: 0; margin-bottom: 12px; }
+      #debug-log { 
+        max-height: 20vh; 
+        overflow-y: auto; 
+        white-space: pre-wrap; 
+        font-family: ui-monospace, SFMono-Regular, Menlo, monospace; 
+        font-size: 11px; 
+        color: #93c5fd; 
+        background: #111827;
+        padding: 8px;
+        border-radius: 6px;
+        -webkit-overflow-scrolling: touch;
+      }
+    </style>
+  </head>
+  <body>
+    <h2>AgentWake 移动通知</h2>
+      <div class="card">
+        <div class="button-group">
+          <button id="btn-notification">授权系统通知</button>
+          <button id="btn-install-check">检查安装条件</button>
+        </div>
+        <div id="status" class="meta">初始化中...</div>
+      </div>
+    <div class="card">
+      <h3>实时事件</h3>
+      <div id="events"></div>
+    </div>
+    <div class="card">
+      <h3>调试日志</h3>
+      <div id="debug-log"></div>
+    </div>
+    <script src="/app.js?v=debug11"></script>
+  </body>
+  </html>

package/web/manifest.webmanifest

@@ -0,0 +1,25 @@
+{
+  "name": "AgentWake Mobile",
+  "short_name": "AgentWake",
+  "id": "/",
+  "start_url": "/",
+  "scope": "/",
+  "display": "standalone",
+  "orientation": "portrait",
+  "background_color": "#101827",
+  "theme_color": "#101827",
+  "icons": [
+    {
+      "src": "/icons/icon-192.svg",
+      "sizes": "192x192",
+      "type": "image/svg+xml",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "/icons/icon-512.svg",
+      "sizes": "512x512",
+      "type": "image/svg+xml",
+      "purpose": "any maskable"
+    }
+  ]
+}

package/web/sw.js

@@ -0,0 +1,32 @@
+self.addEventListener("install", () => {
+  self.skipWaiting();
+});
+
+self.addEventListener("activate", (event) => {
+  event.waitUntil(self.clients.claim());
+});
+
+self.addEventListener("push", (event) => {
+  if (!event.data) {
+    return;
+  }
+  let payload = { title: "AgentWake", body: "New event" };
+  try {
+    payload = event.data.json();
+  } catch {
+    payload = { title: "AgentWake", body: event.data.text() };
+  }
+
+  event.waitUntil(
+    self.registration.showNotification(payload.title, {
+      body: payload.body,
+      data: payload.event || null,
+      tag: "agentwake-notification",
+    }),
+  );
+});
+
+self.addEventListener("notificationclick", (event) => {
+  event.notification.close();
+  event.waitUntil(self.clients.openWindow("/"));
+});