gabehf/sqm-dashboards
1
0
Fork 0
mirror of https://github.com/edcommonwealth/sqm-dashboards.git synced 2026-03-08 23:18:18 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Create landing page to select a school dashboard [179826663]

Browse source
This commit is contained in:
Alex Basson 2021-10-19 12:05:30 -04:00 • committed by Chad Serrant
parent 31a9f3f0a4
commit 28f32d072f
1791 changed files with 243 additions and 48306 deletions
Download patch file Download diff file Expand all files Collapse all files

68
app/javascript/home.js
View file

@ -1,33 +1,47 @@
export function initializeListenersForHomeDropdowns() {
document.addEventListener("turbolinks:load", () => {
const districtDropdown = document.querySelector("#district-dropdown");
if (districtDropdown) {
districtDropdown.addEventListener("change", (event) => {
const schoolDropdown = document.querySelector("#school-dropdown");
const districtDropdown = document.querySelector("#district-dropdown");
if (districtDropdown) {
const schoolDropdown = document.querySelector("#school-dropdown");
districtDropdown.addEventListener("change", (event) => {
const districtId = Number(event.target.value);
const schoolsInDistrict = window.schools.filter(
(school) => school.district_id === districtId
);
const districtId = Number(event.target.value);
schoolDropdown.replaceChildren(
...schoolsInDistrict.map((school) => {
return createOptionForSelect(school.name, school.url, false);
})
);
const schoolsInDistrict = window.schools.filter(
(school) => school.district_id === districtId
);
let optionElem = createOptionForSelect("Select a school", schoolDropdown.firstChild.value, true)
schoolDropdown.insertBefore(optionElem, schoolDropdown.firstChild);
schoolsInDistrict.forEach((school) => {
const optionElem = document.createElement("option");
optionElem.setAttribute("value", school.url);
const schoolNameNode = document.createTextNode(school.name);
optionElem.appendChild(schoolNameNode);
schoolDropdown.appendChild(optionElem);
});
schoolDropdown.disabled = false;
});
schoolDropdown.addEventListener("change", (event) => {
const goButton = document.querySelector('button[data-id="go-to-school"]');
goButton.disabled = false;
});
document
.querySelector('button[data-id="go-to-school"]')
.addEventListener("click", (event) => {
const selectedSchoolURL = schoolDropdown.value;
window.location = selectedSchoolURL;
});
document
.querySelector('button[data-id="go-to-school"]')
.addEventListener("click", (event) => {
const selectedSchoolURL =
document.querySelector("#school-dropdown").value;
window.location = selectedSchoolURL;
});
}
});
return true;
}
}
function createOptionForSelect(name, value, selected) {
const optionElem = document.createElement("option");
optionElem.setAttribute("value", value);
if (selected === true) {
optionElem.setAttribute("selected", "selected");
}
const schoolNameNode = document.createTextNode(name);
optionElem.appendChild(schoolNameNode);
return optionElem;
}