Skip to content

Commit 7550c48

Browse files
committed
wip
1 parent 19e6454 commit 7550c48

File tree

5 files changed

+119
-61
lines changed

5 files changed

+119
-61
lines changed

demo/demo-js/cypress.config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ module.exports = defineConfig({
66
baseUrl: 'http://localhost:7682/',
77
supportFile: 'cypress/support/e2e.js',
88
specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}',
9+
watchForFileChanges: false, // Disable watching for file changes to avoid unnecessary reloads
910
// viewportWidth: 1280,
1011
// viewportHeight: 720,
1112
viewportWidth: 2560,

demo/demo-js/cypress/e2e/launcher_introduction.cy.js

Lines changed: 41 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -23,41 +23,37 @@ describe('Cognotik Launcher - Comprehensive Introduction', () => {
2323
cy.wait(1000);
2424

2525
// Show different API providers
26-
cy.narrate('api_providers_overview');
2726
cy.get('#api-keys-container').should('be.visible');
28-
27+
cy.narrate('api_providers_overview');
28+
2929
// Local Tools tab
30-
cy.narrate('local_tools_explanation');
3130
cy.get('[data-tab="local-tools"]').click();
32-
cy.wait(1000);
3331
cy.get('#local-tools-container').should('be.visible');
34-
32+
cy.narrate('local_tools_explanation');
33+
3534
// Close user settings
3635
cy.get('#close-user-settings-modal').click();
3736

3837
// Step 1: Cognitive Modes
3938
cy.narrate('step1_cognitive_modes');
4039

41-
// Chat Mode (Single Task)
40+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(1) > :nth-child(1)').click()
41+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(1) > :nth-child(1) > .tooltip').click();
4242
cy.narrate('chat_mode_explanation');
43-
cy.get('#single-task-mode').should('be.checked');
44-
cy.get('label[for="single-task-mode"]').should('contain', 'Chat');
45-
46-
// Autonomous Mode
43+
44+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(2) > :nth-child(1) > .tooltip').click()
4745
cy.narrate('autonomous_mode_explanation');
4846
cy.get('#auto-plan-mode').check();
49-
cy.get('#auto-plan-settings').should('be.visible');
5047
cy.narrate('autonomous_settings_explanation');
51-
52-
// Plan Ahead Mode
48+
49+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(3) > :nth-child(1)').click()
50+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(3) > :nth-child(1) > .tooltip').click()
5351
cy.narrate('plan_ahead_mode_explanation');
54-
cy.get('#plan-ahead-mode').check();
55-
cy.get('#auto-plan-settings').should('not.be.visible');
56-
57-
// Goal Oriented Mode
52+
53+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(4) > :nth-child(1)').click()
54+
cy.get('#cognitive-mode > :nth-child(4) > :nth-child(4) > :nth-child(1) > .tooltip').click()
5855
cy.narrate('goal_oriented_mode_explanation');
59-
cy.get('#goal-oriented-mode').check();
60-
56+
6157
// Return to Chat mode for demonstration
6258
cy.get('#single-task-mode').check();
6359
cy.get('#next-to-task-settings').click();
@@ -78,8 +74,8 @@ describe('Cognotik Launcher - Comprehensive Introduction', () => {
7874

7975
// Temperature Setting
8076
cy.narrate('temperature_explanation');
81-
cy.get('#temperature').invoke('val', 0.5).trigger('input');
82-
cy.get('#temperature-value').should('contain', '0.5');
77+
cy.get('#temperature').invoke('val', 0.2).trigger('input');
78+
cy.get('#temperature-value').should('contain', '0.2');
8379

8480
// Auto Fix
8581
cy.narrate('auto_fix_explanation');
@@ -91,57 +87,50 @@ describe('Cognotik Launcher - Comprehensive Introduction', () => {
9187
cy.narrate('step3_task_types');
9288

9389
// Insight Task
90+
cy.get('#task-toggles > :nth-child(1) > div > .tooltip').click();
9491
cy.narrate('insight_task_explanation');
95-
cy.get('#task-InsightTask').check();
92+
//cy.get('#task-InsightTask').check();
9693

9794
// File Modification Task
95+
cy.get('#task-toggles > :nth-child(2) > div > .tooltip').click();
9896
cy.narrate('file_modification_task_explanation');
99-
cy.get('#task-FileModificationTask').check();
100-
97+
// cy.get('#task-FileModificationTask').check();
98+
10199
// Shell Command Task
100+
cy.get('#task-toggles > :nth-child(3) > div > .tooltip').click();
102101
cy.narrate('shell_command_task_explanation');
103-
cy.get('#task-RunShellCommandTask').check();
104-
102+
// cy.get('#task-RunShellCommandTask').check();
103+
105104
// Code Execution Task
105+
cy.get('#task-toggles > :nth-child(4) > div > .tooltip').click();
106106
cy.narrate('code_execution_task_explanation');
107-
cy.get('#task-RunCodeTask').check();
108-
107+
// cy.get('#task-RunCodeTask').check();
108+
109109
// Auto Fix Task
110+
cy.get('#task-toggles > :nth-child(5) > div > .tooltip').click();
110111
cy.narrate('auto_fix_task_explanation');
111-
cy.get('#task-CommandAutoFixTask').check();
112-
112+
// cy.get('#task-CommandAutoFixTask').check();
113+
113114
// File Search Task
114-
cy.narrate('file_search_task_explanation');
115-
cy.get('#task-FileSearchTask').check();
116-
115+
cy.get('#task-toggles > :nth-child(6) > div > .tooltip').click();
116+
cy.narrate('file_search_task_explanation')
117+
// cy.get('#task-FileSearchTask').check();
118+
117119
// Web Search Task
120+
cy.get('#task-toggles > :nth-child(7) > div > .tooltip').click();
118121
cy.narrate('web_search_task_explanation');
119-
cy.get('#task-CrawlerAgentTask').check();
120-
122+
// cy.get('#task-CrawlerAgentTask').check();
123+
121124
// GitHub Search Task
125+
cy.get('#task-toggles > :nth-child(8) > div > .tooltip').click();
122126
cy.narrate('github_search_task_explanation');
123-
cy.get('#task-GitHubSearchTask').check();
124-
127+
//cy.get('#task-GitHubSearchTask').check();
128+
125129
cy.get('#next-to-launch').click();
126-
127-
// Step 4: Launch
128130
cy.narrate('step4_launch');
129-
130-
// Review summaries
131131
cy.narrate('review_configuration');
132-
cy.get('#cognitive-mode-summary').should('be.visible');
133-
cy.get('#task-settings-summary').should('be.visible');
134-
cy.get('#api-settings-summary').should('be.visible');
135-
136-
// Launch button
137132
cy.narrate('launch_button_explanation');
138-
cy.get('#launch-session').should('be.visible');
139-
140-
// Basic Chat alternative
141133
cy.narrate('basic_chat_alternative');
142-
cy.get('#open-basic-chat').should('be.visible');
143-
144-
// Conclusion
145134
cy.narrate('introduction_conclusion');
146135
});
147136
});

desktop/src/main/resources/welcome/welcome.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -348,6 +348,8 @@ body {
348348
position: relative;
349349
display: inline-block;
350350
margin-left: 5px;
351+
cursor: pointer;
352+
user-select: none;
351353
}
352354

353355
.tooltip .tooltiptext {
@@ -368,6 +370,10 @@ body {
368370
}
369371

370372
.tooltip:hover .tooltiptext {
373+
/* Remove hover behavior */
374+
}
375+
376+
.tooltip.active .tooltiptext {
371377
visibility: visible;
372378
opacity: 1;
373379
}

desktop/src/main/resources/welcome/welcome.html

Lines changed: 36 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,8 @@ <h3>Basic Chat Settings</h3>
3838
</select>
3939
</div>
4040
<div class="form-group">
41-
<label for="basic-chat-temperature">Temperature: <span class="tooltip">?<span class="tooltiptext">Controls randomness in AI responses. Lower values (0.0-0.3) are more deterministic, higher values (0.7-1.0) are more creative.</span></span></label>
41+
<label for="basic-chat-temperature">Temperature: <span class="tooltip">?<span
42+
class="tooltiptext"><strong>Temperature Control</strong><br><br>Controls the randomness and creativity of AI responses:<br><br><strong>0.0-0.3:</strong> More deterministic and focused<br><strong>0.4-0.6:</strong> Balanced creativity<br><strong>0.7-1.0:</strong> More creative and varied</span></span></label>
4243
<input id="basic-chat-temperature" type="range" min="0" max="1" step="0.01" value="0.3">
4344
<span id="basic-chat-temperature-value">0.3</span>
4445
</div>
@@ -127,26 +128,52 @@ <h3>Step 1: Choose Cognitive Mode</h3>
127128
<div>
128129
<input checked id="single-task-mode" name="cognitive-mode" type="radio" value="single-task">
129130
<label for="single-task-mode">Chat</label>
130-
<span class="tooltip">?
131-
<span class="tooltiptext">Execute individual tasks with AI assistance. Best for focused, specific tasks.</span>
132-
</span>
131+
<span class="tooltip">?<span class="tooltiptext">
132+
<div>
133+
<h2>Interactive Conversation with AI Assistance</h2>
134+
<ul class="features-list">
135+
<li>Execute individual tasks</li>
136+
<li>Direct Q&A format</li>
137+
<li>Best for focused, specific questions</li>
138+
<li>Real-time collaboration</li>
139+
</ul>
140+
</div>
141+
</span></span>
133142
</div>
134143
</div>
135144
<div class="task-toggle">
136145
<div>
137146
<input id="auto-plan-mode" name="cognitive-mode" type="radio" value="auto-plan">
138147
<label for="auto-plan-mode">Autonomous</label>
139-
<span class="tooltip">?
140-
<span class="tooltiptext">Let AI automatically plan and execute complex development tasks with minimal guidance.</span>
141-
</span>
148+
<span class="tooltip">?<span class="tooltiptext">
149+
<div>
150+
<h2>AI-Driven Feedback Loop</h2>
151+
<ul class="features-list">
152+
<li>Automatic task breakdown</li>
153+
<li>Self-directed execution</li>
154+
<li>Minimal human intervention</li>
155+
<li>Best for complex, multi-step projects</li>
156+
</ul>
157+
</div>
158+
</span></span>
142159
</div>
143160
</div>
144161
<div class="task-toggle">
145162
<div>
146163
<input id="plan-ahead-mode" name="cognitive-mode" type="radio" value="plan-ahead">
147164
<label for="plan-ahead-mode">Plan Ahead</label>
148165
<span class="tooltip">?
149-
<span class="tooltiptext">Work with AI to create detailed plans before execution, with more control over the process.</span>
166+
<span class="tooltiptext">
167+
<div>
168+
<h2>Structured Planning with AI Guidance</h2>
169+
<ul class="features-list">
170+
<li>Iterative planning and execution</li>
171+
<li>AI assists in task breakdown</li>
172+
<li>Focus on achieving specific goals</li>
173+
<li>Best for projects requiring detailed planning</li>
174+
</ul>
175+
</div>
176+
</span>
150177
</span>
151178
</div>
152179
</div>
@@ -209,7 +236,7 @@ <h3>Step 2: Configure Settings</h3>
209236
</div>
210237
</div>
211238
<div class="form-group">
212-
<label for="temperature">Temperature: <span class="tooltip">?<span class="tooltiptext">Controls randomness in AI responses. Lower values (0.0-0.3) are more deterministic, higher values (0.7-1.0) are more creative.</span></span></label>
239+
<label for="temperature">Temperature: <span class="tooltip">?<span class="tooltiptext"><strong>Temperature Control</strong><br><br>Controls the randomness and creativity of AI responses:<br><br><strong>0.0-0.3:</strong> More deterministic and focused<br><strong>0.4-0.6:</strong> Balanced creativity<br><strong>0.7-1.0:</strong> More creative and varied</span></span></label>
213240
<input id="temperature" max="1" min="0" step="0.1" type="range" value="0.2">
214241
<span id="temperature-value">0.2</span>
215242
</div>

desktop/src/main/resources/welcome/welcome.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -269,6 +269,38 @@ function populateModelSelections(apiSettingsParam = null, taskSettingsParam = nu
269269
console.log('[populateModelSelections] Finished. Final modelSelect.value:', modelSelect.value, 'parsingModelSelect.value:', parsingModelSelect.value);
270270
}
271271

272+
function setupTooltips() {
273+
console.log('[setupTooltips] Called');
274+
275+
// Add click handlers to all tooltip elements
276+
document.querySelectorAll('.tooltip').forEach(tooltip => {
277+
tooltip.addEventListener('click', function(e) {
278+
e.stopPropagation();
279+
console.log('[setupTooltips] Tooltip clicked');
280+
281+
// Close all other tooltips
282+
document.querySelectorAll('.tooltip.active').forEach(activeTooltip => {
283+
if (activeTooltip !== tooltip) {
284+
activeTooltip.classList.remove('active');
285+
}
286+
});
287+
288+
// Toggle this tooltip
289+
tooltip.classList.toggle('active');
290+
});
291+
});
292+
293+
// Close tooltips when clicking outside
294+
document.addEventListener('click', function(e) {
295+
if (!e.target.closest('.tooltip')) {
296+
console.log('[setupTooltips] Clicked outside tooltip, closing all');
297+
document.querySelectorAll('.tooltip.active').forEach(tooltip => {
298+
tooltip.classList.remove('active');
299+
});
300+
}
301+
});
302+
}
303+
272304
// HTTP service for better testability
273305
class HttpService {
274306
constructor(dependencies = {}) {
@@ -410,6 +442,9 @@ document.addEventListener('DOMContentLoaded', function () {
410442

411443
setupEventListeners();
412444
console.log('[DOMContentLoaded] setupEventListeners called.');
445+
setupTooltips();
446+
console.log('[DOMContentLoaded] setupTooltips called.');
447+
413448

414449
loadSettingsFromServer();
415450
console.log('[DOMContentLoaded] loadSettingsFromServer called.');

0 commit comments

Comments
 (0)