@wipcomputer/wip-ldm-os 0.4.85-alpha.2 → 0.4.85-alpha.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/README.md +22 -2
  2. package/SKILL.md +8 -5
  3. package/bin/ldm.js +169 -65
  4. package/docs/universal-installer/SPEC.md +16 -3
  5. package/docs/universal-installer/TECHNICAL.md +4 -4
  6. package/lib/deploy.mjs +104 -20
  7. package/lib/detect.mjs +35 -4
  8. package/package.json +13 -2
  9. package/scripts/test-crc-agentid-tenant-boundary.mjs +80 -0
  10. package/scripts/test-crc-e2ee-key-persistence.mjs +150 -0
  11. package/scripts/test-crc-e2ee-session-route.mjs +129 -0
  12. package/scripts/test-crc-pair-login-flow.mjs +40 -0
  13. package/scripts/test-crc-pair-relink-audit-and-rotation.mjs +164 -0
  14. package/scripts/test-crc-pair-status-poll-token.mjs +73 -0
  15. package/scripts/test-install-prompt-policy.mjs +60 -0
  16. package/scripts/test-installer-skill-directory.mjs +55 -0
  17. package/scripts/test-installer-skill-dry-run-destinations.mjs +100 -0
  18. package/scripts/test-installer-target-self-update.mjs +131 -0
  19. package/scripts/test-ldm-status-timeout.mjs +80 -0
  20. package/shared/templates/install-prompt.md +20 -2
  21. package/src/hosted-mcp/README.md +15 -0
  22. package/src/hosted-mcp/app/footer.js +74 -0
  23. package/src/hosted-mcp/app/kaleidoscope-login.html +846 -0
  24. package/src/hosted-mcp/app/pair.html +165 -57
  25. package/src/hosted-mcp/app/sprites.png +0 -0
  26. package/src/hosted-mcp/codex-relay-e2ee-registry.mjs +208 -0
  27. package/src/hosted-mcp/demo/index.html +3 -7
  28. package/src/hosted-mcp/demo/login.html +318 -20
  29. package/src/hosted-mcp/deploy.sh +307 -56
  30. package/src/hosted-mcp/docs/self-host.md +268 -0
  31. package/src/hosted-mcp/nginx/codex-relay.conf +25 -0
  32. package/src/hosted-mcp/nginx/conf.d/redact-logs.conf +60 -0
  33. package/src/hosted-mcp/nginx/mcp-oauth.conf +58 -0
  34. package/src/hosted-mcp/nginx/wip.computer.conf +25 -1
  35. package/src/hosted-mcp/scripts/audit-logs.sh +205 -0
  36. package/src/hosted-mcp/scripts/verify-deploy.sh +102 -0
  37. package/src/hosted-mcp/server.mjs +963 -146
