瀏覽代碼

report: star grade semantics per spec — 10-color palette covers 0..100 a decade per color, always five stars in the decade's color, filled count = position within the decade (1 star = 2 pts, half = 1: 95 -> green 2.5 stars)

Alexander Korolev 1 月之前
父節點
當前提交
597364832f
共有 1 個文件被更改,包括 12 次插入 和 9 次删除
  1. 12 9
      src/report/page.html

+ 12 - 9
src/report/page.html

@@ -102,26 +102,29 @@ const COLS = [
 const NUM = new Set(["nodes", "tp", "port", "n", "pct", "tps1", "tps2", "stars"]);
 const NUM = new Set(["nodes", "tp", "port", "n", "pct", "tps1", "tps2", "stars"]);
 const MEDAL = { 1: "🥇 ", 2: "🥈 ", 3: "🥉 " };
 const MEDAL = { 1: "🥇 ", 2: "🥈 ", 3: "🥉 " };
 
 
-// star grade of the latest completed bench: 1 star = 10 points, half star
-// = 5; one color per decade (red → brown → orange → yellow → green ramp);
-// sort key is the ABSOLUTE score
-const STARS = 10;
+// star grade of the latest completed bench. The 10-color palette covers
+// 0..100 a decade per color (color = which decade the score is in); the
+// star count shows the position WITHIN that decade (1 star = 2 points of
+// the band, half star = 1) — 95 → green, 2.5 stars. Sort key is the
+// ABSOLUTE score.
 const PALETTE = [
 const PALETTE = [
   "red", "firebrick", "brown", "sienna", "chocolate",
   "red", "firebrick", "brown", "sienna", "chocolate",
   "darkorange", "gold", "yellowgreen", "limegreen", "green",
   "darkorange", "gold", "yellowgreen", "limegreen", "green",
 ];
 ];
 function starInfo(r) {
 function starInfo(r) {
   const e = latest(r, x => x.done && x.pct != null);
   const e = latest(r, x => x.done && x.pct != null);
-  return e ? { pct: e.pct, s: Math.round(e.pct / 5) / 2 } : null;
+  if (!e) return null;
+  const band = Math.min(9, Math.floor(e.pct / 10));
+  return { pct: e.pct, band, s: Math.round(e.pct - band * 10) / 2 };
 }
 }
 function starGlyphs(si) {
 function starGlyphs(si) {
+  const col = PALETTE[si.band];
   let out = "";
   let out = "";
-  for (let i = 1; i <= STARS; i++) {
-    const col = PALETTE[i - 1];
+  for (let i = 1; i <= 5; i++) {
     if (si.s >= i) out += `<span style="color:${col}">★</span>`;
     if (si.s >= i) out += `<span style="color:${col}">★</span>`;
     else if (si.s >= i - 0.5)
     else if (si.s >= i - 0.5)
-      out += `<span class="half" style="background-image:linear-gradient(90deg,${col} 50%,color-mix(in srgb,CanvasText 30%,transparent) 50%)">★</span>`;
-    else out += '<span class="dim">☆</span>';
+      out += `<span class="half" style="background-image:linear-gradient(90deg,${col} 50%,color-mix(in srgb,${col} 30%,transparent) 50%)">★</span>`;
+    else out += `<span style="color:${col};opacity:.3">☆</span>`;
   }
   }
   return out;
   return out;
 }
 }