Hugging Face's logo

Spaces:
Adieee5
/
JUIT_AI_Assist
Sleeping

App Files Community
Adieee5 commited on
Commit
0382f8f
·
verified ·
1 Parent(s): d8f820c

Update templates/chat.html

Browse files
Files changed (1) hide show
  1. templates/chat.html +21 -24
templates/chat.html CHANGED
@@ -30,27 +30,24 @@
30
 
31
  <body>
32
  <div class="container-fluid h-100">
33
- <div class="row justify-content-center h-100">
34
- <div class="col-12 col-md-8 col-xl-6 chat">
35
  <div class="card">
36
  <div class="card-header msg_head">
37
  <div class="d-flex bd-highlight">
38
  <div class="img_cont">
39
- <img src="/static/images/juitlogo.png" class="rounded-circle user_img">
40
  <span class="online_icon"></span>
41
  </div>
42
 
43
  <div class="user_info">
44
  <span>JUIT AI Assist</span>
45
- <p>Explore College and Beyond: Ask Anything! 🎓</p>
46
- <!-- Add this inside the card-header (after user_info div) -->
47
-
48
  </div>
49
- <div class="d-flex flex-column align-items-end ml-auto">
50
  <button id="themeToggle" class="btn btn-sm btn-light" style="position: static;">Light Mode</button>
51
-
52
  <button id="clearChat" class="btn btn-danger btn-sm mt-2">Clear Chat</button>
53
- </div>
54
  </div>
55
  </div>
56
 
@@ -155,14 +152,14 @@
155
  chatHistory.push(rawText); // Store the user's message in history
156
  currentIndex = chatHistory.length - 1; // Update the current index
157
  var userHtml = `
158
- <div class="d-flex justify-content-end mb-4">
159
- <div class="msg_container_send">${rawText}
160
- <span class="msg_time_send">${str_time}</span>
161
- </div>
162
- <div class="img_cont_msg">
163
- <img src="/static/images/user.png" class="rounded-circle user_img_msg">
164
- </div>
165
- </div>`;
166
  $("#text").val(""); // Clear the input field
167
  $("#messageFormeight").append(userHtml); // Add the user message to the chat
168
  $(document).ready(function () {
@@ -201,12 +198,12 @@
201
  url: "/get",
202
  }).done(function (response) {
203
  let botHtml = `
204
- <div class="d-flex justify-content-start mb-4">
205
- <div class="img_cont_msg">
206
- <img src="/static/images/juitlogo.png" class="rounded-circle user_img_msg">
207
- </div>
208
- <div class="msg_container">${response}<span class="msg_time">${time}</span></div>
209
- </div>`;
210
  $("#messageFormeight").append($.parseHTML(botHtml));
211
  $("#messageFormeight").animate({ scrollTop: $("#messageFormeight")[0].scrollHeight }, 500);
212
  });
@@ -235,7 +232,7 @@
235
 
236
  // Create the container for the bot message
237
  var botContainer = $('<div class="d-flex justify-content-start mb-4"></div>');
238
- var imgDiv = $('<div class="img_cont_msg"><img src="/static/images/juitlogo.png" class="rounded-circle user_img_msg"></div>');
239
  var msgDiv = $('<div class="msg_container"></div>');
240
  botContainer.append(imgDiv);
241
  botContainer.append(msgDiv);
 
30
 
31
  <body>
32
  <div class="container-fluid h-100">
33
+ <div class="row no-gutters h-100">
34
+ <div class=" chat">
35
  <div class="card">
36
  <div class="card-header msg_head">
37
  <div class="d-flex bd-highlight">
38
  <div class="img_cont">
39
+ <img src="/static/images/juit.png" class="rounded-circle user_img">
40
  <span class="online_icon"></span>
41
  </div>
42
 
43
  <div class="user_info">
44
  <span>JUIT AI Assist</span>
45
+ <p font-size="200px">Explore College and Beyond: Ask Anything! 🎓</p>
 
 
46
  </div>
47
+ <div class="d-flex flex-row align-items-baseline ml-auto">
48
  <button id="themeToggle" class="btn btn-sm btn-light" style="position: static;">Light Mode</button>
 
49
  <button id="clearChat" class="btn btn-danger btn-sm mt-2">Clear Chat</button>
50
+ </div>
51
  </div>
52
  </div>
53
 
 
152
  chatHistory.push(rawText); // Store the user's message in history
153
  currentIndex = chatHistory.length - 1; // Update the current index
154
  var userHtml = `
155
+ <div class="d-flex justify-content-end mb-4">
156
+ <div class="msg_container_send">${rawText}
157
+ <span class="msg_time_send">${str_time}</span>
158
+ </div>
159
+ <div class="img_cont_msg">
160
+ <img src="/static/images/user.png" class="rounded-circle user_img_msg">
161
+ </div>
162
+ </div>`;
163
  $("#text").val(""); // Clear the input field
164
  $("#messageFormeight").append(userHtml); // Add the user message to the chat
165
  $(document).ready(function () {
 
198
  url: "/get",
199
  }).done(function (response) {
200
  let botHtml = `
201
+ <div class="d-flex justify-content-start mb-4">
202
+ <div class="img_cont_msg">
203
+ <img src="/static/images/juit.png" class="rounded-circle user_img_msg">
204
+ </div>
205
+ <div class="msg_container">${response}<span class="msg_time">${time}</span></div>
206
+ </div>`;
207
  $("#messageFormeight").append($.parseHTML(botHtml));
208
  $("#messageFormeight").animate({ scrollTop: $("#messageFormeight")[0].scrollHeight }, 500);
209
  });
 
232
 
233
  // Create the container for the bot message
234
  var botContainer = $('<div class="d-flex justify-content-start mb-4"></div>');
235
+ var imgDiv = $('<div class="img_cont_msg"><img src="/static/images/juit.png" class="rounded-circle user_img_msg"></div>');
236
  var msgDiv = $('<div class="msg_container"></div>');
237
  botContainer.append(imgDiv);
238
  botContainer.append(msgDiv);