Skip to content

Commit a58b405

Browse files
qu1ckqu1ck
committed
Add board stats, checkbox progress bars
Fixes #77
1 parent 872cdf4 commit a58b405

File tree

4 files changed

+173
-2
lines changed

4 files changed

+173
-2
lines changed

‎InteractiveHtmlBom/web/ibom.css‎

Lines changed: 47 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -398,13 +398,59 @@ mark.highlight {
398398

399399
.menubtn {
400400
background-color: white;
401-
font-size: 16px;
402401
border: none;
403402
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 20 20'%3E%3Cpath fill='none' d='M0 0h20v20H0V0z'/%3E%3Cpath d='M15.95 10.78c.03-.25.05-.51.05-.78s-.02-.53-.06-.78l1.69-1.32c.15-.12.19-.34.1-.51l-1.6-2.77c-.1-.18-.31-.24-.49-.18l-1.99.8c-.42-.32-.86-.58-1.35-.78L12 2.34c-.03-.2-.2-.34-.4-.34H8.4c-.2 0-.36.14-.39.34l-.3 2.12c-.49.2-.94.47-1.35.78l-1.99-.8c-.18-.07-.39 0-.49.18l-1.6 2.77c-.1.18-.06.39.1.51l1.69 1.32c-.04.25-.07.52-.07.78s.02.53.06.78L2.37 12.1c-.15.12-.19.34-.1.51l1.6 2.77c.1.18.31.24.49.18l1.99-.8c.42.32.86.58 1.35.78l.3 2.12c.04.2.2.34.4.34h3.2c.2 0 .37-.14.39-.34l.3-2.12c.49-.2.94-.47 1.35-.78l1.99.8c.18.07.39 0 .49-.18l1.6-2.77c.1-.18.06-.39-.1-.51l-1.67-1.32zM10 13c-1.65 0-3-1.35-3-3s1.35-3 3-3 3 1.35 3 3-1.35 3-3 3z'/%3E%3C/svg%3E%0A");
404403
background-position: center;
405404
background-repeat: no-repeat;
406405
}
407406

407+
.statsbtn {
408+
background-color: white;
409+
border: none;
410+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9.52 9.53'%3E%3Cg fill='none' stroke-width='.53'%3E%3Cpath d='M.8.8h7.4v7.67H.8z' stroke='%23666'/%3E%3Cpath d='M8.73 1.06V9H1.06' stroke='%23ccc'/%3E%3Cpath d='M1.85 2.12H3.7M4.5 2.12h1.06M6.09 2.12h1.05M1.85 3.44H3.7M4.5 3.44h1.06M6.09 3.44h1.05M1.85 5.3h1.33M1.85 6.88h1.32M3.97 6.88H6.6M3.97 5.3h3.17' stroke='%23000'/%3E%3C/g%3E%3C/svg%3E");
411+
background-position: center;
412+
background-repeat: no-repeat;
413+
}
414+
415+
.dark .statsbtn {
416+
filter: invert(1);
417+
}
418+
419+
.stats {
420+
border-collapse: collapse;
421+
font-size: 12pt;
422+
table-layout: fixed;
423+
width: 100%;
424+
min-width: 450px;
425+
}
426+
427+
.dark .stats td {
428+
border: 1px solid #bbb;
429+
}
430+
431+
.stats td {
432+
border: 1px solid black;
433+
padding: 5px;
434+
word-wrap: break-word;
435+
text-align: center;
436+
position: relative;
437+
}
438+
439+
#checkbox-stats div {
440+
position: absolute;
441+
left: 0;
442+
top: 0;
443+
height: 100%;
444+
width: 100%;
445+
display: flex;
446+
align-items: center;
447+
justify-content: center;
448+
}
449+
450+
#checkbox-stats .bar {
451+
background-color: rgba(28, 251, 0, 0.6);
452+
}
453+
408454
.dark .menubtn {
409455
filter: invert(1);
410456
}

‎InteractiveHtmlBom/web/ibom.html‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,51 @@
122122
<button id="tb-btn" class="right-most-button" onclick="changeBomLayout('top-bottom')"
123123
title="BOM top, drawings bot"></button>
124124
</div>
125+
<div class="hideonprint menu" style="float: right; margin: 10px; top: 8px;">
126+
<button class="statsbtn"></button>
127+
<div class="menu-content">
128+
<table class="stats">
129+
<tbody>
130+
<tr>
131+
<td width="40%">Board stats</td>
132+
<td>Front</td>
133+
<td>Back</td>
134+
<td>Total</td>
135+
</tr>
136+
<tr>
137+
<td>Components</td>
138+
<td id="stats-components-front">~</td>
139+
<td id="stats-components-back">~</td>
140+
<td id="stats-components-total">~</td>
141+
</tr>
142+
<tr>
143+
<td>Groups</td>
144+
<td id="stats-groups-front">~</td>
145+
<td id="stats-groups-back">~</td>
146+
<td id="stats-groups-total">~</td>
147+
</tr>
148+
<tr>
149+
<td>SMD pads</td>
150+
<td id="stats-smd-pads-front">~</td>
151+
<td id="stats-smd-pads-back">~</td>
152+
<td id="stats-smd-pads-total">~</td>
153+
</tr>
154+
<tr>
155+
<td>TH pads</td>
156+
<td colspan=3 id="stats-th-pads">~</td>
157+
</tr>
158+
</tbody>
159+
</table>
160+
<table class="stats">
161+
<col width="40%"/><col />
162+
<tbody id="checkbox-stats">
163+
<tr>
164+
<td colspan=2 style="border-top: 0">Checkboxes</td>
165+
</tr>
166+
</tbody>
167+
</table>
168+
</div>
169+
</div>
125170
</div>
126171
<div id="fileinfodiv" style="overflow: auto;">
127172
<table class="fileinfo">

