X-Git-Url: https://git.cworth.org/git?p=lmno.games;a=blobdiff_plain;f=empathy%2Fempathy.jsx;h=566ad105c5e3cdb3727ffe504d74ca52e9c0efc4;hp=3d7034527c0c8bd49dc8fea14dcf14af96b5520e;hb=04b3139e734606e5281f7a784c3a04ce1b02cc4d;hpb=6baa178ee249fde9b660e91c6d6cc374b3d755ac diff --git a/empathy/empathy.jsx b/empathy/empathy.jsx index 3d70345..566ad10 100644 --- a/empathy/empathy.jsx +++ b/empathy/empathy.jsx @@ -57,13 +57,27 @@ events.addEventListener("player-update", event => { events.addEventListener("game-state", event => { const state = JSON.parse(event.data); + window.game.reset_game_state(); + window.game.set_prompts(state.prompts); window.game.set_active_prompt(state.active_prompt); - window.game.set_scores(state.scores); + window.game.set_players_answered(state.players_answered); + + window.game.set_players_answering(state.players_answering); + + window.game.set_end_answers(state.end_answers); window.game.set_ambiguities(state.ambiguities); + + window.game.set_players_judged(state.players_judged); + + window.game.set_players_judging(state.players_judging); + + window.game.set_end_judging(state.end_judging); + + window.game.set_scores(state.scores); }); events.addEventListener("prompt", event => { @@ -78,10 +92,28 @@ events.addEventListener("start", event => { window.game.set_active_prompt(prompt); }); -events.addEventListener("answered", event => { - const players_answered = JSON.parse(event.data); +events.addEventListener("player-answered", event => { + const player = JSON.parse(event.data); - window.game.set_players_answered(players_answered); + window.game.set_player_answered(player); +}); + +events.addEventListener("player-answering", event => { + const player = JSON.parse(event.data); + + window.game.set_player_answering(player); +}); + +events.addEventListener("vote-end-answers", event => { + const player = JSON.parse(event.data); + + window.game.set_player_vote_end_answers(player); +}); + +events.addEventListener("unvote-end-answers", event => { + const player = JSON.parse(event.data); + + window.game.set_player_unvote_end_answers(player); }); events.addEventListener("ambiguities", event => { @@ -90,10 +122,28 @@ events.addEventListener("ambiguities", event => { window.game.set_ambiguities(ambiguities); }); -events.addEventListener("judged", event => { - const players_judged = JSON.parse(event.data); +events.addEventListener("player-judged", event => { + const player = JSON.parse(event.data); + + window.game.set_player_judged(player); +}); + +events.addEventListener("player-judging", event => { + const player = JSON.parse(event.data); - window.game.set_players_judged(players_judged); + window.game.set_player_judging(player); +}); + +events.addEventListener("vote-end-judging", event => { + const player = JSON.parse(event.data); + + window.game.set_player_vote_end_judging(player); +}); + +events.addEventListener("unvote-end-judging", event => { + const player = JSON.parse(event.data); + + window.game.set_player_unvote_end_judging(player); }); events.addEventListener("scores", event => { @@ -225,7 +275,6 @@ class CategoryRequest extends React.PureComponent { if (response.status === 200) { const result = await response.json(); - console.log(result); if (! result.valid) { add_message("danger", result.message); return; @@ -312,10 +361,6 @@ const PromptOptions = React.memo(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); @@ -349,17 +394,25 @@ class Ambiguities extends React.PureComponent { constructor(props) { super(props); + const word_sets = props.words.map(word => { + const set = new Set(); + set.add(word); + return set; + }); + this.state = { - word_groups: props.words.map(word => [word]), + word_sets: word_sets, submitted: false, selected: null }; + + this.judging_sent_recently = false; } async handle_submit() { const response = await fetch_post_json( - `judging/${this.props.prompt.id}`,{ - word_groups: this.state.word_groups + `judged/${this.props.prompt.id}`,{ + word_groups: this.state.word_sets.map(set => Array.from(set)) } ); @@ -370,7 +423,7 @@ class Ambiguities extends React.PureComponent { return; } } else { - add_message("danger", "An error occurred submitting your answers"); + add_message("danger", "An error occurred submitting the results of your judging"); return; } @@ -380,37 +433,62 @@ class Ambiguities extends React.PureComponent { } handle_click(word) { + + /* Let the server know we are doing some judging, (but rate limit + * this so we don't send a "judging" notification more frquently + * than necessary. + */ + if (! this.judging_sent_recently) { + fetch_post_json(`judging/${this.props.prompt.id}`); + this.judging_sent_recently = true; + setTimeout(() => { this.judging_sent_recently = false; }, 1000); + } + if (this.state.selected == word) { /* Second click on same word removes the word from the group. */ - const new_groups = this.state.word_groups.filter( - group => (! group.includes(this.state.selected)) || (group.length > 1)).map( - group => { - return group.filter(w => w !== this.state.selected); - } - ); + const idx = this.state.word_sets.findIndex(s => s.has(word)); + const set = this.state.word_sets[idx]; + if (set.size === 1) { + /* When the word is already alone, there's nothing to do but + * to un-select it. */ + this.setState({ + selected: null + }); + return; + } + + const new_set = new Set([...set].filter(w => w !== word)); this.setState({ selected: null, - word_groups: [...new_groups, [word]] + word_sets: [...this.state.word_sets.slice(0, idx), + new_set, + new Set().add(word), + ...this.state.word_sets.slice(idx+1)] }); } else if (this.state.selected) { /* Click of a second word groups the two together. */ - const new_groups = this.state.word_groups.filter( - group => (! group.includes(word)) || (group.length > 1)).map( - group => { - if (group.includes(this.state.selected)) { - if (! group.includes(word)) - return [...group, word]; - else - return group; - } else { - return group.filter(w => w !== word); - } - } - ); - this.setState({ - selected: null, - word_groups: new_groups - }); + const idx1 = this.state.word_sets.findIndex(s => s.has(this.state.selected)); + const idx2 = this.state.word_sets.findIndex(s => s.has(word)); + const set1 = this.state.word_sets[idx1]; + const set2 = this.state.word_sets[idx2]; + const new_set = new Set([...set2, ...set1]); + if (idx1 < idx2) { + this.setState({ + selected: null, + word_sets: [...this.state.word_sets.slice(0, idx1), + ...this.state.word_sets.slice(idx1 + 1, idx2), + new_set, + ...this.state.word_sets.slice(idx2 + 1)] + }); + } else { + this.setState({ + selected: null, + word_sets: [...this.state.word_sets.slice(0, idx2), + new_set, + ...this.state.word_sets.slice(idx2 + 1, idx1), + ...this.state.word_sets.slice(idx1 + 1)] + }); + } } else { /* First click of a word selects it. */ this.setState({ @@ -423,11 +501,46 @@ class Ambiguities extends React.PureComponent { if (this.state.submitted) return (
- Please wait for the rest of the players to complete judging. + The following players have completed judging: + {[...this.props.players_judged].join(', ')}
++ Still waiting for the following players: +
++ The following players have submitted their answers: + {[...this.props.players_answered].join(', ')} +
- Please wait for the rest of the players to submit their answers. + Still waiting for the following players:
+