diff options
Diffstat (limited to 'main.html')
| -rw-r--r-- | main.html | 70 |
1 files changed, 70 insertions, 0 deletions
@@ -315,6 +315,26 @@ } .ollama-status.connected { background: rgba(0, 255, 0, 0.1); border: 1px solid var(--success-color); } .ollama-status.disconnected { background: rgba(255, 85, 85, 0.1); border: 1px solid var(--error-color); } + /* Toggle slider styles */ + #ollama-optimization-slider::before, #ollama-validator-slider::before { + content: ""; + position: absolute; + height: 20px; + width: 20px; + left: 2px; + bottom: 2px; + background: var(--text-color); + border-radius: 50%; + transition: 0.3s; + } + #ollama-optimization-toggle:checked + #ollama-optimization-slider::before, + #ollama-validator-toggle:checked + #ollama-validator-slider::before { + transform: translateX(22px); + } + #ollama-optimization-toggle:checked + #ollama-optimization-slider, + #ollama-validator-toggle:checked + #ollama-validator-slider { + border-color: var(--success-color); + } .copy-btn { position: absolute; top: 5px; @@ -635,6 +655,56 @@ </select> <button class="btn" onclick="webx11.setOllamaModel()" style="width: 100%;">Set Model</button> </div> + <hr style="border-color:var(--border-color); margin: 15px 0;"> + <h4 style="color: var(--accent-color); margin-bottom: 10px;">⚡ AI Agent Optimization</h4> + <div style="display:flex; align-items:center; gap:10px; margin-bottom: 12px;"> + <span style="color:var(--text-muted); font-size:0.85em;">Agent Loop Optimizations:</span> + <label style="position:relative; display:inline-block; width:48px; height:26px;"> + <input type="checkbox" id="ollama-optimization-toggle" onchange="webx11.toggleOptimization()" style="opacity:0; width:0; height:0;"> + <span id="ollama-optimization-slider" style="position:absolute; cursor:pointer; inset:0; background:var(--bg-tertiary); border:1px solid var(--border-color); border-radius:26px; transition:0.3s;"></span> + </label> + <span id="ollama-optimization-label" style="font-size:0.85em; color:var(--success-color);">Enabled</span> + </div> + <div style="font-size:0.8em; color:var(--text-muted); margin-bottom: 10px;"> + ⚡ Tool def caching, trivial query skip, parallel safe tools, debounced reflection<br> + <span style="color:var(--warning-color);">Disable for debugging or if model behaves unexpectedly. Reload after toggle.</span> + </div> + <hr style="border-color:var(--border-color); margin: 15px 0;"> + <h4 style="color: var(--info-color); margin-bottom: 10px;">🔍 Validator Agent (Future)</h4> + <div style="font-size:0.85em; color:var(--text-muted); margin-bottom: 10px;"> + A separate lightweight AI that validates the main agent's tool results. Has its own + endpoint and model — independent from your active AI model. + </div> + <div style="display:flex; align-items:center; gap:10px; margin-bottom: 10px;"> + <span style="color:var(--text-muted); font-size:0.85em;">Enable Validator:</span> + <label style="position:relative; display:inline-block; width:48px; height:26px;"> + <input type="checkbox" id="ollama-validator-toggle" onchange="webx11.toggleValidator()" style="opacity:0; width:0; height:0;"> + <span id="ollama-validator-slider" style="position:absolute; cursor:pointer; inset:0; background:var(--bg-tertiary); border:1px solid var(--border-color); border-radius:26px; transition:0.3s;"></span> + </label> + <span id="ollama-validator-label" style="font-size:0.85em; color:var(--text-muted);">Disabled</span> + </div> + <div style="margin-bottom: 8px;"> + <label style="display: block; margin-bottom: 3px; color: var(--text-muted); font-size:0.85em;">Validator Endpoint:</label> + <input type="text" id="validator-endpoint-input" class="module-url-input" value="http://localhost:11434" placeholder="http://localhost:11434" style="margin-bottom:6px;"> + <button class="btn" onclick="webx11.connectValidatorEndpoint()" style="width:100%; border-color:var(--info-color); color:var(--info-color);">🔌 Connect & Load Models</button> + <div id="validator-connection-status" style="font-size:0.8em; margin-top:4px;"></div> + </div> + <div style="margin-bottom: 10px;"> + <label style="display: block; margin-bottom: 3px; color: var(--text-muted); font-size:0.85em;">Validator Model:</label> + <select id="validator-model-select" class="module-url-input" style="margin-bottom:6px;" disabled> + <option value="">Connect to load models</option> + </select> + <button class="btn" onclick="webx11.saveValidatorConfig()" style="width:100%; border-color:var(--info-color); color:var(--info-color);">Save Validator Config</button> + </div> + <div style="font-size:0.8em; color:var(--warning-color); border:1px solid var(--border-color); border-radius:4px; padding:10px; margin-top:10px;"> + <strong>⚠️ Connection Notes</strong><br> + • Cloud models (deepseek-v4*, gemma4:*b-cloud) via Ollama proxy often <strong>ignore tool calls</strong> + and answer from training data instead. Use local models for tool calling.<br> + • To connect to local Ollama from a web page: set <code>OLLAMA_ORIGINS</code> on the server: + <code>export OLLAMA_ORIGINS="https://webx11.duckdns.org"</code> then restart Ollama.<br> + • Test local connection: open a terminal and run <code>curl http://localhost:11434/api/tags</code><br> + • If you see <strong>403</strong> errors in console: the <code>OLLAMA_ORIGINS</code> env var isn't matching your page URL. + </div> </div> <div class="modal-footer"> <button class="btn" onclick="webx11.closeOllamaManager()">Close</button> |