Web exchange seems to work now

This commit is contained in:
Martin Asprusten
2025-04-20 14:13:29 +02:00
parent 14cdefea69
commit 564e449e33
11 changed files with 155 additions and 69 deletions
+53 -21
View File
@@ -12,38 +12,70 @@
<br />
<label for="info_for_santa">Info for your santa (e.g. shipping address or similar):</label><br />
<textarea id="info_for_santa"></textarea><br />
<button id="submit_info_button">Submit your info</button>
<button id="submit_info_button" onclick="submitInfo();">Submit your info</button>
<br /><br /><br />
<p id="statusParagraph"></p>
<button>Start with current participants</button>
<pre id="statusParagraph"></pre>
<button id="start_exchange_button" onclick="submitStart();">Start with current participants</button>
<p>Current participants:</p>
<div id='participantList'></div>
<!--<script type="text/javascript">
<ul id='participantList'>
</ul>
<script type="text/javascript">
const socket = io();
const client_id = Math.floor(Math.random() * 2**64)
socket.emit('join', {room: window.location.pathname, 'client_id': client_id})
socket.on('message', data => {
// All messages are broadcast to everyone, so discard messages that were actually sent from ourselves
data = JSON.parse(data);
if (data['client_id'] != client_id) {
console.log(data);
console.log(data['message']);
window.pass_message_to_python(JSON.stringify(data['message']));
}
});
</script>-->
const other_users = []
let submitButton = document.getElementById('submit_info_button');
let startButton = document.getElementById('start_exchange_button');
submitButton.disabled = true;
startButton.disabled = true;
<script type="text/javascript">
const exchangeWorker = new Worker("{{ url_for('static', filename='exchange_worker.js') }}", { type: 'module' });
exchangeWorker.onmessage = (e) => {
console.log('Received message:');
console.log(e);
document.getElementById('statusParagraph').innerHTML = e.data;
if (e.data.type == 'status') {
document.getElementById('statusParagraph').innerHTML = e.data.text;
if (e.data.stage == 'wait_for_user') {
submitButton.disabled = false;
startButton.disabled = true;
} else if (e.data.stage == 'wait_for_start') {
submitButton.disabled = true;
startButton.disabled = false;
} else {
submitButton.disabled = true;
startButton.disabled = true;
}
} else if (e.data.type == 'message') {
socket.emit('message', {client_id: client_id, room: window.location.pathname, message: e.data.message});
} else if (e.data.type == 'new_user') {
let list = document.getElementById('participantList');
const childNode = document.createElement("li");
childNode.innerHTML = e.data.username;
other_users.push(e.data.username);
list.appendChild(childNode);
}
};
exchangeWorker.postMessage('Nothing');
socket.on('message', data => {
// All messages are broadcast to everyone, so discard messages that were actually sent from ourselves
if (data['client_id'] != client_id) {
exchangeWorker.postMessage({type: 'message', message: data['message']})
}
});
function submitInfo() {
let name = document.getElementById('own_name').value;
let info = document.getElementById('info_for_santa').value;
exchangeWorker.postMessage({type: 'set_user', username: name, userinfo: info});
}
function submitStart() {
exchangeWorker.postMessage({type: 'start', users: other_users});
}
socket.emit('join', {room: window.location.pathname, client_id: client_id})
</script>
</body>
</html>