Stanislav commited on
Commit
11feedc
·
1 Parent(s): 6461baf

feat: html with waiting spinning, split history sessions for different users fix

Browse files
Files changed (2) hide show
  1. run_fast_api.py +16 -3
  2. templates/chat.html +38 -1
run_fast_api.py CHANGED
@@ -60,26 +60,39 @@ chat_histories = {} # session_id -> list of chat messages
60
  async def homepage(request: Request, session_id: str = Cookie(default=None)):
61
  if not session_id:
62
  session_id = str(uuid4())
 
 
63
  chat_histories[session_id] = []
64
- history = chat_histories.get(session_id, [])
65
  response = templates.TemplateResponse("chat.html", {
66
  "request": request,
67
- "chat_history": history
68
  })
 
69
  response.set_cookie(key="session_id", value=session_id)
70
  return response
71
 
 
72
  @app.post("/ask", response_class=HTMLResponse)
73
  async def ask(request: Request, message: str = Form(...), session_id: str = Cookie(default=None)):
 
 
 
74
  if session_id not in chat_histories:
75
  chat_histories[session_id] = []
 
76
  response = engine.run(message)
77
  chat_histories[session_id].append({"user": message, "bot": response})
78
- return templates.TemplateResponse("chat.html", {
 
79
  "request": request,
80
  "chat_history": chat_histories[session_id]
81
  })
82
 
 
 
 
 
83
  @app.get("/static/favicon.png", include_in_schema=False)
84
  async def favicon():
85
  return FileResponse("static/favicon.png")
 
60
  async def homepage(request: Request, session_id: str = Cookie(default=None)):
61
  if not session_id:
62
  session_id = str(uuid4())
63
+
64
+ if session_id not in chat_histories:
65
  chat_histories[session_id] = []
66
+
67
  response = templates.TemplateResponse("chat.html", {
68
  "request": request,
69
+ "chat_history": chat_histories[session_id]
70
  })
71
+
72
  response.set_cookie(key="session_id", value=session_id)
73
  return response
74
 
75
+
76
  @app.post("/ask", response_class=HTMLResponse)
77
  async def ask(request: Request, message: str = Form(...), session_id: str = Cookie(default=None)):
78
+ if not session_id:
79
+ session_id = str(uuid4())
80
+
81
  if session_id not in chat_histories:
82
  chat_histories[session_id] = []
83
+
84
  response = engine.run(message)
85
  chat_histories[session_id].append({"user": message, "bot": response})
86
+
87
+ html = templates.TemplateResponse("chat.html", {
88
  "request": request,
89
  "chat_history": chat_histories[session_id]
90
  })
91
 
92
+ html.set_cookie(key="session_id", value=session_id)
93
+ return html
94
+
95
+
96
  @app.get("/static/favicon.png", include_in_schema=False)
97
  async def favicon():
98
  return FileResponse("static/favicon.png")
templates/chat.html CHANGED
@@ -5,6 +5,18 @@
5
  <link rel="icon" type="image/x-icon" href="/static/favicon.png">
6
  <meta charset="UTF-8">
7
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
  <body style="
10
  font-family: sans-serif;
@@ -34,6 +46,24 @@
34
  {% endfor %}
35
  </div>
36
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
37
  <!-- FORM -->
38
  <form method="post" action="/ask">
39
  <input type="text" name="message" placeholder="Ask something..." style="
@@ -57,7 +87,14 @@
57
  </form>
58
 
59
  </div>
60
- </body>
61
 
 
 
 
62
 
 
 
 
 
 
63
  </html>
 
5
  <link rel="icon" type="image/x-icon" href="/static/favicon.png">
6
  <meta charset="UTF-8">
7
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
+ <style>
9
+ @keyframes spin {
10
+ 0% { transform: rotate(0deg); }
11
+ 100% { transform: rotate(360deg); }
12
+ }
13
+
14
+ /* Push button */
15
+ button:active {
16
+ background-color: #e0a800;
17
+ transform: scale(0.98);
18
+ }
19
+ </style>
20
  </head>
21
  <body style="
22
  font-family: sans-serif;
 
46
  {% endfor %}
47
  </div>
48
 
49
+ <!-- SPINNER -->
50
+ <div id="loading" style="
51
+ display: none;
52
+ margin-bottom: 15px;
53
+ text-align: center;
54
+ ">
55
+ <div class="spinner" style="
56
+ border: 4px solid #333;
57
+ border-top: 4px solid #ffcc00;
58
+ border-radius: 50%;
59
+ width: 30px;
60
+ height: 30px;
61
+ animation: spin 1s linear infinite;
62
+ margin: 0 auto;
63
+ "></div>
64
+ <p style="color: #ffcc00; font-weight: bold;">Thinking...</p>
65
+ </div>
66
+
67
  <!-- FORM -->
68
  <form method="post" action="/ask">
69
  <input type="text" name="message" placeholder="Ask something..." style="
 
87
  </form>
88
 
89
  </div>
 
90
 
91
+ <script>
92
+ const form = document.querySelector("form");
93
+ const loading = document.getElementById("loading");
94
 
95
+ form.addEventListener("submit", () => {
96
+ loading.style.display = "block";
97
+ });
98
+ </script>
99
+ </body>
100
  </html>