From b1d639fe8b73570494663b0f10a9a56d7d06784d Mon Sep 17 00:00:00 2001 From: BerendF <berend.fuchs@web.de> Date: Wed, 5 Jun 2024 12:15:48 +0200 Subject: [PATCH] functioning bot w/ pre written recipes --- .gitignore | 1 + actions/__pycache__/actions.cpython-310.pyc | Bin 6632 -> 6632 bytes app.py | 26 ++++ credentials.yml | 6 + templates/about.html | 63 ++++++++ templates/contact.html | 65 +++++++++ templates/index.html | 152 ++++++++++++++++++++ 7 files changed, 313 insertions(+) create mode 100644 .gitignore create mode 100644 app.py create mode 100644 templates/about.html create mode 100644 templates/contact.html create mode 100644 templates/index.html diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6ea8874 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +models/ \ No newline at end of file diff --git a/actions/__pycache__/actions.cpython-310.pyc b/actions/__pycache__/actions.cpython-310.pyc index 45f661ec8f8b38d82d8a656e9a28397de789b846..74fc8103838e3793dca463966d7dede78aa57318 100644 GIT binary patch delta 50 zcmaE1{KA+wpO=@50SNkq!qdby@&<D<GH*`gv}9zo-#nXZ2QQ=3<PeF^jCPYfB<C|~ F0RT#;4Nm|7 delta 50 zcmaE1{KA+wpO=@50SFuqho*^c<PGLzWZIm_Y01cFw|O?#4qisb$srP-8Eq$fNX}=} F1OQi>4XOYD diff --git a/app.py b/app.py new file mode 100644 index 0000000..48fe199 --- /dev/null +++ b/app.py @@ -0,0 +1,26 @@ +from flask import Flask, render_template, request, jsonify +import requests + +app = Flask(__name__) + +@app.route('/') +def home(): + return render_template('index.html') + +@app.route('/about') +def about(): + return render_template('about.html') + +@app.route('/contact') +def contact(): + return render_template('contact.html') + +@app.route('/send_message', methods=['POST']) +def send_message(): + message = request.form['message'] + rasa_response = requests.post('http://localhost:5005/webhooks/rest/webhook', json={"message": message}) + response_text = [resp["text"] for resp in rasa_response.json()] + return jsonify(response_text) + +if __name__ == '__main__': + app.run(debug=True) diff --git a/credentials.yml b/credentials.yml index e9f1291..edb4bdc 100644 --- a/credentials.yml +++ b/credentials.yml @@ -31,3 +31,9 @@ rest: # for the Rasa Enterprise "channel", i.e. Talk to your bot and Share with guest testers. rasa: url: "http://localhost:5002/api" + + + + # rasa run -m models --enable-api --cors “*†--debug + + diff --git a/templates/about.html b/templates/about.html new file mode 100644 index 0000000..c8c5004 --- /dev/null +++ b/templates/about.html @@ -0,0 +1,63 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>About Rasa Chatbot</title> + <style> + body { + font-family: 'Helvetica Neue', Arial, sans-serif; + background-color: #e0f7fa; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + margin: 0; + } + #content-container { + width: 350px; + background-color: #ffffff; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + border-radius: 10px; + overflow: hidden; + display: flex; + flex-direction: column; + height: 67vh; /* 2/3 of the viewport height */ + padding: 20px; + text-align: center; + } + #header { + background-color: #00796b; + color: #ffffff; + padding: 15px; + text-align: center; + font-size: 1.2em; + border-radius: 10px 10px 0 0; + } + #footer { + text-align: center; + padding: 10px; + background-color: #00796b; + color: #ffffff; + border-radius: 0 0 10px 10px; + margin-top: auto; + } + #footer a { + color: #ffffff; + text-decoration: none; + margin: 0 10px; + } + </style> +</head> +<body> + <div id="content-container"> + <div id="header">About Rasa Chatbot</div> + <p>Welcome to the Rasa Chatbot! This bot is designed to assist you with various tasks and answer your questions. It uses natural language processing to understand and respond to your queries in real-time.</p> + <div id="footer"> + <a href="/">Home</a> + <a href="/about">About</a> + <a href="/contact">Contact</a> + </div> + </div> +</body> +</html> diff --git a/templates/contact.html b/templates/contact.html new file mode 100644 index 0000000..c09c67e --- /dev/null +++ b/templates/contact.html @@ -0,0 +1,65 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Contact Rasa Chatbot</title> + <style> + body { + font-family: 'Helvetica Neue', Arial, sans-serif; + background-color: #e0f7fa; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + margin: 0; + } + #content-container { + width: 350px; + background-color: #ffffff; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + border-radius: 10px; + overflow: hidden; + display: flex; + flex-direction: column; + height: 67vh; /* 2/3 of the viewport height */ + padding: 20px; + text-align: center; + } + #header { + background-color: #00796b; + color: #ffffff; + padding: 15px; + text-align: center; + font-size: 1.2em; + border-radius: 10px 10px 0 0; + } + #footer { + text-align: center; + padding: 10px; + background-color: #00796b; + color: #ffffff; + border-radius: 0 0 10px 10px; + margin-top: auto; + } + #footer a { + color: #ffffff; + text-decoration: none; + margin: 0 10px; + } + </style> +</head> +<body> + <div id="content-container"> + <div id="header">Contact Rasa Chatbot</div> + <p>If you have any questions or need further assistance, please feel free to reach out to us.</p> + <p>Email: support@rasabot.com</p> + <p>Phone: +1 234 567 890</p> + <div id="footer"> + <a href="/">Home</a> + <a href="/about">About</a> + <a href="/contact">Contact</a> + </div> + </div> +</body> +</html> diff --git a/templates/index.html b/templates/index.html new file mode 100644 index 0000000..f68f5b6 --- /dev/null +++ b/templates/index.html @@ -0,0 +1,152 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Rasa Chatbot</title> + <style> + body { + font-family: 'Helvetica Neue', Arial, sans-serif; + background-color: #e0f7fa; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + margin: 0; + } + #chat-container { + width: 350px; + background-color: #ffffff; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + border-radius: 10px; + overflow: hidden; + display: flex; + flex-direction: column; + height: 67vh; /* 2/3 of the viewport height */ + } + #header { + background-color: #00796b; + color: #ffffff; + padding: 15px; + text-align: center; + font-size: 1.2em; + } + #chat-box { + flex: 1; + overflow-y: auto; + padding: 20px; + border-bottom: 1px solid #ddd; + height: calc(67vh - 120px); /* Adjust for header and input box */ + } + .message { + margin: 10px 0; + padding: 10px; + border-radius: 10px; + max-width: 80%; + } + .user-message { + margin-left: auto; + background-color: #00796b; + color: #ffffff; + } + .bot-message { + margin-right: auto; + background-color: #f1f1f1; + color: #333; + } + #input-box { + display: flex; + padding: 10px; + background-color: #f7f7f7; + border-top: 1px solid #ddd; + } + #input-box input { + flex: 1; + padding: 10px; + border: 1px solid #ddd; + border-radius: 20px; + margin-right: 10px; + } + #input-box button { + padding: 10px 15px; + border: none; + background-color: #00796b; + color: #ffffff; + border-radius: 20px; + cursor: pointer; + } + #footer { + text-align: center; + padding: 10px; + background-color: #00796b; + color: #ffffff; + } + #footer a { + color: #ffffff; + text-decoration: none; + margin: 0 10px; + } + </style> +</head> +<body> + <div id="chat-container"> + <div id="header">Rasa Chatbot</div> + <div id="chat-box"></div> + <div id="input-box"> + <input type="text" id="user-input" placeholder="Type your message here..."> + <button onclick="sendMessage()">Send</button> + </div> + <div id="footer"> + <a href="/">Home</a> + <a href="/about">About</a> + <a href="/contact">Contact</a> + </div> + </div> + + <script> + function sendMessage() { + const userInput = document.getElementById('user-input').value; + if (userInput.trim() === "") return; + + const chatBox = document.getElementById('chat-box'); + + // Add user message to chat box + const userMessage = document.createElement('div'); + userMessage.classList.add('message', 'user-message'); + userMessage.innerText = userInput; + chatBox.appendChild(userMessage); + + // Clear input box + document.getElementById('user-input').value = ''; + + // Scroll chat box to bottom + chatBox.scrollTop = chatBox.scrollHeight; + + // Send message to Rasa bot + fetch('/send_message', { + method: 'POST', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, + body: `message=${userInput}` + }) + .then(response => response.json()) + .then(data => { + data.forEach(botResponse => { + const botMessage = document.createElement('div'); + botMessage.classList.add('message', 'bot-message'); + botMessage.innerText = botResponse; + chatBox.appendChild(botMessage); + chatBox.scrollTop = chatBox.scrollHeight; + }); + }); + } + + document.getElementById('user-input').addEventListener('keypress', function (e) { + if (e.key === 'Enter') { + sendMessage(); + } + }); + </script> +</body> +</html> -- GitLab