Bug 1395091 - about:telemetry global search should have headings before section results. r=gfritzsche
Put a table heading to each search section in the about:telemetry homepage.
MozReview-Commit-ID: 7DaFjy6lbcq
--- a/toolkit/content/aboutTelemetry.js
+++ b/toolkit/content/aboutTelemetry.js
@@ -1454,32 +1454,39 @@ var Search = {
adjustHeaderState();
Array.from(document.querySelectorAll("section")).forEach((section) => {
section.classList.toggle("active", section.id == "home-section");
});
},
homeSearch(text) {
changeUrlSearch(text);
+ removeSearchSectionTitles();
if (text === "") {
this.resetHome();
return;
}
document.getElementById("main").classList.add("search");
let title = bundle.formatStringFromName("resultsForSearch", [text], 1);
adjustHeaderState(title);
let noSearchResults = true;
Array.from(document.querySelectorAll("section")).forEach((section) => {
if (section.id == "home-section" || section.id == "raw-payload-section") {
section.classList.remove("active");
return;
}
section.classList.add("active");
let sectionHidden = this.search(text, section);
- if (noSearchResults && !sectionHidden) {
+ if (!sectionHidden) {
+ let sectionTitle = document.querySelector(`.category[value="${section.id}"] .category-name`).textContent;
+ let sectionDataDiv = document.querySelector(`#${section.id}.has-data.active .data`);
+ let titleDiv = document.createElement("h1");
+ titleDiv.classList.add("data", "search-section-title");
+ titleDiv.textContent = sectionTitle;
+ section.insertBefore(titleDiv, sectionDataDiv);
noSearchResults = false;
}
});
this.updateNoResults(text, noSearchResults);
}
};
/*
@@ -1868,32 +1875,40 @@ function displayProcessesSelector(select
"keyed-histograms-section",
"events-section"
];
let processes = document.getElementById("processes");
processes.hidden = !whitelist.includes(selectedSection);
}
function refreshSearch() {
+ removeSearchSectionTitles();
let selectedSection = document.querySelector(".category.selected").getAttribute("value");
let search = document.getElementById("search");
if (!Search.blacklist.includes(selectedSection)) {
Search.search(search.value);
}
}
function adjustSearchState() {
+ removeSearchSectionTitles();
let selectedSection = document.querySelector(".category.selected").getAttribute("value");
let search = document.getElementById("search");
search.value = "";
search.hidden = Search.blacklist.includes(selectedSection);
document.getElementById("no-search-results").classList.add("hidden");
Search.search(""); // reinitialize search state.
}
+function removeSearchSectionTitles() {
+ for (let sectionTitleDiv of Array.from(document.getElementsByClassName("search-section-title"))) {
+ sectionTitleDiv.remove();
+ }
+}
+
function adjustSection() {
let selectedCategory = document.querySelector(".category.selected");
if (!selectedCategory.classList.contains("has-data")) {
PingPicker._showStructuredPingData();
}
}
function adjustHeaderState(title = null) {