Add tracks and zones support

Issue #113

InteractiveHtmlBom/ecad/kicad.py

@@ -339,6 +339,49 @@ def parse_modules(self, pcb_modules):
 
         return modules
 
+    def parse_tracks(self, tracks):
+        result = {pcbnew.F_Cu: [], pcbnew.B_Cu: []}
+        for track in tracks:
+            if track.GetClass() == "VIA":
+                track_dict = {
+                    "start": self.normalize(track.GetStart()),
+                    "end": self.normalize(track.GetEnd()),
+                    "width": track.GetWidth() * 1e-6,
+                    "net": track.GetNetname(),
+                }
+                for l in [pcbnew.F_Cu, pcbnew.B_Cu]:
+                    if track.IsOnLayer(l):
+                        result[l].append(track_dict)
+            else:
+                if track.GetLayer() in [pcbnew.F_Cu, pcbnew.B_Cu]:
+                    result[track.GetLayer()].append({
+                        "start": self.normalize(track.GetStart()),
+                        "end": self.normalize(track.GetEnd()),
+                        "width": track.GetWidth() * 1e-6,
+                        "net": track.GetNetname(),
+                    })
+
+        return {
+            'F': result.get(pcbnew.F_Cu),
+            'B': result.get(pcbnew.B_Cu)
+        }
+
+    def parse_zones(self, zones):
+        result = {pcbnew.F_Cu: [], pcbnew.B_Cu: []}
+        for zone in zones:
+            if not zone.IsFilled() or zone.GetIsKeepout():
+                continue
+            if zone.GetLayer() in [pcbnew.F_Cu, pcbnew.B_Cu]:
+                result[zone.GetLayer()].append({
+                    "polygons": self.parse_poly_set(zone.GetFilledPolysList()),
+                    "net": zone.GetNetname(),
+                })
+
+        return {
+            'F': result.get(pcbnew.F_Cu),
+            'B': result.get(pcbnew.B_Cu)
+        }
+
     @staticmethod
     def module_to_component(module):
         # type: (pcbnew.MODULE) -> Component
@@ -409,6 +452,8 @@ def parse(self):
             "bom": {},
             "font_data": self.font_parser.get_parsed_font()
         }
+        pcbdata["tracks"] = self.parse_tracks(self.board.GetTracks())
+        pcbdata["zones"] = self.parse_zones(self.board.Zones())
         components = [self.module_to_component(m) for m in pcb_modules]
 
         return pcbdata, components

InteractiveHtmlBom/web/ibom.css

@@ -10,6 +10,8 @@
   --fabrication-edge-color: #907651;
   --fabrication-polygon-color: #907651;
   --fabrication-text-color: #a27c24;
