Skip to content

Commit 866353b

Browse files
hellenicdevhellenicdev
committed
v01.2
1 parent 226de5b commit 866353b

File tree

3 files changed

+301
-290
lines changed

3 files changed

+301
-290
lines changed

‎codriver/index.html‎

Lines changed: 3 additions & 290 deletions
Original file line numberDiff line numberDiff line change
@@ -4,104 +4,7 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>Codriver - Your AI-powered Assistant</title>
7-
<style>
8-
body {
9-
font-family: Arial, sans-serif;
10-
margin: 0;
11-
padding: 0;
12-
background-color: #f4f4f9;
13-
}
14-
.fullscreen-container {
15-
width: 100vw;
16-
height: 100vh;
17-
display: flex;
18-
flex-direction: column;
19-
align-items: center;
20-
justify-content: center;
21-
}
22-
.title {
23-
color: blue;
24-
font-size: 30px;
25-
font-weight: bold;
26-
text-align: center;
27-
margin-bottom: 10px;
28-
}
29-
.mic-status {
30-
font-size: 14px;
31-
font-weight: bold;
32-
color: red;
33-
margin-bottom: 10px;
34-
display: none;
35-
}
36-
.chat-container {
37-
width: 100%;
38-
height: 80%;
39-
background: white;
40-
border-radius: 10px;
41-
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
42-
padding: 20px;
43-
display: flex;
44-
flex-direction: column;
45-
}
46-
.message-area {
47-
flex: 1;
48-
overflow-y: auto;
49-
border: 1px solid #ddd;
50-
border-radius: 8px;
51-
padding: 10px;
52-
margin-bottom: 15px;
53-
}
54-
.input-area {
55-
display: flex;
56-
gap: 10px;
57-
align-items: center;
58-
}
59-
.input-area input {
60-
flex: 1;
61-
padding: 10px;
62-
border: 1px solid #ddd;
63-
border-radius: 20px;
64-
}
65-
.input-area button {
66-
padding: 8px;
67-
width: 80px;
68-
height: 40px;
69-
border: none;
70-
background-color: #0078d7;
71-
color: white;
72-
border-radius: 20px;
73-
cursor: pointer;
74-
font-size: 14px;
75-
display: flex;
76-
justify-content: center;
77-
align-items: center;
78-
}
79-
.input-area button:hover {
80-
background-color: #005cbf;
81-
}
82-
.assistant-message-container {
83-
display: flex;
84-
align-items: center;
85-
gap: 10px;
86-
}
87-
.user-message {
88-
background-color: #d1e7dd;
89-
padding: 8px;
90-
border-radius: 5px;
91-
margin: 5px 0;
92-
font-size: 16px;
93-
color: #000;
94-
text-align: right;
95-
}
96-
.assistant-message {
97-
background-color: #e3f2fd;
98-
padding: 8px;
99-
border-radius: 5px;
100-
margin: 5px 0;
101-
font-size: 16px;
102-
color: #000;
103-
}
104-
</style>
7+
<link rel="stylesheet" href="style.css">
1058
</head>
1069
<body>
10710
<div class="fullscreen-container">
@@ -117,198 +20,8 @@
11720
</div>
11821
</div>
11922

120-
<script>
121-
// Global variables for game integration
122-
let gameActive = false;
123-
let secretNumber = null;
23+
<script src="script.js"></script>
12424

