Skip to content

Commit c942626

Browse files
bayeggexbayeggex
committed
Patch & New sample🧙‍♂️
API and HTTP Control accelerated, Timeout bug fixed and new Web UI Interface added
1 parent 3a72682 commit c942626

File tree

10 files changed

+359
-50
lines changed

10 files changed

+359
-50
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,3 +9,4 @@ build/
99
.pio/
1010
lib/
1111
/.vscode/
12+
Docs.pdf

‎examples/Datatest/AITranslation.ino‎ renamed to ‎examples/AITranslation/AITranslation.ino‎

File renamed without changes.

‎examples/Datatest/ChatGpt.ino‎ renamed to ‎examples/ChatGpt/ChatGpt.ino‎

File renamed without changes.

‎examples/Datatest/HuggingFace.ino‎ renamed to ‎examples/HuggingFace/HuggingFace.ino‎

File renamed without changes.

‎examples/Datatest/QuestionAnswering.ino‎ renamed to ‎examples/QuestionAnswering/QuestionAnswering.ino‎

File renamed without changes.

‎examples/Datatest/TextGeneration.ino‎ renamed to ‎examples/TextGeneration/TextGeneration.ino‎

File renamed without changes.

‎examples/Datatest/TextSummarization.ino‎ renamed to ‎examples/TextSummarization/TextSummarization.ino‎

File renamed without changes.

‎examples/WebUIInterface/Web_UI_Interface.ino‎

Lines changed: 221 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,221 @@
1+
#include <WiFi.h>
2+
#include <WebServer.h>
3+
#include <AIChatbot.h>
4+
5+
const char* ssid = "YOUR_SSID";
6+
const char* password = "YOUR_PASSWORD";
7+
// const char* apiKey = "YOUR_CHATGPT_API_KEY"; //for OPENAI
8+
const char* apiKey = "YOUR_HUGGING_FACE_API_KEY"; //for Hugging face
9+
const char* model = "HuggingFaceH4/zephyr-7b-beta"
10+
11+
AIChatbot chatbot;
12+
WebServer server(80);
13+
14+
const char index_html[] PROGMEM = R"rawliteral(
15+
<!DOCTYPE html>
16+
<html lang="en">
17+
<head>
18+
<meta charset="UTF-8">
19+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
20+
<title>ESP32 ChatBot</title>
21+
<style>
22+
body {
23+
font-family: Arial, sans-serif;
24+
background-color: #1e1e1e;
25+
color: white;
26+
margin: 0;
27+
padding: 20px;
28+
display: flex;
29+
flex-direction: column;
30+
align-items: center;
31+
}
32+
33+
#chat {
34+
width: 100%;
35+
max-width: 500px;
36+
height: 400px;
37+
overflow-y: auto;
38+
background-color: #2c2c2c;
39+
padding: 10px;
40+
border-radius: 10px;
41+
border: 1px solid #444;
42+
}
43+
44+
.message {
45+
max-width: 80%;
46+
margin: 5px;
47+
padding: 10px;
48+
border-radius: 10px;
49+
word-wrap: break-word;
50+
}
51+
52+
.user {
53+
background-color: #007bff;
54+
align-self: flex-end;
55+
color: white;
56+
}
57+
58+
.bot {
59+
background-color: #444;
60+
align-self: flex-start;
61+
}
62+
63+
#inputContainer {
64+
display: flex;
65+
width: 100%;
66+
max-width: 500px;
67+
margin-top: 10px;
68+
}
69+
70+
#messageInput {
71+
flex: 1;
72+
padding: 10px;
73+
border: 1px solid #444;
74+
background-color: #2c2c2c;
75+
color: white;
76+
border-radius: 5px;
77+
}
78+
79+
button {
80+
padding: 10px;
81+
background-color: #007bff;
82+
color: white;
83+
border: none;
84+
margin-left: 10px;
85+
border-radius: 5px;
86+
cursor: pointer;
87+
}
88+
89+
button:hover {
90+
background-color: #0056b3;
91+
}
92+
93+
.typing {
94+
font-style: italic;
95+
color: #888;
96+
}
97+
</style>
98+
</head>
99+
<body>
100+
<h2> Arduino-AI-Chat-Library Interface </h2>
101+
<div id="chat"></div>
102+
103+
<div id="inputContainer">
104+
<input type="text" id="messageInput" placeholder="Message Your Microcontroller" />
105+
<button onclick="sendMessage()">Send</button>
106+
<button onclick="exportChat()">Export Chat</button>
107+
</div>
108+
109+
<footer>
110+
<p>Built with ❤️ by BayEggex | Powered by Your❤️</p>
111+
</footer>
112+
113+
<script>
114+
let chatHistory = "";
115+
116+
function appendMessage(sender, text) {
117+
var chatDiv = document.getElementById("chat");
118+
var messageDiv = document.createElement("div");
119+
messageDiv.className = "message " + sender;
120+
messageDiv.innerHTML = parseMarkdown(text);
121+
chatDiv.appendChild(messageDiv);
122+
chatDiv.scrollTop = chatDiv.scrollHeight;
123+
124+
chatHistory += sender.toUpperCase() + ": " + text + "\n";
125+
}
126+
127+
function sendMessage() {
128+
var input = document.getElementById("messageInput");
129+
var message = input.value.trim();
130+
if (message === "") return;
131+
132+
appendMessage("user", message);
133+
input.value = "";
134+
135+
var typingDiv = document.createElement("div");
136+
typingDiv.className = "typing";
137+
typingDiv.innerText = "Bot Typing...";
138+
document.getElementById("chat").appendChild(typingDiv);
139+
140+
var xhr = new XMLHttpRequest();
141+
xhr.open("POST", "/chat", true);
142+
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
143+
xhr.onreadystatechange = function () {
144+
if (xhr.readyState === 4) {
145+
document.getElementById("chat").removeChild(typingDiv);
146+
if (xhr.status === 200) {
147+
appendMessage("bot", xhr.responseText.trim());
148+
} else {
149+
appendMessage("bot", "Error");
150+
}
151+
}
152+
};
153+
xhr.send("message=" + encodeURIComponent(message));
154+
}
155+
156+
function exportChat() {
157+
const blob = new Blob([chatHistory], { type: 'text/plain' });
158+
const link = document.createElement('a');
159+
link.href = window.URL.createObjectURL(blob);
160+
link.download = "chat_history.txt";
161+
link.click();
162+
}
163+
164+
function parseMarkdown(text) {
165+
text = text.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
166+
text = text.replace(/\*(.*?)\*/g, '<em>$1</em>');
167+
return text;
168+
}
169+
170+
</script>
171+
</body>
172+
</html>
173+
)rawliteral";
174+
175+
176+
void setup() {
177+
Serial.begin(115200);
178+
WiFi.begin(ssid, password);
179+
Serial.print("Connecting to Wi-Fi...");
180+
while (WiFi.status() != WL_CONNECTED) {
181+
delay(500);
182+
Serial.print(".");
183+
}
184+
Serial.println("\nConnected to Wi-Fi!");
185+
Serial.print("IP Address: ");
186+
Serial.println(WiFi.localIP());
187+
188+
Serial.println("Now, open your browser and type in the " + WiFi.localIP().toString() + " Address shown above.");
189+
190+
chatbot.setKey(apiKey, "huggingface");
191+
//tested AI MODEL AND AI
192+
chatbot.selectAI("huggingface", model);
193+
194+
195+
server.on("/", HTTP_GET, []() {
196+
server.send_P(200, "text/html", index_html);
197+
});
198+
199+
server.on("/chat", HTTP_POST, []() {
200+
if (server.hasArg("message")) {
201+
String message = server.arg("message");
202+
Serial.println("Received message: " + message);
203+
204+
if (WiFi.status() == WL_CONNECTED) {
205+
String response = chatbot.getResponse(message);
206+
server.send(200, "text/plain", response);
207+
} else {
208+
server.send(503, "text/plain", "No Wi-Fi connection.");
209+
}
210+
} else {
211+
server.send(400, "text/plain", "Missing parameter: message");
212+
}
213+
});
214+
215+
server.begin();
216+
Serial.println("Web server started.");
217+
}
218+
219+
void loop() {
220+
server.handleClient();
221+
}

0 commit comments

Comments
 (0)