All of lore.kernel.org
 help / color / mirror / Atom feed
* [Buildroot] [PATCH 0/2] support/scripts/pkg-stats: reduce size of HTML output
@ 2022-08-05 18:58 Sen Hastings
  2022-08-05 18:58 ` [Buildroot] [PATCH 1/2] support/scripts/pkg-stats: move to procedurally generated row/column classes Sen Hastings
  2022-08-05 18:58 ` [Buildroot] [PATCH 2/2] support/scripts/pkg-stats: optimize CSS selector usage Sen Hastings
  0 siblings, 2 replies; 3+ messages in thread
From: Sen Hastings @ 2022-08-05 18:58 UTC (permalink / raw)
  To: buildroot; +Cc: Sen Hastings

pkg-stats.html has unfortunately ballooned in size, almost entirely due
to the classes I was applying to cells for use in sortGrid().

This patch series cuts the size (in bytes) of the markup back down to
sortable.js days, and even does a little bit better :-)

Sen Hastings (2):
  support/scripts/pkg-stats: move to procedurally generated row/column
    clases
  support/scripts/pkg-stats: optimize CSS selector usage

 support/scripts/pkg-stats | 238 ++++++++++++++++++--------------------
 1 file changed, 111 insertions(+), 127 deletions(-)

-- 
2.34.1

_______________________________________________
buildroot mailing list
buildroot@buildroot.org
https://lists.buildroot.org/mailman/listinfo/buildroot

^ permalink raw reply	[flat|nested] 3+ messages in thread

* [Buildroot] [PATCH 1/2] support/scripts/pkg-stats: move to procedurally generated row/column classes
  2022-08-05 18:58 [Buildroot] [PATCH 0/2] support/scripts/pkg-stats: reduce size of HTML output Sen Hastings
@ 2022-08-05 18:58 ` Sen Hastings
  2022-08-05 18:58 ` [Buildroot] [PATCH 2/2] support/scripts/pkg-stats: optimize CSS selector usage Sen Hastings
  1 sibling, 0 replies; 3+ messages in thread
From: Sen Hastings @ 2022-08-05 18:58 UTC (permalink / raw)
  To: buildroot; +Cc: Sen Hastings

Rather than having pre-baked classes in the markup for sorting purposes,
all the cells in package-grid are iterated over at load time and given
a row/column class.

Signed-off-by: Sen Hastings <sen@phobosdpl.com>
---
 support/scripts/pkg-stats | 160 ++++++++++++++++----------------------
 1 file changed, 68 insertions(+), 92 deletions(-)

