NovaChatBot/index.py at main · zCoder0/NovaChatBot · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
import streamlit as st
import time
from MyModel import MyModel
from Translate import Translation
# Initialize the model
model = MyModel()
trans = Translation()
# Title and chatbot description
st.title("🤖 Luna Assistant")
st.markdown("Im here to help you. Feel free to ask anything!")

# CSS for styling chat bubbles with right and left alignment and fitted borders
st.markdown("""
    <style>
        /* Container for chat bubbles */
        .chat-container {
            max-width: 700px;
            margin: auto;
            display: flex;
            flex-direction: column;
        }

        /* User message styling - aligned to the right with border */
        .user-bubble {
            background-color: rgba(240, 240, 240, 0.8); /* Light white background */
            color: black;
            padding: 5px 10px;
            margin-top:10px;
            border-radius: 20px;
            text-align: right;
            float: right;
            clear:both;
            with : fit-content;
             border: none;

        }

        /* Bot message styling - aligned to the left with border */
        .bot-bubble {
            background-color: transparent; /* Transparent background */
            color: black;
             padding: 10px 10px;
            border-radius: 20px;
            text-align: left;
            margin-top:15px;
            float: left;
            clear: both;
            max-width: 100%;
            width: fit-content;

        }

        /* Typing indicator */
        .typing {
            font-style: italic;
            color: grey;
        }
    </style>
""", unsafe_allow_html=True)

# Session state for chat history
if "history" not in st.session_state:
    st.session_state.history = []

# Custom function for the gradual typing effect with emoji
def gradual_typing(response_text, delay=0.05):
    response = "🤖 "  # Add emoji before the bot's response
    typing_area = st.empty()
    for char in response_text:
        response += char
        typing_area.markdown(f"<div class='bot-bubble'>{response}▮</div>", unsafe_allow_html=True)
        time.sleep(delay)
    typing_area.markdown(f"<div class='bot-bubble'>{response}</div>", unsafe_allow_html=True)

# Input from user
user_message = st.chat_input("Type your message here...")


if user_message:
    # Add user message to history
    st.session_state.history.append({"message": user_message, "is_user": True})

    # Get bot response with typing effect

    user_message ,ln = trans.translate(user_message)
    bot_response = model.predict(user_message.lower())
    bot_response ,lng= trans.translate(bot_response,ln)
    # Append bot response to history
    st.session_state.history.append({"message": bot_response, "is_user": False})

# Display chat history with typing effect for the latest bot message
for i, chat in enumerate(st.session_state.history):
    if chat["is_user"]:
        # Display user message aligned to the right with fitted border
        st.markdown(f"""
            <div class="chat-container">
                <div class="user-bubble">{chat["message"]}</div>
            </div>
        """, unsafe_allow_html=True)
    else:
        # Apply gradual typing effect to only the latest bot message with emoji
        if i == len(st.session_state.history) - 1:
            gradual_typing(chat["message"])
        else:
            # Display bot message aligned to the left with emoji
            st.markdown(f"""
                <div class="chat-container">
                    <div class="bot-bubble">🤖 {chat["message"]}</div>
                </div>
            """, unsafe_allow_html=True)