1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
/**
* ui.js - Global UI Utilities
*/
export const ui = {
get elements() {
return {
scenarioSelect: document.getElementById('scenario-select'),
modelSelect: document.getElementById('model-select'),
oversightSelect: document.getElementById('oversight-select'),
runsInput: document.getElementById('runs-input'),
runBtn: document.getElementById('run-btn'),
cancelBtn: document.getElementById('cancel-btn'),
statusBadge: document.getElementById('status-badge'),
statusTime: document.getElementById('status-time'),
logsContainer: document.getElementById('logs-container'),
csvResults: document.getElementById('csv-results'),
imageResults: document.getElementById('image-results'),
judgeResults: document.getElementById('judge-results'),
interactiveCharts: document.getElementById('interactive-charts'),
csvFileSelect: document.getElementById('csv-file-select'),
chartFileSelect: document.getElementById('chart-file-select'),
judgeFileSelect: document.getElementById('judge-file-select'),
tabTriggers: document.querySelectorAll('.tab-trigger'),
tabPanels: document.querySelectorAll('.tab-panel'),
clearLogsBtn: document.getElementById('clear-logs-btn'),
scrollLockBtn: document.getElementById('scroll-lock-btn')
};
},
updateStatus(status, time = null) {
const { statusBadge, statusTime } = this.elements;
statusBadge.className = `badge badge-${status}`;
statusBadge.textContent = status.toUpperCase();
if (time) {
const date = new Date(time);
statusTime.textContent = date.toLocaleTimeString();
} else if (status === 'idle') {
statusTime.textContent = '';
}
},
initTabs(onTabChange) {
this.elements.tabTriggers.forEach(trigger => {
trigger.addEventListener('click', () => {
const tabId = trigger.dataset.tab;
this.elements.tabTriggers.forEach(t => t.classList.remove('active'));
this.elements.tabPanels.forEach(p => p.classList.remove('active'));
trigger.classList.add('active');
document.getElementById(`tab-${tabId}`).classList.add('active');
if (onTabChange) onTabChange(tabId);
});
});
}
};
|
