fetch("./locations.json").then((locations_unparsed) => {
  locations_unparsed.json().then((places) => handle_response(places));
});

function handle_response(places) {
  console.log(places);
  Object.keys(places).forEach(name => {
    let document_element = document.createElement("li");
    document_element.className = "element";
    let link_element = document.createElement("a");
    link_element.href = "./map.html?" + name;
    link_element.innerHTML = places[name].display_name;
    document_element.appendChild(link_element);
    document.getElementById("search_list").appendChild(document_element);
  });
}

function eliminate_results() {
  let input = document.getElementById("search_bar").value;
  input = input.toLowerCase();
  console.log("Typed a charachter");
  let x = document.getElementsByClassName('element');

  for (i = 0; i < x.length; i++) {
    if (!x[i].innerHTML.toLowerCase().includes(input)) {
      x[i].style.display = "none";
    }
    else {
      x[i].style.display = "list-item";
    }
  }
}