@naarang/ccc 1.0.15 → 1.1.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +170 -56
- package/dist/claude/manager.js +1 -1
- package/dist/claude/project-setup.js +1 -1
- package/dist/claude/session.js +1 -1
- package/dist/claude/stream-parser.js +1 -1
- package/dist/index.js +1 -1
- package/dist/mqtt/client.js +1 -1
- package/dist/mqtt-broker.js +1 -1
- package/dist/ngrok/manager.js +1 -1
- package/dist/proxy/router.js +1 -0
- package/dist/public/terminal.html +250 -0
- package/dist/terminal/server.js +1 -0
- package/dist/types/index.js +1 -1
- package/dist/utils/auto-update.js +1 -1
- package/dist/utils/logger.js +1 -1
- package/dist/utils/version.js +1 -1
- package/package.json +6 -2
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
6
|
+
<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' 'unsafe-eval' ws: wss:;">
|
|
7
|
+
<title>Terminal - Claude Code Chat</title>
|
|
8
|
+
<link rel="stylesheet" href="/xterm/xterm.css" />
|
|
9
|
+
<style>
|
|
10
|
+
* {
|
|
11
|
+
margin: 0;
|
|
12
|
+
padding: 0;
|
|
13
|
+
box-sizing: border-box;
|
|
14
|
+
}
|
|
15
|
+
body {
|
|
16
|
+
background: #1A1A19;
|
|
17
|
+
font-family: 'JetBrains Mono', 'Menlo', 'Monaco', 'Courier New', monospace;
|
|
18
|
+
overflow: hidden;
|
|
19
|
+
-webkit-user-select: none;
|
|
20
|
+
-webkit-touch-callout: none;
|
|
21
|
+
}
|
|
22
|
+
#terminal {
|
|
23
|
+
width: 100vw;
|
|
24
|
+
height: 100vh;
|
|
25
|
+
padding: 10px;
|
|
26
|
+
}
|
|
27
|
+
.xterm {
|
|
28
|
+
height: 100%;
|
|
29
|
+
width: 100%;
|
|
30
|
+
}
|
|
31
|
+
.loading {
|
|
32
|
+
position: fixed;
|
|
33
|
+
top: 50%;
|
|
34
|
+
left: 50%;
|
|
35
|
+
transform: translate(-50%, -50%);
|
|
36
|
+
color: #DA7756;
|
|
37
|
+
font-size: 16px;
|
|
38
|
+
text-align: center;
|
|
39
|
+
padding: 20px;
|
|
40
|
+
}
|
|
41
|
+
#debug {
|
|
42
|
+
position: fixed;
|
|
43
|
+
bottom: 10px;
|
|
44
|
+
left: 10px;
|
|
45
|
+
color: #666666;
|
|
46
|
+
font-size: 10px;
|
|
47
|
+
max-width: 90%;
|
|
48
|
+
word-wrap: break-word;
|
|
49
|
+
}
|
|
50
|
+
</style>
|
|
51
|
+
</head>
|
|
52
|
+
<body>
|
|
53
|
+
<div id="loading" class="loading">Connecting to terminal...</div>
|
|
54
|
+
<div id="terminal" style="display: none;"></div>
|
|
55
|
+
<div id="debug"></div>
|
|
56
|
+
|
|
57
|
+
<!-- Load xterm from local server -->
|
|
58
|
+
<script src="/xterm/xterm.js"></script>
|
|
59
|
+
<script src="/xterm/addon-fit.js"></script>
|
|
60
|
+
<script>
|
|
61
|
+
(function() {
|
|
62
|
+
var debug = document.getElementById('debug');
|
|
63
|
+
function log(msg) {
|
|
64
|
+
console.log(msg);
|
|
65
|
+
debug.textContent = msg;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
log('Script loaded');
|
|
69
|
+
|
|
70
|
+
function init() {
|
|
71
|
+
log('Init called');
|
|
72
|
+
|
|
73
|
+
// Check if Terminal exists on window
|
|
74
|
+
var Terminal = window.Terminal;
|
|
75
|
+
var FitAddon = window.FitAddon;
|
|
76
|
+
|
|
77
|
+
log('Terminal: ' + typeof Terminal + ', FitAddon: ' + typeof FitAddon);
|
|
78
|
+
|
|
79
|
+
if (typeof Terminal === 'undefined') {
|
|
80
|
+
document.getElementById('loading').textContent = 'Failed to load Terminal library';
|
|
81
|
+
document.getElementById('loading').style.color = '#EF4444';
|
|
82
|
+
log('ERROR: Terminal undefined');
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
if (typeof FitAddon === 'undefined') {
|
|
87
|
+
document.getElementById('loading').textContent = 'Failed to load FitAddon';
|
|
88
|
+
document.getElementById('loading').style.color = '#EF4444';
|
|
89
|
+
log('ERROR: FitAddon undefined');
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
log('Creating terminal...');
|
|
94
|
+
|
|
95
|
+
try {
|
|
96
|
+
// Initialize terminal with CCC dark theme colors
|
|
97
|
+
var term = new Terminal({
|
|
98
|
+
cursorBlink: true,
|
|
99
|
+
fontSize: 14,
|
|
100
|
+
fontFamily: "'JetBrains Mono', 'Menlo', 'Monaco', 'Courier New', monospace",
|
|
101
|
+
theme: {
|
|
102
|
+
background: '#1A1A19',
|
|
103
|
+
foreground: '#F0F0F0',
|
|
104
|
+
cursor: '#DA7756',
|
|
105
|
+
cursorAccent: '#1A1A19',
|
|
106
|
+
selectionBackground: 'rgba(218, 119, 86, 0.3)',
|
|
107
|
+
black: '#1A1A19',
|
|
108
|
+
red: '#EF4444',
|
|
109
|
+
green: '#4ADE80',
|
|
110
|
+
yellow: '#F59E0B',
|
|
111
|
+
blue: '#60A5FA',
|
|
112
|
+
magenta: '#DA7756',
|
|
113
|
+
cyan: '#22D3EE',
|
|
114
|
+
white: '#F0F0F0',
|
|
115
|
+
brightBlack: '#666666',
|
|
116
|
+
brightRed: '#FCA5A5',
|
|
117
|
+
brightGreen: '#86EFAC',
|
|
118
|
+
brightYellow: '#FCD34D',
|
|
119
|
+
brightBlue: '#93C5FD',
|
|
120
|
+
brightMagenta: '#E89B81',
|
|
121
|
+
brightCyan: '#67E8F9',
|
|
122
|
+
brightWhite: '#FFFFFF',
|
|
123
|
+
},
|
|
124
|
+
allowProposedApi: true,
|
|
125
|
+
});
|
|
126
|
+
|
|
127
|
+
log('Terminal created, adding fit addon...');
|
|
128
|
+
|
|
129
|
+
// Add fit addon
|
|
130
|
+
var fitAddon = new FitAddon.FitAddon();
|
|
131
|
+
term.loadAddon(fitAddon);
|
|
132
|
+
|
|
133
|
+
log('Opening terminal...');
|
|
134
|
+
|
|
135
|
+
// Open terminal
|
|
136
|
+
term.open(document.getElementById('terminal'));
|
|
137
|
+
fitAddon.fit();
|
|
138
|
+
|
|
139
|
+
log('Connecting to WebSocket...');
|
|
140
|
+
|
|
141
|
+
// Connect to WebSocket
|
|
142
|
+
var protocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
|
|
143
|
+
var wsUrl = protocol + '//' + location.host + location.pathname;
|
|
144
|
+
log('WS URL: ' + wsUrl);
|
|
145
|
+
|
|
146
|
+
var socket = new WebSocket(wsUrl);
|
|
147
|
+
|
|
148
|
+
socket.onopen = function() {
|
|
149
|
+
log('WebSocket connected!');
|
|
150
|
+
|
|
151
|
+
// Hide loading, show terminal
|
|
152
|
+
document.getElementById('loading').style.display = 'none';
|
|
153
|
+
document.getElementById('terminal').style.display = 'block';
|
|
154
|
+
|
|
155
|
+
setTimeout(function() {
|
|
156
|
+
fitAddon.fit();
|
|
157
|
+
debug.style.display = 'none'; // Hide debug info once connected
|
|
158
|
+
}, 100);
|
|
159
|
+
|
|
160
|
+
// Welcome message with CCC branding
|
|
161
|
+
term.writeln('\x1b[38;5;209m✓ Connected to CCC Terminal\x1b[0m');
|
|
162
|
+
term.writeln('');
|
|
163
|
+
term.focus();
|
|
164
|
+
};
|
|
165
|
+
|
|
166
|
+
socket.onmessage = function(event) {
|
|
167
|
+
term.write(event.data);
|
|
168
|
+
};
|
|
169
|
+
|
|
170
|
+
socket.onerror = function(error) {
|
|
171
|
+
log('WebSocket error: ' + error);
|
|
172
|
+
document.getElementById('loading').textContent = 'Connection error';
|
|
173
|
+
document.getElementById('loading').style.color = '#EF4444';
|
|
174
|
+
document.getElementById('loading').style.display = 'block';
|
|
175
|
+
};
|
|
176
|
+
|
|
177
|
+
socket.onclose = function(event) {
|
|
178
|
+
log('WebSocket closed: ' + event.code);
|
|
179
|
+
term.writeln('');
|
|
180
|
+
term.writeln('\x1b[38;5;214m⚠ Connection closed\x1b[0m');
|
|
181
|
+
if (event.reason) {
|
|
182
|
+
term.writeln('\x1b[38;5;214m ' + event.reason + '\x1b[0m');
|
|
183
|
+
}
|
|
184
|
+
};
|
|
185
|
+
|
|
186
|
+
// Send user input to server
|
|
187
|
+
term.onData(function(data) {
|
|
188
|
+
if (socket.readyState === WebSocket.OPEN) {
|
|
189
|
+
socket.send(data);
|
|
190
|
+
}
|
|
191
|
+
});
|
|
192
|
+
|
|
193
|
+
// Handle terminal resize
|
|
194
|
+
term.onResize(function(size) {
|
|
195
|
+
log('Resized: ' + size.cols + 'x' + size.rows);
|
|
196
|
+
});
|
|
197
|
+
|
|
198
|
+
// Fit terminal on window resize
|
|
199
|
+
window.addEventListener('resize', function() {
|
|
200
|
+
fitAddon.fit();
|
|
201
|
+
});
|
|
202
|
+
|
|
203
|
+
// Handle page visibility change
|
|
204
|
+
document.addEventListener('visibilitychange', function() {
|
|
205
|
+
if (!document.hidden) {
|
|
206
|
+
fitAddon.fit();
|
|
207
|
+
}
|
|
208
|
+
});
|
|
209
|
+
|
|
210
|
+
} catch (error) {
|
|
211
|
+
log('ERROR: ' + error.message);
|
|
212
|
+
document.getElementById('loading').textContent = 'Error: ' + error.message;
|
|
213
|
+
document.getElementById('loading').style.color = '#EF4444';
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
// Try multiple strategies to ensure scripts are loaded
|
|
218
|
+
var attempts = 0;
|
|
219
|
+
var maxAttempts = 100;
|
|
220
|
+
|
|
221
|
+
function tryInit() {
|
|
222
|
+
attempts++;
|
|
223
|
+
log('Attempt ' + attempts + '/' + maxAttempts);
|
|
224
|
+
|
|
225
|
+
if (window.Terminal && window.FitAddon) {
|
|
226
|
+
log('Libraries found!');
|
|
227
|
+
init();
|
|
228
|
+
} else if (attempts < maxAttempts) {
|
|
229
|
+
setTimeout(tryInit, 100);
|
|
230
|
+
} else {
|
|
231
|
+
log('Timeout: Libraries not loaded');
|
|
232
|
+
document.getElementById('loading').textContent = 'Timeout loading libraries';
|
|
233
|
+
document.getElementById('loading').style.color = '#EF4444';
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
// Start trying after DOM is ready
|
|
238
|
+
if (document.readyState === 'loading') {
|
|
239
|
+
document.addEventListener('DOMContentLoaded', function() {
|
|
240
|
+
log('DOM loaded, starting init');
|
|
241
|
+
setTimeout(tryInit, 100);
|
|
242
|
+
});
|
|
243
|
+
} else {
|
|
244
|
+
log('DOM ready, starting init');
|
|
245
|
+
setTimeout(tryInit, 100);
|
|
246
|
+
}
|
|
247
|
+
})();
|
|
248
|
+
</script>
|
|
249
|
+
</body>
|
|
250
|
+
</html>
|