X-Git-Url: https://git.cworth.org/git?p=lmno.games;a=blobdiff_plain;f=empathy%2Fempathy.jsx;h=54d6c2660975aac30c9376ba05cff1c4feef3048;hp=1867381f15d4472ecff3775382b9d0b38ae50c01;hb=3c2c043c4a6e389a597736c9fd366b716ac7237c;hpb=fcdecf554d0bbad80b96b3c34fb5ba8cefef2144 diff --git a/empathy/empathy.jsx b/empathy/empathy.jsx index 1867381..54d6c26 100644 --- a/empathy/empathy.jsx +++ b/empathy/empathy.jsx @@ -55,9 +55,11 @@ events.addEventListener("player-update", event => { events.addEventListener("game-state", event => { const state = JSON.parse(event.data); - for (let prompt of state.prompts) { - window.game.add_or_update_prompt(prompt); - } + window.game.set_prompts(state.prompts); + + window.game.set_active_prompt(state.active_prompt); + + window.game.set_scores(state.scores); }); events.addEventListener("prompt", event => { @@ -66,6 +68,24 @@ events.addEventListener("prompt", event => { window.game.add_or_update_prompt(prompt); }); +events.addEventListener("start", event => { + const prompt = JSON.parse(event.data); + + window.game.set_active_prompt(prompt); +}); + +events.addEventListener("answered", event => { + const players_answered = JSON.parse(event.data); + + window.game.set_players_answered(players_answered); +}); + +events.addEventListener("scores", event => { + const scores = JSON.parse(event.data); + + window.game.set_scores(scores); +}); + /********************************************************* * Game and supporting classes * *********************************************************/ @@ -80,7 +100,7 @@ function copy_to_clipboard(id) document.body.removeChild(tmp); } -function GameInfo(props) { +const GameInfo = React.memo(props => { if (! props.id) return null; @@ -97,9 +117,9 @@ function GameInfo(props) { >Copy Link ); -} +}); -function PlayerInfo(props) { +const PlayerInfo = React.memo(props => { if (! props.player.id) return null; @@ -115,7 +135,7 @@ function PlayerInfo(props) { ))} ); -} +}); function fetch_method_json(method, api = '', data = {}) { const response = fetch(api, { @@ -136,7 +156,7 @@ async function fetch_put_json(api = '', data = {}) { return fetch_method_json('PUT', api, data); } -class CategoryRequest extends React.Component { +class CategoryRequest extends React.PureComponent { constructor(props) { super(props); this.category = React.createRef(); @@ -210,11 +230,7 @@ class CategoryRequest extends React.Component { } } -function PromptOptions(props) { - - function handle_click(id) { - fetch_post_json(`vote/${id}`); - } +const PromptOptions = React.memo(props => { if (props.prompts.length === 0) return null; @@ -231,24 +247,165 @@ function PromptOptions(props) { ); })} ); +}); + +const LetsPlay = React.memo(props => { + + function handle_click(prompt_id) { + fetch_post_json + } + + const quorum = Math.round((props.num_players + 1) / 2); + const max_votes = props.prompts.reduce( + (max_so_far, v) => Math.max(max_so_far, v.votes.length), 0); + + if (max_votes < quorum) + return null; + + const candidates = props.prompts.filter(p => p.votes.length >= quorum); + const index = Math.floor(Math.random() * candidates.length); + const winner = candidates[index]; + + return ( +
+ That should be enough voting. If you're not waiting for any + other players to join, then let's start. +
+ ++ Please wait for the rest of the players to submit their answers. +
++ Remember, you're trying to match your answers with + what the other players submit. + Give {this.props.prompt.items} answers for the following prompt: +
+