const searchForm = document.querySelector("form");

const date = searchForm.querySelector("input[name=date]");
const start_time = searchForm.querySelector("input[name=start_time]");
const end_time = searchForm.querySelector("input[name=end_time]");

const date_issue = searchForm.querySelector("#date_issue");
const time_issue = searchForm.querySelector("#time_issue");

date.valueAsDate = new Date(); // Set todays date

/* Setup form */
searchForm.action = "/search.php";
searchForm.method = "get";
searchForm.noValidate = true;

searchForm.onsubmit = function (e) {
  e.preventDefault();

  let isValid = true;
  time_issue.classList.remove("shown");
  date_issue.classList.remove("shown");

  date.classList.remove("invalid");
  start_time.classList.remove("invalid");
  end_time.classList.remove("invalid");


  /* Check if date is valid*/
  if (date.valueAsDate == null) {
    date_issue.classList.add("shown");
    date.classList.add("invalid");
    isValid = false;
  }

  /* Check if start time valid */
  if (start_time.valueAsDate == null) {
    isValid = false;
    console.log("UWU");
    time_issue.classList.add("shown");
    start_time.classList.add("invalid");
  }

  /* Check if end time valid */
  if (end_time.valueAsDate == null) {
    isValid = false;
    time_issue.classList.add("shown");
    end_time.classList.add("invalid");
  }

  /* Check if start < end */
  if (start_time.valueAsNumber >= end_time.valueAsNumber) {
    isValid = false;
    time_issue.classList.add("shown");
    start_time.classList.add("invalid");
    end_time.classList.add("invalid");
  }

  if (isValid) {
    this.submit();
  }
};