Spaces:

Ritesh-hf
/

nutrigenics-flask-chatbot-server

Running on CPU Upgrade

App Files Files Community

Ritesh-hf commited on Oct 29, 2024

Commit

b12dd27

1 Parent(s): 7e7a010

update chat.html

Browse files

Files changed (2) hide show

app.py +7 -1
templates/chat.html +3 -135

app.py CHANGED Viewed

@@ -707,7 +707,7 @@ def respond_to_user(image, message):
 from PIL import Image
 import numpy as np
-@app.route("/", methods=["POST"])
 def get_answer():
     global CURR_CONTEXT
     global CURR_SESSION_KEY
@@ -760,6 +760,12 @@ def get_answer():
     return jsonify(response)
 # Main function to run the app
 if __name__ == '__main__':

 from PIL import Image
 import numpy as np
+@app.route("/get-answer", methods=["POST"])
 def get_answer():
     global CURR_CONTEXT
     global CURR_SESSION_KEY
     return jsonify(response)
+# Home route
+@app.route("/")
+def index_view():
+    return render_template('chat.html')
 # Main function to run the app
 if __name__ == '__main__':

templates/chat.html CHANGED Viewed

@@ -10,146 +10,14 @@
 </head>
 <body class="bg-gray-100 p-5 pb-50 h-screen flex flex-col">
-    <div class="chat-container  max-w-5xl w-full h-full  flex flex-col mx-auto bg-white shadow-lg rounded-lg p-4">
-        <div class="chat-box w-full h-full  overflow-y-auto mb-4 p-3 border border-gray-200 rounded-lg" id="chat-box"></div>
-        <div class="input-container flex flex-col flex-none space-x-y">
-            <input type="file" id="image-input"
-                class="block w-96 px-4 py-2 text-sm text-gray-500 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 focus:outline-none mb-2"
-                accept="image/*">
-            <div class="input-container flex space-x-2">
-                <input type="text" id="chat-input"
-                class="block w-full px-4 py-4 text-sm text-gray-700 bg-gray-50 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500"
-                placeholder="Type your message here...">
-                <button id="send-button"
-                    class="bg-blue-600 text-white px-10 py-2 rounded-lg hover:bg-blue-700 focus:ring-4 focus:ring-blue-300">
-                    Send
-                </button>
-            </div>
-        </div>
     </div>
-    <script src="https://cdn.socket.io/4.5.0/socket.io.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"
         integrity="sha512-LhccdVNGe2QMEfI3x4DVV3ckMRe36TfydKss6mJpdHjNFiV07dFpS2xzeZedptKZrwxfICJpez09iNioiSZ3hA=="
         crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.5/flowbite.min.js"></script>
-    <script>
-        const socket = io.connect(document.baseURI);
-        const chatBox = document.getElementById('chat-box');
-        const chatInput = document.getElementById('chat-input');
-        const imageInput = document.getElementById('image-input');
-        const sendButton = document.getElementById('send-button');
-        const converter = new showdown.Converter();
-        let response = "";
-        // Function to add a loader element
-        function addLoader() {
-            const loaderEle = document.createElement('div');
-            loaderEle.classList.add('dot-loader');
-            loaderEle.innerHTML = `
-                <div></div>
-                <div></div>
-                <div></div>
-            `;
-            chatBox.appendChild(loaderEle);
-        }
-        // Function to append a message to the chat box
-        function appendMessage(message, sender) {
-            if (sender === 'bot') {
-                response += message;
-                const loaderEle = chatBox.lastElementChild;
-                if (loaderEle && loaderEle.classList.contains('dot-loader')) {
-                    chatBox.removeChild(loaderEle);
-                    const messageElement = document.createElement('div');
-                    messageElement.classList.add('chat-message', sender);
-                    messageElement.innerHTML = `<span>${response}</span>`;
-                    chatBox.append(messageElement);
-                    chatBox.scrollTop = chatBox.scrollHeight;
-                } else {
-                    const lastMessageEle = chatBox.lastElementChild;
-                    if (lastMessageEle) {
-                        lastMessageEle.innerHTML = response;
-                    }
-                    chatBox.scrollTop = chatBox.scrollHeight;
-                }
-            } else {
-                const messageElement = document.createElement('div');
-                messageElement.classList.add('chat-message', sender);
-                messageElement.innerHTML = `<span>${message}</span>`;
-                chatBox.append(messageElement);
-                chatBox.scrollTop = chatBox.scrollHeight;
-                setTimeout(addLoader, 500);
-            }
-        }
-        // Function to handle image as Base64 and send with message
-        function readImageAsBase64(imageFile) {
-            return new Promise((resolve, reject) => {
-                const reader = new FileReader();
-                reader.onload = () => resolve(reader.result);
-                reader.onerror = reject;
-                reader.readAsDataURL(imageFile);
-            });
-        }
-        // Function to handle sending the message and image
-        sendButton.addEventListener('click', async () => {
-            const message = chatInput.value.trim();
-            const imageFile = imageInput.files[0];
-            // Prepare the message object
-            let messageData = {
-                message: message,
-                session_id: 'abc123'
-            };
-            // If there is an image, read it as base64 and add to messageData
-            if (imageFile) {
-                try {
-                    const imageBase64 = await readImageAsBase64(imageFile);
-                    messageData.image = imageBase64;
-                } catch (error) {
-                    console.error('Error reading image file:', error);
-                }
-            }
-            if (message || imageFile) {
-                // appendMessage(imageFile || 'Image sent', 'user');
-                appendMessage(message || 'Image sent', 'user');
-                // Send message and image (if available) to the server via socket
-                socket.emit('message', messageData);
-                // Clear inputs
-                chatInput.value = '';
-                imageInput.value = ''; // Clear the image input
-                response = "";
-            } else {
-                console.error("Message or image cannot be empty.");
-            }
-        });
-        // Event listener for 'Enter' key press in the chat input
-        chatInput.addEventListener('keypress', (e) => {
-            if (e.key === 'Enter') {
-                sendButton.click();
-            }
-        });
-        // Handle incoming responses from the server
-        socket.on('response', (data) => {
-            if (data && typeof data === 'string') {
-                appendMessage(data, 'bot');
-            } else {
-                console.error("Invalid response format received from the server.");
-            }
-        });
-        // Handle connection errors
-        socket.on('connect_error', (error) => {
-            appendMessage("Sorry, there was a problem connecting to the server. Please try again later.", 'bot');
-        });
-        // Handle connection
-        socket.on('connect', (reason) => {
-            console.log("Connected to server.");
-        });
-        // Handle disconnection
-        socket.on('disconnect', (reason) => {
-            appendMessage("You have been disconnected from the server. Please refresh the page to reconnect.", 'bot');
-        });
-    </script>
 </body>
 </html>

 </head>
 <body class="bg-gray-100 p-5 pb-50 h-screen flex flex-col">
+    <div class="chat-container  max-w-5xl w-full h-full flex items-center justify-center mx-auto bg-white shadow-lg rounded-lg p-4">
+        <p>Nutrigenics chatbot</p>
+        <a class="btn py-3 px-6" href="https://www.nutrigenics.care">Visit Nutrigenics</a>
     </div>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"
         integrity="sha512-LhccdVNGe2QMEfI3x4DVV3ckMRe36TfydKss6mJpdHjNFiV07dFpS2xzeZedptKZrwxfICJpez09iNioiSZ3hA=="
         crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.5/flowbite.min.js"></script>
 </body>
 </html>