mirror of
https://github.com/lucaspalomodevelop/Party.git
synced 2026-03-13 08:09:37 +00:00
chat
This commit is contained in:
parent
4e745b0da9
commit
d2ae3e5b47
7
test/database.py
Normal file
7
test/database.py
Normal file
@ -0,0 +1,7 @@
|
||||
import sqlite3
|
||||
|
||||
conn = sqlite3.connect("chat.db")
|
||||
c = conn.cursor()
|
||||
c.execute("CREATE TABLE messages (username text, message text, timestamp text)")
|
||||
conn.commit()
|
||||
conn.close()
|
||||
@ -1,70 +0,0 @@
|
||||
<!-- chat.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Chat</title>
|
||||
<script>
|
||||
// JavaScript-Code, um Nachrichten abzurufen und zu senden
|
||||
// JavaScript-Code in chat.html
|
||||
|
||||
// Globale Variablen
|
||||
let username;
|
||||
|
||||
// Senden einer Nachricht
|
||||
function sendMessage() {
|
||||
let message = document.getElementById("message").value;
|
||||
fetch("/send_message", {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
"username": username,
|
||||
"message": message
|
||||
}),
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
console.log(data);
|
||||
document.getElementById("message").value = "";
|
||||
getMessages();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("Error:", error);
|
||||
});
|
||||
}
|
||||
|
||||
// Abrufen von Nachrichten
|
||||
function getMessages() {
|
||||
fetch("/get_messages")
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
let chatWindow = document.getElementById("chat-window");
|
||||
chatWindow.innerHTML = "";
|
||||
for (let message of data) {
|
||||
chatWindow.innerHTML += `<p>${message.username}: ${message.message}</p>`;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("Error:", error);
|
||||
});
|
||||
}
|
||||
|
||||
// Laden der Nachrichten beim Laden der Seite
|
||||
window.onload = function() {
|
||||
username = document.getElementById("username").value;
|
||||
getMessages();
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="chat-window">
|
||||
<!-- Nachrichten werden hier angezeigt -->
|
||||
</div>
|
||||
<form id="send-message-form">
|
||||
<textarea id="message"></textarea>
|
||||
<input type="button" value="Send" onclick="sendMessage()">
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,18 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Chat Room</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Welcome to the Chat Room</h1>
|
||||
<form method="POST" action="{{ url_for('enter_chat') }}">
|
||||
<label for="name">Name:</label>
|
||||
<input type="text" id="name" name="name">
|
||||
<br>
|
||||
<label for="message">Message:</label>
|
||||
<input type="text" id="message" name="message">
|
||||
<br>
|
||||
<input type="submit" value="Enter Chat">
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,15 +1,83 @@
|
||||
<!-- index.html -->
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Chat</title>
|
||||
</head>
|
||||
<body>
|
||||
<form action="/enter_chat" method="post">
|
||||
<label for="username">Username:</label>
|
||||
<input type="text" id="username" name="username">
|
||||
<input type="submit" value="Enter Chat">
|
||||
</form>
|
||||
|
||||
</body>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: lightblue;
|
||||
}
|
||||
|
||||
#messages {
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid gray;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.message {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.username {
|
||||
font-weight: bold;
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.timestamp {
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
width: 50%;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
font-size: 16px;
|
||||
border-radius: 10px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 10px 20px;
|
||||
font-size: 16px;
|
||||
background-color: lightgray;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function getMessages() {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("GET", "/get");
|
||||
xhr.onload = function() {
|
||||
document.getElementById("messages").innerHTML = xhr.responseText;
|
||||
};
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function sendMessage() {
|
||||
var message = document.getElementById("message").value;
|
||||
var username = document.getElementById("username").value;
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", "/send");
|
||||
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
|
||||
xhr.send("message=" + message + "&username=" + username);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="getMessages(); setInterval(getMessages, 1000);">
|
||||
<div id="messages"></div>
|
||||
<input type="text" id="username" placeholder="Username">
|
||||
<input type="text" id="message" placeholder="Message">
|
||||
<button onclick="sendMessage();">Send</button>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
3
test/templates/messages.html
Normal file
3
test/templates/messages.html
Normal file
@ -0,0 +1,3 @@
|
||||
{% for message in messages %}
|
||||
<p>{{ message[0] }}: {{ message[1] }} ({{ message[2] }})</p>
|
||||
{% endfor %}
|
||||
68
test/test.py
68
test/test.py
@ -1,52 +1,34 @@
|
||||
from flask import Flask, render_template, request, jsonify
|
||||
from flask import Flask, request, render_template
|
||||
import sqlite3
|
||||
|
||||
app = Flask(__name__)
|
||||
|
||||
# Verbindung zur Datenbank herstellen
|
||||
conn = sqlite3.connect('chat.db', check_same_thread=False)
|
||||
cursor = conn.cursor()
|
||||
|
||||
# Tabelle erstellen, falls sie nicht existiert
|
||||
cursor.execute('''CREATE TABLE IF NOT EXISTS messages
|
||||
(id INTEGER PRIMARY KEY, username TEXT, message TEXT, timestamp DATETIME DEFAULT CURRENT_TIMESTAMP)''')
|
||||
conn.commit()
|
||||
|
||||
@app.route('/')
|
||||
@app.route("/")
|
||||
def index():
|
||||
return render_template('index.html')
|
||||
return render_template("index.html")
|
||||
|
||||
@app.route("/enter_chat", methods=["GET", "POST"])
|
||||
def enter_chat():
|
||||
if request.method == "POST":
|
||||
# Handle POST request
|
||||
pass
|
||||
elif request.method == "GET":
|
||||
# Handle GET request
|
||||
return render_template("enter_chat.html")
|
||||
|
||||
|
||||
|
||||
@app.route('/chat')
|
||||
def chat():
|
||||
return render_template('chat.html')
|
||||
|
||||
@app.route('/send_message', methods=['POST'])
|
||||
def send_message():
|
||||
username = request.form.get('username')
|
||||
message = request.form.get('message')
|
||||
|
||||
# Nachricht in die Datenbank einfügen
|
||||
cursor.execute("INSERT INTO messages (username, message) VALUES (?,?)", (username, message))
|
||||
@app.route("/send", methods=["POST"])
|
||||
def send():
|
||||
message = request.form["message"]
|
||||
username = request.form["username"]
|
||||
|
||||
conn = sqlite3.connect("chat.db")
|
||||
c = conn.cursor()
|
||||
c.execute("INSERT INTO messages (username, message) VALUES (?, ?)", (username, message))
|
||||
conn.commit()
|
||||
conn.close()
|
||||
|
||||
return render_template("index.html")
|
||||
|
||||
return jsonify({'status': 'OK'})
|
||||
@app.route("/get")
|
||||
def get():
|
||||
conn = sqlite3.connect("chat.db")
|
||||
c = conn.cursor()
|
||||
c.execute("SELECT username, message, timestamp FROM messages")
|
||||
messages = c.fetchall()
|
||||
conn.close()
|
||||
|
||||
return render_template("messages.html", messages=messages)
|
||||
|
||||
@app.route('/get_messages')
|
||||
def get_messages():
|
||||
cursor.execute("SELECT * FROM messages ORDER BY timestamp ASC")
|
||||
messages = cursor.fetchall()
|
||||
return jsonify({'messages': messages})
|
||||
|
||||
if __name__ == '__main__':
|
||||
app.run()
|
||||
if __name__ == "__main__":
|
||||
app.run()
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user