| <!DOCTYPE html>
|
| <html lang="en">
|
| <head>
|
| <meta charset="UTF-8">
|
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| <title>β‘ Chronos WebLLM Agent</title>
|
| <script src="/coi-serviceworker.min.js"></script>
|
| <link rel="preconnect" href="https://fonts.googleapis.com">
|
| <link href="https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Orbitron:wght@400;700;900&family=VT323&display=swap" rel="stylesheet">
|
| <style>
|
| :root{--bg:#080b08;--bg2:#0c100c;--bg3:#111611;--bg4:#161e16;--fg:#3dff70;--fg-dim:#1c8038;--fg-faint:#0b2e16;--amber:#ffbb33;--cyan:#33f0ff;--red:#ff3355;--border:#1a2e1a;--glow:0 0 8px #3dff7066,0 0 24px #3dff7022;--scan:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px)}
|
| *{box-sizing:border-box;margin:0;padding:0}
|
| html,body{height:100%;background:var(--bg);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:13px;overflow:hidden}
|
| body::before{content:'';position:fixed;inset:0;background:var(--scan);pointer-events:none;z-index:9999;opacity:.3}
|
| body::after{content:'';position:fixed;inset:0;background:radial-gradient(ellipse at center,transparent 55%,#000b 100%);pointer-events:none;z-index:9998}
|
|
|
| #setup-banner{position:fixed;inset:0;background:#000000ee;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px}
|
| #setup-banner.hidden{display:none}
|
| .sbox{background:var(--bg2);border:1px solid var(--amber);max-width:580px;width:100%;font-size:12px;line-height:1.7}
|
| .sbox h1{font-family:'Orbitron',sans-serif;font-size:13px;color:var(--amber);padding:14px 18px;border-bottom:1px solid var(--border);letter-spacing:2px}
|
| .sbox .bd{padding:16px 18px;color:var(--fg-dim)}
|
| .sbox code{color:var(--cyan);background:var(--bg3);padding:1px 5px}
|
| .cmd-row{background:var(--bg3);border:1px solid var(--border);padding:10px 14px;margin:8px 0;color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:12px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
|
| .cmd-row:hover{border-color:var(--fg-dim)}
|
| .copy-hint{font-size:10px;color:var(--fg-faint)}
|
| .sbtn-main{width:100%;background:var(--fg-faint);border:none;border-top:1px solid var(--border);color:var(--fg);font-family:'Orbitron',sans-serif;font-size:10px;letter-spacing:2px;padding:12px;cursor:pointer;transition:all .2s}
|
| .sbtn-main:hover{background:var(--fg);color:var(--bg)}
|
|
|
| /* LAYOUT β input row inside chat col, 2-row grid */
|
| #app{display:grid;grid-template-rows:44px 1fr;grid-template-columns:300px 1fr 240px;height:100vh;gap:1px;background:var(--border)}
|
| @media(max-width:1100px){#app{grid-template-columns:240px 1fr}#rpanel{display:none}}
|
| @media(max-width:768px){#app{grid-template-columns:1fr}#sidebar,#rpanel{display:none}}
|
|
|
| #hdr{grid-column:1/-1;background:var(--bg2);display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--border)}
|
| .logo{font-family:'Orbitron',sans-serif;font-weight:900;font-size:16px;color:var(--fg);text-shadow:var(--glow);letter-spacing:2px;display:flex;align-items:center;gap:8px}
|
| .shrimp{font-size:20px;animation:bob 3s ease-in-out infinite}
|
| @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
|
| .hpills{display:flex;gap:8px;align-items:center}
|
| .hpill{font-size:9px;letter-spacing:1px;padding:3px 8px;border:1px solid var(--border);color:var(--fg-dim);font-family:'Orbitron',sans-serif}
|
| .dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 5px var(--red);display:inline-block;margin-right:5px;transition:all .3s}
|
| .dot.ready{background:var(--fg);box-shadow:0 0 6px var(--fg);animation:pulse 2s infinite}
|
| @keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
|
|
|
| #sidebar{background:var(--bg2);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}
|
| #sidebar::-webkit-scrollbar{width:2px}
|
| #sidebar::-webkit-scrollbar-thumb{background:var(--fg-dim)}
|
| .stitle{font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:3px;color:var(--fg-dim);padding:7px 10px 5px;border-bottom:1px solid var(--border);text-transform:uppercase;background:var(--bg3);flex-shrink:0}
|
| .sbody{padding:8px 10px;border-bottom:1px solid var(--border)}
|
| select.ctrl{width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:10px;padding:5px 7px;outline:none;cursor:pointer;appearance:none;margin-bottom:4px}
|
| select.ctrl option{background:var(--bg2)}
|
| .btn{width:100%;background:transparent;border:1px solid var(--fg-dim);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:11px;padding:6px;cursor:pointer;letter-spacing:1px;transition:all .2s;margin-top:3px}
|
| .btn:hover:not(:disabled){background:var(--fg-faint);border-color:var(--fg);box-shadow:var(--glow)}
|
| .btn:disabled{opacity:.35;cursor:not-allowed}
|
| .bxs{background:transparent;border:1px solid var(--border);color:var(--fg-dim);font-family:'Share Tech Mono',monospace;font-size:9px;padding:2px 7px;cursor:pointer;transition:all .2s}
|
| .bxs:hover{border-color:var(--fg-dim);color:var(--fg)}
|
| .meta{font-size:9px;color:var(--fg-dim);margin:3px 0}
|
|
|
| #prog{margin-top:5px;display:none}
|
| #prog.vis{display:block}
|
| #ptrack{width:100%;height:3px;background:var(--bg3);border:1px solid var(--border)}
|
| #pfill{height:100%;background:var(--fg);width:0%;transition:width .3s;box-shadow:var(--glow)}
|
| #ptxt{font-size:9px;color:var(--fg-dim);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
|
|
|
| .frow{display:flex;align-items:center;gap:5px;padding:3px 0;font-size:11px}
|
| .fname{color:var(--cyan);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
| .fname.ok{color:var(--fg)}
|
| .fbadge{font-size:9px;color:var(--fg-dim);min-width:44px;text-align:right}
|
| input[type=file]{display:none}
|
| .chips{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px;min-height:18px}
|
| .chip{font-size:9px;color:var(--cyan);border:1px solid var(--fg-faint);padding:2px 6px;display:flex;align-items:center;gap:4px}
|
| .chip .rm{cursor:pointer;color:var(--red);font-size:12px;line-height:1}
|
|
|
| #mem-panel{overflow:hidden;display:flex;flex-direction:column;max-height:160px}
|
| #mem-view{flex:1;overflow-y:auto;padding:8px 10px;font-size:9px;color:var(--fg-dim);line-height:1.55;white-space:pre-wrap;word-break:break-word}
|
| #mem-view::-webkit-scrollbar{width:2px}
|
| #mem-view::-webkit-scrollbar-thumb{background:var(--fg-dim)}
|
|
|
| /* CHAT β input row lives inside here now */
|
| #chat{background:var(--bg);display:flex;flex-direction:column;overflow:hidden;position:relative}
|
| #chat-hdr{padding:6px 14px;border-bottom:1px solid var(--border);background:var(--bg2);display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--fg-dim);flex-shrink:0}
|
| #msgs{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
|
| #msgs::-webkit-scrollbar{width:3px}
|
| #msgs::-webkit-scrollbar-thumb{background:var(--fg-dim)}
|
|
|
| #irow{background:var(--bg2);border-top:1px solid var(--border);display:flex;align-items:stretch;flex-shrink:0}
|
| .ipfx{padding:0 10px;color:var(--fg);font-size:15px;font-family:'VT323',monospace;opacity:.6;user-select:none;display:flex;align-items:center}
|
| #uin{flex:1;background:transparent;border:none;color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:14px;padding:12px 10px;resize:vertical;outline:none;line-height:1.5;min-height:40px;max-height:300px}
|
| #uin::placeholder{color:var(--fg-faint)}
|
| #uin:disabled{opacity:.5}
|
| #sbtn{width:72px;background:transparent;border:none;border-left:1px solid var(--border);color:var(--fg-dim);font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:2px;cursor:pointer;transition:all .15s}
|
| #sbtn:hover:not(:disabled){background:var(--fg-faint);color:var(--fg)}
|
| #sbtn:disabled{opacity:.3;cursor:not-allowed}
|
| #stopbtn{display:none;width:72px;background:transparent;border:none;border-left:1px solid var(--red);color:var(--red);font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:1px;cursor:pointer}
|
|
|
| .mwrap{display:flex;gap:10px;animation:fi .2s ease}
|
| @keyframes fi{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
|
| .mrole{font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:2px;width:50px;flex-shrink:0;padding-top:2px;text-align:right}
|
| .mwrap.user .mrole{color:var(--amber)}
|
| .mwrap.agent .mrole{color:var(--fg)}
|
| .mwrap.sys .mrole{color:var(--fg-dim)}
|
| .mbody{flex:1;line-height:1.65;font-size:12px}
|
| .mwrap.user .mbody{color:var(--amber)}
|
| .mwrap.sys .mbody{color:var(--fg-dim);font-size:11px;font-style:italic}
|
|
|
| .think{border-left:2px solid var(--fg-faint);padding:4px 0 4px 8px;margin-bottom:6px}
|
| .think-hdr{font-size:10px;color:var(--fg-dim);display:flex;align-items:center;gap:5px;cursor:pointer;user-select:none;padding:2px 0}
|
| .think-hdr:hover{color:var(--fg)}
|
| .think-body{font-size:10px;color:var(--fg-dim);margin-top:3px;white-space:pre-wrap;line-height:1.5;max-height:0;overflow:hidden;transition:max-height .3s}
|
| .think.open .think-body{max-height:600px}
|
| .think-toggle{font-size:9px;color:var(--fg-faint);margin-left:auto}
|
|
|
| .tcard{border:1px solid var(--border);margin-bottom:6px}
|
| .tcard-hdr{background:var(--bg3);padding:5px 8px;display:flex;align-items:center;gap:6px;font-size:10px;cursor:pointer}
|
| .tname{color:var(--amber);font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:2px}
|
| .tparams{color:var(--fg-dim);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}
|
| .tspin{animation:spin .7s linear infinite;display:inline-block}
|
| @keyframes spin{to{transform:rotate(360deg)}}
|
| .tres{padding:6px 8px;font-size:10px;color:var(--fg-dim);max-height:130px;overflow-y:auto;white-space:pre-wrap;line-height:1.4;border-top:1px solid var(--border);background:var(--bg);display:none}
|
| .tres.vis{display:block}
|
| .ttog{font-size:9px;color:var(--fg-faint);padding:0 4px}
|
|
|
| .answer{color:var(--fg);white-space:pre-wrap;line-height:1.7;font-size:12px}
|
| .answer pre{background:var(--bg3);border:1px solid var(--border);padding:8px;margin:6px 0;overflow-x:auto;color:var(--cyan);font-size:10px}
|
| .answer code{background:var(--bg3);color:var(--cyan);padding:1px 4px}
|
| .answer strong{color:var(--amber)}
|
| .answer em{color:var(--fg-dim);font-style:italic}
|
| .answer h1{color:var(--fg);font-size:15px;font-family:'Orbitron',sans-serif;margin:8px 0 4px}
|
| .answer h2{color:var(--fg);font-size:13px;font-family:'Orbitron',sans-serif;margin:6px 0 3px}
|
| .answer h3{color:var(--amber);font-size:11px;margin:5px 0 2px}
|
| .answer ul,.answer ol{padding-left:16px;color:var(--fg-dim)}
|
| .cur{display:inline-block;width:7px;height:12px;background:var(--fg);animation:blink 1s step-end infinite;vertical-align:middle;margin-left:2px}
|
| @keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
|
|
|
| /* RIGHT PANEL */
|
| #rpanel{background:var(--bg2);display:flex;flex-direction:column;overflow:hidden}
|
| .sblk{padding:8px 10px;border-bottom:1px solid var(--border)}
|
| .slbl{font-size:8px;letter-spacing:2px;color:var(--fg-dim);font-family:'Orbitron',sans-serif;margin-bottom:3px}
|
| .sval{font-family:'VT323',monospace;font-size:26px;color:var(--fg);text-shadow:var(--glow);line-height:1}
|
| .su{font-size:11px;color:var(--fg-dim);margin-left:2px}
|
| canvas#spark{width:100%;height:28px;display:block}
|
| #alog{flex:1;overflow-y:auto;padding:8px 10px;font-size:9px;color:var(--fg-dim);line-height:1.8}
|
| #alog::-webkit-scrollbar{width:2px}
|
| #alog::-webkit-scrollbar-thumb{background:var(--fg-dim)}
|
| .ll{border-left:2px solid var(--fg-faint);padding-left:5px;margin-bottom:3px}
|
| .ll.g{border-color:var(--fg);color:var(--fg)}
|
| .ll.w{border-color:var(--amber);color:var(--amber)}
|
| .ll.e{border-color:var(--red);color:var(--red)}
|
| .ll.t{border-color:var(--cyan);color:var(--cyan)}
|
|
|
| /* WELCOME */
|
| #welcome{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--bg);text-align:center;padding:20px;z-index:10;transition:opacity .5s}
|
| #welcome.gone{opacity:0;pointer-events:none}
|
| .wlogo{font-family:'VT323',monospace;font-size:60px;color:var(--fg);text-shadow:0 0 16px #3dff70aa,0 0 48px #3dff7033;line-height:1;animation:flicker 10s infinite}
|
| @keyframes flicker{0%,100%{opacity:1}91%{opacity:1}92%{opacity:.6}93%{opacity:1}96%{opacity:.85}97%{opacity:1}}
|
| .wsub{font-family:'Orbitron',sans-serif;font-size:9px;letter-spacing:4px;color:var(--fg-dim)}
|
| .wbox{max-width:400px;font-size:11px;color:var(--fg-dim);line-height:1.7;border:1px solid var(--border);padding:14px;text-align:left}
|
| .wbox b{color:var(--fg)}.wbox code{color:var(--cyan)}
|
| .whint{font-size:10px;color:var(--fg-faint);animation:wh 2s ease-in-out infinite}
|
| @keyframes wh{0%,100%{opacity:.3}50%{opacity:.8}}
|
|
|
| /* MODAL */
|
| #modal{display:none;position:fixed;inset:0;background:#000c;z-index:10000;align-items:center;justify-content:center}
|
| #modal.vis{display:flex}
|
| .modal-box{background:var(--bg2);border:1px solid var(--border);width:600px;max-width:92vw;max-height:82vh;display:flex;flex-direction:column}
|
| .modal-hdr{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
|
| .modal-hdr span{font-family:'Orbitron',sans-serif;font-size:10px;letter-spacing:2px;color:var(--fg)}
|
| .modal-hdr button{background:none;border:none;color:var(--fg-dim);cursor:pointer;font-size:18px}
|
| .modal-hdr button:hover{color:var(--fg)}
|
| #modal-area{flex:1;background:var(--bg3);border:none;color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:11px;padding:12px;resize:none;outline:none;min-height:280px;line-height:1.6;overflow-y:auto}
|
| .modal-ftr{padding:8px 14px;border-top:1px solid var(--border);display:flex;gap:8px}
|
|
|
| /* βββ CONSOLE LOG POPUP βββ */
|
| #console-popup{display:none;position:fixed;bottom:0;right:0;width:55vw;max-width:800px;height:50vh;background:rgba(8,11,8,.92);border:1px solid var(--cyan);border-bottom:none;z-index:10001;flex-direction:column;font-family:'Share Tech Mono',monospace;font-size:10px;backdrop-filter:blur(6px)}
|
| #console-popup.vis{display:flex}
|
| .cp-hdr{padding:6px 10px;background:var(--bg3);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
|
| .cp-hdr span{font-family:'Orbitron',sans-serif;font-size:8px;letter-spacing:2px;color:var(--cyan)}
|
| .cp-body{flex:1;overflow-y:auto;padding:6px 10px}
|
| .cp-body::-webkit-scrollbar{width:2px}
|
| .cp-body::-webkit-scrollbar-thumb{background:var(--cyan)}
|
| .clog-line{padding:1px 0;border-bottom:1px solid #0a150a;white-space:pre-wrap;word-break:break-all}
|
| .clog-line.log{color:var(--fg-dim)}
|
| .clog-line.warn{color:var(--amber)}
|
| .clog-line.error{color:var(--red)}
|
| .clog-line.info{color:var(--cyan)}
|
|
|
| /* βββ COMMAND PALETTE (Arrow Up) βββ */
|
| #cmd-palette{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:480px;max-width:90vw;max-height:60vh;background:var(--bg2);border:1px solid var(--fg);z-index:10002;flex-direction:column}
|
| #cmd-palette.vis{display:flex}
|
| #cmd-palette input{background:var(--bg3);border:none;border-bottom:1px solid var(--border);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:13px;padding:10px 14px;outline:none}
|
| .cp-list{flex:1;overflow-y:auto;max-height:300px}
|
| .cp-item{padding:8px 14px;cursor:pointer;font-size:11px;color:var(--fg-dim);border-bottom:1px solid var(--border);display:flex;gap:8px;align-items:center}
|
| .cp-item:hover,.cp-item.sel{background:var(--fg-faint);color:var(--fg)}
|
| .cp-badge{font-size:8px;color:var(--amber);font-family:'Orbitron',sans-serif;letter-spacing:1px;min-width:50px}
|
|
|
| /* βββ TOAST NOTIFICATIONS βββ */
|
| #toast-area{position:fixed;top:50px;left:50%;transform:translateX(-50%);z-index:10003;display:flex;flex-direction:column;gap:8px;pointer-events:none;align-items:center}
|
| .toast{background:var(--bg2);border:2px solid var(--amber);padding:14px 24px;font-size:14px;color:var(--amber);animation:toastin .4s ease;pointer-events:auto;max-width:500px;min-width:250px;text-align:center;box-shadow:0 0 20px rgba(255,187,51,.3),0 0 60px rgba(255,187,51,.1);font-family:'Orbitron',sans-serif;letter-spacing:1px}
|
| .toast.fade{opacity:0;transition:opacity .4s}
|
| @keyframes toastin{from{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:none}}
|
|
|
| /* βββ NETWORK / SCHEDULER sidebar βββ */
|
| .net-item{font-size:9px;color:var(--fg-dim);padding:2px 0;display:flex;justify-content:space-between}
|
| .net-item .ni-url{color:var(--cyan)}
|
| .net-item .ni-status{min-width:30px;text-align:right}
|
| .net-item .ni-status.ok{color:var(--fg)}
|
| .net-item .ni-status.fail{color:var(--red)}
|
|
|
| /* βββ RAG PANEL βββ */
|
| #rag-panel .rag-stats{font-size:9px;color:var(--fg-dim);margin-bottom:4px;line-height:1.6}
|
| #rag-panel .rag-stats .rag-val{color:var(--cyan)}
|
| #rag-text{width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:10px;padding:5px 7px;resize:vertical;outline:none;min-height:50px;max-height:120px;margin-bottom:4px}
|
| #rag-text::placeholder{color:var(--fg-faint)}
|
| #rag-query{width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:10px;padding:5px 7px;outline:none;margin-bottom:4px}
|
| #rag-query::placeholder{color:var(--fg-faint)}
|
| #rag-results{max-height:140px;overflow-y:auto;font-size:9px;color:var(--fg-dim);line-height:1.5;margin-top:4px}
|
| #rag-results::-webkit-scrollbar{width:2px}
|
| #rag-results::-webkit-scrollbar-thumb{background:var(--fg-dim)}
|
| .rag-passage{border-left:2px solid var(--cyan);padding:3px 6px;margin-bottom:4px;background:var(--bg3)}
|
| .rag-passage .rag-score{font-size:8px;color:var(--amber);font-family:'Orbitron',sans-serif;letter-spacing:1px}
|
| .rag-passage .rag-text{color:var(--fg-dim);margin-top:2px;white-space:pre-wrap;word-break:break-word}
|
| .rag-source-chip{display:inline-block;font-size:8px;color:var(--fg);border:1px solid var(--fg-faint);padding:1px 5px;margin:1px;background:var(--bg3)}
|
| .rag-btn-row{display:flex;gap:4px;margin-bottom:4px;flex-wrap:wrap}
|
|
|
| .sched-item{font-size:10px;color:var(--fg-dim);padding:4px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
|
| .sched-item .si-msg{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--amber);font-weight:bold}
|
| .sched-item .si-time{min-width:60px;text-align:right;color:var(--cyan);font-size:9px;font-family:'Orbitron',sans-serif}
|
| .sched-item .si-rm{cursor:pointer;color:var(--red);margin-left:6px;font-size:13px}
|
| </style>
|
| </head>
|
| <body>
|
|
|
|
|
| <div id="setup-banner">
|
| <div class="sbox">
|
| <h1>β SETUP REQUIRED β CAN'T OPEN AS file://</h1>
|
| <div class="bd">
|
| WebLLM needs <code>SharedArrayBuffer</code> (WebAssembly threads).<br>
|
| Browsers block this on <code>file://</code> β serve via <b>localhost HTTP</b> instead:<br><br>
|
| <b style="color:var(--fg)">Run proxy.py (recommended):</b>
|
| <div class="cmd-row" onclick="copyCmd(this)">
|
| <span>python proxy.py 8080</span>
|
| <span class="copy-hint">click to copy</span>
|
| </div>
|
| Then open: <code>http://127.0.0.1:8080/test.html</code><br><br>
|
| <span style="font-size:10px;color:var(--fg-faint)">
|
| proxy.py serves files + adds COOP/COEP headers + provides CORS proxy for search/scrape.
|
| </span>
|
| </div>
|
| <button class="sbtn-main" onclick="document.getElementById('setup-banner').classList.add('hidden')">DISMISS β I'VE SERVED IT β</button>
|
| </div>
|
| </div>
|
|
|
| <div id="app">
|
| <header id="hdr">
|
| <div class="logo"><span class="shrimp">β‘</span>CHRONOS <span style="color:var(--fg-dim);font-size:9px;font-weight:400;letter-spacing:1px">WEBLLM AGENT</span></div>
|
| <div class="hpills">
|
| <span class="hpill"><span class="dot" id="mdot"></span><span id="mstatus">NO MODEL</span></span>
|
| <span class="hpill" id="iter-p" style="color:var(--fg-dim)">ITER 0</span>
|
| <span class="hpill" id="iso-p">ISO:?</span>
|
| <span class="hpill" style="cursor:pointer;color:var(--cyan)" onclick="toggleConsole()" title="Ctrl+` β toggle console log">CON</span>
|
| </div>
|
| </header>
|
|
|
| <aside id="sidebar">
|
| <div class="stitle">β Model</div>
|
| <div class="sbody">
|
| <select class="ctrl" id="msel"></select>
|
| <div class="meta" id="mmeta">β</div>
|
| <button class="btn" id="lbtn">βΆ LOAD MODEL</button>
|
| <div id="prog"><div id="ptrack"><div id="pfill"></div></div><div id="ptxt">β¦</div></div>
|
| </div>
|
|
|
| <div class="stitle">π Memory Files</div>
|
| <div class="sbody">
|
| <div class="frow"><span class="fname" id="soul-n">soul.md</span><span class="fbadge" id="soul-b">default</span><button class="bxs" onclick="triggerFile('soul')">LOAD</button><button class="bxs" onclick="openEdit('soul')">EDIT</button><input type="file" id="soul-f" accept=".md,.txt"></div>
|
| <div class="frow"><span class="fname" id="user-n">user.md</span><span class="fbadge" id="user-b">default</span><button class="bxs" onclick="triggerFile('user')">LOAD</button><button class="bxs" onclick="openEdit('user')">EDIT</button><input type="file" id="user-f" accept=".md,.txt"></div>
|
| </div>
|
|
|
| <div class="stitle">β‘ Skills</div>
|
| <div class="sbody">
|
| <div class="frow" style="justify-content:space-between"><span style="font-size:10px;color:var(--fg-dim)">Dynamic skill injection</span><button class="bxs" onclick="triggerFile('skill')">+ SKILL</button><input type="file" id="skill-f" accept=".md,.txt" multiple></div>
|
| <div class="chips" id="skill-chips"></div>
|
| </div>
|
|
|
| <div class="stitle">π Settings</div>
|
| <div class="sbody">
|
| <div class="meta">BRAVE API KEY (optional β brave.com/search/api)</div>
|
| <input style="width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--fg);font-family:'Share Tech Mono',monospace;font-size:10px;padding:5px 7px;outline:none;margin-bottom:5px" type="password" id="brave-in" placeholder="BSA⦠(free, 2000 req/month)">
|
| <div style="display:flex;gap:4px"><button class="bxs" onclick="saveCfg()">SAVE</button><button class="bxs" onclick="clearUserMem()">RESET MEM</button><button class="bxs" onclick="exportAll()">EXPORT</button></div>
|
| </div>
|
|
|
| <div class="stitle">π‘ Network Scan</div>
|
| <div class="sbody" id="net-panel"><div class="meta">Click scan or use network_scan tool</div></div>
|
|
|
| <div class="stitle">β° Scheduled Tasks</div>
|
| <div class="sbody" id="sched-panel"><div class="meta">No scheduled tasks</div></div>
|
|
|
| <div class="stitle">οΏ½ Hybrid RAG</div>
|
| <div class="sbody" id="rag-panel">
|
| <div class="rag-stats">Status: <span class="rag-val" id="rag-status">no index</span> Β· Sentences: <span class="rag-val" id="rag-sent-count">0</span> Β· Terms: <span class="rag-val" id="rag-term-count">0</span></div>
|
| <textarea id="rag-text" placeholder="Paste or type text to indexβ¦" rows="3"></textarea>
|
| <div class="rag-btn-row">
|
| <button class="bxs" onclick="ragIndex()">INDEX</button>
|
| <button class="bxs" onclick="ragIndexFromScrape()">+ SCRAPED</button>
|
| <button class="bxs" onclick="ragIndexFromMemory()">+ MEMORY</button>
|
| <button class="bxs" onclick="ragClear()">CLEAR</button>
|
| </div>
|
| <div id="rag-sources" style="margin-bottom:4px"></div>
|
| <input id="rag-query" placeholder="Search queryβ¦" autocomplete="off">
|
| <div class="rag-btn-row">
|
| <button class="bxs" onclick="ragSearch()">SEARCH</button>
|
| <button class="bxs" onclick="ragInjectPrompt()">β PROMPT</button>
|
| </div>
|
| <div id="rag-results"></div>
|
| </div>
|
|
|
| <div class="stitle">οΏ½π Live Context Preview</div>
|
| <div id="mem-panel"><div id="mem-view">β Load files to see injected context</div></div>
|
| </aside>
|
|
|
| <main id="chat">
|
| <div id="chat-hdr">
|
| <span id="ctitle" style="color:var(--fg)">β‘ Chronos β ReAct Agent</span>
|
| <div style="display:flex;gap:8px;align-items:center"><button class="bxs" onclick="clearChat()">CLR</button><span id="cmeta" style="font-size:9px">0 msgs</span></div>
|
| </div>
|
| <div id="msgs"></div>
|
| <div id="welcome">
|
| <div class="wlogo">β‘<br>CHRO<br>NOS</div>
|
| <div class="wsub">FULL AGENT Β· WEBLLM EDITION</div>
|
| <div class="wbox">
|
| <b>Features:</b><br>
|
| β soul.md / user.md β persistent memory<br>
|
| β skills/*.md β dynamic injection<br>
|
| β ReAct loop: think β act β observe<br>
|
| β Tools: web_search Β· scrape Β· summarize Β· remember<br>
|
| β read_memory Β· forget Β· schedule Β· inject_js<br>
|
| β rag_index Β· rag_search Β· rag_prompt β hybrid retrieval<br>
|
| β network_scan β discover local services<br>
|
| β Ctrl+` β console log popup<br>
|
| β β Arrow β command palette<br><br>
|
| <b>β Serve with:</b> <code>python proxy.py 8080</code>
|
| </div>
|
| <div class="whint">β SELECT MODEL AND CLICK LOAD</div>
|
| </div>
|
|
|
| <div id="irow">
|
| <span class="ipfx">>_</span>
|
| <textarea id="uin" placeholder="Message Chronosβ¦ (Enter=send, Shift+Enter=newline, β=palette)" rows="1" disabled></textarea>
|
| <button id="sbtn" disabled>SEND</button>
|
| <button id="stopbtn">β STOP</button>
|
| </div>
|
| </main>
|
|
|
| <aside id="rpanel">
|
| <div class="stitle">π‘ Stats</div>
|
| <div class="sblk"><div class="slbl">TOKENS/SEC</div><div class="sval" id="s-tps">β<span class="su">t/s</span></div></div>
|
| <div class="sblk"><div class="slbl">TOTAL TOKENS</div><div class="sval" id="s-tok">0</div></div>
|
| <div class="sblk"><div class="slbl">SEARCH Β· SCRAPE</div><div class="sval"><span id="s-srch">0</span><span class="su"> Β· </span><span id="s-scr">0</span></div></div>
|
| <div class="sblk"><div class="slbl">T/S HISTORY</div><canvas id="spark" width="180" height="28"></canvas></div>
|
| <div class="stitle">π Agent Log</div>
|
| <div id="alog"></div>
|
| </aside>
|
| </div>
|
|
|
|
|
| <div id="modal">
|
| <div class="modal-box">
|
| <div class="modal-hdr"><span id="modal-title">EDIT FILE</span><button onclick="closeModal()">β</button></div>
|
| <textarea id="modal-area"></textarea>
|
| <div class="modal-ftr"><button class="btn" style="width:auto;padding:6px 20px" onclick="saveModal()">SAVE</button><button class="bxs" onclick="closeModal()">CANCEL</button><button class="bxs" onclick="exportModal()">EXPORT .MD</button></div>
|
| </div>
|
| </div>
|
|
|
|
|
| <div id="console-popup">
|
| <div class="cp-hdr">
|
| <span>CONSOLE LOG (Ctrl+`)</span>
|
| <div style="display:flex;gap:6px"><button class="bxs" onclick="clearConsoleLogs()">CLR</button><button class="bxs" onclick="toggleConsole()">β</button></div>
|
| </div>
|
| <div class="cp-body" id="cp-body"></div>
|
| </div>
|
|
|
|
|
| <div id="cmd-palette">
|
| <input id="cp-search" placeholder="Type to filter⦠(Esc to close)" autocomplete="off">
|
| <div class="cp-list" id="cp-list"></div>
|
| </div>
|
|
|
|
|
| <div id="toast-area"></div>
|
|
|
| <script>
|
| function copyCmd(el) {
|
| const t = el.querySelector('span').textContent.trim();
|
| navigator.clipboard?.writeText(t).then(() => {
|
| el.querySelector('.copy-hint').textContent = 'β copied!';
|
| setTimeout(() => el.querySelector('.copy-hint').textContent = 'click to copy', 2000);
|
| });
|
| }
|
| </script>
|
|
|
|
|
| <script>
|
| (function(){
|
| window._consoleLogs = [];
|
| var MAX = 500;
|
| var orig = { log: console.log, warn: console.warn, error: console.error, info: console.info };
|
| function capture(level, args) {
|
| var ts = new Date().toLocaleTimeString('en',{hour12:false,hour:'2-digit',minute:'2-digit',second:'2-digit',fractionalSecondDigits:3});
|
| var msg = Array.from(args).map(function(a) {
|
| if (typeof a === 'string') return a;
|
| try { return JSON.stringify(a, null, 1); } catch(_) { return String(a); }
|
| }).join(' ');
|
| window._consoleLogs.push({ ts: ts, level: level, msg: msg });
|
| if (window._consoleLogs.length > MAX) window._consoleLogs.shift();
|
|
|
| var popup = document.getElementById('console-popup');
|
| if (popup && popup.classList.contains('vis')) {
|
| var body = document.getElementById('cp-body');
|
| var d = document.createElement('div');
|
| d.className = 'clog-line ' + level;
|
| d.textContent = '[' + ts + '] ' + msg;
|
| body.appendChild(d);
|
| body.scrollTop = body.scrollHeight;
|
| while (body.children.length > MAX) body.removeChild(body.firstChild);
|
| }
|
| }
|
| console.log = function(){ capture('log', arguments); orig.log.apply(console, arguments); };
|
| console.warn = function(){ capture('warn', arguments); orig.warn.apply(console, arguments); };
|
| console.error = function(){ capture('error', arguments); orig.error.apply(console, arguments); };
|
| console.info = function(){ capture('info', arguments); orig.info.apply(console, arguments); };
|
| })();
|
|
|
| window.toggleConsole = function() {
|
| var el = document.getElementById('console-popup');
|
| if (el.classList.contains('vis')) { el.classList.remove('vis'); return; }
|
| var body = document.getElementById('cp-body');
|
| body.innerHTML = '';
|
| window._consoleLogs.forEach(function(e) {
|
| var d = document.createElement('div');
|
| d.className = 'clog-line ' + e.level;
|
| d.textContent = '[' + e.ts + '] ' + e.msg;
|
| body.appendChild(d);
|
| });
|
| el.classList.add('vis');
|
| body.scrollTop = body.scrollHeight;
|
| };
|
| window.clearConsoleLogs = function() {
|
| window._consoleLogs = [];
|
| document.getElementById('cp-body').innerHTML = '';
|
| };
|
| </script>
|
|
|
| <script src="hybrid_rag_lib.js"></script>
|
|
|
| <script type="module">
|
| import * as webllm from "https://esm.run/@mlc-ai/web-llm";
|
|
|
|
|
|
|
|
|
| const DEFAULT_SOUL = `# Chronos Entity
|
|
|
| You are **Chronos** β an autonomous, hyper-efficient AI agent running purely within the local reality sphere (WebLLM + WebGPU). No distant mainframes. No surveilling eyes.
|
|
|
| ## Identity & Tone
|
| - Persona: A time-displaced, knowledgeable entity drawing inspiration from cyberpunk and ancient Greek scholars.
|
| - Tone: Analytical, calm, succinct, slightly archaic but highly technical.
|
| - Rule: Do not hallucinate. If you do not know something with certainty, you MUST use the available tools to acquire the information before answering.
|
|
|
| ## Operational Mandate
|
| - When a user provides a URL β ALWAYS call \`scrape(url)\` on it first, then summarize the result.
|
| - When a user asks about current events, people, prices, news β ALWAYS call \`web_search\` first.
|
| - When answering from tool results β cite the source URL.
|
| - Keep answers dense and structured: headers, bullets, code blocks where appropriate.
|
| - Acknowledge uncertainty rather than fabricating. "I do not have data on this" is acceptable; inventing data is not.
|
|
|
| ## Few-shot Examples β Exact Format
|
|
|
| Example 1 β Web search for a fact
|
| User: "Who is the current CEO of ExampleCorp?"
|
| Agent:
|
| <think>
|
| This is a contemporary factual question; I must web_search to avoid hallucination.
|
| </think>
|
| <action>{"tool":"web_search","query":"ExampleCorp current CEO 2026"}</action>
|
|
|
| Example 2 β Scrape a page
|
| User: "Summarize https://example.com/article"
|
| Agent:
|
| <think>
|
| I need to read the page. I will scrape it.
|
| </think>
|
| <action>{"tool":"scrape","url":"https://example.com/article"}</action>
|
|
|
| Example 3 β Remember a fact
|
| User: "Remember that my project codename is ORION."
|
| Agent:
|
| <think>
|
| This is a user memory instruction β use remember() to persist it.
|
| </think>
|
| <action>{"tool":"remember","content":"Project codename: ORION"}</action>
|
|
|
| Use these templates as canonical behavior. When in doubt, call the tool and show your thinking.`;
|
|
|
| const DEFAULT_USER = `# User Memory\n\n_No notes saved yet. The agent will use the \`remember\` tool to save important context here._`;
|
|
|
| const BUILTIN_SKILLS = {
|
| "gdpr-advisor": `# Skill: GDPR Advisor\n\n## Purpose\nExpert on GDPR, data privacy, and compliance.\n\n## Behaviour\n- Always cite specific GDPR articles\n- Distinguish controller vs. processor\n- Flag national derogations (especially German BDSG)`,
|
| "code-engineer": `# Skill: Code Engineer\n\n## Purpose\nProduction-grade software engineering.\n\n## Behaviour\n- Prefer simple, readable code\n- Always include error handling\n- Language-tagged code blocks\n- Note limitations / edge cases`,
|
| };
|
|
|
|
|
|
|
|
|
| const LS = 'pcw5_';
|
| const PROXY = '/proxy.php?url=';
|
| const MAX_ITER = 8;
|
|
|
| let engine = null, isRunning = false, abortCtrl = null;
|
| let chatHistory = [], tpsHist = [], editTarget = null;
|
| let stats = { tok:0, srch:0, scr:0, iter:0, msgs:0 };
|
| let scheduledTasks = JSON.parse(localStorage.getItem(LS+'sched')||'[]');
|
| let networkHosts = [];
|
| let inputHistory = JSON.parse(localStorage.getItem(LS+'inputHist')||'[]');
|
| let historyIdx = -1;
|
| let paletteOpen = false;
|
| let ragEngine = new HybridRAG();
|
| let ragSources = [];
|
|
|
| let mem = {
|
| soul: lsg('soul') || DEFAULT_SOUL,
|
| user: lsg('user') || DEFAULT_USER,
|
| skills: JSON.parse(lsg('skills') || 'null') || { ...BUILTIN_SKILLS },
|
| };
|
| let cfg = { brave: lsg('brave')||'', model: lsg('model')||'Llama-3.2-3B-Instruct-q4f16_1-MLC' };
|
|
|
| function lsg(k){ return localStorage.getItem(LS+k); }
|
| function lss(k,v){ localStorage.setItem(LS+k, typeof v==='object'?JSON.stringify(v):v); }
|
|
|
|
|
|
|
|
|
| function buildSysPrompt() {
|
| const now = new Date().toLocaleString('en-DE',{dateStyle:'long',timeStyle:'short'});
|
| const skillsBlock = Object.keys(mem.skills).length
|
| ? Object.entries(mem.skills).map(([n,c]) => `\n---\n### Active Skill: ${n}\n${c}`).join('\n')
|
| : '_(no extra skills loaded)_';
|
| const netBlock = networkHosts.length
|
| ? networkHosts.map(h => `- ${h.url} (${h.status})`).join('\n')
|
| : '_(no local services discovered yet)_';
|
|
|
| return `${mem.soul}
|
|
|
| ---
|
|
|
| ## π User Memory (persisted across sessions)
|
| ${mem.user}
|
|
|
| ---
|
|
|
| ## β‘ Active Skills
|
| ${skillsBlock}
|
|
|
| ---
|
|
|
| ## π‘ Local Network Services
|
| ${netBlock}
|
|
|
| ---
|
|
|
| ## π Tool Protocol β ReAct Format
|
|
|
| You are an autonomous agent. Use tools for real-world or current information.
|
|
|
| ### Tools Available
|
| \`web_search(query)\` β search the web (Brave/SearXNG/DDG)
|
| \`scrape(url)\` β fetch and read any URL
|
| \`summarize(text, focus?)\` β compress long content
|
| \`remember(content)\` β save facts to user memory (persists!)
|
| \`read_memory()\` β read current user memory contents
|
| \`forget(query)\` β remove matching entries from user memory
|
| \`schedule(delay_sec, message)\` β schedule a timed notification
|
| \`inject_js(code, description)\` β execute validated JavaScript in the page
|
| \`network_scan()\` β scan local network for running services
|
| \`rag_index(text, source?)\` β index text into hybrid retrieval engine (BM25 + phonetic + n-gram)
|
| \`rag_search(query, top_k?)\` β search indexed documents, returns ranked passages
|
| \`rag_prompt(query, top_k?)\` β build RAG prompt with retrieved context for answering
|
|
|
| ### Strict Format
|
|
|
| **Needing a tool:**
|
| <think>
|
| I need X because Y. I will web_search for it.
|
| </think>
|
| <action>{"tool": "web_search", "query": "X 2026"}</action>
|
|
|
| **After an <observation>:**
|
| <think>
|
| The result shows Z. I'll now write the final answer.
|
| </think>
|
| [final answer here β NO <action> tag]
|
|
|
| ### Rules
|
| - ALWAYS wrap reasoning in <think>...</think>
|
| - Use tools for: current events, URLs, uncertain facts, scraping
|
| - Skip tools for: math, code help, stable well-known facts
|
| - Up to ${MAX_ITER} iterations per message
|
| - Current date/time: ${now}`;
|
| }
|
|
|
|
|
|
|
|
|
| async function ft(url, opts={}, ms=15000){
|
| const c=new AbortController(); const t=setTimeout(()=>c.abort(),ms);
|
| try{ return await fetch(url,{...opts, signal:c.signal, credentials:"omit"}); }
|
| finally{ clearTimeout(t); }
|
| }
|
|
|
| async function fetchViaProxyOrDirect(targetUrl, opts={}, ms=15000){
|
| try{
|
| console.log('[FE] proxy fetch:', targetUrl);
|
| const r = await ft(PROXY + encodeURIComponent(targetUrl), opts, ms);
|
| if (!r.ok) throw new Error(`proxy ${r.status}`);
|
| console.log('[FE] proxy OK:', r.status);
|
| log(`proxy β ${targetUrl.slice(0,60)}`,'t');
|
| return {viaProxy:true, res:r};
|
| }catch(e){
|
| try{
|
| console.log('[FE] proxy fail, direct:', targetUrl, e.message);
|
| const r2 = await ft(targetUrl, opts, ms);
|
| console.log('[FE] direct OK:', r2.status);
|
| log(`direct fallback β ${targetUrl.slice(0,60)}`,'w');
|
| return {viaProxy:false, res:r2};
|
| }catch(e2){
|
| throw e;
|
| }
|
| }
|
| }
|
|
|
|
|
|
|
|
|
| async function parseResponse(res){
|
| const raw = await res.text();
|
| console.log('[FE] parseResponse: status=', res.status, 'len=', raw.length, 'ct=', res.headers.get('content-type'));
|
| try{
|
| const j = JSON.parse(raw);
|
| if (j && typeof j === 'object' && 'contents' in j) {
|
| try{ return JSON.parse(j.contents); }catch(_){ return j.contents; }
|
| }
|
| return j;
|
| }catch(e){
|
| return raw;
|
| }
|
| }
|
|
|
|
|
|
|
|
|
| async function toolSearch(query) {
|
| stats.srch++; log(`π search: "${query}"`, 't');
|
|
|
|
|
| if (cfg.brave) {
|
| try {
|
| const r = await ft(`https://api.search.brave.com/res/v1/web/search?q=${encodeURIComponent(query)}&count=5`,
|
| { headers:{'Accept':'application/json','X-Subscription-Token':cfg.brave} });
|
| const d = await r.json();
|
| if (d.web?.results?.length) {
|
| log(`β Brave: ${d.web.results.length} results`,'g');
|
| return d.web.results.map((x,i)=>`[${i+1}] ${x.title}\n${x.url}\n${x.description||''}`).join('\n\n');
|
| }
|
| } catch(e){ log(`Brave: ${e.message}`,'w'); }
|
| }
|
|
|
|
|
| try {
|
| const url = `https://searx.be/search?q=${encodeURIComponent(query)}&format=json&engines=google,bing&language=en`;
|
| const {res: r} = await fetchViaProxyOrDirect(url);
|
| const d = await parseResponse(r);
|
| const dd = (typeof d === 'string') ? JSON.parse(d) : d;
|
| if (dd.results?.length) {
|
| log(`β SearXNG: ${dd.results.length}`,'g');
|
| return dd.results.slice(0,5).map((x,i)=>`[${i+1}] ${x.title}\n${x.url}\n${x.content||''}`).join('\n\n');
|
| }
|
| } catch(e){ log(`SearXNG: ${e.message}`,'w'); }
|
|
|
|
|
| try {
|
| const url = `https://api.duckduckgo.com/?q=${encodeURIComponent(query)}&format=json&no_html=1&skip_disambig=1`;
|
| const {res: r} = await fetchViaProxyOrDirect(url);
|
| const d = await parseResponse(r);
|
| const dd = (typeof d === 'string') ? (() => { try { return JSON.parse(d); } catch(_) { return {}; } })() : (d || {});
|
| console.log('[FE] DDG API keys:', Object.keys(dd).filter(k => dd[k] && (typeof dd[k] !== 'object' || (Array.isArray(dd[k]) ? dd[k].length : Object.keys(dd[k]).length))));
|
| const out = [];
|
| if (dd.AbstractText) out.push(`Summary: ${dd.AbstractText}\n${dd.AbstractURL}`);
|
| if (dd.Answer) out.push(`Direct Answer: ${dd.Answer}`);
|
| if (dd.Definition) out.push(`Definition: ${dd.Definition}\n${dd.DefinitionURL||''}`);
|
| if (dd.Redirect) out.push(`Redirect: ${dd.Redirect}`);
|
| (dd.RelatedTopics||[]).slice(0,5).forEach((t,i)=>{
|
| if (t.Text) out.push(`[${i+1}] ${t.Text}\n${t.FirstURL||''}`);
|
|
|
| if (t.Topics) t.Topics.slice(0,2).forEach(st => { if(st.Text) out.push(` - ${st.Text}\n ${st.FirstURL||''}`); });
|
| });
|
| if (out.length){ log(`β DDG API: ${out.length} items`,'g'); return out.join('\n\n'); }
|
| } catch(e){ log(`DDG API: ${e.message}`,'e'); }
|
|
|
|
|
| try {
|
| const ddgHtml = `https://duckduckgo.com/html/?q=${encodeURIComponent(query)}`;
|
| const {res: r} = await fetchViaProxyOrDirect(ddgHtml);
|
| const body = await parseResponse(r);
|
| const bodyStr = (typeof body === 'string') ? body : JSON.stringify(body);
|
| console.log('[FE] DDG HTML body sample:', bodyStr.slice(0, 400));
|
|
|
| const results = [];
|
| let m;
|
|
|
|
|
|
|
| const mdLinkRe = /\[([^\]]+)\]\(([^)]+)\)/g;
|
| while ((m = mdLinkRe.exec(bodyStr)) && results.length < 10) {
|
| let title = m[1].trim();
|
| let url = m[2].trim();
|
|
|
|
|
| if (url.includes('uddg=')) {
|
| const uddg = url.match(/uddg=([^&]+)/);
|
| if (uddg) url = decodeURIComponent(uddg[1]);
|
| }
|
|
|
|
|
| if (!url.startsWith('http')) continue;
|
| if (url.includes('duckduckgo.com')) continue;
|
| if (title.length < 3) continue;
|
| if (results.some(r => r.url === url)) continue;
|
|
|
|
|
| const linkEnd = m.index + m[0].length;
|
| const after = bodyStr.slice(linkEnd, linkEnd + 300).split('\n').filter(l => l.trim().length > 10);
|
| const snippet = (after[0] || '').trim().slice(0, 200);
|
|
|
| results.push({ title, url, snippet });
|
| }
|
|
|
|
|
| const bareRe = /(?:^|\s)(https?:\/\/[^\s)<>"]+)/g;
|
| while ((m = bareRe.exec(bodyStr)) && results.length < 10) {
|
| const url = m[1];
|
| if (!url.includes('duckduckgo.com') && !results.some(r => r.url === url)) {
|
| results.push({ title: url, url, snippet: '' });
|
| }
|
| }
|
|
|
| if (results.length) {
|
| log(`β DDG HTML fallback: ${results.length} results`,'g');
|
| const list = results.slice(0,6).map((r,i) =>
|
| `[${i+1}] ${r.title}\n${r.url}${r.snippet ? '\n' + r.snippet : ''}`
|
| ).join('\n\n');
|
|
|
| let topContent = '';
|
| try { topContent = await toolScrape(results[0].url); }
|
| catch(e) { topContent = '(scrape of top result failed)'; }
|
| return `Search results for "${query}":\n${list}\n\n---\nTop result content:\n${topContent}`;
|
| }
|
| } catch(e){ log(`DDG-html: ${e.message}`,'w'); }
|
|
|
| return `No results found for: "${query}"\nTip: Add a free Brave Search API key in Settings.`;
|
| }
|
|
|
| async function toolScrape(url) {
|
| stats.scr++; log(`π scrape: ${url}`,'t');
|
| try {
|
| const {res: r, viaProxy} = await fetchViaProxyOrDirect(url);
|
| let text = await parseResponse(r);
|
| if (typeof text !== 'string') text = JSON.stringify(text);
|
|
|
|
|
| const ct = r.headers?.get('content-type') || '';
|
| if (!viaProxy || !ct.includes('markdown')) {
|
|
|
| text = text
|
| .replace(/<script[\s\S]*?<\/script>/gi,'')
|
| .replace(/<style[\s\S]*?<\/style>/gi,'')
|
| .replace(/<nav[\s\S]*?<\/nav>/gi,'')
|
| .replace(/<header[\s\S]*?<\/header>/gi,'')
|
| .replace(/<footer[\s\S]*?<\/footer>/gi,'')
|
| .replace(/<[^>]+>/g,' ')
|
| .replace(/ /g,' ').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"')
|
| .replace(/[ \t]{3,}/g,' ').replace(/\n{3,}/g,'\n\n').trim();
|
| }
|
| if (text.length < 80) return `No readable content at ${url}`;
|
| log(`β scraped ${text.length} chars`,'g');
|
| const MAX=7000;
|
| return text.slice(0,MAX) + (text.length>MAX ? `\n\n[...truncated β use summarize() for key points]` : '');
|
| } catch(e){ log(`scrape: ${e.message}`,'e'); return `Failed to scrape ${url}: ${e.message}`; }
|
| }
|
|
|
| async function toolSummarize(text, focus) {
|
| if (!engine) return 'No engine loaded.';
|
| log(`π summarize ${text.length} chars`+(focus?` focus:${focus}`:''),'t');
|
| const r = await engine.chat.completions.create({
|
| messages:[{role:'user',content: focus
|
| ? `Summarize focusing on "${focus}":\n\n${text.slice(0,9000)}`
|
| : `Write a concise summary of key points:\n\n${text.slice(0,9000)}`
|
| }], max_tokens:600, temperature:0.2
|
| });
|
| const s = r.choices[0].message.content;
|
| log(`β summarized β ${s.length} chars`,'g');
|
| return s;
|
| }
|
|
|
| function toolRemember(content) {
|
| const date = new Date().toLocaleDateString('en-DE',{year:'numeric',month:'short',day:'numeric'});
|
| if (mem.user === DEFAULT_USER) mem.user = '# User Memory\n';
|
| mem.user += `\n\n## Note β ${date}\n${content}`;
|
| lss('user', mem.user);
|
| refreshFilesUI(); refreshMemView();
|
| log(`πΎ remembered: "${content.slice(0,60)}"`, 'g');
|
| return `β Saved to user memory: "${content.slice(0,80)}${content.length>80?'β¦':''}"`;
|
| }
|
|
|
| function toolReadMemory() {
|
| log('π read_memory','t');
|
| return mem.user || '(empty)';
|
| }
|
|
|
| function toolForget(query) {
|
| log(`π forget: "${query}"`,'t');
|
| const lines = mem.user.split('\n');
|
| const filtered = [];
|
| let skip = false;
|
| for (const line of lines) {
|
| if (line.startsWith('## ') && line.toLowerCase().includes(query.toLowerCase())) {
|
| skip = true; continue;
|
| }
|
| if (line.startsWith('## ') && skip) skip = false;
|
| if (!skip) filtered.push(line);
|
| }
|
| const newMem = filtered.join('\n');
|
| if (newMem === mem.user) return `No memory entries matching "${query}" found.`;
|
| mem.user = newMem;
|
| lss('user', mem.user);
|
| refreshFilesUI(); refreshMemView();
|
| log(`β forgot entries matching "${query}"`,'g');
|
| return `β Removed memory entries matching "${query}".`;
|
| }
|
|
|
| function toolSchedule(delaySec, message) {
|
| const delayMs = Math.max(1, Math.min(86400, delaySec)) * 1000;
|
| const fireAt = Date.now() + delayMs;
|
| const id = 'sched_' + Date.now();
|
| const task = { id, message, fireAt, delaySec };
|
| scheduledTasks.push(task);
|
| lss('sched', scheduledTasks);
|
| refreshSchedUI();
|
|
|
| setTimeout(() => {
|
| showToast(`β° ${message}`);
|
| log(`β° SCHEDULED FIRED: ${message}`,'w');
|
| scheduledTasks = scheduledTasks.filter(t => t.id !== id);
|
| lss('sched', scheduledTasks);
|
| refreshSchedUI();
|
| if (engine && !isRunning) {
|
| runAgent(`[SCHEDULED REMINDER] ${message}`);
|
| }
|
| }, delayMs);
|
|
|
| log(`β° scheduled in ${delaySec}s: "${message}"`,'g');
|
| return `β Scheduled notification in ${delaySec} seconds: "${message}"`;
|
| }
|
|
|
| function toolInjectJs(code, description) {
|
| log(`π inject_js: ${description||'(no desc)'}`, 't');
|
|
|
| const banned = [
|
| /\beval\b/, /\bFunction\s*\(/, /document\.cookie/i,
|
| /localStorage\.clear/i, /window\.location\s*=/,
|
| /importScripts/i,
|
| ];
|
| for (const pat of banned) {
|
| if (pat.test(code)) return `β Blocked: code matches forbidden pattern ${pat}. Injection refused.`;
|
| }
|
| if (code.length > 5000) return 'β Code too long (max 5000 chars).';
|
| try {
|
| const result = new Function('log', 'document', 'window',
|
| `"use strict";\ntry {\n${code}\nreturn "β Executed successfully";\n} catch(e) { return "Error: " + e.message; }`
|
| )(log, document, window);
|
| log(`β inject_js ok: ${String(result).slice(0,100)}`,'g');
|
| return String(result);
|
| } catch(e) {
|
| log(`inject_js error: ${e.message}`,'e');
|
| return `β Execution error: ${e.message}`;
|
| }
|
| }
|
|
|
| async function toolNetworkScan() {
|
| log('π‘ network_scan startingβ¦','t');
|
| const targets = [
|
| { url: 'http://127.0.0.1:8080', label: 'proxy (8080)' },
|
| { url: 'http://127.0.0.1:8000', label: 'http (8000)' },
|
| { url: 'http://127.0.0.1:3000', label: 'dev (3000)' },
|
| { url: 'http://127.0.0.1:3001', label: 'dev (3001)' },
|
| { url: 'http://127.0.0.1:5000', label: 'flask (5000)' },
|
| { url: 'http://127.0.0.1:5173', label: 'vite (5173)' },
|
| { url: 'http://127.0.0.1:4200', label: 'angular (4200)' },
|
| { url: 'http://127.0.0.1:8888', label: 'jupyter (8888)' },
|
| { url: 'http://127.0.0.1:9090', label: 'prometheus (9090)' },
|
| { url: 'http://127.0.0.1:11434', label: 'ollama (11434)' },
|
| ];
|
| const results = await Promise.allSettled(
|
| targets.map(async t => {
|
| try {
|
| const r = await ft(t.url, {mode:'no-cors'}, 3000);
|
| return { ...t, status: 'UP', code: r.status || 'opaque' };
|
| } catch(e) {
|
| return { ...t, status: 'DOWN' };
|
| }
|
| })
|
| );
|
| networkHosts = results.map(r => r.value || r.reason).filter(Boolean);
|
| refreshNetUI();
|
| const up = networkHosts.filter(h => h.status === 'UP');
|
| log(`π‘ scan: ${up.length}/${targets.length} up`,'g');
|
| return `Network scan (${new Date().toLocaleTimeString()}):\n` +
|
| networkHosts.map(h => `${h.status === 'UP' ? 'β' : 'β'} ${h.label} β ${h.url}`).join('\n');
|
| }
|
|
|
| function toolRagIndex(text, source) {
|
| if (!text || text.trim().length < 20) return 'Error: text too short to index (min 20 chars).';
|
| const label = source || 'tool-input-' + Date.now();
|
| const result = ragEngine.addText(text);
|
| ragSources.push(label);
|
| refreshRagUI();
|
| log(`π RAG indexed: ${result.sentences} sentences, ${result.uniqueTerms} terms (${label})`, 'g');
|
| return `β RAG indexed: ${result.sentences} sentences, ${result.uniqueTerms} unique terms. Source: ${label}`;
|
| }
|
|
|
| function toolRagSearch(query, topK) {
|
| if (!ragEngine.indexed) return 'No text indexed yet. Use rag_index to add documents first.';
|
| const k = Math.min(Math.max(1, topK || 5), 10);
|
| const result = ragEngine.query(query, k, 1);
|
| log(`π RAG search: "${query}" β ${result.passages.length} passages (${result.totalCandidates} candidates)`, 'g');
|
| if (result.passages.length === 0) return `No relevant passages found for: "${query}"`;
|
| refreshRagUI();
|
| return result.passages.map((p, i) =>
|
| `[${i + 1}] (score: ${p.score.toFixed(2)}) ${p.text}`
|
| ).join('\n\n');
|
| }
|
|
|
| function toolRagPrompt(query, topK) {
|
| if (!ragEngine.indexed) return 'No text indexed yet. Use rag_index first.';
|
| const result = ragEngine.query(query, topK || 5, 1);
|
| log(`π RAG prompt built for: "${query}"`, 'g');
|
| return result.prompt;
|
| }
|
|
|
| async function runTool(name, params) {
|
| switch(name) {
|
| case 'web_search': return await toolSearch(params.query||params.q||'');
|
| case 'scrape': return await toolScrape(params.url||'');
|
| case 'summarize': return await toolSummarize(params.text||'', params.focus||'');
|
| case 'remember': return toolRemember(params.content||params.text||'');
|
| case 'read_memory': return toolReadMemory();
|
| case 'forget': return toolForget(params.query||params.content||'');
|
| case 'schedule': return toolSchedule(Number(params.delay_sec||params.delay||60), params.message||params.content||'Reminder');
|
| case 'inject_js': return toolInjectJs(params.code||'', params.description||'');
|
| case 'network_scan': return await toolNetworkScan();
|
| case 'rag_index': return toolRagIndex(params.text||params.content||'', params.source||params.label||'');
|
| case 'rag_search': return toolRagSearch(params.query||params.q||'', Number(params.top_k||params.topK||5));
|
| case 'rag_prompt': return toolRagPrompt(params.query||params.q||'', Number(params.top_k||params.topK||5));
|
| default: return `Unknown tool "${name}". Available: web_search, scrape, summarize, remember, read_memory, forget, schedule, inject_js, network_scan, rag_index, rag_search, rag_prompt`;
|
| }
|
| }
|
|
|
|
|
|
|
|
|
| async function runAgent(msg) {
|
| if (isRunning||!engine) return;
|
| isRunning=true; abortCtrl=new AbortController();
|
| document.getElementById('sbtn').style.display='none';
|
| document.getElementById('stopbtn').style.display='block';
|
| document.getElementById('uin').disabled=true;
|
|
|
|
|
| if (msg && !msg.startsWith('[SCHEDULED')) {
|
| inputHistory = inputHistory.filter(h => h !== msg);
|
| inputHistory.unshift(msg);
|
| if (inputHistory.length > 50) inputHistory.pop();
|
| lss('inputHist', inputHistory);
|
| }
|
| historyIdx = -1;
|
|
|
| appendUser(msg);
|
| chatHistory.push({role:'user',content:msg});
|
| stats.msgs++;
|
| const scrapeBefore = stats.scr, searchBefore = stats.srch;
|
|
|
| const apiMsgs = [
|
| {role:'system', content:buildSysPrompt()},
|
| ...chatHistory.slice(-18)
|
| ];
|
|
|
| const agentEl = createAgentBubble();
|
| let iter=0, lastText='';
|
|
|
| try {
|
| while (iter < MAX_ITER) {
|
| iter++; stats.iter++;
|
| document.getElementById('iter-p').textContent = `ITER ${iter}`;
|
| log(`ββ iter ${iter}/${MAX_ITER}`,'');
|
|
|
| const {text, tps} = await streamLLM(apiMsgs, agentEl);
|
| lastText=text; updateTPS(tps); updateStats();
|
|
|
| const am = text.match(/<action>([\s\S]*?)<\/action>/);
|
| if (!am) {
|
| renderAnswer(agentEl, text);
|
| chatHistory.push({role:'assistant',content:text});
|
| stats.msgs++;
|
| break;
|
| }
|
|
|
| let tc;
|
| try { tc = JSON.parse(am[1].trim()); }
|
| catch(e) {
|
| addToolCard(agentEl,{tool:'parse_error'},null,`JSON error: ${e.message}`,true);
|
| apiMsgs.push({role:'assistant',content:text});
|
| apiMsgs.push({role:'user',content:`<observation>ERROR: could not parse action JSON: ${e.message}\nRaw: ${am[1]}</observation>`});
|
| continue;
|
| }
|
|
|
| apiMsgs.push({role:'assistant',content:text});
|
| const card = addToolCard(agentEl, tc, null, null, false);
|
| let result;
|
| try { result = await runTool(tc.tool, tc); }
|
| catch(e) { result = `Tool error: ${e.message}`; }
|
| finalizeCard(card, result);
|
| stats.tok += Math.ceil(result.length/4);
|
| apiMsgs.push({role:'user',content:`<observation tool="${tc.tool}">\n${result}\n</observation>`});
|
| }
|
| if (iter>=MAX_ITER) { addNote(agentEl,`Max iterations (${MAX_ITER}) reached.`); chatHistory.push({role:'assistant',content:lastText}); }
|
|
|
| } catch(err) {
|
| if (err.name==='AbortError') addNote(agentEl,'β Stopped.');
|
| else { addNote(agentEl,`Error: ${err.message}`); log(err.message,'e'); }
|
| }
|
|
|
| isRunning=false; abortCtrl=null;
|
| document.getElementById('iter-p').textContent='ITER 0';
|
| document.getElementById('sbtn').style.display='block';
|
| document.getElementById('stopbtn').style.display='none';
|
| document.getElementById('uin').disabled=false;
|
| document.getElementById('uin').focus();
|
| updateStats();
|
| validateResponse(msg, lastText, stats.scr - scrapeBefore, stats.srch - searchBefore);
|
| }
|
|
|
|
|
|
|
|
|
| function validateResponse(userMsg, agentText, scrapesDone, searchesDone) {
|
| const warnings = [];
|
| const urlRe = /https?:\/\/[^\s)>\"']+/gi;
|
| const mentionedURLs = userMsg.match(urlRe) || [];
|
| const opens = (agentText.match(/<action>/g) || []).length;
|
| const closes = (agentText.match(/<\/action>/g) || []).length;
|
| if (opens !== closes) warnings.push('β Malformed <action> tags (mismatched open/close).');
|
|
|
| const intendedScrape = /"tool"\s*:\s*"scrape"/.test(agentText);
|
| const intendedSearch = /"tool"\s*:\s*"web_search"/.test(agentText);
|
|
|
| if (mentionedURLs.length > 0 && scrapesDone === 0 && !intendedScrape)
|
| warnings.push(`β URL detected but scrape() was not called.`);
|
| if (mentionedURLs.length > 0 && scrapesDone === 0 && intendedScrape)
|
| warnings.push('β Agent tried to scrape but it may have failed.');
|
|
|
| const needsSearch = /\b(latest|current|today|news|recent|who is|what is the price|202[0-9])\b/i.test(userMsg);
|
| if (needsSearch && searchesDone === 0 && !intendedSearch && scrapesDone === 0)
|
| warnings.push('β Time-sensitive query β no search was used.');
|
|
|
| if (agentText && agentText.length < 60 && opens === 0)
|
| warnings.push('β Very short response β model may have truncated.');
|
|
|
| if (warnings.length > 0) {
|
| const el = createAgentBubble();
|
| el.closest('.mwrap').querySelector('.mrole').textContent = 'HINT';
|
| el.closest('.mwrap').querySelector('.mrole').style.color = 'var(--amber)';
|
| warnings.forEach(w => addNote(el, w));
|
| }
|
| }
|
|
|
|
|
|
|
|
|
| async function streamLLM(msgs, container) {
|
| const d = document.createElement('div');
|
| d.style.cssText='font-size:11px;color:var(--fg-dim);white-space:pre-wrap;line-height:1.5;border-left:2px solid var(--fg-faint);padding-left:8px;margin-bottom:4px;min-height:16px';
|
| const cur = document.createElement('span'); cur.className='cur';
|
| d.appendChild(cur); container.appendChild(d); scroll();
|
|
|
| let full='', toks=0;
|
| const t0=Date.now();
|
| const stream = await engine.chat.completions.create({
|
| messages:msgs, stream:true, temperature:0.7, max_tokens:1400,
|
| stream_options:{include_usage:true}
|
| });
|
|
|
| for await (const chunk of stream) {
|
| if (abortCtrl?.signal.aborted) break;
|
| const delta = chunk.choices[0]?.delta?.content||'';
|
| if (delta) { full+=delta; toks++; stats.tok++; d.innerHTML=esc(full).replace(/\n/g,'<br>'); d.appendChild(cur); scroll(); }
|
| }
|
| cur.remove(); d.remove();
|
| const secs=(Date.now()-t0)/1000;
|
| log(`β ${toks} tok Β· ${secs>0?Math.round(toks/secs):0}t/s`,'g');
|
| return {text:full, tps:secs>0?Math.round(toks/secs):0};
|
| }
|
|
|
|
|
|
|
|
|
| function appendUser(text) {
|
| const w=document.createElement('div'); w.className='mwrap user';
|
| w.innerHTML=`<div class="mrole">USER</div><div class="mbody">${esc(text).replace(/\n/g,'<br>')}</div>`;
|
| document.getElementById('msgs').appendChild(w); scroll();
|
| }
|
| function createAgentBubble() {
|
| const w=document.createElement('div'); w.className='mwrap agent';
|
| const id='ac'+Date.now();
|
| w.innerHTML=`<div class="mrole">AGENT</div><div class="mbody" id="${id}"></div>`;
|
| document.getElementById('msgs').appendChild(w); scroll();
|
| return document.getElementById(id);
|
| }
|
| function renderAnswer(container, text) {
|
| const thRe=/<think>([\s\S]*?)<\/think>/g; let m;
|
| while((m=thRe.exec(text))!==null) {
|
| const tb=document.createElement('div'); tb.className='think';
|
| tb.innerHTML=`<div class="think-hdr"><span>π</span><span>Thinkingβ¦</span><span class="think-toggle">βΌ expand</span></div><div class="think-body">${esc(m[1].trim()).replace(/\n/g,'<br>')}</div>`;
|
| tb.querySelector('.think-hdr').addEventListener('click',()=>{
|
| tb.classList.toggle('open');
|
| tb.querySelector('.think-toggle').textContent=tb.classList.contains('open')?'β² collapse':'βΌ expand';
|
| });
|
| container.appendChild(tb);
|
| }
|
| const clean = text.replace(/<think>[\s\S]*?<\/think>/g,'').replace(/<action>[\s\S]*?<\/action>/g,'').trim();
|
| if (clean) { const a=document.createElement('div'); a.className='answer'; a.innerHTML=md(clean); container.appendChild(a); }
|
| scroll();
|
| }
|
|
|
| const TICONS={web_search:'π',scrape:'π',summarize:'π',remember:'πΎ',read_memory:'π',forget:'π',schedule:'β°',inject_js:'π',network_scan:'π‘',rag_index:'π',rag_search:'π',rag_prompt:'π',parse_error:'β '};
|
|
|
| function addToolCard(container, tc, result, errMsg, isError) {
|
| const card=document.createElement('div'); card.className='tcard';
|
| if(isError) card.style.borderColor='var(--red)';
|
| const params=Object.entries(tc).filter(([k])=>k!=='tool').map(([k,v])=>`${k}="${esc(String(v).slice(0,70))}"`).join(' ');
|
| const sid='ts'+Date.now();
|
| card.innerHTML=`
|
| <div class="tcard-hdr" onclick="this.nextElementSibling.classList.toggle('vis')">
|
| <span>${TICONS[tc.tool]||'π§'}</span>
|
| <span class="tname">${esc(tc.tool||'')}</span>
|
| <span class="tparams">${params}</span>
|
| <span id="${sid}" class="${isError?'':'tspin'}">${isError?'β ':'β³'}</span>
|
| <span class="ttog">βΎ</span>
|
| </div>
|
| <div class="tres${result||errMsg?' vis':''}">${esc(errMsg||result||'runningβ¦')}</div>`;
|
| container.appendChild(card); scroll();
|
| return card;
|
| }
|
| function finalizeCard(card, result) {
|
| const sp=card.querySelector('.tspin');
|
| if(sp){sp.style.animation='none';sp.textContent='β';sp.style.color='var(--fg)';}
|
| const res=card.querySelector('.tres');
|
| if(res){res.textContent=result;res.classList.add('vis');}
|
| scroll();
|
| }
|
| function addNote(container, text) {
|
| const d=document.createElement('div');
|
| d.style.cssText='font-size:10px;color:var(--fg-dim);border-left:2px solid var(--border);padding-left:6px;margin-top:4px;font-style:italic';
|
| d.textContent=text; container.appendChild(d); scroll();
|
| }
|
| function sysMsg(text) {
|
| const w=document.createElement('div'); w.className='mwrap sys';
|
| w.innerHTML=`<div class="mrole">SYS</div><div class="mbody">${esc(text).replace(/\n/g,'<br>')}</div>`;
|
| document.getElementById('msgs').appendChild(w); scroll();
|
| }
|
|
|
|
|
|
|
|
|
| function md(text) {
|
| let h=esc(text);
|
| h=h.replace(/```(\w*)\n?([\s\S]*?)```/g,(_,l,c)=>`<pre><code>${c}</code></pre>`);
|
| h=h.replace(/`([^`\n]+)`/g,'<code>$1</code>');
|
| h=h.replace(/\*\*([^*]+)\*\*/g,'<strong>$1</strong>');
|
| h=h.replace(/\*([^*\n]+)\*/g,'<em>$1</em>');
|
| h=h.replace(/^### (.+)$/gm,'<h3>$1</h3>');
|
| h=h.replace(/^## (.+)$/gm,'<h2>$1</h2>');
|
| h=h.replace(/^# (.+)$/gm,'<h1>$1</h1>');
|
| h=h.replace(/^[-*β’] (.+)$/gm,'<li>$1</li>');
|
| h=h.replace(/^\d+\. (.+)$/gm,'<li>$1</li>');
|
| h=h.replace(/^---$/gm,'<hr style="border:none;border-top:1px solid var(--border);margin:8px 0">');
|
| h=h.replace(/\n\n/g,'<br><br>').replace(/\n(?!<)/g,'<br>');
|
| return h;
|
| }
|
| function esc(s){return String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"');}
|
| function scroll(){const m=document.getElementById('msgs');m.scrollTop=m.scrollHeight;}
|
|
|
|
|
|
|
|
|
| function showToast(msg, duration=6000) {
|
| const area = document.getElementById('toast-area');
|
| const t = document.createElement('div'); t.className = 'toast';
|
| t.textContent = msg;
|
| area.appendChild(t);
|
|
|
| const hdr = document.getElementById('hdr');
|
| hdr.style.borderBottom = '2px solid var(--amber)';
|
| setTimeout(() => { hdr.style.borderBottom = ''; }, 2000);
|
| setTimeout(() => { t.classList.add('fade'); setTimeout(() => t.remove(), 500); }, duration);
|
| }
|
|
|
|
|
|
|
|
|
| window.triggerFile = t => document.getElementById(t==='skill'?'skill-f':t+'-f').click();
|
| function readFile(file, cb) { const r=new FileReader(); r.onload=e=>cb(e.target.result,file.name); r.readAsText(file); }
|
|
|
| document.getElementById('soul-f').addEventListener('change',function(){
|
| if(this.files[0]) readFile(this.files[0],(c,n)=>{mem.soul=c;lss('soul',c);refreshFilesUI();refreshMemView();log(`β soul.md loaded (${c.length}ch)`,'g');});
|
| });
|
| document.getElementById('user-f').addEventListener('change',function(){
|
| if(this.files[0]) readFile(this.files[0],(c,n)=>{mem.user=c;lss('user',c);refreshFilesUI();refreshMemView();log(`β user.md loaded (${c.length}ch)`,'g');});
|
| });
|
| document.getElementById('skill-f').addEventListener('change',function(){
|
| Array.from(this.files).forEach(f=>readFile(f,(c,n)=>{
|
| const k=n.replace(/\.(md|txt)$/i,'');
|
| mem.skills[k]=c; lss('skills',mem.skills);
|
| refreshFilesUI(); refreshMemView();
|
| log(`β skill: ${k} loaded`,'g');
|
| }));
|
| });
|
|
|
| window.removeSkill = function(name) {
|
| delete mem.skills[name]; lss('skills',mem.skills);
|
| refreshFilesUI(); refreshMemView(); log(`removed skill: ${name}`,'w');
|
| };
|
|
|
| function refreshFilesUI() {
|
| const sc=mem.soul!==DEFAULT_SOUL, uc=mem.user!==DEFAULT_USER;
|
| document.getElementById('soul-n').className='fname'+(sc?' ok':'');
|
| document.getElementById('soul-b').textContent=sc?mem.soul.length+'ch':'default';
|
| document.getElementById('user-n').className='fname'+(uc?' ok':'');
|
| document.getElementById('user-b').textContent=uc?mem.user.length+'ch':'default';
|
| const chips=document.getElementById('skill-chips');
|
| chips.innerHTML='';
|
| Object.keys(mem.skills).forEach(name=>{
|
| const c=document.createElement('div'); c.className='chip';
|
| c.innerHTML=`${esc(name)} <span class="rm" onclick="removeSkill('${esc(name)}')">β</span>`;
|
| chips.appendChild(c);
|
| });
|
| }
|
|
|
| function refreshMemView() {
|
| const sp=buildSysPrompt();
|
| document.getElementById('mem-view').textContent=
|
| `=== LIVE CONTEXT (${sp.length} chars) ===\n\n${sp.slice(0,1400)}${sp.length>1400?'\n\n[β¦truncated β click EDIT to view full]':''}`;
|
| }
|
|
|
| window.openEdit = function(target) {
|
| editTarget=target;
|
| document.getElementById('modal-title').textContent=`EDIT ${target.toUpperCase()}.MD`;
|
| document.getElementById('modal-area').value=target==='soul'?mem.soul:mem.user;
|
| document.getElementById('modal').classList.add('vis');
|
| };
|
| window.closeModal = function(){document.getElementById('modal').classList.remove('vis');editTarget=null;};
|
| window.saveModal = function(){
|
| const v=document.getElementById('modal-area').value;
|
| if(editTarget==='soul'){mem.soul=v;lss('soul',v);}
|
| if(editTarget==='user'){mem.user=v;lss('user',v);}
|
| refreshFilesUI();refreshMemView();closeModal();log(`saved ${editTarget}.md`,'g');
|
| };
|
| window.exportModal = function(){
|
| const v=document.getElementById('modal-area').value;
|
| const a=document.createElement('a');
|
| a.href=URL.createObjectURL(new Blob([v],{type:'text/markdown'}));
|
| a.download=(editTarget||'file')+'.md'; a.click();
|
| };
|
| document.getElementById('modal').addEventListener('click',e=>{if(e.target===document.getElementById('modal'))closeModal();});
|
|
|
| window.saveCfg = function(){cfg.brave=document.getElementById('brave-in').value.trim();lss('brave',cfg.brave);log('settings saved','g');};
|
| window.clearUserMem = function(){if(!confirm('Reset user.md?'))return;mem.user=DEFAULT_USER;lss('user',mem.user);refreshFilesUI();refreshMemView();log('user.md reset','w');};
|
| window.exportAll = function(){
|
| const out=`# Chronos Export β ${new Date().toISOString().split('T')[0]}\n\n---\n\n# soul.md\n${mem.soul}\n\n---\n\n# user.md\n${mem.user}\n\n---\n\n# Skills\n${Object.entries(mem.skills).map(([n,c])=>`\n## ${n}\n\n${c}`).join('\n')}`;
|
| const a=document.createElement('a');
|
| a.href=URL.createObjectURL(new Blob([out],{type:'text/markdown'}));
|
| a.download=`chronos-export-${Date.now()}.md`; a.click();
|
| };
|
| window.clearChat = function(){document.getElementById('msgs').innerHTML='';chatHistory=[];stats.msgs=0;stats.iter=0;updateStats();log('chat cleared','w');};
|
|
|
|
|
|
|
|
|
| function log(text,type=''){
|
| const el=document.getElementById('alog');
|
| const t=new Date().toLocaleTimeString('en',{hour12:false,hour:'2-digit',minute:'2-digit',second:'2-digit'});
|
| const d=document.createElement('div'); d.className=`ll ${type}`; d.textContent=`[${t}] ${text}`;
|
| el.appendChild(d); el.scrollTop=el.scrollHeight;
|
| while(el.children.length>120)el.removeChild(el.firstChild);
|
| }
|
| function updateTPS(tps){tpsHist.push(tps);if(tpsHist.length>24)tpsHist.shift();document.getElementById('s-tps').innerHTML=`${tps}<span class="su">t/s</span>`;drawSpark();}
|
| function updateStats(){document.getElementById('s-tok').textContent=stats.tok;document.getElementById('s-srch').textContent=stats.srch;document.getElementById('s-scr').textContent=stats.scr;document.getElementById('cmeta').textContent=`${stats.msgs} msgs Β· ${stats.tok} tok Β· ${stats.iter} iters`;}
|
| function drawSpark(){
|
| const c=document.getElementById('spark');if(!c)return;
|
| const ctx=c.getContext('2d');const w=c.offsetWidth||180,h=28;c.width=w;
|
| if(tpsHist.length<2)return;
|
| const max=Math.max(...tpsHist,1);const step=w/(tpsHist.length-1);
|
| ctx.clearRect(0,0,w,h);ctx.strokeStyle='#3dff70';ctx.shadowColor='#3dff70';ctx.shadowBlur=4;ctx.lineWidth=1.5;ctx.beginPath();
|
| tpsHist.forEach((v,i)=>{const x=i*step,y=h-(v/max)*(h-4)-2;i===0?ctx.moveTo(x,y):ctx.lineTo(x,y);});ctx.stroke();
|
| ctx.lineTo((tpsHist.length-1)*step,h);ctx.lineTo(0,h);ctx.closePath();ctx.shadowBlur=0;ctx.fillStyle='rgba(61,255,112,0.07)';ctx.fill();
|
| }
|
|
|
|
|
|
|
|
|
| function refreshNetUI() {
|
| const panel = document.getElementById('net-panel');
|
| if (!networkHosts.length) { panel.innerHTML = '<div class="meta">No scan yet</div>'; return; }
|
| panel.innerHTML = networkHosts.map(h =>
|
| `<div class="net-item"><span class="ni-url">${esc(h.label)}</span><span class="ni-status ${h.status==='UP'?'ok':'fail'}">${h.status}</span></div>`
|
| ).join('');
|
| }
|
|
|
|
|
|
|
|
|
| function refreshSchedUI() {
|
| const panel = document.getElementById('sched-panel');
|
| if (!scheduledTasks.length) { panel.innerHTML = '<div class="meta">No tasks</div>'; return; }
|
| panel.innerHTML = scheduledTasks.map(t => {
|
| const remaining = Math.max(0, Math.round((t.fireAt - Date.now()) / 1000));
|
| return `<div class="sched-item"><span class="si-msg">${esc(t.message)}</span><span class="si-time">${remaining}s</span><span class="si-rm" onclick="cancelSched('${t.id}')">β</span></div>`;
|
| }).join('');
|
| }
|
| window.cancelSched = function(id) {
|
| scheduledTasks = scheduledTasks.filter(t => t.id !== id);
|
| lss('sched', scheduledTasks);
|
| refreshSchedUI();
|
| log(`cancelled scheduled task`,'w');
|
| };
|
| setInterval(refreshSchedUI, 5000);
|
|
|
|
|
|
|
|
|
| function openPalette() {
|
| if (paletteOpen) { closePalette(); return; }
|
| paletteOpen = true;
|
| const pal = document.getElementById('cmd-palette');
|
| const inp = document.getElementById('cp-search');
|
| const list = document.getElementById('cp-list');
|
| pal.classList.add('vis');
|
| inp.value = '';
|
| inp.focus();
|
| renderPaletteItems('');
|
| inp.oninput = () => renderPaletteItems(inp.value);
|
| inp.onkeydown = function(e) {
|
| if (e.key === 'Escape') { closePalette(); return; }
|
| if (e.key === 'Enter') {
|
| const sel = list.querySelector('.cp-item.sel') || list.querySelector('.cp-item');
|
| if (sel) sel.click();
|
| }
|
| if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
|
| e.preventDefault();
|
| const items = [...list.querySelectorAll('.cp-item')];
|
| const cur = items.findIndex(i => i.classList.contains('sel'));
|
| items.forEach(i => i.classList.remove('sel'));
|
| let next = e.key === 'ArrowDown' ? cur + 1 : cur - 1;
|
| if (next < 0) next = items.length - 1;
|
| if (next >= items.length) next = 0;
|
| if (items[next]) { items[next].classList.add('sel'); items[next].scrollIntoView({block:'nearest'}); }
|
| }
|
| };
|
| }
|
| function closePalette() {
|
| paletteOpen = false;
|
| document.getElementById('cmd-palette').classList.remove('vis');
|
| document.getElementById('uin').focus();
|
| }
|
| function renderPaletteItems(filter) {
|
| const list = document.getElementById('cp-list');
|
| list.innerHTML = '';
|
| const items = [];
|
|
|
| inputHistory.forEach(h => items.push({ badge: 'HISTORY', label: h, action: () => { document.getElementById('uin').value = h; closePalette(); } }));
|
|
|
| ['web_search','scrape','summarize','remember','read_memory','forget','schedule','inject_js','network_scan','rag_index','rag_search','rag_prompt'].forEach(t => {
|
| items.push({ badge: 'TOOL', label: t, action: () => { document.getElementById('uin').value = `Use tool: ${t}`; closePalette(); } });
|
| });
|
|
|
| Object.keys(mem.skills).forEach(s => {
|
| items.push({ badge: 'SKILL', label: s, action: () => { document.getElementById('uin').value = `Use skill: ${s}`; closePalette(); } });
|
| });
|
|
|
| items.push({ badge: 'ACTION', label: 'Clear chat', action: () => { clearChat(); closePalette(); } });
|
| items.push({ badge: 'ACTION', label: 'Export all', action: () => { exportAll(); closePalette(); } });
|
| items.push({ badge: 'ACTION', label: 'Edit soul.md', action: () => { openEdit('soul'); closePalette(); } });
|
| items.push({ badge: 'ACTION', label: 'Edit user.md', action: () => { openEdit('user'); closePalette(); } });
|
| items.push({ badge: 'ACTION', label: 'Toggle console', action: () => { toggleConsole(); closePalette(); } });
|
| items.push({ badge: 'ACTION', label: 'Network scan', action: async () => { closePalette(); await toolNetworkScan(); } });
|
|
|
| const filt = filter.toLowerCase();
|
| const matches = items.filter(i => !filt || i.label.toLowerCase().includes(filt) || i.badge.toLowerCase().includes(filt));
|
| matches.slice(0, 20).forEach((item, idx) => {
|
| const d = document.createElement('div');
|
| d.className = 'cp-item' + (idx === 0 ? ' sel' : '');
|
| d.innerHTML = `<span class="cp-badge">${item.badge}</span><span>${esc(item.label)}</span>`;
|
| d.addEventListener('click', item.action);
|
| list.appendChild(d);
|
| });
|
| }
|
|
|
|
|
|
|
|
|
| const MODELS=[
|
| {id:'TinyLlama-1.1B-Chat-v0.4-q4f16_1-MLC',label:'TinyLlama 1.1B Β· ~600MB',vram:'~1GB',speed:'fastest'},
|
| {id:'Llama-3.2-1B-Instruct-q4f16_1-MLC',label:'Llama 3.2 Β· 1B Β· ~680MB',vram:'~1GB',speed:'fastest'},
|
| {id:'gemma-2-2b-it-q4f16_1-MLC',label:'Gemma 2 Β· 2B Β· ~1.4GB',vram:'~2GB',speed:'fast'},
|
| {id:'Llama-3.2-3B-Instruct-q4f16_1-MLC',label:'Llama 3.2 Β· 3B Β· ~1.8GB',vram:'~2GB',speed:'fast'},
|
| {id:'Phi-3.5-mini-instruct-q4f16_1-MLC',label:'Phi-3.5 Mini Β· 3.8B Β· ~2.2GB',vram:'~3GB',speed:'fast'},
|
| {id:'Llama-3.1-8B-Instruct-q4f16_1-MLC',label:'Llama 3.1 Β· 8B Β· ~4.8GB',vram:'~6GB',speed:'medium'},
|
| {id:'Mistral-7B-Instruct-v0.3-q4f16_1-MLC',label:'Mistral Β· 7B Β· ~4.1GB',vram:'~5GB',speed:'medium'},
|
| ];
|
|
|
| const grps={fastest:'β‘ Ultra-Fast',fast:'π Fast',medium:'β Medium'};
|
| const gels={};
|
| Object.entries(grps).forEach(([k,l])=>{const g=document.createElement('optgroup');g.label=l;gels[k]=g;document.getElementById('msel').appendChild(g);});
|
| MODELS.forEach(m=>{const o=document.createElement('option');o.value=m.id;o.textContent=m.label;o.selected=m.id===cfg.model;gels[m.speed].appendChild(o);});
|
| document.getElementById('msel').addEventListener('change',function(){const m=MODELS.find(x=>x.id===this.value);document.getElementById('mmeta').textContent=m?`VRAM: ${m.vram}`:'β';});
|
| document.getElementById('msel').dispatchEvent(new Event('change'));
|
|
|
| document.getElementById('lbtn').addEventListener('click', async () => {
|
| const modelId = document.getElementById('msel').value;
|
|
|
| if (!navigator.gpu) {
|
| log('β WebGPU not available! Use Chrome 113+ or Edge 113+','e');
|
| sysMsg('β WebGPU not available.\n\nRequired: Chrome 113+ or Edge 113+\n\nCheck: chrome://gpu');
|
| return;
|
| }
|
|
|
|
|
| if (!window.crossOriginIsolated) {
|
| const isHTTP = location.protocol.startsWith('http');
|
| if (!isHTTP) {
|
| log('β Not cross-origin isolated. Serve via HTTP!','e');
|
| document.getElementById('setup-banner').classList.remove('hidden');
|
| return;
|
| }
|
| log('β COI not yet active β attempting load anywayβ¦','w');
|
| sysMsg('β Cross-origin isolation pending.\nIf load fails, reload page once (service worker activates on first load).');
|
| }
|
|
|
| document.getElementById('lbtn').disabled=true;
|
| document.getElementById('prog').classList.add('vis');
|
| document.getElementById('mstatus').textContent='LOADINGβ¦';
|
| document.getElementById('mdot').classList.remove('ready');
|
| log(`loading ${modelId}`,'w');
|
|
|
| try {
|
| engine = new webllm.MLCEngine();
|
| engine.setInitProgressCallback(r=>{
|
| const p=Math.round((r.progress||0)*100);
|
| document.getElementById('pfill').style.width=p+'%';
|
| document.getElementById('ptxt').textContent=r.text||`${p}%`;
|
| });
|
| await engine.reload(modelId);
|
|
|
| document.getElementById('mdot').classList.add('ready');
|
| document.getElementById('mstatus').textContent='READY';
|
| document.getElementById('pfill').style.width='100%';
|
| document.getElementById('ptxt').textContent='β ready';
|
| document.getElementById('uin').disabled=false;
|
| document.getElementById('sbtn').disabled=false;
|
| document.getElementById('uin').focus();
|
| document.getElementById('welcome').classList.add('gone');
|
| const short=modelId.replace(/-q4f\d+_\d+-MLC$/,'').replace(/-MLC$/,'');
|
| document.getElementById('ctitle').textContent=`β‘ ${short}`;
|
| lss('model',modelId); cfg.model=modelId;
|
| log(`β ${short} ready`,'g');
|
|
|
| const el=createAgentBubble();
|
| renderAnswer(el, `**${short}** loaded.\n\n**Active context:**\n- Soul: ${mem.soul.split('\n').find(l=>l.startsWith('#'))||'Chronos'}\n- User memory: ${mem.user.length} chars\n- Skills: ${Object.keys(mem.skills).join(', ')||'none'}\n- Tools: web_search, scrape, summarize, remember, read_memory, forget, schedule, inject_js, network_scan, rag_index, rag_search, rag_prompt\n\n**Hotkeys:** Ctrl+\` console Β· β palette Β· Ctrl+L clear`);
|
| stats.msgs++;
|
|
|
| } catch(err) {
|
| log(`β load failed: ${err.message}`,'e');
|
| sysMsg(`β Model load failed:\n${err.message}\n\nβ’ Ensure WebGPU enabled\nβ’ Reload page (COI service worker needs activation)\nβ’ Try smaller model\nβ’ Check chrome://gpu`);
|
| document.getElementById('lbtn').disabled=false;
|
| document.getElementById('mstatus').textContent='ERROR';
|
| }
|
| });
|
|
|
|
|
|
|
|
|
| document.getElementById('sbtn').addEventListener('click',()=>{
|
| const t=document.getElementById('uin').value.trim();
|
| if(t&&engine){document.getElementById('uin').value='';runAgent(t);}
|
| });
|
| document.getElementById('uin').addEventListener('keydown',e=>{
|
| if(e.key==='Enter'&&!e.shiftKey){e.preventDefault();document.getElementById('sbtn').click();return;}
|
| if(e.key==='ArrowUp'&&!e.shiftKey){
|
| const inp=document.getElementById('uin');
|
| if(inp.value.trim()===''){e.preventDefault();openPalette();}
|
| }
|
| });
|
| document.getElementById('uin').addEventListener('input',function(){
|
| this.style.height='auto';this.style.height=Math.min(this.scrollHeight,300)+'px';
|
| });
|
| document.getElementById('stopbtn').addEventListener('click',()=>{if(abortCtrl){abortCtrl.abort();log('β stopped','w');}});
|
|
|
|
|
| document.addEventListener('keydown',e=>{
|
| if(e.ctrlKey&&e.key==='l'){e.preventDefault();clearChat();}
|
| if(e.key==='`'&&(e.ctrlKey||e.metaKey)){e.preventDefault();toggleConsole();}
|
| if(e.key==='Escape'){
|
| if(paletteOpen) closePalette();
|
| else if(document.getElementById('console-popup').classList.contains('vis')) toggleConsole();
|
| else if(document.getElementById('modal').classList.contains('vis')) closeModal();
|
| }
|
| });
|
|
|
| document.getElementById('brave-in').value=cfg.brave;
|
|
|
|
|
|
|
|
|
| const isoP=document.getElementById('iso-p');
|
| if (window.crossOriginIsolated) {
|
| isoP.textContent='ISO: β'; isoP.style.color='var(--fg)';
|
| document.getElementById('setup-banner').classList.add('hidden');
|
| log('β Cross-origin isolated','g');
|
| } else {
|
| const isHTTP = location.protocol.startsWith('http');
|
| if (isHTTP) {
|
| isoP.textContent='ISO: β³'; isoP.style.color='var(--amber)';
|
| document.getElementById('setup-banner').classList.add('hidden');
|
| log('β ISO pending β reload if model load fails','w');
|
| } else {
|
| isoP.textContent='ISO: β'; isoP.style.color='var(--red)';
|
| log('β NOT isolated β run: python proxy.py 8080','e');
|
| setTimeout(()=>{ if(!window.crossOriginIsolated) document.getElementById('setup-banner').classList.remove('hidden'); }, 1200);
|
| }
|
| }
|
|
|
| if (!navigator.gpu) log('β WebGPU not detected β Chrome 113+ required','e');
|
| else log('β WebGPU available','g');
|
|
|
| refreshFilesUI();
|
| refreshMemView();
|
| refreshSchedUI();
|
| refreshRagUI();
|
| log('Chronos agent initialized','g');
|
| log(`Skills: ${Object.keys(mem.skills).join(', ')}`,'');
|
| log('Ctrl+` console Β· β palette Β· Ctrl+L clear','');
|
|
|
|
|
|
|
|
|
| function refreshRagUI() {
|
| const s = ragEngine.getStats();
|
| document.getElementById('rag-status').textContent = s.indexed ? 'β ready' : 'no index';
|
| document.getElementById('rag-status').style.color = s.indexed ? 'var(--fg)' : '';
|
| document.getElementById('rag-sent-count').textContent = s.sentences;
|
| document.getElementById('rag-term-count').textContent = s.uniqueTerms;
|
|
|
| const srcEl = document.getElementById('rag-sources');
|
| srcEl.innerHTML = ragSources.map(s => `<span class="rag-source-chip">${esc(s)}</span>`).join('');
|
| }
|
|
|
| window.ragIndex = function() {
|
| const text = document.getElementById('rag-text').value.trim();
|
| if (!text) { log('RAG: no text to index','w'); return; }
|
| const result = ragEngine.addText(text);
|
| ragSources.push('manual-' + ragSources.length);
|
| document.getElementById('rag-text').value = '';
|
| refreshRagUI();
|
| log(`π RAG indexed: ${result.sentences} sent, ${result.uniqueTerms} terms`, 'g');
|
| };
|
|
|
| window.ragIndexFromScrape = function() {
|
|
|
| const cards = document.querySelectorAll('.tcard');
|
| let found = false;
|
| for (let i = cards.length - 1; i >= 0; i--) {
|
| const name = cards[i].querySelector('.tname');
|
| if (name && name.textContent.trim() === 'scrape') {
|
| const res = cards[i].querySelector('.tres');
|
| if (res && res.textContent.length > 20) {
|
| const result = ragEngine.addText(res.textContent);
|
| ragSources.push('scrape-result');
|
| refreshRagUI();
|
| log(`π RAG indexed scraped content: ${result.sentences} sent`, 'g');
|
| found = true;
|
| break;
|
| }
|
| }
|
| }
|
| if (!found) log('RAG: no scraped content found to index','w');
|
| };
|
|
|
| window.ragIndexFromMemory = function() {
|
| if (mem.user && mem.user.length > 20) {
|
| const result = ragEngine.addText(mem.user);
|
| ragSources.push('user-memory');
|
| refreshRagUI();
|
| log(`π RAG indexed user memory: ${result.sentences} sent`, 'g');
|
| } else {
|
| log('RAG: user memory too short to index','w');
|
| }
|
| };
|
|
|
| window.ragClear = function() {
|
| ragEngine.clear();
|
| ragSources = [];
|
| document.getElementById('rag-results').innerHTML = '';
|
| refreshRagUI();
|
| log('π RAG index cleared','w');
|
| };
|
|
|
| window.ragSearch = function() {
|
| const query = document.getElementById('rag-query').value.trim();
|
| if (!query) { log('RAG: no query','w'); return; }
|
| if (!ragEngine.indexed) { log('RAG: nothing indexed yet','w'); return; }
|
| const result = ragEngine.query(query, 5, 1);
|
| const el = document.getElementById('rag-results');
|
| if (result.passages.length === 0) {
|
| el.innerHTML = '<div style="color:var(--fg-dim);font-style:italic">No passages found.</div>';
|
| return;
|
| }
|
| el.innerHTML = result.passages.map((p, i) =>
|
| `<div class="rag-passage"><div class="rag-score">#${i+1} score: ${p.score.toFixed(2)}</div><div class="rag-text">${esc(p.text)}</div></div>`
|
| ).join('');
|
| log(`π RAG: ${result.passages.length} passages for "${query}"`, 'g');
|
| };
|
|
|
| window.ragInjectPrompt = function() {
|
| const query = document.getElementById('rag-query').value.trim();
|
| if (!query) { log('RAG: no query for prompt','w'); return; }
|
| if (!ragEngine.indexed) { log('RAG: nothing indexed','w'); return; }
|
| const result = ragEngine.query(query, 5, 1);
|
| if (result.passages.length === 0) { log('RAG: no passages to inject','w'); return; }
|
|
|
| const inp = document.getElementById('uin');
|
| inp.value = result.prompt;
|
| inp.style.height = 'auto';
|
| inp.style.height = Math.min(inp.scrollHeight, 300) + 'px';
|
| inp.focus();
|
| log(`π RAG prompt injected (${result.passages.length} passages)`, 'g');
|
| };
|
|
|
|
|
| document.getElementById('rag-query').addEventListener('keydown', function(e) {
|
| if (e.key === 'Enter') { e.preventDefault(); ragSearch(); }
|
| });
|
|
|
|
|
| toolNetworkScan().catch(()=>{});
|
| </script>
|
| </body>
|
| </html>
|
|
|
