split mate & chat into seperate files

This commit is contained in:
hyperbel 2023-07-14 11:35:24 +02:00
parent dcb8f249df
commit c14aa08283
7 changed files with 133 additions and 117 deletions

View File

@ -12,6 +12,8 @@ app = Flask(__name__,
app.secret_key = 'super secret key 1234 5678 9012 3456 '
socketio = SocketIO(app)
@app.route('/', methods=['GET'])
def index():
response = jsonify(success=True)
@ -63,6 +65,7 @@ def api_mate_status():
@app.route('/api/mate/trinken/<row>/<column>', methods=['POST'])
def api_mate_trinken(row, column):
MateKiste.removeAt(int(row), int(column))
response = jsonify(success=True)
response.status_code = 200
return response

View File

@ -4,7 +4,7 @@ import random
def generate_kiste(count: int) -> list[bool]:
return [random.choice([True, False]) for _ in range(count)]
return [random.choice([True]) for _ in range(count)]
class MateKiste():
@ -39,4 +39,5 @@ class MateKiste():
@classmethod
def removeAt(self, x: int, y: int):
self.collection.update_one({'mateKiste': True}, {'$set': {f'status.{y * self.FlaschenBreite + x}': False}})
position = y * self.FlaschenBreite + x
self.collection.update_one({'mateKiste': True}, {'$set': {'status.' + str(position): False}})

52
party/static/js/chat.js Normal file
View File

@ -0,0 +1,52 @@
function getNChatMessages(socket, count, skip) {
socket.emit('chat-get-messages', { count: 100, skip: 0 }, (data) => {
sessionStorage['alreadyLoadedMessages'] += 100;
let message_array = [];
// dont fucking touch this
data = JSON.parse(data.data.messages)
for (let message of data) {
message_array.push(buildChatMessage(message.content, message.author, message.timestamp));
}
const chatBox = document.getElementById('chatBox');
message_array.forEach(message => chatBox.appendChild(message));
chatBox.style.overflow = 'auto';
chatBox.scrollTop = chatBox.scrollHeight;
});
}
function buildChatMessage(content, author, timestap) {
console.log(content, author, timestap);
const message = document.createElement('div');
message.classList.add('chat-message');
const messageContent = document.createElement('div');
messageContent.classList.add('chat-message-content');
const content_field = document.createElement('p');
content_field.textContent = content;
messageContent.appendChild(content_field);
const messageAuthor = document.createElement('div');
messageAuthor.classList.add('chat-message-author');
const author_field = document.createElement('p');
author_field.textContent = author;
messageAuthor.appendChild(author_field);
const messageTimestamp = document.createElement('div');
messageTimestamp.classList.add('chat-message-timestamp');
const timestamp_field = document.createElement('p');
timestamp_field.textContent = timestap;
messageTimestamp.appendChild(timestamp_field);
const messageDetails = document.createElement('div');
messageDetails.classList.add('chat-message-details');
messageDetails.appendChild(messageAuthor);
messageDetails.appendChild(messageTimestamp);
message.appendChild(messageDetails);
message.appendChild(messageContent);
return message;
}

68
party/static/js/mate.js Normal file
View File

@ -0,0 +1,68 @@
function getMateStatus(socket) {
socket.emit('mate-status', (data) => {
let flaschen = data.data;
console.log(flaschen)
const ROWS = 4;
const COLUMNS = 5;
var mate_kiste = document.getElementById('mate_kiste');
var table = document.createElement('tbody');
let rows = [];
for (let rowNumber = 0; rowNumber < ROWS; rowNumber++) {
const row = document.createElement('tr');
rows.push(row);
}
for (let a = 0; a < flaschen.length; a++) {
const [x, y] = flascheIndex(a, ROWS, COLUMNS);
const flascheIstVoll = flaschen[a];
const cell = document.createElement('td');
if (!flascheIstVoll) {
rows[x].appendChild(cell);
continue;
}
cell.classList = ['flasche', x, y, `voll-${flascheIstVoll}`];
const flascheTrinkenButton = document.createElement('button');
flascheTrinkenButton.classList.add('flasche-trinken-button');
flascheTrinkenButton.disabled = !flascheIstVoll;
if (!flascheIstVoll) flascheTrinkenButton.style.backgroundColor = 'red';
flascheTrinkenButton.style.backgroundColor = flascheIstVoll ? '#c88a35' : '#333';
flascheTrinkenButton.id = `flasche-trinken-button-${x}-${y}`; //TODO: remove and replace with class
flascheTrinkenButton.onclick = () => { flascheTrinken(x, y) };
cell.appendChild(flascheTrinkenButton);
if (rows[x]) rows[x].appendChild(cell);
}
rows.forEach(row => table.appendChild(row));
mate_kiste.appendChild(table);
});
}
// returns x and y
function flascheIndex(index_1d, rows, columns) {
return [Math.floor(index_1d / columns), index_1d % columns];
}
//TODO: replace id lookup with class lookup
function flascheTrinken(rowNumber, columnNumber) {
console.log(`flasche trinken ${rowNumber} ${columnNumber}`);
fetch(`/api/mate/trinken/${rowNumber}/${columnNumber}`, {
method: 'POST',
}).then(response => {
if (response.status === 200) {
console.log('flasche getrunken');
let flasche = document.getElementById(`flasche-trinken-button-${rowNumber}-${columnNumber}`);
flasche.disabled = true;
flasche.style.backgroundColor = '#333';
} else {
alert('Fehler beim Trinken');
}
});
}

View File

@ -1,4 +1,5 @@
const socket = io();
window.addEventListener('DOMContentLoaded', function() {
var name = sessionStorage.getItem('name'); // Den Namen aus dem SessionStorage abrufen
@ -62,125 +63,14 @@ function handleSwitchDiv(index) {
switch (index) {
case 4:
// get previous messages
socket.emit('chat-get-messages', { count: 100, skip: 0 }, (data) => {
sessionStorage['alreadyLoadedMessages'] += 100;
let message_array = [];
// dont fucking touch this
data = JSON.parse(data.data.messages)
for (let message of data) {
message_array.push(chatMessage(message.content, message.author, message.timestamp));
}
const chatBox = document.getElementById('chatBox');
message_array.forEach(message => chatBox.appendChild(message));
chatBox.style.overflow = 'auto';
chatBox.scrollTop = chatBox.scrollHeight;
});
getNChatMessages(socket, 100, 0);
break;
case 6: // Mate
socket.emit('mate-status', (data) => {
let flaschen = data.data;
console.log(flaschen)
const ROWS = 4;
const COLUMNS = 5;
var mate_kiste = document.getElementById('mate_kiste');
var table = document.createElement('tbody');
let rows = [];
for (let rowNumber = 0; rowNumber < ROWS; rowNumber++) {
const row = document.createElement('tr');
rows.push(row);
}
for (let a = 0; a < flaschen.length; a++) {
const [x, y] = flascheIndex(a, ROWS, COLUMNS);
const flascheIstVoll = flaschen[a];
const cell = document.createElement('td');
cell.classList = ['flasche', x, y, `voll-${flascheIstVoll}`];
const flascheTrinkenButton = document.createElement('button');
flascheTrinkenButton.classList.add('flasche-trinken-button');
flascheTrinkenButton.disabled = !flascheIstVoll;
if (!flascheIstVoll) flascheTrinkenButton.style.backgroundColor = 'red';
flascheTrinkenButton.style.backgroundColor = flascheIstVoll ? '#c88a35' : '#333';
flascheTrinkenButton.id = `flasche-trinken-button-${x}-${y}`; //TODO: remove and replace with class
flascheTrinkenButton.onclick = () => flascheTrinken(x, y);
cell.appendChild(flascheTrinkenButton);
rows[x].appendChild(cell);
}
rows.forEach(row => table.appendChild(row));
mate_kiste.appendChild(table);
});
getMateStatus(socket);
break;
}
}
function chatMessage(content, author, timestap) {
console.log(content, author, timestap);
const message = document.createElement('div');
message.classList.add('chat-message');
const messageContent = document.createElement('div');
messageContent.classList.add('chat-message-content');
const content_field = document.createElement('p');
content_field.textContent = content;
messageContent.appendChild(content_field);
const messageAuthor = document.createElement('div');
messageAuthor.classList.add('chat-message-author');
const author_field = document.createElement('p');
author_field.textContent = author;
messageAuthor.appendChild(author_field);
const messageTimestamp = document.createElement('div');
messageTimestamp.classList.add('chat-message-timestamp');
const timestamp_field = document.createElement('p');
timestamp_field.textContent = timestap;
messageTimestamp.appendChild(timestamp_field);
const messageDetails = document.createElement('div');
messageDetails.classList.add('chat-message-details');
messageDetails.appendChild(messageAuthor);
messageDetails.appendChild(messageTimestamp);
message.appendChild(messageDetails);
message.appendChild(messageContent);
return message;
}
// returns x and y
function flascheIndex(index_1d, rows, columns) {
return [Math.floor(index_1d / columns), index_1d % columns];
}
//TODO: replace id lookup with class lookup
function flascheTrinken(rowNumber, columnNumber) {
console.log(`flasche trinken ${rowNumber} ${columnNumber}`);
fetch(`/api/mate/trinken/${rowNumber}/${columnNumber}`, {
method: 'POST',
}).then(response => {
if (response.status === 200) {
console.log('flasche getrunken');
let flasche = document.getElementById(`flasche-trinken-button-${rowNumber}-${columnNumber}`);
flasche.disabled = true;
flasche.style.backgroundColor = '#333';
} else {
alert('Fehler beim Trinken');
}
});
}
function sendData(endpoint) {
fetch(endpoint, {
method: 'POST',

View File

@ -118,6 +118,8 @@
{% endblock %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.7.1/socket.io.js"></script>
<script src="/static/js/session.js"></script>
<script src="/static/js/chat.js"></script>
<script src="/static/js/mate.js"></script>
</body>
</html>

View File

@ -8,6 +8,6 @@ Chat.init()
def generate_message():
Chat.insertMessage(fake.text(), fake.name(), fake.date_time().isoformat())
MESSAGE_COUNT = 100000
MESSAGE_COUNT = 1000
for i in range(MESSAGE_COUNT):
generate_message()