Skip to content
Snippets Groups Projects
Commit 6ec48b84 authored by Swetha Lakshmana Murthy's avatar Swetha Lakshmana Murthy
Browse files

Restructure: agentic workflow code

parent aa3b6f12
No related branches found
No related tags found
No related merge requests found
Showing
with 367 additions and 3 deletions
# Use a slim Python base image
FROM python:3.10-slim
FROM python:3.12-slim
ENV PYTHONUNBUFFERED=1
......
from flask import Flask, render_template, request, redirect, url_for, session
from flask import Flask, render_template, request, redirect, url_for, session, jsonify, render_template_string
import logging
# Initialize Flask app
......@@ -45,3 +45,42 @@ def chat():
chat_history = ["No conversation history yet."]
return render_template("chat.html", chat_history=chat_history)
@app.route("/ask", methods=["POST"])
def ask():
data = request.get_json()
user_query = data.get("user_query", "")
if user_query:
logger.info(f"User query received via AJAX: {user_query}")
parameters.clear()
parameters.append(user_query)
try:
app.chatbot_instance.receive_new_query(user_query)
except Exception as e:
logger.error("Error with chatbot_instance: %s", e)
return jsonify({"success": False, "error": str(e)}), 500
return jsonify({"success": True})
@app.route("/chat_history", methods=["GET"])
def chat_history():
try:
with open("chat_log.txt", "r", encoding="utf-8") as log_file:
lines = log_file.readlines()
chat_history = [line.strip() for line in lines if line.strip()]
except FileNotFoundError:
chat_history = ["No conversation history yet."]
html = render_template_string('''
<h2><i class="fas fa-comments"></i> Chat History</h2>
{% for line in chat_history %}
<p class="chat-line {{ 'user' if 'User:' in line else 'bot' }}">
<i class="fas {{ 'fa-user' if 'User:' in line else 'fa-robot' }}"></i>
{{ line|safe }}
</p>
{% endfor %}
''', chat_history=chat_history)
return html
\ No newline at end of file
grpcio==1.38.0
grpcio-tools==1.38.0
grpcio
grpcio-tools
grpc-interceptor
protobuf==3.16.0
protobuf
multithreading
Flask
\ No newline at end of file
......@@ -4,32 +4,37 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Travel Advisor</title>
<!-- Leaflet.js CSS -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<!-- Font Awesome for icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&display=swap" rel="stylesheet">
<style>
body, html {
height: 100%;
margin: 0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-family: 'Inter', sans-serif;
}
/* Create the map container to be the background */
#map {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1; /* Ensure the map is behind everything else */
z-index: -1;
}
.overlay {
background: rgba(255, 255, 255, 0.85);
background: rgba(228, 216, 216, 0.6);
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
min-height: 100vh;
padding: 40px 20px;
display: flex;
......@@ -37,25 +42,29 @@
align-items: center;
z-index: 1;
}
h1 {
font-size: 2.5em;
margin-bottom: 10px;
font-family: 'Playfair Display', serif;
font-size: 2.8em;
color: #2c3e50;
margin-bottom: 20px;
letter-spacing: 0.5px;
}
form {
display: flex;
background: #fff;
background: #ffffff;
padding: 15px 20px;
border-radius: 10px;
border-radius: 12px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
width: 100%;
max-width: 600px;
margin-bottom: 30px;
gap: 10px;
animation: fadeIn 0.7s ease-in-out;
}
input[type="text"] {
flex: 1;
padding: 12px;
......@@ -63,7 +72,7 @@
border: 1px solid #ccc;
border-radius: 6px;
}
button {
background-color: #3498db;
color: white;
......@@ -72,97 +81,159 @@
padding: 12px 20px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
transition: background-color 0.3s ease, transform 0.2s ease;
}
button:hover {
background-color: #2980b9;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.chat-box {
background: white;
overflow-y: auto;
padding: 15px;
border-radius: 8px;
border-radius: 12px;
width: 100%;
max-width: 600px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
font-size: 14px; /* Reduced font size for better readability */
word-wrap: break-word; /* Ensures words break appropriately */
font-size: 14px;
word-wrap: break-word;
display: flex;
flex-direction: column;
gap: 10px;
animation: fadeIn 0.8s ease-in-out;
}
.chat-line {
padding: 8px 12px; /* Reduced padding */
margin: 8px 0; /* Added margin for separation between lines */
border-radius: 8px;
display: flex;
flex-direction: column; /* Ensure messages are stacked vertically */
align-items: flex-start; /* Align text to the left */
gap: 8px; /* Reduced gap between text and icon */
white-space: pre-wrap; /* Ensures line breaks are respected */
max-width: 100%; /* Ensures lines don’t break out of the container */
word-wrap: break-word; /* Allow words to wrap within the container */
overflow-wrap: break-word; /* Forces long words to break and wrap */
word-break: break-all; /* Breaks long words at any point */
position: relative;
padding: 12px 16px;
border-radius: 16px;
max-width: 80%;
line-height: 1.5;
word-wrap: break-word;
overflow-wrap: break-word;
word-break: break-word;
}
.user {
text-align: right;
background-color: #d0f0fd;
align-self: flex-end;
background-color: #3498db;
color: white;
}
.bot {
text-align: left;
background-color: #fef1e6;
align-self: flex-start;
background-color: #f1f1f1;
color: #333;
}
.user::after {
content: "";
position: absolute;
right: -8px;
top: 50%;
border: 8px solid transparent;
border-left-color: #3498db;
transform: translateY(-50%);
}
.bot::before {
content: "";
position: absolute;
left: -8px;
top: 50%;
border: 8px solid transparent;
border-right-color: #f1f1f1;
transform: translateY(-50%);
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.chat-line i {
margin-right: 8px; /* Reduced icon margin */
color: #555;
#typing-indicator {
display: none;
margin-top: 10px;
font-style: italic;
color: #999;
}
@keyframes typingDots {
0% { content: ""; }
33% { content: "."; }
66% { content: ".."; }
100% { content: "..."; }
}
#typing-indicator .dots::after {
content: "...";
animation: typingDots 1s steps(3, end) infinite;
}
/* Smaller font size for mobile screens */
@media (max-width: 600px) {
form {
flex-direction: column;
gap: 8px;
}
input[type="text"],
button {
width: 100%;
}
.chat-box {
font-size: 12px; /* Even smaller text on smaller screens */
font-size: 12px;
}
}
h1 {
font-size: 1.8em;
}
}
</style>
</head>
<body>
<div id="map"></div> <!-- Map container for interactive background -->
<div id="map"></div>
<div class="overlay">
<h1><i class="fas fa-plane-departure"></i> Travel Advisor</h1>
<form method="POST">
<form id="chat-form">
<input type="text" id="user_query" name="user_query" placeholder="Ask right away!..." required>
<button type="submit"><i class="fas fa-paper-plane"></i></button>
</form>
<div id="typing-indicator">
<i class="fas fa-robot"></i> Bot is typing<span class="dots">...</span>
</div>
<div class="chat-box">
<h2><i class="fas fa-comments"></i> Chat History</h2>
{% for line in chat_history %}
<p class="chat-line {{ 'user' if 'User:' in line else 'bot' }}">
<i class="fas {{ 'fa-user' if 'User:' in line else 'fa-robot' }}"></i>
<!-- Using the |safe filter to render HTML content -->
<div class="chat-line {{ 'user' if 'User:' in line else 'bot' }}">
{{ line|safe }}
</p>
</div>
{% endfor %}
</div>
<div id="typing-indicator">
<i class="fas fa-robot"></i> Bot is typing...
</div>
</div>
<!-- Leaflet JS -->
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<script>
var map = L.map('map').setView([51.505, -0.09], 2);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png', {
attribution: '&copy; OpenStreetMap contributors & CartoDB'
}).addTo(map);
L.marker([51.505, -0.09]).addTo(map)
......@@ -170,12 +241,72 @@
.openPopup();
</script>
<!-- Auto scroll to latest chat -->
<script>
window.onload = function() {
window.onload = function () {
const chatBox = document.querySelector('.chat-box');
chatBox.scrollTop = chatBox.scrollHeight;
};
</script>
<!-- Chat Submit and Polling -->
<script>
document.getElementById('chat-form').addEventListener('submit', function (e) {
e.preventDefault();
const userInput = document.getElementById('user_query').value.trim();
if (!userInput) return;
// Add user's message to chat box immediately
const chatBox = document.querySelector('.chat-box');
const userLine = document.createElement('div');
userLine.className = 'chat-line user';
userLine.textContent = userInput;
chatBox.appendChild(userLine);
chatBox.scrollTop = chatBox.scrollHeight;
// Clear input and show typing indicator
document.getElementById('user_query').value = '';
document.getElementById('typing-indicator').style.display = 'block';
fetch('/ask', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ user_query: userInput })
})
.then(response => response.json())
.then(data => {
if (data.success) {
// Simulate typing delay to make indicator visible
setTimeout(() => {
updateChat();
}, 1500); // Show typing indicator for 1.5 seconds
} else {
console.error('Chatbot error:', data.error);
document.getElementById('typing-indicator').style.display = 'none';
}
})
.catch(error => {
console.error('Network error:', error);
document.getElementById('typing-indicator').style.display = 'none';
});
});
function updateChat() {
fetch('/chat_history')
.then(response => response.text())
.then(html => {
document.querySelector('.chat-box').innerHTML = html;
const chatBox = document.querySelector('.chat-box');
chatBox.scrollTop = chatBox.scrollHeight;
document.getElementById('typing-indicator').style.display = 'none';
});
}
setInterval(updateChat, 1000); // Adjust polling frequency to reduce spam
updateChat();
</script>
</body>
</html>
</html>
\ No newline at end of file
# Use a slim Python base image
FROM python:3.10-slim
FROM python:3.12-slim
ENV PYTHONUNBUFFERED=1
......
grpcio==1.38.0
grpcio-tools==1.38.0
grpcio
grpcio-tools
grpc-interceptor
protobuf==3.16.0
protobuf
multithreading
openai
requests
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment