Downloads: 1
Diff of
/templates/index.html
[000000]
..
[bb4041]
Switch to side-by-side view
--- a +++ b/templates/index.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html> + <head> + <link rel="stylesheet" type="text/css" href="/static/style.css"> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> + </head> + <body> + <h1>Automated Healthcare Chatbot</h1> + <div> + <div id="chatbox"> + <p class="botText"><span>Please try typing full sentences as I am still learning!</span></p> + <p class="botText"><span>I am a chatbot. You can begin conversation by typing in a message and pressing enter.</span></p> + <p class="botText"><span>Hi There! What is your name?</span></p> + </div> + <div id="userInput"> + <input id="textInput" type="text" name="msg" placeholder="Message"> + <input id="buttonInput" type="submit" value="Send"> + </div> + <script> + function getBotResponse() { + var rawText = $("#textInput").val(); + var userHtml = '<p class="userText"><span>' + rawText + '</span></p>'; + $("#textInput").val(""); + $("#chatbox").append(userHtml); + document.getElementById('userInput').scrollIntoView({block: 'start', behavior: 'smooth'}); + $.get("/get", { msg: rawText }).done(function(data) { + var botHtml = '<p class="botText"><span>' + data + '</span></p>'; + $("#chatbox").append(botHtml); + document.getElementById('userInput').scrollIntoView({block: 'start', behavior: 'smooth'}); + }); + } + $("#textInput").keypress(function(e) { + if(e.which == 13) { + getBotResponse(); + } + }); + $("#buttonInput").click(function() { + getBotResponse(); + }) + </script> + </div> + </body> +</html> \ No newline at end of file