Spaces:
Runtime error
Runtime error
| <!-- templates/index.html --> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Chat Interface</title> | |
| <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"> | |
| <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | |
| </head> | |
| <body> | |
| <div class="chat-container"> | |
| <div id="chat-box" class="chat-box"></div> | |
| <form id="chat-form"> | |
| <input id="user-input" type="text" placeholder="Type a message" required> | |
| <button type="submit">Send</button> | |
| </form> | |
| </div> | |
| <script> | |
| $(document).ready(function(){ | |
| $('#chat-form').on('submit', function(event){ | |
| event.preventDefault(); | |
| const userMessage = $('#user-input').val(); | |
| if(userMessage.trim() === "") return; | |
| $('#chat-box').append('<div class="message sent">' + userMessage + '</div>'); | |
| $('#user-input').val(''); | |
| $.ajax({ | |
| url: '/predict', | |
| type: 'POST', | |
| contentType: 'application/json', | |
| data: JSON.stringify({ message: userMessage }), | |
| success: function(response){ | |
| $('#chat-box').append('<div class="message received">' + response.response + '</div>'); | |
| $('#chat-box').scrollTop($('#chat-box')[0].scrollHeight); | |
| } | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |