Add (rate-limited) posts to the /answering and /judging endpoints
authorCarl Worth <cworth@cworth.org>
Sun, 14 Jun 2020 18:54:42 +0000 (11:54 -0700)
committerCarl Worth <cworth@cworth.org>
Sun, 14 Jun 2020 18:54:42 +0000 (11:54 -0700)
This gives all connected clients visibility into people that are
actively filling out information.

empathy/empathy.jsx

index ee92ab3d7b556d2c4d4f2d236363af825efc37b5..546df87acbbb0129f33deffc8e4996209460800d 100644 (file)
@@ -393,6 +393,8 @@ class Ambiguities extends React.PureComponent {
       submitted: false,
       selected: null
     };
+
+    this.judging_sent_recently = false;
   }
 
   async handle_submit() {
@@ -419,6 +421,17 @@ 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 idx = this.state.word_sets.findIndex(s => s.has(word));
@@ -569,7 +582,27 @@ class ActivePrompt extends React.PureComponent {
     };
 
     this.answers = [...Array(items)].map(() => React.createRef());
+    this.answering_sent_recently = false;
+
     this.handle_submit = this.handle_submit.bind(this);
+    this.handle_change = this.handle_change.bind(this);
+  }
+
+  handle_change(event) {
+    /* We don't care (or even look) at what the player is typing at
+     * this point. We simply want to be informed that the player _is_
+     * typing so that we can tell the server (which will tell other
+     * players) that there is activity here.
+     */
+
+    /* Rate limit so that we don't send an "answering" notification
+     * more frequently than necessary.
+     */
+    if (! this.answering_sent_recently) {
+      fetch_post_json(`answering/${this.props.prompt.id}`);
+      this.answering_sent_recently = true;
+      setTimeout(() => { this.answering_sent_recently = false; }, 1000);
+    }
   }
 
   async handle_submit(event) {
@@ -666,6 +699,7 @@ class ActivePrompt extends React.PureComponent {
                   name={`answer_${i}`}
                   required
                   autoComplete="off"
+                  onChange={this.handle_change}
                   ref={this.answers[i]}
                 />
               </div>