+  --track-color: #def5f1;
+  --zone-color: #def5f1;
 }
 
 html, body {
@@ -23,6 +25,8 @@ html, body {
   --pad-color: #808080;
   --pin1-outline-color: #ffa800;
   --pin1-outline-color-highlight: #ccff00;
+  --track-color: #42524f;
+  --zone-color: #42524f;
   background-color: #252c30;
   color: #eee;
 }

InteractiveHtmlBom/web/ibom.html

@@ -55,22 +55,30 @@
             <input id="padsCheckbox" type="checkbox" checked onchange="padsVisible(this.checked)">
             Show footprint pads
           </label>
-          <label class="menu-label">
+          <label class="menu-label" style="width: calc(50% - 18px)">
             <input id="fabricationCheckbox" type="checkbox" checked onchange="fabricationVisible(this.checked)">
-            Show fabrication layer
-          </label>
-          <label class="menu-label">
+            Fab layer
+          </label><!-- This comment eats space! All of it!
+          --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
             <input id="silkscreenCheckbox" type="checkbox" checked onchange="silkscreenVisible(this.checked)">
-            Show silkscreen
+            Silkscreen
           </label>
           <label class="menu-label" style="width: calc(50% - 18px)">
             <input id="referencesCheckbox" type="checkbox" checked onchange="referencesVisible(this.checked)">
             References
           </label><!-- This comment eats space! All of it!
-          --><label class="menu-label" style="width: calc(50% - 18px); border-left: 0;">
+          --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
             <input id="valuesCheckbox" type="checkbox" checked onchange="valuesVisible(this.checked)">
             Values
           </label>
+          <label class="menu-label" style="width: calc(50% - 18px)">
+            <input id="tracksCheckbox" type="checkbox" checked onchange="tracksVisible(this.checked)">
+            Tracks
+          </label><!-- This comment eats space! All of it!
+          --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
+            <input id="zonesCheckbox" type="checkbox" checked onchange="zonesVisible(this.checked)">
+            Zones
+          </label>
           <label class="menu-label">
             <input id="dnpOutlineCheckbox" type="checkbox" checked onchange="dnpOutline(this.checked)">
             DNP components outlined

InteractiveHtmlBom/web/ibom.js

@@ -46,6 +46,18 @@ function valuesVisible(value) {
   redrawIfInitDone();
 }
 
+function tracksVisible(value) {
+  writeStorage("tracksVisible", value);
+  renderTracks = value;
+  redrawIfInitDone();
+}
+
+function zonesVisible(value) {
+  writeStorage("zonesVisible", value);
+  renderZones = value;
+  redrawIfInitDone();
+}
+
 function dnpOutline(value) {
   writeStorage("dnpOutline", value);
   renderDnpOutline = value;
@@ -853,6 +865,14 @@ function initDefaults() {
   document.getElementById("valuesCheckbox").checked = b;
   valuesVisible(b);
 
+  b = getStorageBooleanOrDefault("tracksVisible", true);
+  document.getElementById("tracksCheckbox").checked = b;
+  tracksVisible(b);
+
+  b = getStorageBooleanOrDefault("zonesVisible", true);
+  document.getElementById("zonesCheckbox").checked = b;
+  zonesVisible(b);
+
   b = getStorageBooleanOrDefault("dnpOutline", false);
   document.getElementById("dnpOutlineCheckbox").checked = b;
   dnpOutline(b);

InteractiveHtmlBom/web/render.js

@@ -6,6 +6,8 @@ var renderPads = true;
 var renderReferences = true;
 var renderValues = true;
 var renderDnpOutline = false;
+var renderTracks = true;
+var renderZones = true;
 
 function deg2rad(deg) {
   return deg * Math.PI / 180;
@@ -327,6 +329,26 @@ function drawBgLayer(layername, canvas, layer, scalefactor, edgeColor, polygonCo
   }
 }
 
+function drawTracks(canvas, layer, color) {
+  ctx = canvas.getContext("2d");
+  ctx.strokeStyle = color;
+  ctx.lineCap = "round";
+  for(var track of pcbdata.tracks[layer]) {
+    ctx.lineWidth = track.width;
+    ctx.beginPath();
+    ctx.moveTo(...track.start);
+    ctx.lineTo(...track.end);
+    ctx.stroke();
+  }
+}
+
+function drawZones(canvas, layer, color) {
+  ctx = canvas.getContext("2d");
+  for(var zone of pcbdata.zones[layer]) {
+    drawPolygons(ctx, color, zone.polygons, ctx.fill.bind(ctx));
+  }
+}
+
 function clearCanvas(canvas) {
   var ctx = canvas.getContext("2d");
   ctx.save();
@@ -351,10 +373,20 @@ function drawBackground(canvasdict) {
   clearCanvas(canvasdict.fab);
   clearCanvas(canvasdict.silk);
   drawEdgeCuts(canvasdict.bg, canvasdict.transform.s);
+
+  var style = getComputedStyle(topmostdiv);
+  if (renderTracks) {
+    var trackColor = style.getPropertyValue('--track-color');
+    drawTracks(canvasdict.bg, canvasdict.layer, trackColor);
+  }
+  if (renderZones) {
+    var zoneColor = style.getPropertyValue('--zone-color');
+    drawZones(canvasdict.bg, canvasdict.layer, zoneColor);
+  }
+
   drawModules(canvasdict.bg, canvasdict.layer,
     canvasdict.transform.s * canvasdict.transform.zoom, false);
 
-  var style = getComputedStyle(topmostdiv);
   var edgeColor = style.getPropertyValue('--silkscreen-edge-color');
   var polygonColor = style.getPropertyValue('--silkscreen-polygon-color');
   var textColor = style.getPropertyValue('--silkscreen-text-color');