Compliment Timer

0:00
以下がHTMLとJavaScriptのコードです。30分経過後にもう一度「Great job!」が表示されないように、タイマーが30分後に自動的に停止するように注意してください。

```html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Compliment Timer</title>
  </head>
  <body>
    <h1>Compliment Timer</h1>
    <p id="timer">0:00</p>
    <p id="message"></p>
    <button onclick="startTimer()">Start</button>
    <button onclick="stopTimer()">Stop</button>
    <script>
      let timer = null;
      let startTime = null;
      
      function startTimer() {
        if (timer !== null) return; // already started
        startTime = Date.now();
        timer = setInterval(updateTimer, 1000);
      }
      
      function stopTimer() {
        clearInterval(timer);
        timer = null;
        startTime = null;
        showMessage('');
        updateTimer();
      }
      
      function updateTimer() {
        const elapsed = Math.floor((Date.now() - startTime) / 1000);
        const minutes = Math.floor(elapsed / 60).toString().padStart(2, '0');
        const seconds = (elapsed % 60).toString().padStart(2, '0');
        document.getElementById('timer').textContent = `${minutes}:${seconds}`;
        showMessage(getMessage(elapsed));
        if (elapsed >= 1800) stopTimer(); // stop after 30 minutes
      }
      
      function getMessage(elapsed) {
        const minutes = Math.floor(elapsed / 60);
        if (minutes % 5 === 0 && elapsed % 60 === 0) {
          return 'Next word!';
        } else if (elapsed % 60 === 0) {
          return 'Good! You are genius!';
        } else {
          return '';
        }
      }
      
      function showMessage(message) {
        document.getElementById('message').textContent = message;
      }
    </script>
  </body>
</html>
```

注意：このタイマーは単にジョークとして作られたものであり、本格的な時間管理には不適切です。タイマーを利用する際には、適切な時間管理について正確な知識を持つことが必要です。