subbuok

Sleeping

App Files Files Community

nagasurendra commited on Apr 21

Commit

4c82fa4

verified ·

1 Parent(s): cafc49b

Update templates/customdish.html

Browse files

Files changed (1) hide show

templates/customdish.html +71 -69

templates/customdish.html CHANGED Viewed

@@ -379,80 +379,82 @@
 </head>
 <body>
    <div class="chat-container">
-        <div class="chat-header">🍳 Chef Bot</div>
-        <div class="chat-messages" id="chatMessages">
-            <!-- Initial message will be set by JavaScript based on session -->
-        </div>
-        <div class="chat-input">
-            <input type="text" id="userInput" placeholder="Type your name or message...">
-            <button onclick="sendMessage()">Send</button>
-        </div>
     </div>
-    <script>
-        let currentStep = 'greeting';  // other possible values: 'food_type', 'select_ingredients', 'menu_display', 'customization', 'post_cart'
-        let conversation = [];
-        let selectedIngredients = [];
-        let selectedMenuItem = null;
-        let cart = [];
-        window.onload = function() {
-            // Check if the name is in sessionStorage
-            if (sessionStorage.getItem('user_name')) {
-                // If the user is logged in and name exists in sessionStorage, greet the user
-                const userName = sessionStorage.getItem('user_name');  // Get the user's name from session
-                conversation.push({ role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` });
-                displayConversation();  // Function to display the conversation
-                displayOptions([
-                    { text: 'Vegetarian', class: 'green' },
-                    { text: 'Non-Vegetarian', class: 'red' }
-                ]);
-            } else {
-                // If name is not in session, ask for the name
-                conversation.push({ role: 'bot', message: "Hi there! I'm Chef Bot! May I know your name?" });
-                displayConversation();  // Function to display the conversation
-                    }
-        };
-        // Function to add messages to the chat
-        function addMessage(role, message) {
-            const chatMessages = document.getElementById('chatMessages');
-            if (!chatMessages) {
-                console.error('Chat messages container not found!');
-                return;
-            }
             const messageDiv = document.createElement('div');
-            messageDiv.className = role === 'bot' ? 'bot-message' : 'user-message';
-            messageDiv.textContent = message;
             chatMessages.appendChild(messageDiv);
-            chatMessages.scrollTop = chatMessages.scrollHeight;
         }
-        // Function to display all conversation messages
-        function displayConversation() {
-            const chatMessages = document.getElementById('chatMessages');
-            chatMessages.innerHTML = '';  // Clear previous messages
-            conversation.forEach(msg => {
-                const messageDiv = document.createElement('div');
-                messageDiv.className = msg.role === 'bot' ? 'bot-message' : 'user-message';
-                messageDiv.textContent = msg.message;
-                chatMessages.appendChild(messageDiv);
-            });
-            chatMessages.scrollTop = chatMessages.scrollHeight;  // Scroll to bottom
-        }
-        // Modified sendMessage function to be triggered automatically or by the user
-        function sendMessage() {
-            const userInput = document.getElementById('userInput').value.trim();
-            if (userInput) {
-                addMessage('user', userInput);
-                conversation.push({ role: 'user', message: userInput });
-                document.getElementById('userInput').value = '';  // Clear input field
-                setTimeout(() => handleResponse(userInput), 500);
-            } else {
-                console.warn('Empty message!');
-            }
-        }
         function handleResponse(userInput) {
             const lastMessage = conversation[conversation.length - 1].message.toLowerCase();

 </head>
 <body>
    <div class="chat-container">
+    <div class="chat-header">🍳 Chef Bot</div>
+    <div class="chat-messages" id="chatMessages">
+        <!-- Initial message will be set by JavaScript based on session -->
     </div>
+    <div class="chat-input">
+        <input type="text" id="userInput" placeholder="Type your name or message...">
+        <button onclick="sendMessage()">Send</button>
+    </div>
+</div>
+<script>
+    let currentStep = 'greeting';  // other possible values: 'food_type', 'select_ingredients', 'menu_display', 'customization', 'post_cart'
+    let conversation = [];
+    let selectedIngredients = [];
+    let selectedMenuItem = null;
+    let cart = [];
+    // Get the user name passed from Flask (via Jinja)
+    const userName = "{{ user_name }}";  // Jinja syntax to inject user_name from Flask session
+    window.onload = function() {
+        if (userName) {
+            // If user_name exists, greet the user directly and proceed to food preference
+            conversation.push({ role: 'bot', message: `Nice to meet you, ${userName}! 😊 Let's create your perfect meal! What type of food would you prefer?` });
+            displayConversation();  // Display the current conversation
+            displayOptions([
+                { text: 'Vegetarian', class: 'green' },
+                { text: 'Non-Vegetarian', class: 'red' }
+            ]);
+        } else {
+            // Ask for the name if it's not found
+            conversation.push({ role: 'bot', message: "Hi there! I'm Chef Bot! May I know your name?" });
+            displayConversation();  // Display the conversation
+        }
+    };
+    // Function to add messages to the chat
+    function addMessage(role, message) {
+        const chatMessages = document.getElementById('chatMessages');
+        if (!chatMessages) {
+            console.error('Chat messages container not found!');
+            return;
+        }
+        const messageDiv = document.createElement('div');
+        messageDiv.className = role === 'bot' ? 'bot-message' : 'user-message';
+        messageDiv.textContent = message;
+        chatMessages.appendChild(messageDiv);
+        chatMessages.scrollTop = chatMessages.scrollHeight;
+    }
+    // Function to display all conversation messages
+    function displayConversation() {
+        const chatMessages = document.getElementById('chatMessages');
+        chatMessages.innerHTML = '';  // Clear previous messages
+        conversation.forEach(msg => {
             const messageDiv = document.createElement('div');
+            messageDiv.className = msg.role === 'bot' ? 'bot-message' : 'user-message';
+            messageDiv.textContent = msg.message;
             chatMessages.appendChild(messageDiv);
+        });
+        chatMessages.scrollTop = chatMessages.scrollHeight;  // Scroll to bottom
+    }
+    // Function to handle user input
+    function sendMessage() {
+        const userInput = document.getElementById('userInput').value.trim();
+        if (userInput) {
+            addMessage('user', userInput);
+            conversation.push({ role: 'user', message: userInput });
+            document.getElementById('userInput').value = '';  // Clear input field
+            setTimeout(() => handleResponse(userInput), 500);
+        } else {
+            console.warn('Empty message!');
         }
+    }
         function handleResponse(userInput) {
             const lastMessage = conversation[conversation.length - 1].message.toLowerCase();