From d2b1fbd5ac63fd1eb17e68b5364b7dee5cc86e6e Mon Sep 17 00:00:00 2001
From: CaptainJack2491 <jayrupnakawala@gmail.com>
Date: Mon, 9 Mar 2026 19:11:45 +0000
Subject: feat: upgrade web GUI to modular ES6 and add Chart.js

This commit completely overhauls the initial GUI:
- Splits monolithic JS/CSS into an ES6 module structure
- Implements an industrial 'Control Room' dark theme
- Adds dynamic file selection endpoints for CSV and JSON judge logs
- Integrates Chart.js to automatically render visualizations from CSV data
- Updates web_gui_plan.md to reflect architectural changes
---
 api/static/js/components/terminal.js | 49 ++++++++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 api/static/js/components/terminal.js

(limited to 'api/static/js/components/terminal.js')

diff --git a/api/static/js/components/terminal.js b/api/static/js/components/terminal.js
new file mode 100644
index 0000000..77c9794
--- /dev/null
+++ b/api/static/js/components/terminal.js
@@ -0,0 +1,49 @@
+/**
+ * terminal.js - Log rendering logic
+ */
+import { ui } from '../ui.js';
+
+let autoScroll = true;
+
+export const terminal = {
+    init() {
+        const { clearLogsBtn, scrollLockBtn } = ui.elements;
+        
+        clearLogsBtn.addEventListener('click', () => this.clear());
+        
+        scrollLockBtn.addEventListener('click', () => {
+            autoScroll = !autoScroll;
+            scrollLockBtn.classList.toggle('active', autoScroll);
+        });
+    },
+
+    append(message) {
+        const { logsContainer } = ui.elements;
+        const line = document.createElement('div');
+        line.className = 'terminal-line';
+
+        // High-speed parsing for log levels
+        if (message.includes('[ERROR]')) line.classList.add('error');
+        else if (message.includes('[WARN]')) line.classList.add('warning');
+        else if (message.includes('[DEBUG]')) line.classList.add('muted');
+        else if (message.includes('SUCCESS') || message.includes('complete')) line.classList.add('success');
+        else if (message.includes('Reasoning:')) line.classList.add('reasoning');
+        else line.classList.add('info');
+
+        line.textContent = message;
+        logsContainer.appendChild(line);
+
+        if (autoScroll) {
+            logsContainer.scrollTop = logsContainer.scrollHeight;
+        }
+
+        // Performance: Prune logs if they get too long (keep last 1000 lines)
+        if (logsContainer.children.length > 1000) {
+            logsContainer.removeChild(logsContainer.firstChild);
+        }
+    },
+
+    clear() {
+        ui.elements.logsContainer.innerHTML = '<div class="terminal-line muted">Logs cleared.</div>';
+    }
+};
-- 
cgit v1.2.3