diff --git a/gpt/index.html b/gpt/index.html index 784bb12..897435e 100644 --- a/gpt/index.html +++ b/gpt/index.html @@ -1,164 +1,679 @@ - - -Neural Terminal + + + NEURAL-NET TERMINAL v2.1 + + /* Terminal Container */ + .terminal { + height: 100vh; + display: flex; + flex-direction: column; + padding: 8px; + } + + /* Header */ + .header { + border: 1px solid var(--crt-green-dim); + padding: 8px 12px; + margin-bottom: 8px; + display: flex; + justify-content: space-between; + align-items: center; + flex-shrink: 0; + } + + .header-title { + font-weight: bold; + letter-spacing: 2px; + } + + .header-status { + display: flex; + gap: 16px; + font-size: 12px; + color: var(--crt-green-dim); + } + + .status-indicator { + display: flex; + align-items: center; + gap: 6px; + } + + .status-dot { + width: 8px; + height: 8px; + border-radius: 50%; + background: var(--crt-green-dim); + } + + .status-dot.online { + background: var(--crt-green); + box-shadow: 0 0 6px var(--crt-green); + } + + .status-dot.offline { + background: #ff3333; + box-shadow: 0 0 6px #ff3333; + } + + /* Output Area */ + .output { + flex: 1; + overflow-y: auto; + border: 1px solid var(--crt-green-dim); + padding: 12px; + margin-bottom: 8px; + scrollbar-width: none; + } + + .output::-webkit-scrollbar { + display: none; + } + + .output-line { + margin-bottom: 4px; + word-wrap: break-word; + } + + .output-line.user { + color: var(--crt-green-bright); + } + + .output-line.user::before { + content: '> '; + color: var(--crt-green-dim); + } + + .output-line.system { + color: var(--crt-green-dim); + font-style: italic; + } + + .output-line.ai { + color: var(--crt-green); + padding-left: 2ch; + } + + .output-line.error { + color: #ff6666; + } + + /* Input Area */ + .input-area { + border: 1px solid var(--crt-green-dim); + padding: 8px 12px; + display: flex; + align-items: center; + gap: 8px; + flex-shrink: 0; + } + + .input-prompt { + color: var(--crt-green); + font-weight: bold; + flex-shrink: 0; + } + + .input-field { + flex: 1; + background: transparent; + border: none; + outline: none; + color: var(--crt-green); + font-family: inherit; + font-size: inherit; + caret-color: var(--crt-green); + caret-shape: block; + } + + .input-field::placeholder { + color: var(--crt-green-dim); + } + + /* Footer */ + .footer { + display: flex; + justify-content: space-between; + padding: 4px 0; + font-size: 11px; + color: var(--crt-green-dim); + flex-shrink: 0; + } + + /* Config Panel */ + .config-panel { + display: none; + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: var(--crt-bg); + border: 2px solid var(--crt-green); + padding: 20px; + z-index: 100; + min-width: 400px; + max-width: 90vw; + } + + .config-panel.visible { + display: block; + } + + .config-panel h2 { + margin-bottom: 16px; + font-size: 14px; + letter-spacing: 2px; + } + + .config-group { + margin-bottom: 12px; + } + + .config-group label { + display: block; + margin-bottom: 4px; + color: var(--crt-green-dim); + font-size: 12px; + } + + .config-group input, + .config-group select { + width: 100%; + background: var(--crt-bg-light); + border: 1px solid var(--crt-green-dim); + color: var(--crt-green); + padding: 6px 8px; + font-family: inherit; + font-size: 13px; + } + + .config-group input:focus, + .config-group select:focus { + outline: none; + border-color: var(--crt-green); + } + + .config-buttons { + display: flex; + gap: 8px; + margin-top: 16px; + } + + .config-btn { + flex: 1; + background: transparent; + border: 1px solid var(--crt-green-dim); + color: var(--crt-green); + padding: 8px; + font-family: inherit; + cursor: pointer; + } + + .config-btn:hover { + background: var(--crt-green-dim); + color: var(--crt-bg); + } + + .config-btn.primary { + border-color: var(--crt-green); + } + + /* Screen flicker animation */ + @keyframes flicker { + 0%, 100% { opacity: 1; } + 92% { opacity: 1; } + 93% { opacity: 0.8; } + 94% { opacity: 1; } + } + + .terminal { + animation: flicker 8s infinite; + } + - -
+
+ +
+
+ NEURAL-NET TERMINAL v2.1 +
+
+ + OFFLINE +
+
+
-
- NEURAL TERMINAL v1.0 - AI: OFFLINE - +
+
NEURAL-NET TERMINAL v2.1 initialized
+
Type 'help' for available commands
+
Type 'config' to configure AI backend
+
─────────────────────────────────────
+
+ +
+ $ + +
+ +
+ COMMANDS: help | config | clear | status + +
-
+ +
+

[ AI BACKEND CONFIGURATION ]

+ +
+ + +
-
- >> - +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + + +
-
+ + const cmd = trimmed.toLowerCase(); + switch (cmd) { + case 'help': + addLine('', ''); + addLine('Available commands:', 'system'); + addLine(' help - Show this help', 'system'); + addLine(' config - Configure AI backend', 'system'); + addLine(' status - Show connection status', 'system'); + addLine(' clear - Clear screen', 'system'); + addLine(' date - Show current date/time', 'system'); + addLine('', ''); + addLine('Any other input is sent to the AI', 'system'); + break; + + case 'config': + openConfig(); + break; + + case 'status': + addLine('', ''); + addLine('CONNECTION STATUS:', 'system'); + addLine(' Enabled: ' + (aiConfig.enabled ? 'YES' : 'NO'), 'system'); + addLine(' Endpoint: ' + (aiConfig.endpoint || 'Not configured'), 'system'); + addLine(' Model: ' + (aiConfig.model || 'Not configured'), 'system'); + addLine(' Type: ' + (aiConfig.type || 'unknown'), 'system'); + break; + + case 'clear': + clearOutput(); + break; + + case 'date': + addLine(new Date().toString(), 'system'); + break; + + default: + queryAI(trimmed); + } + } + + /* ============================================ + INPUT HANDLING + ============================================ */ + inputField.addEventListener('keydown', function(e) { + if (e.key === 'Enter' && !isProcessing) { + processCommand(this.value); + this.value = ''; + } else if (e.key === 'ArrowUp') { + e.preventDefault(); + if (historyIndex < commandHistory.length - 1) { + historyIndex++; + this.value = commandHistory[historyIndex]; + } + } else if (e.key === 'ArrowDown') { + e.preventDefault(); + if (historyIndex > 0) { + historyIndex--; + this.value = commandHistory[historyIndex]; + } else { + historyIndex = -1; + this.value = ''; + } + } + }); + + /* ============================================ + INITIALIZATION + ============================================ */ + updateStatus(); + updateTime(); + setInterval(updateTime, 1000); + inputField.focus(); + + // Click anywhere to focus input + document.addEventListener('click', function(e) { + if (!configPanel.contains(e.target)) { + inputField.focus(); + } + }); + - \ No newline at end of file +