don't send actions too soon after an update

Fixes #10.

site/src/components/Game.vue

@@ -83,21 +83,48 @@ const timeLeft = ref(15000);
 const timestamp = useTimestamp({
     callback: (t) => {
         timeLeft.value = props.game.deadline - t;
+        if (!notYet.value && storedAction.value != null) {
+            emit('action', storedAction.value);
+            storedAction.value = null;
+        }
     },
     interval: 60,
 });
 watch(() => props.game.deadline, (now) => {
     initTimeLeft.value = now - timestamp.value;
-}, {immediate: true});
-const moveColor = computed(() => timeLeft.value > 3000 ? 'primary' : 'red');
+}, { immediate: true });
+const notYet = computed(() => initTimeLeft.value - timeLeft.value < 3000);
+const moveColor = computed(() => {
+    if (storedAction.value != null) {
+        return 'green';
+    }
+    if (timeLeft.value > 3000) {
+        return 'gray';
+    }
+    return 'red';
+});
+
+const storedAction = ref<Action | null>(null);
 
 function attack(left: boolean) {
     const action = left === props.dealer ? 'self' : 'across';
+    if (notYet.value) {
+        storedAction.value = { action };
+        return;
+    }
+    // Emit the action immediately if enough time has passed, since we don't
+    // want the tick rate to be the difference between winning and losing.
+    storedAction.value = null;
     emit('action', { action });
 }
 
 function useItem(evt: number) {
     const action = evt.toString() as "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7";
+    if (notYet.value) {
+        storedAction.value = { action };
+        return;
+    }
+    storedAction.value = null;
     emit('action', { action });
 }