package/src/hosted-mcp/app/kaleidoscope-login.html ADDED
@@ -0,0 +1,846 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
6
+ <title>Kaleidoscope</title>
7
+ <meta name="description" content="Kaleidoscope by WIP Computer, Inc. Every AI. One experience.">
8
+ <style>
9
+ *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
10
+
11
+ :root {
12
+ --bg: #FFFDF5;
13
+ --text: #1a1a1a;
14
+ --text-muted: #8a8580;
15
+ --accent: #0033FF;
16
+ --accent-hover: #0033FF;
17
+ --input-bg: #F5F3ED;
18
+ --input-border: #E0DDD6;
19
+ --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
20
+ }
21
+
22
+ html, body {
23
+ height: 100%;
24
+ font-family: var(--font);
25
+ background: var(--bg);
26
+ color: var(--text);
27
+ -webkit-text-size-adjust: 100%;
28
+ -webkit-font-smoothing: antialiased;
29
+ }
30
+
31
+ @media (min-width: 768px) {
32
+ html, body { overflow: hidden; }
33
+ }
34
+
35
+ .login-page {
36
+ display: flex;
37
+ flex-direction: column;
38
+ align-items: center;
39
+ justify-content: center;
40
+ min-height: 100vh;
41
+ min-height: 100dvh;
42
+ padding: 24px;
43
+ padding-top: calc(24px + env(safe-area-inset-top, 0px));
44
+ overflow-y: auto;
45
+ -webkit-overflow-scrolling: touch;
46
+ }
47
+
48
+ .login-card {
49
+ position: relative;
50
+ max-width: 380px;
51
+ width: 100%;
52
+ text-align: center;
53
+ }
54
+
55
+ .login-title {
56
+ font-size: 26px;
57
+ font-weight: 600;
58
+ letter-spacing: -0.02em;
59
+ margin-bottom: 8px;
60
+ }
61
+
62
+ .login-buttons {
63
+ display: flex;
64
+ flex-direction: column;
65
+ gap: 12px;
66
+ margin-bottom: 16px;
67
+ }
68
+
69
+ .btn {
70
+ display: block;
71
+ width: 100%;
72
+ padding: 18px;
73
+ border: none;
74
+ border-radius: 12px;
75
+ font-size: 18px;
76
+ font-weight: 600;
77
+ font-family: var(--font);
78
+ cursor: pointer;
79
+ transition: background 0.15s, transform 0.1s;
80
+ -webkit-tap-highlight-color: transparent;
81
+ }
82
+
83
+ .btn:active {
84
+ transform: scale(0.98);
85
+ }
86
+
87
+ .btn-primary {
88
+ background: var(--accent);
89
+ color: white;
90
+ }
91
+
92
+ .btn-primary:hover {
93
+ background: var(--accent-hover);
94
+ }
95
+
96
+ .btn:disabled {
97
+ opacity: 0.5;
98
+ cursor: not-allowed;
99
+ transform: none;
100
+ }
101
+
102
+ .login-status {
103
+ margin-top: 16px;
104
+ font-size: 14px;
105
+ padding: 12px 16px;
106
+ border-radius: 10px;
107
+ display: none;
108
+ text-align: left;
109
+ }
110
+
111
+ .login-status.show { display: block; }
112
+ .login-status.loading { background: #E8EEFF; color: var(--accent); }
113
+ .login-status.error { background: #FFF0F0; color: #D32F2F; }
114
+ .login-status.success { background: #F0FFF4; color: #2E7D32; }
115
+ </style>
116
+ </head>
117
+ <body>
118
+
119
+ <div class="login-page" id="loginPage">
120
+ <div class="login-card">
121
+ <div style="display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px;margin-left:-6px;"><span id="loginIcon" style="width:34px;height:34px;flex-shrink:0;overflow:hidden;"></span><h1 class="login-title" style="margin-bottom:0;">Kaleidoscope</h1></div>
122
+ <p style="color:#8a8580;font-size:16px;margin:0 0 32px 0;letter-spacing:0.2px;">Every AI. One experience.</p>
123
+
124
+ <!-- Signup view (default) -->
125
+ <div id="signup-view">
126
+ <div class="login-buttons">
127
+ <button class="btn btn-primary" id="createBtn" onclick="doCreateAccount()">Enter the Kaleidoscope</button>
128
+ </div>
129
+ <div style="margin-top:12px;">
130
+ <input type="text" id="handleInput" name="kaleidoscope-handle" placeholder="What should Lēsa call you? (optional)" autocapitalize="none" autocorrect="off" autocomplete="off" spellcheck="false" data-1p-ignore="true" data-lpignore="true" onfocus="setTimeout(function(){document.getElementById('handleInput').scrollIntoView({behavior:'smooth',block:'center'})},300)" style="width:100%;padding:16px 18px;border:1px solid #E0DDD6;border-radius:12px;font-size:18px;font-family:var(--font);background:#F5F3ED;color:#1a1a1a;outline:none;text-align:center;" />
131
+ </div>
132
+ <p style="color:#b0aaa4;font-size:13px;font-style:italic;margin:16px 0 0;text-align:center;opacity:0.8;">Use your phone to securely create your account</p>
133
+ <div style="margin-top:12px;text-align:center;">
134
+ <a id="signInBtn" onclick="doSignIn()" style="color:var(--accent);font-size:16px;cursor:pointer;text-decoration:none;">Already have an account? Sign in.</a>
135
+ </div>
136
+ </div>
137
+
138
+ <!-- QR code view (Chrome desktop fallback) -->
139
+ <div id="qr-view" style="display:none">
140
+ <p style="color:#8a8580;font-size:16px;margin:0 0 24px 0;">Scan with your phone to continue.</p>
141
+ <div style="display:flex;justify-content:center;margin-bottom:24px;">
142
+ <img id="qr-image" style="width:200px;height:200px;border-radius:12px;background:#F5F3ED;" />
143
+ </div>
144
+ <p id="qr-status-text" style="color:var(--accent);font-size:14px;">Waiting for phone...</p>
145
+ <div style="margin-top:20px;">
146
+ <a onclick="cancelQrLogin()" style="color:var(--text-muted);font-size:14px;cursor:pointer;text-decoration:none;">Cancel</a>
147
+ </div>
148
+ </div>
149
+
150
+ <!-- Success view (legacy login flow). No action button. -->
151
+ <div id="success-view" style="display:none">
152
+ <p style="font-size:18px;margin-bottom:12px;color:var(--text);">Welcome, <span id="welcome-name"></span>.</p>
153
+ <p style="color:var(--text-muted);font-size:15px;margin-bottom:8px;">Your passkey has been saved to your phone.</p>
154
+ <p style="color:var(--text-muted);font-size:15px;margin-bottom:24px;">You can use it to sign in to any WIP Computer service.</p>
155
+ </div>
156
+
157
+ <!-- Pair-approved view (CRC pair-mode, desktop-side after phone approves) -->
158
+ <div id="pair-approved-view" style="display:none">
159
+ <p style="font-size:18px;margin-bottom:12px;color:var(--text);">Approved on your phone.</p>
160
+ <p style="color:var(--text-muted);font-size:15px;margin-bottom:24px;">Continue pairing on your phone. Your laptop will pick this up after you confirm.</p>
161
+ </div>
162
+
163
+ <div class="login-status" id="loginStatus" style="position:absolute;left:0;right:0;margin-top:16px;text-align:center;"></div>
164
+ </div>
165
+ </div>
166
+ <div id="kscope-footer"></div>
167
+
168
+ <script src="/app/footer.js"></script>
169
+ <script>
170
+ // ── Random kaleidoscope icon from sprite sheet ──
171
+ var SPRITE_COLS = 8;
172
+ var SPRITE_ROWS = 3;
173
+ var SPRITE_TOTAL = SPRITE_COLS * SPRITE_ROWS;
174
+
175
+ function makeIconHTML(size) {
176
+ var idx = Math.floor(Math.random() * SPRITE_TOTAL);
177
+ var col = idx % SPRITE_COLS;
178
+ var row = Math.floor(idx / SPRITE_COLS);
179
+ var bgPosX = (col / (SPRITE_COLS - 1)) * 100;
180
+ var bgPosY = (row / (SPRITE_ROWS - 1)) * 100;
181
+ return '<div style="width:' + size + 'px;height:' + size + 'px;overflow:hidden;"><div style="width:100%;height:100%;background:url(/app/sprites.png);background-size:' + (SPRITE_COLS * 100) + '% ' + (SPRITE_ROWS * 100) + '%;background-position:' + bgPosX + '% ' + bgPosY + '%;"></div></div>';
182
+ }
183
+
184
+ var loginIcon = document.getElementById('loginIcon');
185
+ if (loginIcon) loginIcon.innerHTML = makeIconHTML(34);
186
+
187
+ // Rotate icon every 3s
188
+ var loginRotateIdx = Math.floor(Math.random() * SPRITE_TOTAL);
189
+ setInterval(function() {
190
+ loginRotateIdx = (loginRotateIdx + 1) % SPRITE_TOTAL;
191
+ var col = loginRotateIdx % SPRITE_COLS;
192
+ var row = Math.floor(loginRotateIdx / SPRITE_COLS);
193
+ var bgPosX = (col / (SPRITE_COLS - 1)) * 100;
194
+ var bgPosY = (row / (SPRITE_ROWS - 1)) * 100;
195
+ if (loginIcon) loginIcon.innerHTML = '<div style="width:34px;height:34px;overflow:hidden;"><div style="width:100%;height:100%;background:url(/app/sprites.png);background-size:' + (SPRITE_COLS * 100) + '% ' + (SPRITE_ROWS * 100) + '%;background-position:' + bgPosX + '% ' + bgPosY + '%;"></div></div>';
196
+ }, 3000);
197
+
198
+ // ── WebAuthn helpers ──
199
+ function b64urlToBytes(b64) {
200
+ var bin = atob(b64.replace(/-/g, '+').replace(/_/g, '/') + '=='.slice(0, (4 - b64.length % 4) % 4));
201
+ return Uint8Array.from(bin, function(c) { return c.charCodeAt(0); });
202
+ }
203
+ function bytesToB64url(buf) {
204
+ return btoa(String.fromCharCode.apply(null, new Uint8Array(buf)))
205
+ .replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
206
+ }
207
+
208
+ function setStatus(msg, type) {
209
+ var el = document.getElementById('loginStatus');
210
+ el.style.transition = '';
211
+ el.style.opacity = '';
212
+ el.textContent = msg;
213
+ el.className = msg ? 'login-status show ' + type : 'login-status';
214
+ }
215
+
216
+ function clearStatus() {
217
+ var el = document.getElementById('loginStatus');
218
+ el.style.transition = 'opacity 0.5s';
219
+ el.style.opacity = '0';
220
+ setTimeout(function() { el.className = 'login-status'; el.style.transition = ''; el.style.opacity = ''; }, 500);
221
+ }
222
+
223
+ // ── Browser detection ──
224
+ function isMobileDevice() {
225
+ return navigator.maxTouchPoints > 0 && window.innerWidth < 768;
226
+ }
227
+
228
+ function isSafariDesktop() {
229
+ if (isMobileDevice()) return false;
230
+ return /Safari\//.test(navigator.userAgent) && !/Chrome\//.test(navigator.userAgent);
231
+ }
232
+
233
+ function needsCustomQR() {
234
+ return !isMobileDevice() && !isSafariDesktop() && !isLocalPasskeysOn();
235
+ }
236
+
237
+ // ── Local passkeys toggle (persisted in localStorage) ──
238
+ function isLocalPasskeysOn() {
239
+ return localStorage.getItem('localPasskeys') === 'on';
240
+ }
241
+
242
+ function toggleLocalPasskeys() {
243
+ var on = isLocalPasskeysOn();
244
+ localStorage.setItem('localPasskeys', on ? 'off' : 'on');
245
+ updatePasskeysDot();
246
+ }
247
+
248
+ function updatePasskeysDot() {
249
+ var dot = document.getElementById('passkeys-dot');
250
+ var label = document.getElementById('passkeys-label');
251
+ if (!dot) return;
252
+ if (isLocalPasskeysOn()) {
253
+ dot.style.background = '#2E7D32';
254
+ dot.style.opacity = '1';
255
+ if (label) label.textContent = 'Local passkeys on';
256
+ } else {
257
+ dot.style.background = '#D32F2F';
258
+ dot.style.opacity = '0.4';
259
+ if (label) label.textContent = 'Local passkeys off';
260
+ }
261
+ }
262
+
263
+ // ── `next` continuation carrier ──
264
+ //
265
+ // Two whitelisted next shapes:
266
+ //
267
+ // PAIR_NEXT_REGEX /pair/<CODE> using the daemon alphabet
268
+ // (CODEX_PAIR_ALPHABET, length 6, L is
269
+ // included; I/O/0/1 excluded). C8 applies:
270
+ // URL fallback is mobile-only, the desktop
271
+ // must not become the pairing authority.
272
+ //
273
+ // REMOTE_CONTROL_NEXT_REGEX /codex-remote-control/<UUID>. Standard
274
+ // ?next semantics; allowed on both
275
+ // desktop and mobile (this is navigation
276
+ // continuation, not authority transfer).
277
+ //
278
+ // Anything else is silently dropped. `next` is NOT a general redirect
279
+ // primitive. The server validates authoritatively; this client-side
280
+ // check is defense-in-depth.
281
+ var PAIR_NEXT_REGEX = /^\/pair\/[ABCDEFGHJKLMNPQRSTUVWXYZ23456789]{6}$/;
282
+ var REMOTE_CONTROL_NEXT_REGEX = /^\/codex-remote-control\/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
283
+
284
+ function isWhitelistedNext(raw) {
285
+ return typeof raw === 'string' && (PAIR_NEXT_REGEX.test(raw) || REMOTE_CONTROL_NEXT_REGEX.test(raw));
286
+ }
287
+
288
+ function readPairNextFromQuery() {
289
+ try {
290
+ var raw = new URLSearchParams(window.location.search).get('next');
291
+ if (!raw) return null;
292
+ return isWhitelistedNext(raw) ? raw : null;
293
+ } catch (e) { return null; }
294
+ }
295
+
296
+ function isPairNextOnDesktop() {
297
+ var next = readPairNextFromQuery();
298
+ return !!(next && PAIR_NEXT_REGEX.test(next) && !isMobileDevice());
299
+ }
300
+
301
+ // Direct Remote Control login continuation. Explicit branch ... NOT
302
+ // routed through pair-mode helpers. Called from doSignIn / doCreateAccount
303
+ // the moment /webauthn/auth-verify or /webauthn/register-verify returns
304
+ // success, BEFORE any qr-login/approve or pair-mode logic runs.
305
+ //
306
+ // If the URL was /login?next=/codex-remote-control/<UUID> AND auth-verify
307
+ // returned a real apiKey, store the credentials in sessionStorage so the
308
+ // destination page's auth gate sees them, then location.replace into the
309
+ // Remote Control surface. Returns true if it redirected; caller must
310
+ // return early.
311
+ //
312
+ // If the URL has no remote-control next, returns false (caller proceeds
313
+ // with the existing QR / pair / welcome logic).
314
+ //
315
+ // If the URL has a remote-control next BUT result.apiKey is missing,
316
+ // console.warn and return false. The caller then falls through to the
317
+ // welcome view (defense in depth from PR #805) so the user is not
318
+ // stranded on a blank /codex-remote-control page that bounces back to
319
+ // sign-in.
320
+ //
321
+ // This is deliberately separate from followPairNextIfPresent because
322
+ // pair-mode behavior (C6 desktop strip, C8 desktop-no-redirect) is
323
+ // orthogonal to standard Remote Control login continuation.
324
+ //
325
+ // Also writes a short-lived same-origin handoff cookie as a Safari-safe
326
+ // fallback: some browsers drop sessionStorage across location.replace
327
+ // under privacy/partition heuristics. Path=/ is required because Safari
328
+ // will silently reject document.cookie writes whose Path attribute is
329
+ // not the current path or an ancestor of it; /login is not an ancestor
330
+ // of /codex-remote-control, so the previous Path=/codex-remote-control
331
+ // scope was dropped on Safari. The Remote Control page reads either
332
+ // source and clears both Path scopes after consumption. See
333
+ // setHandoffCookie below.
334
+ function setHandoffCookie(name, value) {
335
+ document.cookie = name + '=' + encodeURIComponent(value)
336
+ + '; Path=/'
337
+ + '; Max-Age=60'
338
+ + '; Secure'
339
+ + '; SameSite=Strict';
340
+ }
341
+ function redirectToRemoteControlIfDirectLogin(result) {
342
+ try {
343
+ var raw = new URLSearchParams(window.location.search).get('next');
344
+ if (!raw || !REMOTE_CONTROL_NEXT_REGEX.test(raw)) return false;
345
+ if (!result || !result.apiKey) {
346
+ console.warn('redirectToRemoteControlIfDirectLogin: missing apiKey on result; falling through to welcome view. result=', result);
347
+ return false;
348
+ }
349
+ console.log('redirectToRemoteControlIfDirectLogin: storing wip_api_key + redirecting', { agentId: result.agentId, next: raw });
350
+ sessionStorage.setItem('wip_api_key', result.apiKey);
351
+ if (result.agentId) sessionStorage.setItem('wip_handle', result.agentId);
352
+ setHandoffCookie('wip_rc_api_key', result.apiKey);
353
+ if (result.agentId) setHandoffCookie('wip_rc_handle', result.agentId);
354
+ location.replace(raw);
355
+ return true;
356
+ } catch (e) {
357
+ console.warn('redirectToRemoteControlIfDirectLogin: unexpected error', e);
358
+ return false;
359
+ }
360
+ }
361
+
362
+ // Phone-side post-passkey hook. Called after successful passkey + (optional)
363
+ // qr-login/approve. Decides whether to redirect to the next URL based on
364
+ // authority rules from plan C6 + C8:
365
+ //
366
+ // - QR-scan path (approveResponse.next from the server): follow it for
367
+ // either whitelisted shape. The phone scanned the desktop's QR,
368
+ // signed in, and the server returned a sanitized `next`.
369
+ //
370
+ // - URL fallback path (no approveResponse.next):
371
+ // - /codex-remote-control/<UUID>: allowed on both desktop and
372
+ // mobile. Standard navigation continuation.
373
+ // - /pair/<CODE>: mobile-only (C8). Desktop with no
374
+ // approveResponse must not become the pairing authority.
375
+ //
376
+ // REGRESSION COVERED: a desktop browser with "Local passkeys" on,
377
+ // loading /login?next=/pair/<CODE> and completing desktop WebAuthn,
378
+ // MUST NOT redirect to /pair/<CODE> or complete pairing. If a future
379
+ // change opens this gate, it violates plan constraint C8 ("Default
380
+ // authority is phone-held passkey; local desktop passkeys are
381
+ // testing-only"). The codex-remote-control next does NOT trip this
382
+ // rule because it's a navigation continuation, not authority transfer.
383
+ //
384
+ // Returns true if it redirected (caller should not run other view-switching).
385
+ async function followPairNextIfPresent(approveResponse, identity) {
386
+ var next = null;
387
+ // Path 1: QR phone-side approve. Server-blessed next, either shape.
388
+ if (approveResponse && typeof approveResponse.next === 'string' && isWhitelistedNext(approveResponse.next)) {
389
+ next = approveResponse.next;
390
+ } else {
391
+ // Path 2: URL ?next= fallback (no approveResponse). Branch by
392
+ // shape: codex-remote-control allowed on any device, pair-mode
393
+ // restricted to mobile per C8.
394
+ var urlNext = readPairNextFromQuery();
395
+ if (urlNext) {
396
+ if (REMOTE_CONTROL_NEXT_REGEX.test(urlNext)) {
397
+ next = urlNext;
398
+ } else if (PAIR_NEXT_REGEX.test(urlNext) && isMobileDevice()) {
399
+ next = urlNext;
400
+ }
401
+ // Path 3 (desktop + pair next, no approveResponse): next stays null.
402
+ }
403
+ }
404
+ if (!next) return false;
405
+ // Auth-handoff guard: if we don't have an apiKey to store, do NOT
406
+ // redirect to next. Stranding the user on /codex-remote-control/<UUID>
407
+ // without a key in sessionStorage would render a redirect-to-login
408
+ // loop or a blank page (depending on the destination's auth gate).
409
+ // Falling through here lets the caller render the existing
410
+ // welcome-name view, which at least shows the user something they
411
+ // can interact with.
412
+ if (!identity || !identity.apiKey) {
413
+ console.warn('followPairNextIfPresent: missing apiKey on identity; skipping redirect to', next);
414
+ return false;
415
+ }
416
+ sessionStorage.setItem('wip_api_key', identity.apiKey);
417
+ if (identity.agentId) sessionStorage.setItem('wip_handle', identity.agentId);
418
+ if (PAIR_NEXT_REGEX.test(next) && identity.codex_pair_presence_token) {
419
+ sessionStorage.setItem('wip_codex_pair_presence_token', identity.codex_pair_presence_token);
420
+ }
421
+ location.replace(next);
422
+ return true;
423
+ }
424
+
425
+ // ── QR Login (Chrome desktop fallback) ──
426
+ var qrLoginPollTimer = null;
427
+
428
+ async function startQrLogin(handle, mode) {
429
+ var btn = document.getElementById('createBtn');
430
+ btn.disabled = true;
431
+ setStatus('', '');
432
+
433
+ try {
434
+ var pairNext = readPairNextFromQuery();
435
+ var startBody = { handle: handle || undefined, mode: mode || 'register' };
436
+ if (pairNext) startBody.next = pairNext;
437
+ var res = await fetch('/api/qr-login', {
438
+ method: 'POST',
439
+ headers: { 'Content-Type': 'application/json' },
440
+ body: JSON.stringify(startBody),
441
+ });
442
+ var data = await res.json();
443
+
444
+ // Switch to QR view
445
+ document.getElementById('signup-view').style.display = 'none';
446
+ document.getElementById('qr-view').style.display = 'block';
447
+ document.getElementById('qr-image').src = data.qrUrl;
448
+
449
+ // Start polling
450
+ qrLoginPollTimer = setInterval(function() {
451
+ pollQrLogin(data.sessionId);
452
+ }, 2000);
453
+
454
+ // Expire after 5 minutes
455
+ setTimeout(function() {
456
+ if (qrLoginPollTimer) {
457
+ cancelQrLogin();
458
+ setStatus('Session expired. Try again.', 'error');
459
+ setTimeout(clearStatus, 3000);
460
+ }
461
+ }, 5 * 60 * 1000);
462
+
463
+ } catch (err) {
464
+ setStatus('Error: ' + err.message, 'error');
465
+ btn.disabled = false;
466
+ }
467
+ }
468
+
469
+ async function pollQrLogin(sessionId) {
470
+ try {
471
+ var res = await fetch('/api/qr-login/status?s=' + sessionId);
472
+ if (res.status === 404) {
473
+ // Session expired on server
474
+ cancelQrLogin();
475
+ setStatus('Session expired. Try again.', 'error');
476
+ setTimeout(clearStatus, 3000);
477
+ return;
478
+ }
479
+ var data = await res.json();
480
+ if (data.status === 'approved') {
481
+ clearInterval(qrLoginPollTimer);
482
+ qrLoginPollTimer = null;
483
+ document.getElementById('qr-view').style.display = 'none';
484
+ // Branch by next shape. Three cases:
485
+ //
486
+ // 1. Pair-mode (URL ?next=/pair/<CODE>): server stripped apiKey
487
+ // and next from this response (plan C6). Desktop never
488
+ // redirects (C8). Show the dedicated pair-approved view.
489
+ // The phone is the actor that completes pair-complete.
490
+ //
491
+ // 2. Codex remote control continuation (data.next is a
492
+ // /codex-remote-control/<UUID>): standard post-login next.
493
+ // Desktop authenticates with the server-provided apiKey and
494
+ // redirects to next. Server returned the full login response
495
+ // (apiKey, credentialLabel, next) for this case.
496
+ //
497
+ // 3. Legacy login mode (no whitelisted next anywhere): show the
498
+ // existing welcome view.
499
+ var urlNext = readPairNextFromQuery();
500
+ if (urlNext && PAIR_NEXT_REGEX.test(urlNext)) {
501
+ document.getElementById('pair-approved-view').style.display = 'block';
502
+ } else if (data.next && REMOTE_CONTROL_NEXT_REGEX.test(data.next) && data.apiKey) {
503
+ // Codex remote control: pick up the credentials so the
504
+ // destination page is authenticated, then redirect.
505
+ sessionStorage.setItem('wip_api_key', data.apiKey);
506
+ if (data.agentId) sessionStorage.setItem('wip_handle', data.agentId);
507
+ location.replace(data.next);
508
+ } else {
509
+ document.getElementById('success-view').style.display = 'block';
510
+ // Use credentialLabel (matches the saved-passkey label the user
511
+ // sees in iOS Passwords / 1Password). Falls back to agentId for
512
+ // back-compat with older deploys.
513
+ document.getElementById('welcome-name').textContent = data.credentialLabel || data.agentId || 'you';
514
+ }
515
+ }
516
+ } catch (err) {
517
+ // Network error, keep polling
518
+ }
519
+ }
520
+
521
+ function cancelQrLogin() {
522
+ if (qrLoginPollTimer) {
523
+ clearInterval(qrLoginPollTimer);
524
+ qrLoginPollTimer = null;
525
+ }
526
+ document.getElementById('qr-view').style.display = 'none';
527
+ document.getElementById('signup-view').style.display = 'block';
528
+ document.getElementById('createBtn').disabled = false;
529
+ document.getElementById('signInBtn').style.pointerEvents = 'auto';
530
+ }
531
+
532
+ // ── Phone-side QR session detection ──
533
+ var urlParams = new URLSearchParams(window.location.search);
534
+ var qrSessionId = urlParams.get('s');
535
+ var qrHandle = urlParams.get('h');
536
+ var qrMode = urlParams.get('m') || 'register';
537
+ var qrSessionMode = !!qrSessionId;
538
+
539
+ // True only while the auto-start setTimeout is invoking
540
+ // doCreateAccount / doSignIn. Read by the NotAllowedError catches so
541
+ // they can suppress the user-facing "Cancelled. Try again when ready."
542
+ // message when the rejection was caused by a strict user-activation
543
+ // policy (Safari Private Browsing) rather than an actual user
544
+ // cancellation. The user's eventual tap on the existing button or
545
+ // link runs the same handler with a real user gesture, and the same
546
+ // qrSessionId completes /api/qr-login/approve.
547
+ var qrAutoStarting = false;
548
+
549
+ if (qrSessionMode) {
550
+ // Clean the URL so session ID doesn't persist
551
+ history.replaceState(null, '', '/login');
552
+ // Pre-fill handle if provided
553
+ if (qrHandle) document.getElementById('handleInput').value = qrHandle;
554
+ // Auto-start the right flow on phone (no extra tap needed).
555
+ // Restored from the pre-#784 known-good QR phone UX. Safari (normal
556
+ // mode) users never see the static login page (Face ID pops within
557
+ // 300ms). Browsers with stricter user-activation policies (Safari
558
+ // Private Browsing, sometimes Chrome on iOS) may reject the
559
+ // auto-start with NotAllowedError. The catch path below replaces
560
+ // the generic "Cancelled" status with a clear, QR-specific
561
+ // instructional message ("This browser blocked automatic Face ID.
562
+ // Tap ... to continue.") and leaves the existing controls enabled
563
+ // so the user's tap completes the flow with a real gesture.
564
+ setTimeout(async function() {
565
+ qrAutoStarting = true;
566
+ try {
567
+ if (qrMode === 'signin') {
568
+ await doSignIn();
569
+ } else {
570
+ await doCreateAccount();
571
+ }
572
+ } finally {
573
+ qrAutoStarting = false;
574
+ }
575
+ }, 300);
576
+ } else if (isPairNextOnDesktop()) {
577
+ // `codex-daemon link` opens /login?next=/pair/<CODE> on the desktop.
578
+ // The desktop's only authority in that flow is to display QR and wait.
579
+ setTimeout(function() {
580
+ startQrLogin('', 'signin');
581
+ }, 0);
582
+ }
583
+
584
+ // ── Create Account ──
585
+ async function doCreateAccount() {
586
+ var username = (document.getElementById('handleInput').value || '').trim().replace(/^@/, '').toLowerCase().replace(/[^a-z0-9\-]/g, '').slice(0, 30);
587
+ var btn = document.getElementById('createBtn');
588
+ btn.disabled = true;
589
+
590
+ // Pair-mode desktop URLs must always use the QR path. A local
591
+ // desktop passkey is testing-only and must not become pair authority.
592
+ if (isPairNextOnDesktop() && !qrSessionMode) {
593
+ startQrLogin(username, 'signin');
594
+ return;
595
+ }
596
+
597
+ // Chrome desktop without local passkeys: use custom QR code
598
+ if (needsCustomQR() && !qrSessionMode) {
599
+ startQrLogin(username);
600
+ return;
601
+ }
602
+
603
+ setStatus('Preparing...', 'loading');
604
+
605
+ try {
606
+ var optRes = await fetch('/webauthn/register-options', {
607
+ method: 'POST',
608
+ headers: { 'Content-Type': 'application/json' },
609
+ body: JSON.stringify({ username: username || undefined }),
610
+ });
611
+ var optData = await optRes.json();
612
+ var challengeId = optData.challengeId;
613
+ var options = optData.options;
614
+ if (!options) throw new Error('Server returned no options');
615
+
616
+ options.challenge = b64urlToBytes(options.challenge);
617
+ options.user.id = b64urlToBytes(options.user.id);
618
+ if (options.excludeCredentials) {
619
+ options.excludeCredentials = options.excludeCredentials.map(function(c) { return Object.assign({}, c, { id: b64urlToBytes(c.id) }); });
620
+ }
621
+
622
+ // Phone-first by default. If local passkeys toggled on, show all options.
623
+ // On mobile (including QR session mode), always use platform (Face ID directly).
624
+ var mobile = isMobileDevice();
625
+ var localOn = isLocalPasskeysOn();
626
+ if (!options.authenticatorSelection) options.authenticatorSelection = {};
627
+ if (mobile) {
628
+ options.authenticatorSelection.authenticatorAttachment = 'platform';
629
+ } else if (!localOn) {
630
+ options.authenticatorSelection.authenticatorAttachment = 'cross-platform';
631
+ }
632
+ options.authenticatorSelection.residentKey = 'preferred';
633
+ options.authenticatorSelection.userVerification = 'required';
634
+
635
+ setStatus(mobile ? 'Waiting for biometric...' : localOn ? 'Waiting for biometric...' : 'Scan the QR code with your phone...', 'loading');
636
+ var credential = await navigator.credentials.create({ publicKey: options });
637
+
638
+ var reqBody = {
639
+ challengeId: challengeId,
640
+ credential: {
641
+ id: credential.id,
642
+ rawId: bytesToB64url(credential.rawId),
643
+ type: credential.type,
644
+ response: {
645
+ attestationObject: bytesToB64url(credential.response.attestationObject),
646
+ clientDataJSON: bytesToB64url(credential.response.clientDataJSON),
647
+ transports: credential.response.getTransports ? credential.response.getTransports() : [],
648
+ },
649
+ },
650
+ };
651
+
652
+ setStatus('Verifying...', 'loading');
653
+ var verRes = await fetch('/webauthn/register-verify', {
654
+ method: 'POST',
655
+ headers: { 'Content-Type': 'application/json' },
656
+ body: JSON.stringify(reqBody),
657
+ });
658
+ var result = await verRes.json();
659
+
660
+ if (result.success) {
661
+ // Direct Remote Control login continuation. Runs before any
662
+ // qr-login/approve or pair-mode logic so the apiKey lands in
663
+ // sessionStorage and the destination's auth gate finds it.
664
+ if (redirectToRemoteControlIfDirectLogin(result)) return;
665
+ // If phone completing a desktop QR session, approve it
666
+ var approveResponse = null;
667
+ if (qrSessionMode && qrSessionId) {
668
+ var approveRes = await fetch('/api/qr-login/approve', {
669
+ method: 'POST',
670
+ headers: { 'Content-Type': 'application/json' },
671
+ body: JSON.stringify({
672
+ sessionId: qrSessionId,
673
+ agentId: result.agentId,
674
+ apiKey: result.apiKey,
675
+ credentialLabel: result.credentialLabel,
676
+ }),
677
+ });
678
+ try { approveResponse = await approveRes.json(); } catch (e) { approveResponse = null; }
679
+ }
680
+ // Mark that user has an account (persists across sessions)
681
+ localStorage.setItem('kscope-has-account', 'true');
682
+ // CRC pair-mode: if the server returned a sanitized `next`, store
683
+ // the api_key on the phone and redirect to /pair/<CODE>. Phone is
684
+ // the actor that completes pair-complete (plan C6).
685
+ if (await followPairNextIfPresent(approveResponse, result)) return;
686
+ document.getElementById('signup-view').style.display = 'none';
687
+ document.getElementById('success-view').style.display = 'block';
688
+ // Use credentialLabel from the server, which matches the userName
689
+ // saved by iOS Passwords / 1Password. Falls back to typed
690
+ // username, then agentId, then "you".
691
+ document.getElementById('welcome-name').textContent = result.credentialLabel || username || result.agentId || 'you';
692
+ setStatus('', '');
693
+ } else {
694
+ setStatus(result.error || 'Registration failed', 'error');
695
+ btn.disabled = false;
696
+ }
697
+ } catch (err) {
698
+ if (err.name === 'NotAllowedError') {
699
+ // Distinguish auto-start rejection from a user cancellation.
700
+ // When the QR auto-start hits a strict user-activation policy
701
+ // (Safari Private Browsing, future stricter modes), surface a
702
+ // clear, QR-specific instruction instead of the generic
703
+ // "Cancelled" copy. The existing primary button stays enabled
704
+ // (btn.disabled = false below); the user's tap is a real
705
+ // gesture and reuses the same qrSessionId.
706
+ if (qrSessionMode && qrAutoStarting) {
707
+ setStatus('This browser blocked automatic Face ID. Tap Enter the Kaleidoscope to continue.', 'error');
708
+ } else {
709
+ setStatus('Cancelled. Try again when ready.', 'error');
710
+ setTimeout(function() { clearStatus(); }, 3000);
711
+ }
712
+ } else {
713
+ setStatus('Error: ' + err.message, 'error');
714
+ }
715
+ btn.disabled = false;
716
+ }
717
+ }
718
+
719
+ async function doSignIn() {
720
+ document.getElementById('signInBtn').style.pointerEvents = 'none';
721
+ document.getElementById('createBtn').disabled = true;
722
+
723
+ // Pair-mode desktop URLs must always use the QR path. A local
724
+ // desktop passkey is testing-only and must not become pair authority.
725
+ if (isPairNextOnDesktop() && !qrSessionMode) {
726
+ startQrLogin('', 'signin');
727
+ return;
728
+ }
729
+
730
+ // Chrome desktop without local passkeys: use QR code for sign-in.
731
+ // With local passkeys on, let Chrome show native dialog (supports YubiKey).
732
+ if (needsCustomQR() && !qrSessionMode) {
733
+ startQrLogin('', 'signin');
734
+ return;
735
+ }
736
+
737
+ setStatus('Preparing...', 'loading');
738
+
739
+ try {
740
+ var optRes = await fetch('/webauthn/auth-options', {
741
+ method: 'POST',
742
+ headers: { 'Content-Type': 'application/json' },
743
+ body: '{}',
744
+ });
745
+ var optData = await optRes.json();
746
+ var challengeId = optData.challengeId;
747
+ var options = optData.options;
748
+ if (!options) throw new Error('Server returned no options');
749
+
750
+ options.challenge = b64urlToBytes(options.challenge);
751
+ if (options.allowCredentials) {
752
+ options.allowCredentials = options.allowCredentials.map(function(c) { return Object.assign({}, c, { id: b64urlToBytes(c.id) }); });
753
+ }
754
+
755
+ setStatus('Waiting for biometric...', 'loading');
756
+ var assertion = await navigator.credentials.get({ publicKey: options });
757
+
758
+ var reqBody = {
759
+ challengeId: challengeId,
760
+ credential: {
761
+ id: assertion.id, rawId: bytesToB64url(assertion.rawId), type: assertion.type,
762
+ response: {
763
+ authenticatorData: bytesToB64url(assertion.response.authenticatorData),
764
+ clientDataJSON: bytesToB64url(assertion.response.clientDataJSON),
765
+ signature: bytesToB64url(assertion.response.signature),
766
+ userHandle: assertion.response.userHandle ? bytesToB64url(assertion.response.userHandle) : null,
767
+ },
768
+ },
769
+ };
770
+
771
+ setStatus('Verifying...', 'loading');
772
+ var verRes = await fetch('/webauthn/auth-verify', {
773
+ method: 'POST',
774
+ headers: { 'Content-Type': 'application/json' },
775
+ body: JSON.stringify(reqBody),
776
+ });
777
+ var result = await verRes.json();
778
+
779
+ if (result.success) {
780
+ // Direct Remote Control login continuation. Runs before any
781
+ // qr-login/approve or pair-mode logic so the apiKey lands in
782
+ // sessionStorage and the destination's auth gate finds it.
783
+ if (redirectToRemoteControlIfDirectLogin(result)) return;
784
+ // If phone completing a desktop QR session, approve it
785
+ var approveResponse = null;
786
+ if (qrSessionMode && qrSessionId) {
787
+ var approveRes = await fetch('/api/qr-login/approve', {
788
+ method: 'POST',
789
+ headers: { 'Content-Type': 'application/json' },
790
+ body: JSON.stringify({
791
+ sessionId: qrSessionId,
792
+ agentId: result.agentId,
793
+ apiKey: result.apiKey,
794
+ credentialLabel: result.credentialLabel,
795
+ }),
796
+ });
797
+ try { approveResponse = await approveRes.json(); } catch (e) { approveResponse = null; }
798
+ }
799
+ // CRC pair-mode: if the server returned a sanitized `next`, store
800
+ // the api_key on the phone and redirect to /pair/<CODE>. Phone is
801
+ // the actor that completes pair-complete (plan C6).
802
+ if (await followPairNextIfPresent(approveResponse, result)) return;
803
+ document.getElementById('signup-view').style.display = 'none';
804
+ document.getElementById('success-view').style.display = 'block';
805
+ // Use credentialLabel from the server, which matches the saved-
806
+ // passkey label the user sees in iOS Passwords / 1Password.
807
+ document.getElementById('welcome-name').textContent = result.credentialLabel || result.agentId || 'you';
808
+ setStatus('', '');
809
+ } else {
810
+ setStatus(result.error || 'Authentication failed', 'error');
811
+ document.getElementById('signInBtn').style.pointerEvents = 'auto';
812
+ document.getElementById('createBtn').disabled = false;
813
+ }
814
+ } catch (err) {
815
+ if (err.name === 'NotAllowedError') {
816
+ // Distinguish auto-start rejection from a user cancellation.
817
+ // When the QR auto-start hits a strict user-activation policy
818
+ // (Safari Private Browsing, future stricter modes), surface a
819
+ // clear, QR-specific instruction instead of the generic
820
+ // "Cancelled" copy. The sign-in link and primary button stay
821
+ // enabled below; the user's tap is a real gesture and reuses
822
+ // the same qrSessionId.
823
+ if (qrSessionMode && qrAutoStarting) {
824
+ setStatus('This browser blocked automatic Face ID. Tap Already have an account? Sign in. to continue.', 'error');
825
+ } else {
826
+ setStatus('Cancelled. Try again when ready.', 'error');
827
+ setTimeout(function() { clearStatus(); }, 3000);
828
+ }
829
+ } else {
830
+ setStatus('Error: ' + err.message, 'error');
831
+ }
832
+ document.getElementById('signInBtn').style.pointerEvents = 'auto';
833
+ document.getElementById('createBtn').disabled = false;
834
+ }
835
+ }
836
+
837
+ // Enter key on handle input triggers create
838
+ document.getElementById('handleInput').addEventListener('keydown', function(e) {
839
+ if (e.key === 'Enter') doCreateAccount();
840
+ });
841
+
842
+ // Initialize footer dot
843
+ updatePasskeysDot();
844
+ </script>
845
+ </body>
846
+ </html>