@jvittechs/j 1.0.11
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 +25 -0
- package/dist/chunk-6XCY6MPX.js +400 -0
- package/dist/chunk-6XCY6MPX.js.map +1 -0
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +16875 -0
- package/dist/cli.js.map +1 -0
- package/dist/summary-G3W57YYB.js +9 -0
- package/dist/summary-G3W57YYB.js.map +1 -0
- package/dist/web-chat/README.md +418 -0
- package/dist/web-chat/app.js +2012 -0
- package/dist/web-chat/index.html +325 -0
- package/dist/web-chat/style.css +2129 -0
- package/package.json +101 -0
- package/redmine.config.example.yaml +29 -0
- package/scripts/postinstall.js +75 -0
- package/scripts/redmine-sync-issue.sh +35 -0
|
@@ -0,0 +1,325 @@
|
|
|
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">
|
|
6
|
+
<title>Jai1 • Web Chat</title>
|
|
7
|
+
<link rel="stylesheet" href="style.css">
|
|
8
|
+
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>⚡</text></svg>">
|
|
9
|
+
<!-- Prevent flash of wrong theme -->
|
|
10
|
+
<script>
|
|
11
|
+
(function() {
|
|
12
|
+
try {
|
|
13
|
+
const saved = localStorage.getItem('wc_theme');
|
|
14
|
+
const theme = saved ? JSON.parse(saved) : null;
|
|
15
|
+
if (theme) {
|
|
16
|
+
document.documentElement.setAttribute('data-theme', theme);
|
|
17
|
+
} else if (window.matchMedia('(prefers-color-scheme: light)').matches) {
|
|
18
|
+
document.documentElement.setAttribute('data-theme', 'light');
|
|
19
|
+
}
|
|
20
|
+
} catch (e) {}
|
|
21
|
+
})();
|
|
22
|
+
</script>
|
|
23
|
+
<!-- Typography: JetBrains Mono for code, Inter for readability -->
|
|
24
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
25
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
26
|
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
27
|
+
<!-- zero-md for markdown rendering -->
|
|
28
|
+
<script type="module" src="https://cdn.jsdelivr.net/npm/zero-md@3?register"></script>
|
|
29
|
+
</head>
|
|
30
|
+
<body>
|
|
31
|
+
<!-- Grain overlay for texture -->
|
|
32
|
+
<div class="grain-overlay" aria-hidden="true"></div>
|
|
33
|
+
|
|
34
|
+
<!-- Ambient background effects -->
|
|
35
|
+
<div class="ambient-bg" aria-hidden="true">
|
|
36
|
+
<div class="ambient-orb ambient-orb-1"></div>
|
|
37
|
+
<div class="ambient-orb ambient-orb-2"></div>
|
|
38
|
+
</div>
|
|
39
|
+
|
|
40
|
+
<div id="app">
|
|
41
|
+
<!-- Header -->
|
|
42
|
+
<header class="header">
|
|
43
|
+
<div class="header-left">
|
|
44
|
+
<div class="logo-container">
|
|
45
|
+
<span class="logo-icon">⚡</span>
|
|
46
|
+
<div class="logo-text">
|
|
47
|
+
<span class="logo-brand">JAI1</span>
|
|
48
|
+
<span class="logo-divider">/</span>
|
|
49
|
+
<span class="logo-product">chat</span>
|
|
50
|
+
</div>
|
|
51
|
+
<span class="badge-experimental">Thử Nghiệm</span>
|
|
52
|
+
</div>
|
|
53
|
+
<div class="connection-status" id="connection-status">
|
|
54
|
+
<span class="status-dot"></span>
|
|
55
|
+
<span class="status-text">connected</span>
|
|
56
|
+
</div>
|
|
57
|
+
</div>
|
|
58
|
+
<div class="header-right">
|
|
59
|
+
<button class="btn-theme-toggle" id="theme-toggle-btn" title="Toggle theme">
|
|
60
|
+
<svg class="icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
61
|
+
<circle cx="12" cy="12" r="5"></circle>
|
|
62
|
+
<line x1="12" y1="1" x2="12" y2="3"></line>
|
|
63
|
+
<line x1="12" y1="21" x2="12" y2="23"></line>
|
|
64
|
+
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
|
|
65
|
+
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
|
|
66
|
+
<line x1="1" y1="12" x2="3" y2="12"></line>
|
|
67
|
+
<line x1="21" y1="12" x2="23" y2="12"></line>
|
|
68
|
+
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
|
|
69
|
+
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
|
|
70
|
+
</svg>
|
|
71
|
+
<svg class="icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
72
|
+
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
|
|
73
|
+
</svg>
|
|
74
|
+
</button>
|
|
75
|
+
<button class="btn-icon" id="toggle-right-sidebar-btn" title="Toggle Stats Panel">
|
|
76
|
+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
77
|
+
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
|
|
78
|
+
<line x1="15" y1="3" x2="15" y2="21"></line>
|
|
79
|
+
</svg>
|
|
80
|
+
</button>
|
|
81
|
+
|
|
82
|
+
</div>
|
|
83
|
+
</header>
|
|
84
|
+
|
|
85
|
+
<!-- Main Content -->
|
|
86
|
+
<main class="main">
|
|
87
|
+
<!-- Left Sidebar - Threads -->
|
|
88
|
+
<aside class="sidebar sidebar-left" id="sidebar">
|
|
89
|
+
<div class="sidebar-header">
|
|
90
|
+
<button id="new-chat-btn" class="btn btn-new-chat">
|
|
91
|
+
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
92
|
+
<line x1="12" y1="5" x2="12" y2="19"></line>
|
|
93
|
+
<line x1="5" y1="12" x2="19" y2="12"></line>
|
|
94
|
+
</svg>
|
|
95
|
+
<span>New Thread</span>
|
|
96
|
+
<kbd class="shortcut">⌘N</kbd>
|
|
97
|
+
</button>
|
|
98
|
+
</div>
|
|
99
|
+
<div class="sidebar-section">
|
|
100
|
+
<div class="sidebar-section-title">
|
|
101
|
+
<span class="section-icon">◈</span>
|
|
102
|
+
<span>Threads</span>
|
|
103
|
+
</div>
|
|
104
|
+
<div class="conversations-list" id="conversations-list">
|
|
105
|
+
<!-- Conversations will be rendered here -->
|
|
106
|
+
</div>
|
|
107
|
+
</div>
|
|
108
|
+
<div class="sidebar-footer">
|
|
109
|
+
<div class="session-info">
|
|
110
|
+
<span class="session-icon">◉</span>
|
|
111
|
+
<span class="session-text">Session active</span>
|
|
112
|
+
</div>
|
|
113
|
+
</div>
|
|
114
|
+
</aside>
|
|
115
|
+
|
|
116
|
+
<!-- Chat Area -->
|
|
117
|
+
<section class="chat-area">
|
|
118
|
+
<div class="messages-container">
|
|
119
|
+
<div class="messages" id="messages">
|
|
120
|
+
<!-- Welcome message -->
|
|
121
|
+
<div class="welcome-message" id="welcome-message">
|
|
122
|
+
<div class="welcome-content">
|
|
123
|
+
<div class="welcome-glyph">
|
|
124
|
+
<span class="glyph-main">⚡</span>
|
|
125
|
+
<div class="glyph-ring"></div>
|
|
126
|
+
</div>
|
|
127
|
+
<h1 class="welcome-title">
|
|
128
|
+
<span class="title-prefix">~/</span>jai1 chat
|
|
129
|
+
</h1>
|
|
130
|
+
<p class="welcome-subtitle">Your AI-powered development companion</p>
|
|
131
|
+
|
|
132
|
+
<div class="welcome-features">
|
|
133
|
+
<div class="feature-card">
|
|
134
|
+
<div class="feature-icon">→</div>
|
|
135
|
+
<div class="feature-content">
|
|
136
|
+
<div class="feature-title">Code Generation</div>
|
|
137
|
+
<div class="feature-desc">Generate, refactor, and explain code</div>
|
|
138
|
+
</div>
|
|
139
|
+
</div>
|
|
140
|
+
<div class="feature-card">
|
|
141
|
+
<div class="feature-icon">→</div>
|
|
142
|
+
<div class="feature-content">
|
|
143
|
+
<div class="feature-title">Multi-Model</div>
|
|
144
|
+
<div class="feature-desc">Switch between Claude, GPT, Gemini</div>
|
|
145
|
+
</div>
|
|
146
|
+
</div>
|
|
147
|
+
<div class="feature-card">
|
|
148
|
+
<div class="feature-icon">→</div>
|
|
149
|
+
<div class="feature-content">
|
|
150
|
+
<div class="feature-title">Local Storage</div>
|
|
151
|
+
<div class="feature-desc">Conversations persist in your browser</div>
|
|
152
|
+
</div>
|
|
153
|
+
</div>
|
|
154
|
+
</div>
|
|
155
|
+
|
|
156
|
+
<div class="welcome-hints">
|
|
157
|
+
<div class="hint">
|
|
158
|
+
<kbd>Enter</kbd>
|
|
159
|
+
<span>Send message</span>
|
|
160
|
+
</div>
|
|
161
|
+
<div class="hint">
|
|
162
|
+
<kbd>Shift + Enter</kbd>
|
|
163
|
+
<span>New line</span>
|
|
164
|
+
</div>
|
|
165
|
+
<div class="hint">
|
|
166
|
+
<kbd>⌘ + N</kbd>
|
|
167
|
+
<span>New thread</span>
|
|
168
|
+
</div>
|
|
169
|
+
</div>
|
|
170
|
+
</div>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
</div>
|
|
174
|
+
|
|
175
|
+
<!-- Input Area -->
|
|
176
|
+
<div class="input-area">
|
|
177
|
+
<!-- Model & Agent Selectors -->
|
|
178
|
+
<div class="input-selectors">
|
|
179
|
+
<div class="selector-group">
|
|
180
|
+
<label for="agent-select" class="selector-label">
|
|
181
|
+
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
182
|
+
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
|
183
|
+
<circle cx="12" cy="7" r="4"></circle>
|
|
184
|
+
</svg>
|
|
185
|
+
<span>Agent:</span>
|
|
186
|
+
</label>
|
|
187
|
+
<select id="agent-select" class="selector-select">
|
|
188
|
+
<option value="default">⚡ General Assistant</option>
|
|
189
|
+
</select>
|
|
190
|
+
</div>
|
|
191
|
+
<div class="selector-divider"></div>
|
|
192
|
+
<div class="selector-group">
|
|
193
|
+
<label for="model-select" class="selector-label">
|
|
194
|
+
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
195
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
196
|
+
<path d="M12 6v6l4 2"></path>
|
|
197
|
+
</svg>
|
|
198
|
+
<span>Model:</span>
|
|
199
|
+
</label>
|
|
200
|
+
<select id="model-select" class="selector-select">
|
|
201
|
+
<option value="">loading...</option>
|
|
202
|
+
</select>
|
|
203
|
+
</div>
|
|
204
|
+
</div>
|
|
205
|
+
<div class="input-container">
|
|
206
|
+
<div class="input-prefix">
|
|
207
|
+
<span class="prefix-symbol">❯</span>
|
|
208
|
+
</div>
|
|
209
|
+
<textarea
|
|
210
|
+
id="message-input"
|
|
211
|
+
placeholder="Ask anything..."
|
|
212
|
+
rows="1"
|
|
213
|
+
autofocus
|
|
214
|
+
></textarea>
|
|
215
|
+
<div class="input-actions">
|
|
216
|
+
<span id="char-count" class="char-count"></span>
|
|
217
|
+
<button id="send-btn" class="btn-send" disabled title="Send message">
|
|
218
|
+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
219
|
+
<line x1="5" y1="12" x2="19" y2="12"></line>
|
|
220
|
+
<polyline points="12 5 19 12 12 19"></polyline>
|
|
221
|
+
</svg>
|
|
222
|
+
</button>
|
|
223
|
+
</div>
|
|
224
|
+
</div>
|
|
225
|
+
<div class="input-footer">
|
|
226
|
+
<span class="footer-hint">Jai1 can make mistakes. Verify important information.</span>
|
|
227
|
+
</div>
|
|
228
|
+
</div>
|
|
229
|
+
</section>
|
|
230
|
+
|
|
231
|
+
<!-- Right Sidebar - Stats & Utilities -->
|
|
232
|
+
<aside class="sidebar sidebar-right" id="sidebar-right">
|
|
233
|
+
<div class="sidebar-section">
|
|
234
|
+
<div class="sidebar-section-title">
|
|
235
|
+
<span class="section-icon">📊</span>
|
|
236
|
+
<span>Model Usage</span>
|
|
237
|
+
<button id="refresh-stats-btn" class="btn-icon-small" title="Refresh stats">
|
|
238
|
+
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
239
|
+
<path d="M23 4v6h-6"></path>
|
|
240
|
+
<path d="M1 20v-6h6"></path>
|
|
241
|
+
<path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"></path>
|
|
242
|
+
</svg>
|
|
243
|
+
</button>
|
|
244
|
+
</div>
|
|
245
|
+
<div class="stats-date" id="stats-date">Today</div>
|
|
246
|
+
<div class="stats-list" id="stats-list">
|
|
247
|
+
<div class="stats-loading">
|
|
248
|
+
<span class="stats-loading-icon">◌</span>
|
|
249
|
+
<span>Loading stats...</span>
|
|
250
|
+
</div>
|
|
251
|
+
</div>
|
|
252
|
+
</div>
|
|
253
|
+
|
|
254
|
+
<div class="sidebar-section">
|
|
255
|
+
<div class="sidebar-section-title">
|
|
256
|
+
<span class="section-icon">📝</span>
|
|
257
|
+
<span>Quick Prompts</span>
|
|
258
|
+
</div>
|
|
259
|
+
<div class="prompts-list" id="prompts-list">
|
|
260
|
+
<button class="prompt-item" data-prompt="Explain this code:">
|
|
261
|
+
<span class="prompt-icon">→</span>
|
|
262
|
+
<span>Explain code</span>
|
|
263
|
+
</button>
|
|
264
|
+
<button class="prompt-item" data-prompt="Refactor this to be more efficient:">
|
|
265
|
+
<span class="prompt-icon">→</span>
|
|
266
|
+
<span>Refactor code</span>
|
|
267
|
+
</button>
|
|
268
|
+
<button class="prompt-item" data-prompt="Write tests for this:">
|
|
269
|
+
<span class="prompt-icon">→</span>
|
|
270
|
+
<span>Write tests</span>
|
|
271
|
+
</button>
|
|
272
|
+
<button class="prompt-item" data-prompt="Fix the bug in this code:">
|
|
273
|
+
<span class="prompt-icon">→</span>
|
|
274
|
+
<span>Fix bug</span>
|
|
275
|
+
</button>
|
|
276
|
+
<button class="prompt-item" data-prompt="Add comments to explain:">
|
|
277
|
+
<span class="prompt-icon">→</span>
|
|
278
|
+
<span>Add comments</span>
|
|
279
|
+
</button>
|
|
280
|
+
</div>
|
|
281
|
+
</div>
|
|
282
|
+
|
|
283
|
+
<div class="sidebar-footer">
|
|
284
|
+
<div class="stats-info">
|
|
285
|
+
<span class="stats-info-text">Stats update on chat success</span>
|
|
286
|
+
</div>
|
|
287
|
+
</div>
|
|
288
|
+
</aside>
|
|
289
|
+
</main>
|
|
290
|
+
|
|
291
|
+
<!-- Error Modal -->
|
|
292
|
+
<div id="error-modal" class="modal hidden">
|
|
293
|
+
<div class="modal-backdrop"></div>
|
|
294
|
+
<div class="modal-content">
|
|
295
|
+
<div class="modal-icon">
|
|
296
|
+
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
297
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
298
|
+
<line x1="12" y1="8" x2="12" y2="12"></line>
|
|
299
|
+
<line x1="12" y1="16" x2="12.01" y2="16"></line>
|
|
300
|
+
</svg>
|
|
301
|
+
</div>
|
|
302
|
+
<h3 id="error-title" class="modal-title">Session Expired</h3>
|
|
303
|
+
<p id="error-message" class="modal-message">Please run 'jai1 chat --web' again to start a new session.</p>
|
|
304
|
+
<div class="modal-actions">
|
|
305
|
+
<button id="error-close-btn" class="btn btn-primary">Understood</button>
|
|
306
|
+
</div>
|
|
307
|
+
</div>
|
|
308
|
+
</div>
|
|
309
|
+
|
|
310
|
+
<!-- Loading Overlay -->
|
|
311
|
+
<div id="loading-overlay" class="loading-overlay">
|
|
312
|
+
<div class="loading-content">
|
|
313
|
+
<div class="loading-spinner">
|
|
314
|
+
<div class="spinner-ring"></div>
|
|
315
|
+
<div class="spinner-core">⚡</div>
|
|
316
|
+
</div>
|
|
317
|
+
<p class="loading-text">Initializing<span class="loading-dots"></span></p>
|
|
318
|
+
</div>
|
|
319
|
+
</div>
|
|
320
|
+
</div>
|
|
321
|
+
|
|
322
|
+
|
|
323
|
+
<script src="app.js"></script>
|
|
324
|
+
</body>
|
|
325
|
+
</html>
|