diff --git a/support/scripts/pkg-stats b/support/scripts/pkg-stats
index d32abd7225..39da5e5593 100755
--- a/support/scripts/pkg-stats
+++ b/support/scripts/pkg-stats
@@ -758,6 +758,17 @@ addedCSSRules = [
 
 addedCSSRules.forEach(rule => styleSheet.insertRule(rule));
 
+window.addEventListener('DOMContentLoaded', (event) => {
+	gridArray = Array.from(document.getElementById("package-grid").children);
+	let l = row = 0;
+	gridArray.forEach(cell =>{
+		if (l != 13){ l++ }
+		else { l = 1; row++; };
+
+		cell.classList.add("c" + l, "ir" + row);
+	});
+});
+
 function sortGrid(sortLabel){
 	let i = 0;
 	let pkgSortArray = [], sortedPkgArray = [], pkgStringSortArray = [], pkgNumSortArray = [];
@@ -774,14 +785,11 @@ function sortGrid(sortLabel){
 	const styleSheet = styleElement.sheet;
 
         columnValues.shift();
-        columnValues.forEach((listing) => {
+	columnValues.forEach((listing) => {
                 let sortArr = [];
-                sortArr[0] = listing.id.replace(sortLabel+"_", "");
-                if (!listing.innerText){
-                        sortArr[1] = -1;
-                } else {
-                        sortArr[1] = listing.innerText;
-                };
+                sortArr[0] = listing.classList[listing.classList.length - 1];
+                sortArr[1] = listing.innerText;
+                if (!listing.innerText){sortArr[1] = -1;};
                 pkgSortArray.push(sortArr);
         });
         pkgSortArray.forEach((listing) => {
@@ -821,13 +829,12 @@ function sortGrid(sortLabel){
 	addedCSSRules.forEach(rule => styleSheet.insertRule(rule));
 };
 
-function expandField(fieldId){
-        const field = document.getElementById(fieldId);
+function expandField(field){
         const fieldText = field.firstElementChild.innerText;
         const fieldTotal = fieldText.split(' ')[2];
 
         if (fieldText == "see all " + fieldTotal + triangleDown){
-		field.firstElementChild.innerText = "see less " + fieldTotal + triangleUp;
+                field.firstElementChild.innerText = "see less " + fieldTotal + triangleUp;
                 field.style.height = "auto";
         } else {
                 field.firstElementChild.innerText = "see all " + fieldTotal + triangleDown;
@@ -919,80 +926,59 @@ def boolean_str(b):
 
 
 def dump_html_pkg(f, pkg):
-    pkg_css_class = pkg.path.replace("/", "_")[:-3]
-    f.write(f'<div id=\"package__{pkg_css_class}\" \
-        class=\"package data _{pkg_css_class}\">{pkg.path}</div>\n')
+    f.write(f'<div class=\"data\">{pkg.path}</div>\n')
     # Patch count
-    data_field_id = f'patch_count__{pkg_css_class}'
-    div_class = ["centered patch_count data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.patch_count == 0:
         div_class.append("nopatches")
     elif pkg.patch_count < 5:
         div_class.append("somepatches")
     else:
         div_class.append("lotsofpatches")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)} \
-        \">{str(pkg.patch_count)}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{str(pkg.patch_count)}</div>\n')
 
     # Infrastructure
-    data_field_id = f'infrastructure__{pkg_css_class}'
     infra = infra_str(pkg.infras)
-    div_class = ["centered infrastructure data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if infra == "Unknown":
         div_class.append("wrong")
     else:
         div_class.append("correct")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)} \
-        \">{infra_str(pkg.infras)}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{infra_str(pkg.infras)}</div>\n')
 
     # License
-    data_field_id = f'license__{pkg_css_class}'
-    div_class = ["centered license data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.is_status_ok('license'):
         div_class.append("correct")
     else:
         div_class.append("wrong")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)} \
-        \">{boolean_str(pkg.is_status_ok("license"))}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{boolean_str(pkg.is_status_ok("license"))}</div>\n')
 
     # License files
-    data_field_id = f'license_files__{pkg_css_class}'
-    div_class = ["centered license_files data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.is_status_ok('license-files'):
         div_class.append("correct")
     else:
         div_class.append("wrong")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)} \
-        \">{boolean_str(pkg.is_status_ok("license-files"))}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{boolean_str(pkg.is_status_ok("license-files"))}</div>\n')
 
     # Hash
-    data_field_id = f'hash_file__{pkg_css_class}'
-    div_class = ["centered hash_file data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.is_status_ok('hash'):
         div_class.append("correct")
     else:
         div_class.append("wrong")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)} \
-        \">{boolean_str(pkg.is_status_ok("hash"))}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{boolean_str(pkg.is_status_ok("hash"))}</div>\n')
 
     # Current version
-    data_field_id = f'current_version__{pkg_css_class}'
     if len(pkg.current_version) > 20:
         current_version = pkg.current_version[:20] + "..."
     else:
         current_version = pkg.current_version
-    f.write(f'  <div id=\"{data_field_id}\" \
-        class=\"centered current_version data _{pkg_css_class}\">{current_version}</div>\n')
+    f.write(f'  <div>class=\"centered data\" {current_version}</div>\n')
 
     # Latest version
-    data_field_id = f'latest_version__{pkg_css_class}'
-    div_class.append(f'_{pkg_css_class}')
-    div_class.append("latest_version data")
+    div_class = ["centered data"]
     if pkg.latest_version['status'] == RM_API_STATUS_ERROR:
         div_class.append("version-error")
     if pkg.latest_version['version'] is None:
@@ -1020,22 +1006,18 @@ def dump_html_pkg(f, pkg):
         else:
             latest_version_text += "found by guess"
 
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">{latest_version_text}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{latest_version_text}</div>\n')
 
     # Warnings
-    data_field_id = f'warnings__{pkg_css_class}'
-    div_class = ["centered warnings data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.warnings == 0:
         div_class.append("correct")
     else:
         div_class.append("wrong")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">{pkg.warnings}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{pkg.warnings}</div>\n')
 
     # URL status
-    data_field_id = f'upstream_url__{pkg_css_class}'
-    div_class = ["centered upstream_url data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     url_str = pkg.status['url'][1]
     if pkg.status['url'][0] in ("error", "warning"):
         div_class.append("missing_url")
@@ -1045,12 +1027,10 @@ def dump_html_pkg(f, pkg):
     else:
         div_class.append("good_url")
         url_str = "<a href=\"%s\">Link</a>" % pkg.url
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">{url_str}</div>\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">{url_str}</div>\n')
 
     # CVEs
-    data_field_id = f'cves__{pkg_css_class}'
-    div_class = ["centered cves data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if len(pkg.cves) > 10:
         div_class.append("collapse")
     if pkg.is_status_ok("cve"):
@@ -1061,10 +1041,10 @@ def dump_html_pkg(f, pkg):
         div_class.append("cve-ok")
     else:
         div_class.append("cve-unknown")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">\n')
     if len(pkg.cves) > 10:
         cve_total = len(pkg.cves) + 1
-        f.write(f' <div onclick=\"expandField(\'{data_field_id}\')\" \
+        f.write(f' <div onclick=\"expandField(this.parentElement)\" \
         class=\"see-more centered cve_ignored\">see all ({cve_total}) &#9662;</div>\n')
     if pkg.is_status_error("cve"):
         for cve in pkg.cves:
@@ -1078,20 +1058,16 @@ def dump_html_pkg(f, pkg):
     f.write("  </div>\n")
 
     # CVEs Ignored
-    data_field_id = f'ignored_cves__{pkg_css_class}'
-    div_class = ["centered data ignored_cves"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["centered data"]
     if pkg.ignored_cves:
         div_class.append("cve_ignored")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">\n')
     for ignored_cve in pkg.ignored_cves:
         f.write("    <a href=\"https://security-tracker.debian.org/tracker/%s\">%s</a><br/>\n" % (ignored_cve, ignored_cve))
     f.write("  </div>\n")
 
     # CPE ID
-    data_field_id = f'cpe_id__{pkg_css_class}'
-    div_class = ["left cpe_id data"]
-    div_class.append(f'_{pkg_css_class}')
+    div_class = ["data"]
     if pkg.is_status_ok("cpe"):
         div_class.append("cpe-ok")
     elif pkg.is_status_error("cpe"):
@@ -1100,7 +1076,7 @@ def dump_html_pkg(f, pkg):
         div_class.append("cpe-ok")
     else:
         div_class.append("cpe-unknown")
-    f.write(f'  <div id=\"{data_field_id}\" class=\"{" ".join(div_class)}\">\n')
+    f.write(f'  <div class=\"{" ".join(div_class)}\">\n')
     if pkg.cpeid:
         cpeid_begin = ":".join(pkg.cpeid.split(":")[0:4]) + ":"
         cpeid_formatted = pkg.cpeid.replace(cpeid_begin, cpeid_begin + "<wbr>")
@@ -1122,32 +1098,32 @@ def dump_html_pkg(f, pkg):
 def dump_html_all_pkgs(f, packages):
     f.write("""
 <div id=\"package-grid\">
-<div style="grid-column: 1;" onclick="sortGrid(this.id)" id=\"package\"
-     class=\"package data label\"><span>Package</span><span></span></div>
-<div style="grid-column: 2;" onclick="sortGrid(this.id)" id=\"patch_count\"
-     class=\"centered patch_count data label\"><span>Patch count</span><span></span></div>
-<div style="grid-column: 3;" onclick="sortGrid(this.id)" id=\"infrastructure\"
-     class=\"centered infrastructure data label\">Infrastructure<span></span></div>
-<div style="grid-column: 4;" onclick="sortGrid(this.id)" id=\"license\"
-     class=\"centered license data label\"><span>License</span><span></span></div>
-<div style="grid-column: 5;" onclick="sortGrid(this.id)" id=\"license_files\"
-     class=\"centered license_files data label\"><span>License files</span><span></span></div>
-<div style="grid-column: 6;" onclick="sortGrid(this.id)" id=\"hash_file\"
-     class=\"centered hash_file data label\"><span>Hash file</span><span></span></div>
-<div style="grid-column: 7;" onclick="sortGrid(this.id)" id=\"current_version\"
-     class=\"centered current_version data label\"><span>Current version</span><span></span></div>
-<div style="grid-column: 8;" onclick="sortGrid(this.id)" id=\"latest_version\"
-     class=\"centered latest_version data label\"><span>Latest version</span><span></span></div>
-<div style="grid-column: 9;" onclick="sortGrid(this.id)" id=\"warnings\"
-     class=\"centered warnings data label\"><span>Warnings</span><span></span></div>
-<div style="grid-column: 10;" onclick="sortGrid(this.id)" id=\"upstream_url\"
-     class=\"centered upstream_url data label\"><span>Upstream URL</span><span></span></div>
-<div style="grid-column: 11;" onclick="sortGrid(this.id)" id=\"cves\"
-     class=\"centered cves data label\"><span>CVEs</span><span></span></div>
-<div style="grid-column: 12;" onclick="sortGrid(this.id)" id=\"ignored_cves\"
-     class=\"centered ignored_cves data label\"><span>CVEs Ignored</span><span></span></div>
-<div style="grid-column: 13;" onclick="sortGrid(this.id)" id=\"cpe_id\"
-     class=\"centered cpe_id data label\"><span>CPE ID</span><span></span></div>
+<div style="grid-column: 1;" onclick="sortGrid(this.id)" id=\"c1\"
+     class=\"data label\"><span>Package</span><span></span></div>
+<div style="grid-column: 2;" onclick="sortGrid(this.id)" id=\"c2\"
+     class=\"centered data label\"><span>Patch count</span><span></span></div>
+<div style="grid-column: 3;" onclick="sortGrid(this.id)" id=\"c3\"
+     class=\"centered data label\">Infrastructure<span></span></div>
+<div style="grid-column: 4;" onclick="sortGrid(this.id)" id=\"c4\"
+     class=\"centered data label\"><span>License</span><span></span></div>
+<div style="grid-column: 5;" onclick="sortGrid(this.id)" id=\"c5\"
+     class=\"centered data label\"><span>License files</span><span></span></div>
+<div style="grid-column: 6;" onclick="sortGrid(this.id)" id=\"c6\"
+     class=\"centered data label\"><span>Hash file</span><span></span></div>
+<div style="grid-column: 7;" onclick="sortGrid(this.id)" id=\"c7\"
+     class=\"centered data label\"><span>Current version</span><span></span></div>
+<div style="grid-column: 8;" onclick="sortGrid(this.id)" id=\"c8\"
+     class=\"centered data label\"><span>Latest version</span><span></span></div>
+<div style="grid-column: 9;" onclick="sortGrid(this.id)" id=\"c9\"
+     class=\"centered data label\"><span>Warnings</span><span></span></div>
+<div style="grid-column: 10;" onclick="sortGrid(this.id)" id=\"c10\"
+     class=\"centered data label\"><span>Upstream URL</span><span></span></div>
+<div style="grid-column: 11;" onclick="sortGrid(this.id)" id=\"c11\"
+     class=\"centered data label\"><span>CVEs</span><span></span></div>
+<div style="grid-column: 12;" onclick="sortGrid(this.id)" id=\"c12\"
+     class=\"centered data label\"><span>CVEs Ignored</span><span></span></div>
+<div style="grid-column: 13;" onclick="sortGrid(this.id)" id=\"c13\"
+     class=\"data label\"><span>CPE ID</span><span></span></div>
 """)
     for pkg in sorted(packages):
         dump_html_pkg(f, pkg)
-- 
2.34.1

_______________________________________________
buildroot mailing list
buildroot@buildroot.org
https://lists.buildroot.org/mailman/listinfo/buildroot

^ permalink raw reply related	[flat|nested] 3+ messages in thread

* [Buildroot] [PATCH 2/2] support/scripts/pkg-stats: optimize CSS selector usage
  2022-08-05 18:58 [Buildroot] [PATCH 0/2] support/scripts/pkg-stats: reduce size of HTML output Sen Hastings
  2022-08-05 18:58 ` [Buildroot] [PATCH 1/2] support/scripts/pkg-stats: move to procedurally generated row/column classes Sen Hastings
@ 2022-08-05 18:58 ` Sen Hastings
  1 sibling, 0 replies; 3+ messages in thread
From: Sen Hastings @ 2022-08-05 18:58 UTC (permalink / raw)
  To: buildroot; +Cc: Sen Hastings

Having lots of CSS selector declarations adds up, especially at 70k+
elements.

This reduces the number of CSS selectors printed in the markup
to the bare minimum, by using pseudo-classes and tag names as selectors.

Signed-off-by: Sen Hastings <sen@phobosdpl.com>
---
 support/scripts/pkg-stats | 132 ++++++++++++++++++++------------------
 1 file changed, 70 insertions(+), 62 deletions(-)

diff --git a/support/scripts/pkg-stats b/support/scripts/pkg-stats
index 39da5e5593..654b918911 100755
--- a/support/scripts/pkg-stats
+++ b/support/scripts/pkg-stats
@@ -845,7 +845,20 @@ function expandField(field){
 
 <style>
 
-.see-more{
+div {
+  text-align: center;
+  border: solid 1px gray;
+}
+#results-grid div{
+  text-align: left;
+}
+#package-grid div:nth-child(13n+1), #package-grid div:nth-child(13n+13)  {
+  text-align: left;
+}
+#package-grid div:nth-child(13){
+  text-align: center;
+}
+.see-more {
   display: none;
 }
 
@@ -859,6 +872,7 @@ function expandField(field){
   padding: 10px 2px 10px 2px;
 }
 #package-grid, #results-grid {
+  border: none;
   display: grid;
   grid-gap: 2px;
   grid-template-columns: 1fr repeat(12, min-content);
@@ -866,21 +880,15 @@ function expandField(field){
 #results-grid {
   grid-template-columns: 3fr 1fr;
 }
-.data {
-  border: solid 1px gray;
+.correct, .nopatches, .good_url, .version-good, .cpe-ok, .cve-ok {
+  background: #d2ffc4;
 }
-.centered {
-  text-align: center;
+.wrong, .lotsofpatches, .invalid_url, .version-needs-update, .cpe-nok, .cve-nok {
+  background: #ff9a69;
+}
+.somepatches, .missing_url, .version-unknown, .cpe-unknown, .cve-unknown {
+  background: #ffd870;
 }
- .correct, .nopatches, .good_url, .version-good, .cpe-ok, .cve-ok {
-   background: #d2ffc4;
- }
- .wrong, .lotsofpatches, .invalid_url, .version-needs-update, .cpe-nok, .cve-nok {
-   background: #ff9a69;
- }
- .somepatches, .missing_url, .version-unknown, .cpe-unknown, .cve-unknown {
-   background: #ffd870;
- }
  .cve_ignored, .version-error {
   background: #ccc;
  }
@@ -926,9 +934,9 @@ def boolean_str(b):
 
 
 def dump_html_pkg(f, pkg):
-    f.write(f'<div class=\"data\">{pkg.path}</div>\n')
+    f.write(f'<div>{pkg.path}</div>\n')
     # Patch count
-    div_class = ["centered data"]
+    div_class = []
     if pkg.patch_count == 0:
         div_class.append("nopatches")
     elif pkg.patch_count < 5:
@@ -939,7 +947,7 @@ def dump_html_pkg(f, pkg):
 
     # Infrastructure
     infra = infra_str(pkg.infras)
-    div_class = ["centered data"]
+    div_class = []
     if infra == "Unknown":
         div_class.append("wrong")
     else:
@@ -947,7 +955,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{infra_str(pkg.infras)}</div>\n')
 
     # License
-    div_class = ["centered data"]
+    div_class = []
     if pkg.is_status_ok('license'):
         div_class.append("correct")
     else:
@@ -955,7 +963,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{boolean_str(pkg.is_status_ok("license"))}</div>\n')
 
     # License files
-    div_class = ["centered data"]
+    div_class = []
     if pkg.is_status_ok('license-files'):
         div_class.append("correct")
     else:
@@ -963,7 +971,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{boolean_str(pkg.is_status_ok("license-files"))}</div>\n')
 
     # Hash
-    div_class = ["centered data"]
+    div_class = []
     if pkg.is_status_ok('hash'):
         div_class.append("correct")
     else:
@@ -975,10 +983,10 @@ def dump_html_pkg(f, pkg):
         current_version = pkg.current_version[:20] + "..."
     else:
         current_version = pkg.current_version
-    f.write(f'  <div>class=\"centered data\" {current_version}</div>\n')
+    f.write(f'  <div>{current_version}</div>\n')
 
     # Latest version
-    div_class = ["centered data"]
+    div_class = []
     if pkg.latest_version['status'] == RM_API_STATUS_ERROR:
         div_class.append("version-error")
     if pkg.latest_version['version'] is None:
@@ -1009,7 +1017,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{latest_version_text}</div>\n')
 
     # Warnings
-    div_class = ["centered data"]
+    div_class = []
     if pkg.warnings == 0:
         div_class.append("correct")
     else:
@@ -1017,7 +1025,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{pkg.warnings}</div>\n')
 
     # URL status
-    div_class = ["centered data"]
+    div_class = []
     url_str = pkg.status['url'][1]
     if pkg.status['url'][0] in ("error", "warning"):
         div_class.append("missing_url")
@@ -1030,7 +1038,7 @@ def dump_html_pkg(f, pkg):
     f.write(f'  <div class=\"{" ".join(div_class)}\">{url_str}</div>\n')
 
     # CVEs
-    div_class = ["centered data"]
+    div_class = []
     if len(pkg.cves) > 10:
         div_class.append("collapse")
     if pkg.is_status_ok("cve"):
@@ -1045,7 +1053,7 @@ def dump_html_pkg(f, pkg):
     if len(pkg.cves) > 10:
         cve_total = len(pkg.cves) + 1
         f.write(f' <div onclick=\"expandField(this.parentElement)\" \
-        class=\"see-more centered cve_ignored\">see all ({cve_total}) &#9662;</div>\n')
+        style=\"text-align: center;\" class=\"see-more cve_ignored\">see all ({cve_total}) &#9662;</div>\n')
     if pkg.is_status_error("cve"):
         for cve in pkg.cves:
             f.write("   <a href=\"https://security-tracker.debian.org/tracker/%s\">%s</a><br/>\n" % (cve, cve))
@@ -1058,16 +1066,16 @@ def dump_html_pkg(f, pkg):
     f.write("  </div>\n")
 
     # CVEs Ignored
-    div_class = ["centered data"]
     if pkg.ignored_cves:
-        div_class.append("cve_ignored")
-    f.write(f'  <div class=\"{" ".join(div_class)}\">\n')
+        f.write("  <div class=\"cve_ignored\">\n")
+    else:
+        f.write("  <div>\n")
     for ignored_cve in pkg.ignored_cves:
         f.write("    <a href=\"https://security-tracker.debian.org/tracker/%s\">%s</a><br/>\n" % (ignored_cve, ignored_cve))
     f.write("  </div>\n")
 
     # CPE ID
-    div_class = ["data"]
+    div_class = []
     if pkg.is_status_ok("cpe"):
         div_class.append("cpe-ok")
     elif pkg.is_status_error("cpe"):
@@ -1099,31 +1107,31 @@ def dump_html_all_pkgs(f, packages):
     f.write("""
 <div id=\"package-grid\">
 <div style="grid-column: 1;" onclick="sortGrid(this.id)" id=\"c1\"
-     class=\"data label\"><span>Package</span><span></span></div>
+     class=\"label\"><span>Package</span><span></span></div>
 <div style="grid-column: 2;" onclick="sortGrid(this.id)" id=\"c2\"
-     class=\"centered data label\"><span>Patch count</span><span></span></div>
+     class=\"label\"><span>Patch count</span><span></span></div>
 <div style="grid-column: 3;" onclick="sortGrid(this.id)" id=\"c3\"
-     class=\"centered data label\">Infrastructure<span></span></div>
+     class=\"label\">Infrastructure<span></span></div>
 <div style="grid-column: 4;" onclick="sortGrid(this.id)" id=\"c4\"
-     class=\"centered data label\"><span>License</span><span></span></div>
+     class=\"label\"><span>License</span><span></span></div>
 <div style="grid-column: 5;" onclick="sortGrid(this.id)" id=\"c5\"
-     class=\"centered data label\"><span>License files</span><span></span></div>
+     class=\"label\"><span>License files</span><span></span></div>
 <div style="grid-column: 6;" onclick="sortGrid(this.id)" id=\"c6\"
-     class=\"centered data label\"><span>Hash file</span><span></span></div>
+     class=\"label\"><span>Hash file</span><span></span></div>
 <div style="grid-column: 7;" onclick="sortGrid(this.id)" id=\"c7\"
-     class=\"centered data label\"><span>Current version</span><span></span></div>
+     class=\"label\"><span>Current version</span><span></span></div>
 <div style="grid-column: 8;" onclick="sortGrid(this.id)" id=\"c8\"
-     class=\"centered data label\"><span>Latest version</span><span></span></div>
+     class=\"label\"><span>Latest version</span><span></span></div>
 <div style="grid-column: 9;" onclick="sortGrid(this.id)" id=\"c9\"
-     class=\"centered data label\"><span>Warnings</span><span></span></div>
+     class=\"label\"><span>Warnings</span><span></span></div>
 <div style="grid-column: 10;" onclick="sortGrid(this.id)" id=\"c10\"
-     class=\"centered data label\"><span>Upstream URL</span><span></span></div>
+     class=\"label\"><span>Upstream URL</span><span></span></div>
 <div style="grid-column: 11;" onclick="sortGrid(this.id)" id=\"c11\"
-     class=\"centered data label\"><span>CVEs</span><span></span></div>
+     class=\"label\"><span>CVEs</span><span></span></div>
 <div style="grid-column: 12;" onclick="sortGrid(this.id)" id=\"c12\"
-     class=\"centered data label\"><span>CVEs Ignored</span><span></span></div>
+     class=\"label\"><span>CVEs Ignored</span><span></span></div>
 <div style="grid-column: 13;" onclick="sortGrid(this.id)" id=\"c13\"
-     class=\"data label\"><span>CPE ID</span><span></span></div>
+     class=\"label\"><span>CPE ID</span><span></span></div>
 """)
     for pkg in sorted(packages):
         dump_html_pkg(f, pkg)
@@ -1135,43 +1143,43 @@ def dump_html_stats(f, stats):
     f.write("<div class=\"data\" id=\"results-grid\">\n")
     infras = [infra[6:] for infra in stats.keys() if infra.startswith("infra-")]
     for infra in infras:
-        f.write(" <div class=\"data\">Packages using the <i>%s</i> infrastructure</div><div class=\"data\">%s</div>\n" %
+        f.write(" <div>Packages using the <i>%s</i> infrastructure</div><div>%s</div>\n" %
                 (infra, stats["infra-%s" % infra]))
-    f.write(" <div class=\"data\">Packages having license information</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages having license information</div><div>%s</div>\n" %
             stats["license"])
-    f.write(" <div class=\"data\">Packages not having license information</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages not having license information</div><div>%s</div>\n" %
             stats["no-license"])
-    f.write(" <div class=\"data\">Packages having license files information</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages having license files information</div><div>%s</div>\n" %
             stats["license-files"])
-    f.write(" <div class=\"data\">Packages not having license files information</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages not having license files information</div><div>%s</div>\n" %
             stats["no-license-files"])
-    f.write(" <div class=\"data\">Packages having a hash file</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages having a hash file</div><div>%s</div>\n" %
             stats["hash"])
-    f.write(" <div class=\"data\">Packages not having a hash file</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Packages not having a hash file</div><div>%s</div>\n" %
             stats["no-hash"])
-    f.write(" <div class=\"data\">Total number of patches</div><div class=\"data\">%s</div>\n" %
+    f.write(" <div>Total number of patches</div><div>%s</div>\n" %
             stats["patches"])
-    f.write("<div class=\"data\">Packages having a mapping on <i>release-monitoring.org</i></div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages having a mapping on <i>release-monitoring.org</i></div><div>%s</div>\n" %
             stats["rmo-mapping"])
-    f.write("<div class=\"data\">Packages lacking a mapping on <i>release-monitoring.org</i></div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages lacking a mapping on <i>release-monitoring.org</i></div><div>%s</div>\n" %
             stats["rmo-no-mapping"])
-    f.write("<div class=\"data\">Packages that are up-to-date</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages that are up-to-date</div><div>%s</div>\n" %
             stats["version-uptodate"])
-    f.write("<div class=\"data\">Packages that are not up-to-date</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages that are not up-to-date</div><div>%s</div>\n" %
             stats["version-not-uptodate"])
-    f.write("<div class=\"data\">Packages with no known upstream version</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages with no known upstream version</div><div>%s</div>\n" %
             stats["version-unknown"])
-    f.write("<div class=\"data\">Packages affected by CVEs</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages affected by CVEs</div><div>%s</div>\n" %
             stats["pkg-cves"])
-    f.write("<div class=\"data\">Total number of CVEs affecting all packages</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Total number of CVEs affecting all packages</div><div>%s</div>\n" %
             stats["total-cves"])
-    f.write("<div class=\"data\">Packages affected by unsure CVEs</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages affected by unsure CVEs</div><div>%s</div>\n" %
             stats["pkg-unsure-cves"])
-    f.write("<div class=\"data\">Total number of unsure CVEs affecting all packages</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Total number of unsure CVEs affecting all packages</div><div>%s</div>\n" %
             stats["total-unsure-cves"])
-    f.write("<div class=\"data\">Packages with CPE ID</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages with CPE ID</div><div>%s</div>\n" %
             stats["cpe-id"])
-    f.write("<div class=\"data\">Packages without CPE ID</div><div class=\"data\">%s</div>\n" %
+    f.write("<div>Packages without CPE ID</div><div>%s</div>\n" %
             stats["no-cpe-id"])
     f.write("</div>\n")
 
-- 
2.34.1


_______________________________________________
buildroot mailing list
buildroot@buildroot.org
https://lists.buildroot.org/mailman/listinfo/buildroot

^ permalink raw reply related	[flat|nested] 3+ messages in thread

end of thread, other threads:[~2022-08-05 18:59 UTC | newest]

Thread overview: 3+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2022-08-05 18:58 [Buildroot] [PATCH 0/2] support/scripts/pkg-stats: reduce size of HTML output Sen Hastings
2022-08-05 18:58 ` [Buildroot] [PATCH 1/2] support/scripts/pkg-stats: move to procedurally generated row/column classes Sen Hastings
2022-08-05 18:58 ` [Buildroot] [PATCH 2/2] support/scripts/pkg-stats: optimize CSS selector usage Sen Hastings

This is an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.