X-Git-Url: https://git.cworth.org/git?a=blobdiff_plain;ds=inline;f=tictactoe%2Ftictactoe.jsx;h=71690b91e2ecf7692790eeb5517080aa35ef5653;hb=e804009ec5cc7bb804c229915ce1c8ebedaa88c7;hp=c51727dab72f9f4172f743b2422cdaed037d20cb;hpb=74237cfd16350e21b67660f7ea9c3dc91e0bf10a;p=lmno.games diff --git a/tictactoe/tictactoe.jsx b/tictactoe/tictactoe.jsx index c51727d..71690b9 100644 --- a/tictactoe/tictactoe.jsx +++ b/tictactoe/tictactoe.jsx @@ -20,6 +20,10 @@ ${message} message_area.insertAdjacentHTML('beforeend', message); } +/********************************************************* + * Handling server-sent event stream * + *********************************************************/ + const events = new EventSource("events"); events.onerror = function(event) { @@ -28,6 +32,25 @@ events.onerror = function(event) { } }; +events.addEventListener("game-info", event => { + const info = JSON.parse(event.data); + + window.game.set_game_info(info); +}); + +events.addEventListener("player-info", event => { + const info = JSON.parse(event.data); + + window.game.set_player_info(info); +}); + +events.addEventListener("player-update", event => { + const info = JSON.parse(event.data); + + if (info.id === window.game.state.player_info.id) + window.game.set_player_info(info); +}); + events.addEventListener("move", event => { const move = JSON.parse(event.data); @@ -37,13 +60,35 @@ events.addEventListener("move", event => { events.addEventListener("game-state", event => { const state = JSON.parse(event.data); - window.game.reset_state(); + window.game.reset_board(); for (let square of state.moves) { window.game.receive_move(square); } }); +/********************************************************* + * Game and supporting classes * + *********************************************************/ + +function GameInfo(props) { + return ( +