ynerant/plateforme-tfjm2
1
0
Fork 0
mirror of https://gitlab.com/animath/si/plateforme.git synced 2025-06-22 22:38:24 +02:00
Code Issues Releases Wiki Activity

First interface to start draws

Browse Source 
Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>
This commit is contained in:
Emmy D'Anello
2023-03-22 18:44:49 +01:00
parent 88823b5252
commit bde3758c50
8 changed files with 182 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
draw/static/draw.js
View File

@ -1,37 +1,61 @@
const tournaments = JSON.parse(document.getElementById('tournaments_list').textContent)
const sockets = {}
for (let tournament of tournaments) {
let socket = new WebSocket(
'ws://' + window.location.host + '/ws/draw/' + tournament.id + '/'
)
sockets[tournament.id] = socket
const messages = document.getElementById('messages')
// TODO: For now, we only have a chatbot. Need to implementthe drawing interface
socket.onmessage = function(e) {
console.log(e.data)
const data = JSON.parse(e.data)
console.log(data)
document.querySelector('#chat-log-' + tournament.id).value += (data.message + '\n')
}
document.addEventListener('DOMContentLoaded', () => {
for (let tournament of tournaments) {
let socket = new WebSocket(
'ws://' + window.location.host + '/ws/draw/' + tournament.id + '/'
)
sockets[tournament.id] = socket
socket.onclose = function(e) {
console.error('Chat socket closed unexpectedly')
}
function addMessage(message, type, timeout = 0) {
const wrapper = document.createElement('div')
wrapper.innerHTML = [
`<div class="alert alert-${type} alert-dismissible" role="alert">`,
`<div>${message}</div>`,
'<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
].join('\n')
messages.append(wrapper)
document.querySelector('#chat-message-' + tournament.id + '-input').focus();
document.querySelector('#chat-message-' + tournament.id + '-input').onkeyup = function(e) {
if (e.keyCode === 13) { // enter, return
document.querySelector('#chat-message-' + tournament.id + '-submit').click();
if (timeout)
setTimeout(() => wrapper.remove(), timeout)
}
};
document.querySelector('#chat-message-' + tournament.id + '-submit').onclick = function(e) {
const messageInputDom = document.querySelector('#chat-message-' + tournament.id + '-input');
const message = messageInputDom.value;
socket.send(JSON.stringify({
'message': message
}));
messageInputDom.value = '';
};
}
function draw_start(data) {
fetch(`/draw/content/${tournament.id}/`).then(resp => resp.text()).then(text => {
document.getElementById(`tab-${tournament.id}-pane`).innerHTML = text
})
}
socket.addEventListener('message', e => {
const data = JSON.parse(e.data)
console.log(data)
switch (data.type) {
case 'alert':
addMessage(data.message, data.alert_type)
break
case 'draw_start':
draw_start(data)
}
})
socket.addEventListener('close', e => {
console.error('Chat socket closed unexpectedly')
})
socket.addEventListener('open', e => {})
document.getElementById('format-form-' + tournament.id)
.addEventListener('submit', function (e) {
e.preventDefault()
socket.send(JSON.stringify({
'type': 'start_draw',
'fmt': document.getElementById('format-' + tournament.id).value
}))
})
}
})