同意を促すメッセージ

by ginpei

HTML

<p>
  <label><input type="checkbox" id="agree"> 同意する</label>
</p>
<p id="message"></p>

JavaScript

/* eslint-disable no-await-in-loop */
/* eslint-disable no-restricted-syntax */
const elAgree = document.querySelector('#agree');
const elMessage = document.querySelector('#message');
const sleep = (ms) => new Promise((f) => setTimeout(f, ms));
const messages = [
  '同意をお願いします',
  '早く同意をお願いします',
  'まだですか？',
  'そろそろ同意をお願いします',
  '同意はよ',
  'まだかよ',
  'とっとと同意しろやこのグズ',
  'うそだよごめんね、でも同意してね',
  '聞いてる？',
  'おーい',
  'いい加減にしろボケ',
  '……',
  'たのむよ……',
];

async function* waitForAgreeing (interval = 2000) {
  let index = 0;
  while (true) {
    if (elAgree.checked) {
      return;
    }

    await sleep(interval);
    yield messages[index];
    index = (index + 1) % messages.length;
  }
}

const main = async () => {
  for await (const message of waitForAgreeing()) {
    elMessage.textContent = message;
  }
  elMessage.textContent = 'さんきゅー';
};

main();