function filterQuestionsState(data, stateVal) {
  filteredQuestion = data.find(item => item.state === stateVal);
  return filteredQuestion;
}

function displayQuestion(question) {
  const questionBox = document.getElementById("questionBox");
  const questionParagraph = document.getElementById("questionParagraph");

  if (question != undefined) {
    if (questionBoxHidden = true) {
      questionBox.style.backgroundColor = 'rgba(13, 110, 253, 0.8)';
      questionBox.style.borderColor = 'rgba(13, 110, 253, 0.9)';
      questionBoxHidden = false;
    }
    questionParagraph.textContent = question.text;
  }
  else {
    questionBox.style.backgroundColor = 'rgba(13, 110, 253, 0)';
    questionBox.style.borderColor = 'rgba(13, 110, 253, 0)';
    questionParagraph.textContent = '';
    var questionBoxHidden = true;
  }
}

function getQuestion() {
  fetch('https://www.d120.de/fragen/api/questions', {
    mode: 'cors',
    method: 'GET',
  })
    .then(response => {
      if (!response.ok) {
        throw new Error('Network response was not ok');
      }
      return response.json();
    })
    .then(data => {
      console.log('response:', data);
      filteredQuestion = filterQuestionsState(data, 2);
      displayQuestion(filteredQuestion);
    })
    .catch(error => {
      console.error('error:', error);
    });
}

document.getElementById("questionBox").style.transition = "all 0.3s"
const updateEvery = 3000;
setInterval(getQuestion, updateEvery);