X-Git-Url: https://git.cworth.org/git?a=blobdiff_plain;f=empires-client.js;h=5f489f8780c547c6f8af2a743561a965ebdcd07c;hb=37c17cc62597ed8c959bacf59e4a47501f56c334;hp=c460bcdbf40eee7f841759ae1a4c995030dc4c07;hpb=4e97bfa79f3b332de1ead30d0eb633534f9ea91a;p=empires-html diff --git a/empires-client.js b/empires-client.js index c460bcd..5f489f8 100644 --- a/empires-client.js +++ b/empires-client.js @@ -1,4 +1,4 @@ -const API = "https://families.cworth.org/"; +const API = "https://families.cworth.org/api/"; function undisplay(element) { element.style.display="none"; @@ -9,7 +9,7 @@ function add_message(severity, message) { ${message} × `; - message_area = document.getElementById('message-area'); + const message_area = document.getElementById('message-area'); message_area.insertAdjacentHTML('beforeend', message); } @@ -31,3 +31,44 @@ function register(form) { form.reset(); } + +const events = new EventSource(API + "events"); + +events.addEventListener("players", function(event) { + const players_element = document.getElementById("players"); + const players = JSON.parse(event.data); + + players_element.innerHTML = ''; + for (const player of players) { + var li = document.createElement('li'); + li.id = "player-" + player.id; + li.innerText = player.name; + players_element.appendChild(li); + } +}); + +events.addEventListener("player-register", function(event) { + const players = document.getElementById("players"); + const player = JSON.parse(event.data); + + const li = document.createElement('li'); + li.id = "player-" + player.id; + li.innerText = player.name; + players.appendChild(li); +}); + +events.addEventListener("player-deregister", function(event) { + const players = document.getElementById("players"); + const id = JSON.parse(event.data); + const player = document.getElementById("player-" + id.id); + + players.removeChild(player); +}); + +events.addEventListener("capture", function(event_string) { + const players = document.getElementById("players"); + const event = JSON.parse(event_string.data); + const player = document.getElementById("player-" + event.captee); + + players.removeChild(player); +});