Spaces:
Running
Running
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width" /> | |
| <title>My static Space</title> | |
| <link rel="stylesheet" href="style.css" /> | |
| </head> | |
| <body> | |
| <div id="chat-container"> | |
| <div id="chat-log"> | |
| <!-- Chat log area where messages will be displayed --> | |
| </div> | |
| <div id="user-input"> | |
| <input type="text" id="user-message" placeholder="Type your message..." /> | |
| <button id="send-button">Send</button> | |
| </div> | |
| </div> | |
| <script> | |
| // JavaScript code for the chatbot functionality | |
| // Add your own logic and functionality here | |
| // Function to handle user messages and display them in the chat log | |
| function handleUserMessage() { | |
| var userInput = document.getElementById("user-message"); | |
| var userMessage = userInput.value; | |
| // Display the user message in the chat log | |
| var chatLog = document.getElementById("chat-log"); | |
| var userMessageElement = document.createElement("div"); | |
| userMessageElement.className = "user-message"; | |
| userMessageElement.textContent = userMessage; | |
| chatLog.appendChild(userMessageElement); | |
| // Add your logic to process the user message and generate bot response here | |
| // Clear the user input field | |
| userInput.value = ""; | |
| } | |
| // Event listener for the send button | |
| var sendButton = document.getElementById("send-button"); | |
| sendButton.addEventListener("click", handleUserMessage); | |
| // Event listener for the enter key to submit the user message | |
| var userInput = document.getElementById("user-message"); | |
| userInput.addEventListener("keydown", function (event) { | |
| if (event.keyCode === 13) { // 13 is the Enter key code | |
| handleUserMessage(); | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |