Update static/index.html
Browse files- static/index.html +22 -12
static/index.html
CHANGED
|
@@ -161,18 +161,28 @@
|
|
| 161 |
}
|
| 162 |
|
| 163 |
function addMessage(sender, message, className) {
|
| 164 |
-
|
| 165 |
-
|
| 166 |
-
|
| 167 |
-
|
| 168 |
-
|
| 169 |
-
|
| 170 |
-
|
| 171 |
-
|
| 172 |
-
|
| 173 |
-
|
| 174 |
-
|
| 175 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 176 |
|
| 177 |
function showTypingIndicator() {
|
| 178 |
const typingElement = document.createElement("div");
|
|
|
|
| 161 |
}
|
| 162 |
|
| 163 |
function addMessage(sender, message, className) {
|
| 164 |
+
const chatHistory = document.getElementById("chat-history");
|
| 165 |
+
const messageElement = document.createElement("div");
|
| 166 |
+
messageElement.className = `message ${className}`;
|
| 167 |
+
|
| 168 |
+
// Check if the message contains a URL
|
| 169 |
+
const linkRegex = /(https?:\/\/[^\s]+)/g;
|
| 170 |
+
const formattedMessage = message.replace(linkRegex, function(url) {
|
| 171 |
+
return `<a href="${url}" target="_blank">${url}</a>`;
|
| 172 |
+
});
|
| 173 |
+
|
| 174 |
+
const icon = sender === "User" ? '<i class="fas fa-user user-icon"></i>' : '<i class="fas fa-user-tie"></i>';
|
| 175 |
+
messageElement.innerHTML = `${icon}<div>${formattedMessage} <span class="timestamp">${new Date().toLocaleTimeString()}</span></div>`;
|
| 176 |
+
|
| 177 |
+
messageElement.onclick = function() {
|
| 178 |
+
const timestamp = messageElement.querySelector('.timestamp');
|
| 179 |
+
timestamp.style.display = timestamp.style.display === 'none' ? 'block' : 'none';
|
| 180 |
+
};
|
| 181 |
+
|
| 182 |
+
chatHistory.appendChild(messageElement);
|
| 183 |
+
chatHistory.scrollTop = chatHistory.scrollHeight;
|
| 184 |
+
}
|
| 185 |
+
|
| 186 |
|
| 187 |
function showTypingIndicator() {
|
| 188 |
const typingElement = document.createElement("div");
|