let company = document.getElementById("company").value;
let page = document.getElementById("page").value;
// let stat = document.getElementById("stat").value;
const stat = "performance_score";

// COMPANY

const companySelect = document.getElementById("company");

const onCompanyChangeHander = (e) => {

  company = e.target.value;
  
  const filteredData = filterData(rawJson);
  const classCompany = company === "Joe Fresh" ? "Joe" : company;
  
  const lineClass = `${classCompany}-line`;
  drawLine(filteredData, lineClass, false, true);
}

companySelect.addEventListener("change", onCompanyChangeHander);

// PAGE

const pageSelect = document.getElementById("page");

const onPageChangeHander = (e) => {

  page = e.target.value;
  
  
  const filteredData = filterData(rawJson);
  const classCompany = company === "Joe Fresh" ? "Joe" : company;
  
  const lineClass = `${classCompany}-line`;
  drawLine(filteredData, lineClass, false, true);
}

pageSelect.addEventListener("change", onPageChangeHander);

// STAT
/*
const statSelect = document.getElementById("stat");

const onStatChangeHander = (e) => {

  stat = e.target.value;
}

statSelect.addEventListener("change", onStatChangeHander);
*/