125-
const userInput = document.getElementById("userInput");
126-
const messageArea = document.getElementById("messageArea");
127-
const micStatus = document.getElementById("micStatus");
128-
const WEATHER_API_KEY = "5b72dabcdd9d4b67a75170510250304";
129-
const NYT_API_KEY = "N8j8mb3TSiexCbefuDeT1Ap5MgKPGwmw";
130-
131-
userInput.addEventListener("keypress", (event) => {
132-
if (event.key === "Enter") sendMessage();
133-
});
134-
135-
const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();
136-
recognition.lang = "en-US";
137-
recognition.interimResults = false;
138-
139-
recognition.addEventListener("start", () => micStatus.style.display = "block");
140-
recognition.addEventListener("end", () => micStatus.style.display = "none");
141-
142-
recognition.addEventListener("result", (event) => {
143-
userInput.value = event.results[0][0].transcript;
144-
sendMessage();
145-
});
146-
147-
function startListening() {
148-
recognition.start();
149-
}
150-
151-
async function fetchWeather(city) {
152-
try {
153-
const response = await fetch(`http://api.weatherapi.com/v1/current.json?key=${WEATHER_API_KEY}&q=${city}`);
154-
const data = await response.json();
155-
return `🌤 Weather in ${data.location.name}: ${data.current.temp_c}°C, ${data.current.condition.text}`;
156-
} catch (error) {
157-
return "Sorry, I couldn't fetch the weather.";
158-
}
159-
}
160-
161-
async function fetchNews() {
162-
try {
163-
const response = await fetch(`https://api.nytimes.com/svc/topstories/v2/home.json?api-key=${NYT_API_KEY}`);
164-
const data = await response.json();
165-
return data.results.slice(0, 5).map(article => `• ${article.title}`).join("\n");
166-
} catch (error) {
167-
return "Sorry, I couldn't fetch the top news.";
168-
}
169-
}
170-
171-
function getRandomQuote() {
172-
return [
173-
"The only limit to our realization of tomorrow is our doubts of today.",
174-
"Be the change you wish to see in the world.",
175-
"Life is 10% what happens to us and 90% how we react to it.",
176-
"Keep your face always toward the sunshine—and shadows will fall behind you."
177-
][Math.floor(Math.random() * 4)];
178-
}
179-
180-
function getRandomFunFact() {
181-
return [
182-
"Honey never spoils!",
183-
"Bananas are berries, but strawberries aren't!",
184-
"Sharks existed before trees.",
185-
"Octopuses have three hearts."
186-
][Math.floor(Math.random() * 4)];
187-
}
188-
189-
function getRandomJoke() {
190-
return [
191-
"Why don't scientists trust atoms? Because they make up everything!",
192-
"Why did the scarecrow win an award? Because he was outstanding in his field!",
193-
"I told my computer I needed a break, and it said 'No problem, I'll go to sleep.'"
194-
][Math.floor(Math.random() * 3)];
195-
}
196-
197-
function getRandomRiddle() {
198-
return [
199-
"What has keys but can’t open locks? A piano.",
200-
"What can travel around the world while staying in one spot? A stamp.",
201-
"What gets wetter the more it dries? A towel."
202-
][Math.floor(Math.random() * 3)];
203-
}
204-
205-
function getCurrentTime() {
206-
const now = new Date();
207-
const hours = now.getHours();
208-
const minutes = String(now.getMinutes()).padStart(2, "0");
209-
const period = hours >= 12 ? "PM" : "AM";
210-
const formattedHours = hours % 12 || 12;
211-
return `The current time is ${formattedHours}:${minutes} ${period}`;
212-
}
213-
214-
function speak(text) {
215-
const utterance = new SpeechSynthesisUtterance(text);
216-
window.speechSynthesis.speak(utterance);
217-
}
218-
219-
async function sendMessage() {
220-
const input = userInput.value.trim();
221-
if (!input) return;
222-
223-
// Always display the user's message first
224-
const userMessage = document.createElement("p");
225-
userMessage.textContent = "You: " + input;
226-
userMessage.classList.add("user-message");
227-
messageArea.appendChild(userMessage);
228-
229-
// If a game is active, handle game input first
230-
if (gameActive) {
231-
if (/exit game/i.test(input)) {
232-
gameActive = false;
233-
addAssistantMessage("Game exited. How else can I assist you?");
234-
userInput.value = "";
235-
return;
236-
} else if (/^\d+$/.test(input)) {
237-
const guess = parseInt(input, 10);
238-
if (guess === secretNumber) {
239-
gameActive = false;
240-
addAssistantMessage("Congratulations! You guessed it right.");
241-
} else if (guess < secretNumber) {
242-
addAssistantMessage("Too low. Try again!");
243-
} else {
244-
addAssistantMessage("Too high. Try again!");
245-
}
246-
userInput.value = "";
247-
return;
248-
} else {
249-
addAssistantMessage("We're in a game! Please enter a number guess or type 'exit game' to quit.");
250-
userInput.value = "";
251-
return;
252-
}
253-
}
254-
255-
let response = "";
256-
257-
// Handle various commands
258-
if (/hello|hi|hey|greetings/i.test(input)) {
259-
response = "Hello! How can I assist you today?";
260-
} else if (/quote/i.test(input)) {
261-
response = getRandomQuote();
262-
} else if (/weather/i.test(input)) {
263-
const city = input.split(" ").pop();
264-
response = await fetchWeather(city);
265-
} else if (/news/i.test(input)) {
266-
response = await fetchNews();
267-
} else if (/fun fact/i.test(input)) {
268-
response = getRandomFunFact();
269-
} else if (/joke/i.test(input)) {
270-
response = getRandomJoke();
271-
} else if (/riddle/i.test(input)) {
272-
response = getRandomRiddle();
273-
} else if (/time/i.test(input)) {
274-
response = getCurrentTime();
275-
} else if (/game/i.test(input)) {
276-
gameActive = true;
277-
secretNumber = Math.floor(Math.random() * 10) + 1;
278-
response = "Let's play a game! I'm thinking of a number between 1 and 10. What's your guess?";
279-
} else if (/calculate|what'?s|what is|^[0-9+\-*/().\s]+$/i.test(input)) {
280-
try {
281-
const expression = input.replace(/[^0-9+\-*/().]/g, "");
282-
const result = Function("'use strict'; return (" + expression + ")")();
283-
response = `The result is ${result}`;
284-
} catch (e) {
285-
response = "I couldn't calculate that. Please check your expression.";
286-
}
287-
} else {
288-
response = "Sorry, I didn't understand that.";
289-
}
290-
291-
addAssistantMessage(response);
292-
userInput.value = "";
293-
messageArea.scrollTop = messageArea.scrollHeight;
294-
}
295-
296-
function addAssistantMessage(response) {
297-
const assistantContainer = document.createElement("div");
298-
assistantContainer.classList.add("assistant-message-container");
299-
300-
const assistantMessage = document.createElement("p");
301-
assistantMessage.textContent = "Codriver: " + response;
302-
assistantMessage.classList.add("assistant-message");
303-
304-
const assistantSpeaker = document.createElement("button");
305-
assistantSpeaker.textContent = "🔊";
306-
assistantSpeaker.onclick = () => speak(response);
307-
308-
assistantContainer.appendChild(assistantMessage);
309-
assistantContainer.appendChild(assistantSpeaker);
310-
messageArea.appendChild(assistantContainer);
311-
}
312-
</script>
25+
<p><b>© 2025 - 2026 HellenicDev <br> All Rights Reserved.</b></p>
31326
</body>
31427
</html>

0 commit comments

Comments
 (0)