@agentproto/apps 0.8.2 → 0.9.1
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.
- package/README.md +28 -1
- package/dist/agents-overview/index.d.ts +54 -0
- package/dist/agents-overview/index.d.ts.map +1 -0
- package/dist/agents-overview/panel.d.ts +14 -0
- package/dist/agents-overview/panel.d.ts.map +1 -0
- package/dist/agents-overview/panel.mjs +306 -0
- package/dist/agents-overview/panel.mjs.map +1 -0
- package/dist/agents-overview.mjs +336 -0
- package/dist/agents-overview.mjs.map +1 -0
- package/dist/bin/sync.mjs +25 -11
- package/dist/bin/sync.mjs.map +1 -1
- package/dist/bureau-sessions/index.d.ts +52 -0
- package/dist/bureau-sessions/index.d.ts.map +1 -0
- package/dist/bureau-sessions/panel.d.ts +10 -0
- package/dist/bureau-sessions/panel.d.ts.map +1 -0
- package/dist/bureau-sessions/panel.mjs +297 -0
- package/dist/bureau-sessions/panel.mjs.map +1 -0
- package/dist/bureau-sessions.mjs +329 -0
- package/dist/bureau-sessions.mjs.map +1 -0
- package/dist/content-team/workflows/produce-content.d.ts +14 -2
- package/dist/content-team/workflows/produce-content.d.ts.map +1 -1
- package/dist/content-team/workflows/produce-cover.d.ts +13 -1
- package/dist/content-team/workflows/produce-cover.d.ts.map +1 -1
- package/dist/content-team.mjs +25 -11
- package/dist/content-team.mjs.map +1 -1
- package/dist/index.d.ts +24 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +2635 -12
- package/dist/index.mjs.map +1 -1
- package/dist/live-session/index.d.ts +46 -0
- package/dist/live-session/index.d.ts.map +1 -0
- package/dist/live-session/logic.d.ts +125 -0
- package/dist/live-session/logic.d.ts.map +1 -0
- package/dist/live-session/panel.d.ts +61 -0
- package/dist/live-session/panel.d.ts.map +1 -0
- package/dist/live-session/panel.mjs +993 -0
- package/dist/live-session/panel.mjs.map +1 -0
- package/dist/live-session.mjs +1032 -0
- package/dist/live-session.mjs.map +1 -0
- package/dist/mcp-app-types.d.ts +33 -0
- package/dist/mcp-app-types.d.ts.map +1 -0
- package/dist/panel-bridge.d.ts +38 -0
- package/dist/panel-bridge.d.ts.map +1 -0
- package/dist/session-story/index.d.ts +66 -0
- package/dist/session-story/index.d.ts.map +1 -0
- package/dist/session-story/panel.d.ts +31 -0
- package/dist/session-story/panel.d.ts.map +1 -0
- package/dist/session-story/panel.mjs +970 -0
- package/dist/session-story/panel.mjs.map +1 -0
- package/dist/session-story.mjs +1002 -0
- package/dist/session-story.mjs.map +1 -0
- package/dist/sessions-panel/index.d.ts +51 -0
- package/dist/sessions-panel/index.d.ts.map +1 -0
- package/dist/sessions-panel/panel.d.ts +20 -0
- package/dist/sessions-panel/panel.d.ts.map +1 -0
- package/dist/sessions-panel/panel.mjs +511 -0
- package/dist/sessions-panel/panel.mjs.map +1 -0
- package/dist/sessions-panel.mjs +545 -0
- package/dist/sessions-panel.mjs.map +1 -0
- package/package.json +56 -5
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* McpApp definition for the agentproto "bureau — sessions navigateur" panel.
|
|
3
|
+
*
|
|
4
|
+
* Shows the browser sessions (kind === "browser"): adapter, base URL, port,
|
|
5
|
+
* status and uptime. One row per live/recent browser service so you can see
|
|
6
|
+
* what's bound where at a glance.
|
|
7
|
+
*
|
|
8
|
+
* Uses the AgnoMcpApp contract (a local McpApp-compatible shape that does
|
|
9
|
+
* NOT depend on @agstudio/mcp-apps). The host (@agentproto/runtime) wires
|
|
10
|
+
* this factory's output via `registerMcpApps` at boot time — see runtime's
|
|
11
|
+
* builtin-apps.ts.
|
|
12
|
+
*
|
|
13
|
+
* Protocol flow:
|
|
14
|
+
* 1. Tool `agentproto_bureau_sessions` is called by the host.
|
|
15
|
+
* 2. execute() returns the browser-session snapshot.
|
|
16
|
+
* 3. The HTML panel opens a JSON-RPC bridge (postMessage) and polls
|
|
17
|
+
* `session_list {kind:'all'}` every ~5 s, filtering to kind==="browser".
|
|
18
|
+
*
|
|
19
|
+
* Data only — no server LLM. The whole bundle is inline (zero CDN).
|
|
20
|
+
*
|
|
21
|
+
* This module also exports `bureauSessionsApp`, a real `defineApp()`
|
|
22
|
+
* `AppHandle` (`agents: []`, UI-only) — the catalog/emit/`app_install` path.
|
|
23
|
+
* It's separate from `makeBureauSessionsApp` above, which the daemon mounts
|
|
24
|
+
* directly at boot: that factory closes over LIVE `listSessions`, something
|
|
25
|
+
* a static emitted `ui.html` snapshot can't carry.
|
|
26
|
+
*/
|
|
27
|
+
import { z } from "zod";
|
|
28
|
+
import { type AppHandle } from "@agentproto/app-kit";
|
|
29
|
+
import type { AgnoMcpApp } from "../mcp-app-types.js";
|
|
30
|
+
export declare const bureauSessionsInputSchema: z.ZodObject<{
|
|
31
|
+
filter: z.ZodOptional<z.ZodEnum<{
|
|
32
|
+
running: "running";
|
|
33
|
+
all: "all";
|
|
34
|
+
}>>;
|
|
35
|
+
}, z.core.$strip>;
|
|
36
|
+
export type BureauSessionsInput = z.infer<typeof bureauSessionsInputSchema>;
|
|
37
|
+
export type BureauSessionsOutput<TSession = unknown> = {
|
|
38
|
+
sessions: TSession[];
|
|
39
|
+
};
|
|
40
|
+
/** Generic over the host's own session-descriptor shape — see
|
|
41
|
+
* sessions-panel/index.ts's SessionsPanelOps for why. */
|
|
42
|
+
export interface BureauSessionsOps<TSession extends {
|
|
43
|
+
kind: string;
|
|
44
|
+
}> {
|
|
45
|
+
listSessions(filter?: "running" | "all"): TSession[];
|
|
46
|
+
}
|
|
47
|
+
export type { AgnoMcpApp };
|
|
48
|
+
export declare function makeBureauSessionsApp<TSession extends {
|
|
49
|
+
kind: string;
|
|
50
|
+
}>(ops: BureauSessionsOps<TSession>): AgnoMcpApp<BureauSessionsInput, BureauSessionsOutput<TSession>>;
|
|
51
|
+
export declare const bureauSessionsApp: AppHandle;
|
|
52
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bureau-sessions/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAA;AACvB,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAE/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAErD,eAAO,MAAM,yBAAyB;;;;;iBAKpC,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,yBAAyB,CAAC,CAAA;AAC3E,MAAM,MAAM,oBAAoB,CAAC,QAAQ,GAAG,OAAO,IAAI;IAAE,QAAQ,EAAE,QAAQ,EAAE,CAAA;CAAE,CAAA;AAE/E;0DAC0D;AAC1D,MAAM,WAAW,iBAAiB,CAAC,QAAQ,SAAS;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE;IAClE,YAAY,CAAC,MAAM,CAAC,EAAE,SAAS,GAAG,KAAK,GAAG,QAAQ,EAAE,CAAA;CACrD;AAED,YAAY,EAAE,UAAU,EAAE,CAAA;AAE1B,wBAAgB,qBAAqB,CAAC,QAAQ,SAAS;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,EACrE,GAAG,EAAE,iBAAiB,CAAC,QAAQ,CAAC,GAC/B,UAAU,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,QAAQ,CAAC,CAAC,CAajE;AAED,eAAO,MAAM,iBAAiB,EAAE,SAY9B,CAAA"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* HTML bundle for the agentproto "bureau — sessions navigateur" panel — the
|
|
3
|
+
* `BUREAU_SESSIONS_HTML` served as the `ui://agentproto_bureau_sessions/view`
|
|
4
|
+
* resource. Mounted via the `agentproto_bureau_sessions` tool defined in
|
|
5
|
+
* ./index.ts.
|
|
6
|
+
*
|
|
7
|
+
* Data only — no server LLM. The whole bundle is inline (zero CDN).
|
|
8
|
+
*/
|
|
9
|
+
export declare const BUREAU_SESSIONS_HTML: string;
|
|
10
|
+
//# sourceMappingURL=panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/bureau-sessions/panel.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH,eAAO,MAAM,oBAAoB,QA8IzB,CAAA"}
|
|
@@ -0,0 +1,297 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @agentproto/apps v0.1.0
|
|
3
|
+
* Ready-made agentproto apps (teams of agents + workflows) built on app-kit.
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
// src/panel-bridge.ts
|
|
7
|
+
function panelBridgeScript(appName) {
|
|
8
|
+
return `// \u2500\u2500 MCP Apps bridge (shared: panel-bridge.ts) \u2500\u2500
|
|
9
|
+
// JSON-RPC 2.0 over window.parent.postMessage \xB7 spec 2026-01-26
|
|
10
|
+
var _nextId = 1, _pending = {}, _notifyHandlers = [];
|
|
11
|
+
var _hostContext = null, _hostContextHandlers = [];
|
|
12
|
+
function post(msg){ window.parent.postMessage(msg, '*'); }
|
|
13
|
+
function getHostContext(){ return _hostContext; }
|
|
14
|
+
function onHostContext(cb){
|
|
15
|
+
_hostContextHandlers.push(cb);
|
|
16
|
+
// Replay the last context so a late subscriber isn't stuck blind.
|
|
17
|
+
if (_hostContext){ try { cb(_hostContext); } catch(_) {} }
|
|
18
|
+
}
|
|
19
|
+
function _setHostContext(ctx){
|
|
20
|
+
if (!ctx || typeof ctx !== 'object') return;
|
|
21
|
+
// ui/notifications/host-context-changed carries only the changed keys \u2014
|
|
22
|
+
// merge, matching the official ext-apps App behaviour.
|
|
23
|
+
_hostContext = Object.assign({}, _hostContext || {}, ctx);
|
|
24
|
+
for (var i = 0; i < _hostContextHandlers.length; i++){
|
|
25
|
+
try { _hostContextHandlers[i](_hostContext); } catch(_) {}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
function rpcRequest(method, params){
|
|
29
|
+
return new Promise(function(resolve, reject){
|
|
30
|
+
var id = _nextId++;
|
|
31
|
+
_pending[id] = {resolve: resolve, reject: reject};
|
|
32
|
+
post({jsonrpc: '2.0', id: id, method: method, params: params || {}});
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
function rpcNotify(method, params){ post({jsonrpc: '2.0', method: method, params: params || {}}); }
|
|
36
|
+
function onHostNotification(cb){ _notifyHandlers.push(cb); }
|
|
37
|
+
window.addEventListener('message', function(evt){
|
|
38
|
+
var msg = evt.data;
|
|
39
|
+
if (!msg || typeof msg !== 'object' || msg.jsonrpc !== '2.0') return;
|
|
40
|
+
if (msg.id != null && msg.method == null){
|
|
41
|
+
var p = _pending[msg.id];
|
|
42
|
+
if (!p) return;
|
|
43
|
+
delete _pending[msg.id];
|
|
44
|
+
if (msg.error) p.reject(new Error(msg.error.message || ('rpc error ' + msg.error.code)));
|
|
45
|
+
else p.resolve(msg.result);
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
if (msg.method){
|
|
49
|
+
if (msg.method === 'ui/notifications/host-context-changed'){
|
|
50
|
+
_setHostContext(msg.params || {});
|
|
51
|
+
}
|
|
52
|
+
for (var i = 0; i < _notifyHandlers.length; i++){
|
|
53
|
+
try { _notifyHandlers[i](msg.method, msg.params || {}); } catch(_) {}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
function initBridge(){
|
|
58
|
+
return rpcRequest('ui/initialize', {
|
|
59
|
+
appInfo: {name: ${JSON.stringify(appName)}, version: '0.1.0'},
|
|
60
|
+
appCapabilities: {availableDisplayModes: ['inline', 'fullscreen', 'pip']},
|
|
61
|
+
protocolVersion: '2026-01-26'
|
|
62
|
+
}).then(function(result){
|
|
63
|
+
// The initialize result carries the initial hostContext (displayMode +
|
|
64
|
+
// availableDisplayModes) \u2014 capture it before notifying the host.
|
|
65
|
+
if (result && result.hostContext) _setHostContext(result.hostContext);
|
|
66
|
+
rpcNotify('ui/notifications/initialized', {});
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
function requestDisplayMode(mode){
|
|
70
|
+
return rpcRequest('ui/request-display-mode', {mode: mode});
|
|
71
|
+
}
|
|
72
|
+
function callTool(name, args){
|
|
73
|
+
return rpcRequest('tools/call', {name: name, arguments: args || {}}).then(function(result){
|
|
74
|
+
if (result.isError){
|
|
75
|
+
var e = (result.content && result.content[0] && result.content[0].text) || 'tool error';
|
|
76
|
+
throw new Error(e);
|
|
77
|
+
}
|
|
78
|
+
var text = (result.content && result.content[0] && result.content[0].text) || '{}';
|
|
79
|
+
return JSON.parse(text);
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
// \u2500\u2500 Display-mode toggle buttons (NO auto-request) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
|
|
84
|
+
// Injected by the shared bridge so every panel gets them without touching
|
|
85
|
+
// its own markup. Mirrors guilde canvas.app.ts canvasShellHtml(): the
|
|
86
|
+
// panel stays inline by default; the user expands on demand. Buttons only
|
|
87
|
+
// appear for modes the host advertises in hostContext.availableDisplayModes.
|
|
88
|
+
(function(){
|
|
89
|
+
function mount(){
|
|
90
|
+
var style = document.createElement('style');
|
|
91
|
+
style.textContent = '#dm,#pin{display:none;position:fixed;top:8px;z-index:10;'
|
|
92
|
+
+ 'border:1px solid #d0d0d0;background:#fff;color:#1a1a1a;'
|
|
93
|
+
+ 'font:600 13px/1 system-ui,sans-serif;padding:7px 12px;border-radius:6px;'
|
|
94
|
+
+ 'cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18)}'
|
|
95
|
+
+ '#dm{right:8px}#pin{right:118px}'
|
|
96
|
+
+ '#dm:hover,#pin:hover{background:#f2f2f2;border-color:#b0b0b0}'
|
|
97
|
+
+ '@media (prefers-color-scheme:dark){'
|
|
98
|
+
+ '#dm,#pin{border-color:#555;background:#2a2a2a;color:#f0f0f0;box-shadow:0 1px 4px rgba(0,0,0,.5)}'
|
|
99
|
+
+ '#dm:hover,#pin:hover{background:#333;border-color:#777}}';
|
|
100
|
+
document.head.appendChild(style);
|
|
101
|
+
|
|
102
|
+
var btn = document.createElement('button');
|
|
103
|
+
btn.id = 'dm'; btn.type = 'button'; btn.title = "Basculer l'affichage";
|
|
104
|
+
var pin = document.createElement('button');
|
|
105
|
+
pin.id = 'pin'; pin.type = 'button'; pin.title = '\xC9pingler sur le c\xF4t\xE9 (pip)';
|
|
106
|
+
document.body.appendChild(pin);
|
|
107
|
+
document.body.appendChild(btn);
|
|
108
|
+
|
|
109
|
+
function has(avail, m){ return !!avail && avail.indexOf(m) >= 0; }
|
|
110
|
+
|
|
111
|
+
// Re-sync button visibility + label from the current host context.
|
|
112
|
+
function syncBtn(ctx){
|
|
113
|
+
ctx = ctx || {};
|
|
114
|
+
var avail = ctx.availableDisplayModes;
|
|
115
|
+
// Diagnostic: what does THIS host actually advertise? (inline/fullscreen/pip)
|
|
116
|
+
console.log('[mcp-app] displayMode=', ctx.displayMode,
|
|
117
|
+
'availableDisplayModes=', avail);
|
|
118
|
+
|
|
119
|
+
// Fullscreen toggle button.
|
|
120
|
+
if (has(avail, 'fullscreen')){
|
|
121
|
+
btn.style.display = 'block';
|
|
122
|
+
btn.textContent = (ctx.displayMode === 'fullscreen') ? '\u2921 R\xE9duire' : '\u2922 Agrandir';
|
|
123
|
+
} else { btn.style.display = 'none'; }
|
|
124
|
+
|
|
125
|
+
// Dedicated pip ("pinned on side") button \u2014 only if the host advertises pip.
|
|
126
|
+
if (has(avail, 'pip')){
|
|
127
|
+
pin.style.display = 'block';
|
|
128
|
+
pin.textContent = (ctx.displayMode === 'pip') ? '\u2921 D\xE9tacher' : '\u{1F4CC} \xC9pingler';
|
|
129
|
+
} else { pin.style.display = 'none'; }
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
onHostContext(syncBtn);
|
|
133
|
+
|
|
134
|
+
btn.addEventListener('click', function(){
|
|
135
|
+
var ctx = getHostContext() || {};
|
|
136
|
+
var inPanel = (ctx.displayMode === 'fullscreen' || ctx.displayMode === 'pip');
|
|
137
|
+
requestDisplayMode(inPanel ? 'inline' : 'fullscreen').catch(function(){});
|
|
138
|
+
});
|
|
139
|
+
|
|
140
|
+
pin.addEventListener('click', function(){
|
|
141
|
+
var ctx = getHostContext() || {};
|
|
142
|
+
requestDisplayMode(ctx.displayMode === 'pip' ? 'inline' : 'pip').catch(function(){});
|
|
143
|
+
});
|
|
144
|
+
}
|
|
145
|
+
if (document.body) mount();
|
|
146
|
+
else document.addEventListener('DOMContentLoaded', mount);
|
|
147
|
+
})();`;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
// src/bureau-sessions/panel.ts
|
|
151
|
+
var BUREAU_SESSIONS_HTML = `<!DOCTYPE html>
|
|
152
|
+
<html lang="fr">
|
|
153
|
+
<head>
|
|
154
|
+
<meta charset="UTF-8">
|
|
155
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
156
|
+
<title>bureau \u2014 sessions navigateur</title>
|
|
157
|
+
<style>
|
|
158
|
+
*{box-sizing:border-box;margin:0;padding:0}
|
|
159
|
+
:root{
|
|
160
|
+
--bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;
|
|
161
|
+
--text:#e6edf3;--text2:#8b949e;
|
|
162
|
+
--green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--purple:#bc8cff;
|
|
163
|
+
}
|
|
164
|
+
*{box-sizing:border-box}
|
|
165
|
+
html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;font-size:13px;background:var(--bg);color:var(--text);overflow:hidden}
|
|
166
|
+
#app{display:flex;flex-direction:column;height:100%}
|
|
167
|
+
#hdr{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--bg2);flex-shrink:0}
|
|
168
|
+
#hdr h1{font-size:13px;font-weight:600}
|
|
169
|
+
#hdr .sub{font-size:11px;color:var(--text2);margin-top:2px}
|
|
170
|
+
#refresh-btn{background:none;border:none;cursor:pointer;color:var(--text2);font-size:16px;line-height:1;padding:4px 6px;border-radius:6px}
|
|
171
|
+
#refresh-btn:hover{color:var(--text);background:var(--bg3)}
|
|
172
|
+
#list{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
|
|
173
|
+
.row{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:11px 14px;display:flex;align-items:center;gap:14px}
|
|
174
|
+
.icon{font-size:20px;flex-shrink:0}
|
|
175
|
+
.body{flex:1;min-width:0}
|
|
176
|
+
.r1{display:flex;align-items:center;gap:8px}
|
|
177
|
+
.adapter{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
|
|
178
|
+
.url{font-family:Menlo,Monaco,'Courier New',monospace;font-size:11.5px;color:var(--blue);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
|
|
179
|
+
.meta{font-size:10.5px;color:var(--text2);margin-top:3px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
|
|
180
|
+
.dot{width:5px;height:5px;border-radius:50%;background:var(--text2);display:inline-block}
|
|
181
|
+
.badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:11px;white-space:nowrap}
|
|
182
|
+
.br{background:rgba(63,185,80,.16);color:var(--green)}
|
|
183
|
+
.bs{background:rgba(88,166,255,.16);color:var(--blue)}
|
|
184
|
+
.bk{background:rgba(248,81,73,.14);color:var(--red)}
|
|
185
|
+
.be{background:rgba(139,148,158,.14);color:var(--text2)}
|
|
186
|
+
.berr{background:rgba(248,81,73,.22);color:var(--red)}
|
|
187
|
+
.port{font-family:Menlo,Monaco,'Courier New',monospace}
|
|
188
|
+
#empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text2);gap:8px;padding:48px;text-align:center}
|
|
189
|
+
#empty .ico{font-size:30px}
|
|
190
|
+
#statusbar{padding:5px 16px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0}
|
|
191
|
+
</style>
|
|
192
|
+
</head>
|
|
193
|
+
<body>
|
|
194
|
+
<div id="app">
|
|
195
|
+
<div id="hdr">
|
|
196
|
+
<div>
|
|
197
|
+
<h1>Bureau \u2014 sessions navigateur</h1>
|
|
198
|
+
<div class="sub">services navigateur actifs \xB7 URL / port / statut</div>
|
|
199
|
+
</div>
|
|
200
|
+
<button id="refresh-btn" title="Rafra\xEEchir" onclick="doRefresh()">↻</button>
|
|
201
|
+
</div>
|
|
202
|
+
<div id="list"><div id="empty"><div class="ico">🌐</div><div>Connexion au bridge…</div></div></div>
|
|
203
|
+
<div id="statusbar">Connexion…</div>
|
|
204
|
+
</div>
|
|
205
|
+
<script>
|
|
206
|
+
${panelBridgeScript("agentproto-bureau-sessions")}
|
|
207
|
+
|
|
208
|
+
// \u2500\u2500 State \u2500\u2500
|
|
209
|
+
var REFRESH_MS = 5000;
|
|
210
|
+
var pollTimer = null, polling = false;
|
|
211
|
+
function esc(s){ return String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }
|
|
212
|
+
function setStatus(m){ document.getElementById('statusbar').textContent = m; }
|
|
213
|
+
|
|
214
|
+
function badgeClass(st){
|
|
215
|
+
if (st === 'running') return 'br';
|
|
216
|
+
if (st === 'starting') return 'bs';
|
|
217
|
+
if (st === 'killed') return 'bk';
|
|
218
|
+
if (st === 'error') return 'berr';
|
|
219
|
+
return 'be';
|
|
220
|
+
}
|
|
221
|
+
function fmtUptime(iso, end){
|
|
222
|
+
if (!iso) return '';
|
|
223
|
+
var start = Date.parse(iso);
|
|
224
|
+
if (isNaN(start)) return '';
|
|
225
|
+
var ref = end ? Date.parse(end) : Date.now();
|
|
226
|
+
var s = Math.max(0, Math.round((ref - start) / 1000));
|
|
227
|
+
if (s < 60) return s + 's';
|
|
228
|
+
var m = Math.floor(s/60), rs = s%60;
|
|
229
|
+
if (m < 60) return m + 'm ' + rs + 's';
|
|
230
|
+
var h = Math.floor(m/60), rm = m%60;
|
|
231
|
+
return h + 'h ' + rm + 'm';
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
function render(rows){
|
|
235
|
+
var list = document.getElementById('list');
|
|
236
|
+
if (!rows.length){
|
|
237
|
+
list.innerHTML = '<div id="empty"><div class="ico">🌐</div><div>Aucune session navigateur</div></div>';
|
|
238
|
+
return;
|
|
239
|
+
}
|
|
240
|
+
var html = '';
|
|
241
|
+
for (var i=0;i<rows.length;i++){
|
|
242
|
+
var s = rows[i];
|
|
243
|
+
var bc = badgeClass(s.status);
|
|
244
|
+
var url = s.browserBaseUrl || (s.browserPort ? ('http://127.0.0.1:' + s.browserPort) : '');
|
|
245
|
+
var adapter = s.browserAdapterId || s.label || s.name || 'navigateur';
|
|
246
|
+
var up = fmtUptime(s.startedAt, s.endedAt);
|
|
247
|
+
html += '<div class="row">'
|
|
248
|
+
+ '<div class="icon">🌐</div>'
|
|
249
|
+
+ '<div class="body">'
|
|
250
|
+
+ '<div class="r1"><span class="adapter">' + esc(adapter) + '</span>'
|
|
251
|
+
+ '<span class="badge ' + bc + '">' + esc(s.status || '') + '</span></div>'
|
|
252
|
+
+ (url ? '<div class="url">' + esc(url) + '</div>' : '')
|
|
253
|
+
+ '<div class="meta">'
|
|
254
|
+
+ (s.browserPort ? '<span>port <span class="port">' + esc(s.browserPort) + '</span></span><span class="dot"></span>' : '')
|
|
255
|
+
+ '<span>' + (up ? 'uptime ' + esc(up) : '') + '</span>'
|
|
256
|
+
+ '</div>'
|
|
257
|
+
+ '</div>'
|
|
258
|
+
+ '</div>';
|
|
259
|
+
}
|
|
260
|
+
list.innerHTML = html;
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
function loadAndRender(){
|
|
264
|
+
return callTool('session_list', {kind:'all'}).then(function(data){
|
|
265
|
+
var all = data.sessions || [];
|
|
266
|
+
var browsers = all.filter(function(s){ return s.kind === 'browser'; });
|
|
267
|
+
render(browsers);
|
|
268
|
+
setStatus(browsers.length + ' session' + (browsers.length===1?'':'s') + ' \xB7 ' + new Date().toLocaleTimeString('fr-FR'));
|
|
269
|
+
}).catch(function(e){ setStatus('Erreur : ' + e.message); });
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
function doPoll(){
|
|
273
|
+
if (polling) return;
|
|
274
|
+
polling = true;
|
|
275
|
+
loadAndRender().then(function(){
|
|
276
|
+
polling = false;
|
|
277
|
+
pollTimer = setTimeout(doPoll, REFRESH_MS);
|
|
278
|
+
}).catch(function(){
|
|
279
|
+
polling = false;
|
|
280
|
+
pollTimer = setTimeout(doPoll, REFRESH_MS);
|
|
281
|
+
});
|
|
282
|
+
}
|
|
283
|
+
function doRefresh(){ if (pollTimer) clearTimeout(pollTimer); return loadAndRender().then(function(){ pollTimer = setTimeout(doPoll, REFRESH_MS); }); }
|
|
284
|
+
|
|
285
|
+
initBridge().then(loadAndRender).then(function(){
|
|
286
|
+
pollTimer = setTimeout(doPoll, REFRESH_MS);
|
|
287
|
+
}).catch(function(e){
|
|
288
|
+
setStatus('Bridge : ' + e.message);
|
|
289
|
+
document.getElementById('list').innerHTML = '<div id="empty"><div class="ico">⚠</div><div>\xC9chec connexion bridge : ' + esc(e.message) + '</div></div>';
|
|
290
|
+
});
|
|
291
|
+
</script>
|
|
292
|
+
</body>
|
|
293
|
+
</html>`;
|
|
294
|
+
|
|
295
|
+
export { BUREAU_SESSIONS_HTML };
|
|
296
|
+
//# sourceMappingURL=panel.mjs.map
|
|
297
|
+
//# sourceMappingURL=panel.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/panel-bridge.ts","../../src/bureau-sessions/panel.ts"],"names":[],"mappings":";;;;;;AAqCO,SAAS,kBAAkB,OAAA,EAAyB;AACzD,EAAA,OAAO,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAA,EAmDa,IAAA,CAAK,SAAA,CAAU,OAAO,CAAC,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAAA,CAAA;AAyF7C;;;ACrKO,IAAM,oBAAA,GAAuB,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuDlC,iBAAA,CAAkB,4BAA4B,CAAC;;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAA","file":"panel.mjs","sourcesContent":["/**\n * Shared MCP Apps client bridge for agentproto panels.\n *\n * One spec-correct copy of the JSON-RPC-over-postMessage bridge that every\n * ui:// panel embeds in its <script> block. Mirrors the behaviour of\n * @agstudio/mcp-apps' mcpAppClientScript() — which we cannot import here:\n * agentproto is a standalone pnpm workspace with no @agstudio/* dependency\n * (same isolation invariant as mcp-apps-adapter.ts).\n *\n * Handshake (MCP Apps ext spec 2026-01-26, ext-apps McpUiInitializeRequest):\n * params REQUIRE `appInfo` (Implementation: {name, version}),\n * `appCapabilities`, and `protocolVersion`. Sending `clientInfo` instead\n * of `appInfo` fails the host's schema validation — hosts either reply\n * with an error or silently drop the request, so the panel's initBridge()\n * promise never resolves and the panel renders blank while every\n * server-side surface (tools, resources) works. That exact bug shipped in\n * 4 copy-pasted bridges; this module is the single corrected source.\n *\n * The script defines, in panel scope:\n * post / rpcRequest / rpcNotify — raw JSON-RPC plumbing\n * onHostNotification(cb) — subscribe to host-pushed\n * notifications (method, params)\n * initBridge() — ui/initialize → ui/notifications/initialized\n * callTool(name, args) — tools/call + JSON text unwrap\n * getHostContext() / onHostContext(cb) — host context (displayMode, theme, …),\n * captured from the initialize result and\n * merged on ui/notifications/host-context-changed\n * requestDisplayMode(mode) — ui/request-display-mode (inline|fullscreen|pip)\n *\n * Display-mode toggle: the bridge also injects two floating buttons\n * (fullscreen + pip) in the top-right corner of every panel, shown only for\n * the modes the host actually advertises via hostContext.availableDisplayModes\n * — same pattern as guilde's canvas.app.ts canvasShellHtml() (the reference\n * implementation that renders correctly in Claude hosts). No auto-request:\n * panels stay inline until the user clicks.\n */\n\nexport function panelBridgeScript(appName: string): string {\n return `// ── MCP Apps bridge (shared: panel-bridge.ts) ──\n// JSON-RPC 2.0 over window.parent.postMessage · spec 2026-01-26\nvar _nextId = 1, _pending = {}, _notifyHandlers = [];\nvar _hostContext = null, _hostContextHandlers = [];\nfunction post(msg){ window.parent.postMessage(msg, '*'); }\nfunction getHostContext(){ return _hostContext; }\nfunction onHostContext(cb){\n _hostContextHandlers.push(cb);\n // Replay the last context so a late subscriber isn't stuck blind.\n if (_hostContext){ try { cb(_hostContext); } catch(_) {} }\n}\nfunction _setHostContext(ctx){\n if (!ctx || typeof ctx !== 'object') return;\n // ui/notifications/host-context-changed carries only the changed keys —\n // merge, matching the official ext-apps App behaviour.\n _hostContext = Object.assign({}, _hostContext || {}, ctx);\n for (var i = 0; i < _hostContextHandlers.length; i++){\n try { _hostContextHandlers[i](_hostContext); } catch(_) {}\n }\n}\nfunction rpcRequest(method, params){\n return new Promise(function(resolve, reject){\n var id = _nextId++;\n _pending[id] = {resolve: resolve, reject: reject};\n post({jsonrpc: '2.0', id: id, method: method, params: params || {}});\n });\n}\nfunction rpcNotify(method, params){ post({jsonrpc: '2.0', method: method, params: params || {}}); }\nfunction onHostNotification(cb){ _notifyHandlers.push(cb); }\nwindow.addEventListener('message', function(evt){\n var msg = evt.data;\n if (!msg || typeof msg !== 'object' || msg.jsonrpc !== '2.0') return;\n if (msg.id != null && msg.method == null){\n var p = _pending[msg.id];\n if (!p) return;\n delete _pending[msg.id];\n if (msg.error) p.reject(new Error(msg.error.message || ('rpc error ' + msg.error.code)));\n else p.resolve(msg.result);\n return;\n }\n if (msg.method){\n if (msg.method === 'ui/notifications/host-context-changed'){\n _setHostContext(msg.params || {});\n }\n for (var i = 0; i < _notifyHandlers.length; i++){\n try { _notifyHandlers[i](msg.method, msg.params || {}); } catch(_) {}\n }\n }\n});\nfunction initBridge(){\n return rpcRequest('ui/initialize', {\n appInfo: {name: ${JSON.stringify(appName)}, version: '0.1.0'},\n appCapabilities: {availableDisplayModes: ['inline', 'fullscreen', 'pip']},\n protocolVersion: '2026-01-26'\n }).then(function(result){\n // The initialize result carries the initial hostContext (displayMode +\n // availableDisplayModes) — capture it before notifying the host.\n if (result && result.hostContext) _setHostContext(result.hostContext);\n rpcNotify('ui/notifications/initialized', {});\n });\n}\nfunction requestDisplayMode(mode){\n return rpcRequest('ui/request-display-mode', {mode: mode});\n}\nfunction callTool(name, args){\n return rpcRequest('tools/call', {name: name, arguments: args || {}}).then(function(result){\n if (result.isError){\n var e = (result.content && result.content[0] && result.content[0].text) || 'tool error';\n throw new Error(e);\n }\n var text = (result.content && result.content[0] && result.content[0].text) || '{}';\n return JSON.parse(text);\n });\n}\n\n// ── Display-mode toggle buttons (NO auto-request) ──────────────────────\n// Injected by the shared bridge so every panel gets them without touching\n// its own markup. Mirrors guilde canvas.app.ts canvasShellHtml(): the\n// panel stays inline by default; the user expands on demand. Buttons only\n// appear for modes the host advertises in hostContext.availableDisplayModes.\n(function(){\n function mount(){\n var style = document.createElement('style');\n style.textContent = '#dm,#pin{display:none;position:fixed;top:8px;z-index:10;'\n + 'border:1px solid #d0d0d0;background:#fff;color:#1a1a1a;'\n + 'font:600 13px/1 system-ui,sans-serif;padding:7px 12px;border-radius:6px;'\n + 'cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18)}'\n + '#dm{right:8px}#pin{right:118px}'\n + '#dm:hover,#pin:hover{background:#f2f2f2;border-color:#b0b0b0}'\n + '@media (prefers-color-scheme:dark){'\n + '#dm,#pin{border-color:#555;background:#2a2a2a;color:#f0f0f0;box-shadow:0 1px 4px rgba(0,0,0,.5)}'\n + '#dm:hover,#pin:hover{background:#333;border-color:#777}}';\n document.head.appendChild(style);\n\n var btn = document.createElement('button');\n btn.id = 'dm'; btn.type = 'button'; btn.title = \"Basculer l'affichage\";\n var pin = document.createElement('button');\n pin.id = 'pin'; pin.type = 'button'; pin.title = 'Épingler sur le côté (pip)';\n document.body.appendChild(pin);\n document.body.appendChild(btn);\n\n function has(avail, m){ return !!avail && avail.indexOf(m) >= 0; }\n\n // Re-sync button visibility + label from the current host context.\n function syncBtn(ctx){\n ctx = ctx || {};\n var avail = ctx.availableDisplayModes;\n // Diagnostic: what does THIS host actually advertise? (inline/fullscreen/pip)\n console.log('[mcp-app] displayMode=', ctx.displayMode,\n 'availableDisplayModes=', avail);\n\n // Fullscreen toggle button.\n if (has(avail, 'fullscreen')){\n btn.style.display = 'block';\n btn.textContent = (ctx.displayMode === 'fullscreen') ? '⤡ Réduire' : '⤢ Agrandir';\n } else { btn.style.display = 'none'; }\n\n // Dedicated pip (\"pinned on side\") button — only if the host advertises pip.\n if (has(avail, 'pip')){\n pin.style.display = 'block';\n pin.textContent = (ctx.displayMode === 'pip') ? '⤡ Détacher' : '📌 Épingler';\n } else { pin.style.display = 'none'; }\n }\n\n onHostContext(syncBtn);\n\n btn.addEventListener('click', function(){\n var ctx = getHostContext() || {};\n var inPanel = (ctx.displayMode === 'fullscreen' || ctx.displayMode === 'pip');\n requestDisplayMode(inPanel ? 'inline' : 'fullscreen').catch(function(){});\n });\n\n pin.addEventListener('click', function(){\n var ctx = getHostContext() || {};\n requestDisplayMode(ctx.displayMode === 'pip' ? 'inline' : 'pip').catch(function(){});\n });\n }\n if (document.body) mount();\n else document.addEventListener('DOMContentLoaded', mount);\n})();`\n}\n","/**\n * HTML bundle for the agentproto \"bureau — sessions navigateur\" panel — the\n * `BUREAU_SESSIONS_HTML` served as the `ui://agentproto_bureau_sessions/view`\n * resource. Mounted via the `agentproto_bureau_sessions` tool defined in\n * ./index.ts.\n *\n * Data only — no server LLM. The whole bundle is inline (zero CDN).\n */\n\nimport { panelBridgeScript } from \"../panel-bridge.js\"\n\n// ── HTML bundle (zero CDN, CSP-safe inline) ──────────────────────────────────\n\nexport const BUREAU_SESSIONS_HTML = `<!DOCTYPE html>\n<html lang=\"fr\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>bureau — sessions navigateur</title>\n<style>\n*{box-sizing:border-box;margin:0;padding:0}\n:root{\n --bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;\n --text:#e6edf3;--text2:#8b949e;\n --green:#3fb950;--yellow:#d29922;--red:#f85149;--blue:#58a6ff;--purple:#bc8cff;\n}\n*{box-sizing:border-box}\nhtml,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;font-size:13px;background:var(--bg);color:var(--text);overflow:hidden}\n#app{display:flex;flex-direction:column;height:100%}\n#hdr{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--bg2);flex-shrink:0}\n#hdr h1{font-size:13px;font-weight:600}\n#hdr .sub{font-size:11px;color:var(--text2);margin-top:2px}\n#refresh-btn{background:none;border:none;cursor:pointer;color:var(--text2);font-size:16px;line-height:1;padding:4px 6px;border-radius:6px}\n#refresh-btn:hover{color:var(--text);background:var(--bg3)}\n#list{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}\n.row{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:11px 14px;display:flex;align-items:center;gap:14px}\n.icon{font-size:20px;flex-shrink:0}\n.body{flex:1;min-width:0}\n.r1{display:flex;align-items:center;gap:8px}\n.adapter{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.url{font-family:Menlo,Monaco,'Courier New',monospace;font-size:11.5px;color:var(--blue);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.meta{font-size:10.5px;color:var(--text2);margin-top:3px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}\n.dot{width:5px;height:5px;border-radius:50%;background:var(--text2);display:inline-block}\n.badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:11px;white-space:nowrap}\n.br{background:rgba(63,185,80,.16);color:var(--green)}\n.bs{background:rgba(88,166,255,.16);color:var(--blue)}\n.bk{background:rgba(248,81,73,.14);color:var(--red)}\n.be{background:rgba(139,148,158,.14);color:var(--text2)}\n.berr{background:rgba(248,81,73,.22);color:var(--red)}\n.port{font-family:Menlo,Monaco,'Courier New',monospace}\n#empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text2);gap:8px;padding:48px;text-align:center}\n#empty .ico{font-size:30px}\n#statusbar{padding:5px 16px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0}\n</style>\n</head>\n<body>\n<div id=\"app\">\n <div id=\"hdr\">\n <div>\n <h1>Bureau — sessions navigateur</h1>\n <div class=\"sub\">services navigateur actifs · URL / port / statut</div>\n </div>\n <button id=\"refresh-btn\" title=\"Rafraîchir\" onclick=\"doRefresh()\">↻</button>\n </div>\n <div id=\"list\"><div id=\"empty\"><div class=\"ico\">🌐</div><div>Connexion au bridge…</div></div></div>\n <div id=\"statusbar\">Connexion…</div>\n</div>\n<script>\n${panelBridgeScript(\"agentproto-bureau-sessions\")}\n\n// ── State ──\nvar REFRESH_MS = 5000;\nvar pollTimer = null, polling = false;\nfunction esc(s){ return String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>'); }\nfunction setStatus(m){ document.getElementById('statusbar').textContent = m; }\n\nfunction badgeClass(st){\n if (st === 'running') return 'br';\n if (st === 'starting') return 'bs';\n if (st === 'killed') return 'bk';\n if (st === 'error') return 'berr';\n return 'be';\n}\nfunction fmtUptime(iso, end){\n if (!iso) return '';\n var start = Date.parse(iso);\n if (isNaN(start)) return '';\n var ref = end ? Date.parse(end) : Date.now();\n var s = Math.max(0, Math.round((ref - start) / 1000));\n if (s < 60) return s + 's';\n var m = Math.floor(s/60), rs = s%60;\n if (m < 60) return m + 'm ' + rs + 's';\n var h = Math.floor(m/60), rm = m%60;\n return h + 'h ' + rm + 'm';\n}\n\nfunction render(rows){\n var list = document.getElementById('list');\n if (!rows.length){\n list.innerHTML = '<div id=\"empty\"><div class=\"ico\">🌐</div><div>Aucune session navigateur</div></div>';\n return;\n }\n var html = '';\n for (var i=0;i<rows.length;i++){\n var s = rows[i];\n var bc = badgeClass(s.status);\n var url = s.browserBaseUrl || (s.browserPort ? ('http://127.0.0.1:' + s.browserPort) : '');\n var adapter = s.browserAdapterId || s.label || s.name || 'navigateur';\n var up = fmtUptime(s.startedAt, s.endedAt);\n html += '<div class=\"row\">'\n + '<div class=\"icon\">🌐</div>'\n + '<div class=\"body\">'\n + '<div class=\"r1\"><span class=\"adapter\">' + esc(adapter) + '</span>'\n + '<span class=\"badge ' + bc + '\">' + esc(s.status || '') + '</span></div>'\n + (url ? '<div class=\"url\">' + esc(url) + '</div>' : '')\n + '<div class=\"meta\">'\n + (s.browserPort ? '<span>port <span class=\"port\">' + esc(s.browserPort) + '</span></span><span class=\"dot\"></span>' : '')\n + '<span>' + (up ? 'uptime ' + esc(up) : '') + '</span>'\n + '</div>'\n + '</div>'\n + '</div>';\n }\n list.innerHTML = html;\n}\n\nfunction loadAndRender(){\n return callTool('session_list', {kind:'all'}).then(function(data){\n var all = data.sessions || [];\n var browsers = all.filter(function(s){ return s.kind === 'browser'; });\n render(browsers);\n setStatus(browsers.length + ' session' + (browsers.length===1?'':'s') + ' · ' + new Date().toLocaleTimeString('fr-FR'));\n }).catch(function(e){ setStatus('Erreur : ' + e.message); });\n}\n\nfunction doPoll(){\n if (polling) return;\n polling = true;\n loadAndRender().then(function(){\n polling = false;\n pollTimer = setTimeout(doPoll, REFRESH_MS);\n }).catch(function(){\n polling = false;\n pollTimer = setTimeout(doPoll, REFRESH_MS);\n });\n}\nfunction doRefresh(){ if (pollTimer) clearTimeout(pollTimer); return loadAndRender().then(function(){ pollTimer = setTimeout(doPoll, REFRESH_MS); }); }\n\ninitBridge().then(loadAndRender).then(function(){\n pollTimer = setTimeout(doPoll, REFRESH_MS);\n}).catch(function(e){\n setStatus('Bridge : ' + e.message);\n document.getElementById('list').innerHTML = '<div id=\"empty\"><div class=\"ico\">⚠</div><div>Échec connexion bridge : ' + esc(e.message) + '</div></div>';\n});\n</script>\n</body>\n</html>`\n"]}
|