‎InteractiveHtmlBom/web/ibom.js‎

Lines changed: 74 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,6 +146,7 @@ function createCheckboxChangeHandler(checkbox, references) {
146146
}
147147
}
148148
writeStorage("checkbox_" + checkbox, [...refsSet].join(","));
149+
updateCheckboxStats(checkbox);
149150
}
150151
}
151152

@@ -300,7 +301,6 @@ function populateBomHeader() {
300301
var th = document.createElement("TH");
301302
th.classList.add("numCol");
302303
tr.appendChild(th);
303-
checkboxes = bomCheckboxes.split(",").filter((e) => e);
304304
var checkboxCompareClosure = function(checkbox) {
305305
return (a, b) => {
306306
var stateA = getCheckboxState(checkbox, a[3]);
@@ -548,6 +548,38 @@ function populateMetadata() {
548548
if (pcbdata.metadata.title != "") {
549549
document.title = pcbdata.metadata.title + " BOM";
550550
}
551+
var fp_f = 0, fp_b = 0, pads_f = 0, pads_b = 0, pads_th = 0;
552+
for (var i = 0; i < pcbdata.modules.length; i++) {
553+
if (pcbdata.bom.skipped.includes(i)) continue;
554+
var mod = pcbdata.modules[i];
555+
if (mod.layer == "F") {
556+
fp_f++;
557+
} else {
558+
fp_b++;
559+
}
560+
for (var pad of mod.pads) {
561+
if (pad.type == "th") {
562+
pads_th++;
563+
} else {
564+
if (pad.layers.includes("F")) {
565+
pads_f++;
566+
}
567+
if (pad.layers.includes("B")) {
568+
pads_b++;
569+
}
570+
}
571+
}
572+
}
573+
document.getElementById("stats-components-front").innerHTML = fp_f;
574+
document.getElementById("stats-components-back").innerHTML = fp_b;
575+
document.getElementById("stats-components-total").innerHTML = fp_f + fp_b;
576+
document.getElementById("stats-groups-front").innerHTML = pcbdata.bom.F.length;
577+
document.getElementById("stats-groups-back").innerHTML = pcbdata.bom.B.length;
578+
document.getElementById("stats-groups-total").innerHTML = pcbdata.bom.both.length;
579+
document.getElementById("stats-smd-pads-front").innerHTML = pads_f;
580+
document.getElementById("stats-smd-pads-back").innerHTML = pads_b;
581+
document.getElementById("stats-smd-pads-total").innerHTML = pads_f + pads_b;
582+
document.getElementById("stats-th-pads").innerHTML = pads_th;
551583
}
552584

553585
function changeBomLayout(layout) {
@@ -664,9 +696,49 @@ function checkBomCheckbox(bomrowid, checkboxname) {
664696
function setBomCheckboxes(value) {
665697
bomCheckboxes = value;
666698
writeStorage("bomCheckboxes", value);
699+
prepCheckboxes();
667700
populateBomTable();
668701
}
669702

703+
function prepCheckboxes() {
704+
checkboxes = bomCheckboxes.split(",").filter((e) => e);
705+
var table = document.getElementById("checkbox-stats");
706+
while (table.childElementCount > 1) {
707+
table.removeChild(table.lastChild);
708+
}
709+
if (checkboxes.length) {
710+
table.style.display = "";
711+
} else {
712+
table.style.display = "none";
713+
}
714+
for (var checkbox of checkboxes) {
715+
var tr = document.createElement("TR");
716+
var td = document.createElement("TD");
717+
td.innerHTML = checkbox;
718+
tr.appendChild(td);
719+
td = document.createElement("TD");
720+
td.id = "checkbox-stats-" + checkbox;
721+
var progressbar = document.createElement("div");
722+
progressbar.classList.add("bar");
723+
td.appendChild(progressbar);
724+
var text = document.createElement("div");
725+
text.classList.add("text");
726+
td.appendChild(text);
727+
tr.appendChild(td);
728+
table.appendChild(tr);
729+
updateCheckboxStats(checkbox);
730+
}
731+
}
732+
733+
function updateCheckboxStats(checkbox) {
734+
var checked = getStoredCheckboxRefs(checkbox).size;
735+
var total = pcbdata.modules.length - pcbdata.bom.skipped.length;
736+
var percent = checked * 100.0 / total;
737+
var td = document.getElementById("checkbox-stats-" + checkbox);
738+
td.firstChild.style.width = percent + "%";
739+
td.lastChild.innerHTML = checked + "/" + total + " (" + Math.round(percent) + "%)";
740+
}
741+
670742
document.onkeydown = function(e) {
671743
switch (e.key) {
672744
case "n":
@@ -820,6 +892,7 @@ window.onload = function(e) {
820892
filter = "";
821893
reflookup = "";
822894
initDone = true;
895+
prepCheckboxes();
823896
// Triggers render
824897
changeBomLayout(bomlayout);
825898
}

‎icons/stats-36px.svg‎

Lines changed: 7 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)