// ゲームで使用する単語のリストを定義
let words = ['apple', 'banana', 'orange', 'strawberry', 'grape', 'blueberry', 'kiwi', 'pineapple', 'peach', 'watermelon'];
let word; //現在の単語を格納する変数
let score = 0;　//プレイヤーのスコアを格納する変数
let time = 60;  //ゲームの制限時間を格納する変数
let isPlaying = false; //ゲームが進行中かどうかを示す変数
let countdown;  //制限時間をカウントダウンするためのタイマーを格納する変数

const wordDisplay = document.getElementById('word'); //HTML内のid属性が'word'で指定された要素を参照
const input = document.getElementById('input'); //'input'というid属性を持つHTML要素を参照
const scoreDisplay = document.getElementById('score'); //'score'というid属性を持つHTML要素を参照
const timeDisplay = document.getElementById('time'); //'time'というid属性を持つHTML要素を参照
const startButton = document.getElementById('start'); //'start'というid属性を持つHTML要素を参照
const resetButton = document.getElementById('reset'); //'resetというid属性を持つHTML要素を参照'

function init() {
  showWord(); //画面上にランダムな単語を表示するための関数
  input.addEventListener('input', startMatch); //input要素（入力フィールド）でテキストが入力されるたびに、startMatch()関数を呼び出すイベントリスナーを設定
  startButton.addEventListener('click', startGame); //startButton要素（ゲーム開始ボタン）がクリックされた時に、startGame()関数を呼び出すイベントリスナーを設定
  resetButton.addEventListener('click', resetGame); //resetButton要素（ゲームリセットボタン）がクリックされた時に、resetGame()関数を呼び出すイベントリスナーを設定
}

function startGame() {
  if (!isPlaying) {								//ゲームが実行中でない場合（isPlayingがfalseの場合）に処理を開始
    isPlaying = true;							//ゲームの状態を「実行中 (true)」に設定
    time = 60;									//制限時間を60秒に設定
    score = 0;									//スコアをリセットしてゼロに設定
    showWord();									//新しい単語を表示
    input.value = '';							//入力フィールドを空に
    input.focus();								//入力フィールドにフォーカスを当て、すぐに単語を入力できるようにする
    updateScore();								//スコアを画面に表示
    updateTime();								//制限時間を画面に表示
    countdown = setInterval(updateTime, 1000); 	//updateTime()関数を1秒ごとに実行し、残り時間を更新
    setTimeout(() => {							
      clearInterval(countdown);					
      isPlaying = false;						
      wordDisplay.innerText = '終了!';			
    }, time * 1000);							
  }
}//指定された時間（60秒）が経過した後に、指定された処理を実行、60秒後に、残り時間のカウントダウンを停止し、ゲームの状態を「実行中 (isPlaying = false）」から「終了 (wordDisplay.innerText = '終了!'）」に変更

function showWord() {
  const randIndex = Math.floor(Math.random() * words.length); //words配列からランダムにインデックスを選択
  word = words[randIndex]; //words配列からランダムにインデックスにある単語をword変数を代入
  wordDisplay.innerText = word; //words配列からランダムに単語を選び、wordDisplay要素を表示
}

function startMatch() {  //ユーザーが入力した単語が表示されている単語が一致しているかどうかを確認
  if (matchWords()) {  //入力した単語が一致した場合のみ、以下のプログラムが実行される
    score++;  //スコアを1ポイントずつ増やす
    updateScore();  //スコアを画面に表示する
    showWord();  //次の単語を表示
    input.value = ''; //入力フィールドをクリア
  }
}

function updateScore() {   //スコアを画面上で更新
  scoreDisplay.innerText = score;   //要素のテキスト内容をscore変数の値に設定
}

function updateTime() {
  time--;  //現在の時間を示し、1秒ずつ減少
  timeDisplay.innerText = time;  //要素のテキスト内容を現在のtime変数の値に設定
}

function resetGame() {
  isPlaying = false; //ゲームを停止状態に設定
  score = 0;  //スコアゼロにリセット
  clearInterval(countdown);  //時間をカウントするためのインターバルを停止
  time = 60;  //制限時間
  showWord();  
  input.value = '';  //入力欄の値を空に設定
  updateScore();  //スコアをリセット
  updateTime();  //制限時間をリセット
  wordDisplay.innerText = 'スタートボタンを押して始めよう!';
}

function matchWords() {
  if (input.value === word) {  //入力した値が、words変数に格納されてる単語と一致しているかを確認
    return true; // 一致していたら次へ
  }
  return false;  //一致していない場合動かない
}

init(); //初期化
