<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Interactive BOM for KiCAD</title> <style type="text/css"> :root { --pcb-edge-color: black; } html, body { margin: 0px; height: 100%; font-family: Verdana, sans-serif; } .dark { --pcb-edge-color: #eee; background-color: #252c30; color: #eee; } button { background-color: #eee; border: 1px solid #888; color: black; height: 44px; width: 44px; text-align: center; text-decoration: none; display: inline-block; font-size: 14px; font-weight: bolder; } .dark button { background-color: #c3b7b5; /* This will be inverted */ } button.depressed { background-color: #0a0; color: white; } .dark button.depressed { background-color: #b3b; /* This will be inverted */ } button:focus { outline: 0; } button#tb-btn { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAABGdBTUEAALGPC/xhBQAAAwBQTFRFAAAABQUFCAgICQkJCgoKEBAQFhYWFxcXGxsbHBwcISEhIyMjJCQkKSkpLS0tLi4uMTExNzc3PDw8QEBAQkJCRERERkZGSEhIT09PWlpaW1tbXFxcYGBgaWlpd3d3eXl5enp6f39/gICAgYGBgoKCi4uLjIyMkpKSk5OTlJSUlpaWl5eXmZmZnJycn5+foqKipqamr6+vtLS0uLi4v7+/w8PDyMjIy8vLz8/P1dXV19fX3Nzc5ubm6urq7+/v8fHx9fX1+Pj4////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAdkhsDgAAAQB0Uk5T////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////AFP3ByUAAAAJcEhZcwAADsIAAA7CARUoSoAAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTnU1rJkAAAA/klEQVQ4T9WT21bCMBBFB0UQRAWrVEmtDYgtXlC03m8l//9PwyQZSRfSLF/dLzmr2WtyHjqAKIJKBCJgI80rSRsIIlUeUgFBTud0LS9K5YEVorXMnFDJnwWeuULpCW61QqlkJf+mQ8wDLdmYgyUmIeRKloMOB0v464lpxMHCHYozy5yF1yRJ5O23Ez5hb6ApWJhBf3BUb32UhKGep2GBPt7DtV94hgePcPN01T6ltBQ2tohHJ+zub3ZpgBMi/ZN/OSFXxTlc+DuoXssvzDs7HuHw5Hi7drcUCqlHGozwJqUcXb5TIkFMzMUPRnBMBGAzM3vKxCEHQ9ak7fauP+ICTGDKoEYZFYYAAAAASUVORK5CYII='); background-position: 5px 5px; background-repeat: no-repeat; } button#lr-btn { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAABYWFhcXFzIyMjc3Nzw8PD09PUBAQE9PT1ZWVldXV1paWlxcXGFhYWNjY2dnZ2xsbG5ubnFxcXNzc3V1dXZ2dnl5eYCAgIaGhpKSkpOTk5SUlJycnKKioqampqysrLGxsbe3t7+/v8XFxcnJydTU1NbW1tnZ2ebm5u/v7/z8/P///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAJTAHzkAAAEAdFJOU////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////wBT9wclAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGXRFWHRTb2Z0d2FyZQBwYWludC5uZXQgNC4wLjE51NayZAAAAO5JREFUOE+tk9kSgjAMRatRcakbrogL4q7//30xobFUpOiD56XJ9ExzpzNRiDrwohEV1qLUAeQ0RDVUOno4JJBIZYi0ClKpM4pCGpQKYY/h3giJRYRB90jkAlheQsiXjGfEd6FJEbbcV2W45YIEIP6XoSBIAMIjSABChJySEaE8ZigRCnxmKHtBZOKXDCyEw9k8vnDvEeirz2vYU2UEmUe8BP6HxcgKEoBwhf7GCg4itMZzmHDvz3A6wI6qqgwpWEECEK5whrt/BAnXaYcqnwDQaC/pARZ0nN0IRsiJtcL6SjY14315V3Xa7sr1R3wC/SGCp4FJdscAAAAASUVORK5CYII='); background-position: 5px 5px; background-repeat: no-repeat; } button#bom-btn { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAABGdBTUEAALGPC/xhBQAAAwBQTFRFAAAAFhYWFxcXQEBAXFxcYGBgkpKSk5OTlJSUn5+fr6+vv7+/z8/P////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQtWgtgAAAQB0Uk5T////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////AFP3ByUAAAAJcEhZcwAADsIAAA7CARUoSoAAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTnU1rJkAAAAaElEQVQ4T+3T0QqAIAwF0JlrWub/f+5NcpCIk16Fzosv4+6CjAD2JgYITpJJHIglTwiTT+U9hq6ck68D+9D5Dpg+D2hmp1mhrTpNSdNSHTSz8/9FtVAHjk+WITJhC3qpA2Er1z09f+AGC2MyfYdXtvQAAAAASUVORK5CYII='); background-position: 5px 5px; background-repeat: no-repeat; } .left-most-button { border-right: 0; border-top-left-radius: 6px; border-bottom-left-radius: 6px; } .middle-button { border-right: 0; } .right-most-button { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .button-container { font-size: 0; } .dark .button-container { filter: invert(1); } @media print { .hideonprint { display: none; } } canvas { cursor: crosshair; } canvas:active { cursor: grabbing; } .fileinfo { width: 100%; max-width: 1000px; border: none; padding: 5px; } .fileinfo .title { font-size: 20pt; font-weight: bold; } .fileinfo td { overflow: hidden; white-space: nowrap; max-width: 1px; width: 50%; text-overflow: ellipsis; } .bom { border-collapse: collapse; font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace; font-size: 10pt; table-layout: fixed; width: 100%; margin-top: 1px; } .bom th, .bom td { border: 1px solid black; padding: 5px; word-wrap: break-word; text-align: center; } .dark .bom th, .dark .bom td { border: 1px solid #777; } .bom th { background-color: #CCCCCC; } .dark .bom th { background-color: #3b4749; } .bom tr.highlighted:nth-child(n) { background-color: #cfc; } .dark .bom tr.highlighted:nth-child(n) { background-color: #226022; } .bom tr:nth-child(even) { background-color: #f2f2f2; } .dark .bom tr:nth-child(even) { background-color: #313b40; } .bom tr { transition: background-color 0.2s; } .bom .numCol { width: 25px; } .bom .bom-checkbox { width: 30px; } .bom .Description { width: 10%; } .bom .Part { width: 10%; } .bom .Value { width: 15%; } .bom .Quantity { width: 65px; } .split { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; } .split.split-horizontal, .gutter.gutter-horizontal { height: 100%; float: left; } .gutter { background-color: #ddd; background-repeat: no-repeat; background-position: 50%; transition: background-color 0.3s; } .dark .gutter { background-color: #777; } .gutter.gutter-horizontal { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg=='); cursor: ew-resize; width: 5px; } .gutter.gutter-vertical { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII='); cursor: ns-resize; height: 5px; } .searchbox { float: left; height: 40px; margin: 10px 5px; padding: 12px 32px; font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace; font-size: 18px; box-sizing: border-box; border: 1px solid #888; border-radius: 6px; outline: none; background-color: #eee; transition: background-color 0.2s, border 0.2s; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABNklEQVQ4T8XSMUvDQBQH8P/LElFa/AIZHcTBQSz0I/gFstTBRR2KUC4ldDxw7h0Bl3RRUATxi4iiODgoiLNrbQYp5J6cpJJqomkX33Z37/14d/dIa33MzDuYI4johOI4XhyNRteO46zNYjDzAxE1yBZprVeZ+QbAUhXEGJMA2Ox2u4+fQIa0mPmsCgCgJYQ4t7lfgF0opQYAdv9ABkKI/UnOFCClXKjX61cA1osQY8x9kiRNKeV7IWA3oyhaSdP0FkAtjxhj3hzH2RBCPOf3pzqYHCilfAAX+URm9oMguPzeWSGQvUcMYC8rOBJCHBRdqxTo9/vbRHRqi8bj8XKv1xvODbiuW2u32/bvf0SlDv4XYOY7z/Mavu+nM1+BmQ+NMc0wDF/LprP0DbTWW0T00ul0nn4b7Q87+X4Qmfiq2wAAAABJRU5ErkJggg=='); background-position: 10px 10px; background-repeat: no-repeat; } .dark .searchbox { background-color: #111; color: #eee; } .searchbox::placeholder { color: #ccc; } .dark .searchbox::placeholder { color: #666; } .filter { width: calc(60% - 10px); } .reflookup { width: calc(40% - 10px); } input[type=text]:focus { background-color: white; border: 1px solid #333; } .dark input[type=text]:focus { background-color: #333; border: 1px solid #ccc; } mark.highlight { background-color: #5050ff; color: #fff; padding: 2px; border-radius: 6px; } .dark mark.highlight { background-color: #76a6da; color: #111; } .menubtn { background-color: white; font-size: 16px; border: none; 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"); background-position: center; background-repeat: no-repeat; } .dark .menubtn { filter: invert(1); } .menu { position: relative; display: inline-block; } .menu-content { display: none; position: absolute; background-color: white; right: 0; min-width: 300px; box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); z-index: 100; padding: 8px; } .dark .menu-content { background-color: #111; } .menu:hover .menu-content { display: block; } .menu:hover .menubtn { background-color: #eee; } .dark .menu:hover .menubtn { } .menu-label { display: inline-block; padding: 8px; border: 1px solid #ccc; border-top: 0; width: calc(100% - 18px); } .menu-label-top { border-top: 1px solid #ccc; } .menu-textbox { float: left; height: 24px; margin: 10px 5px; padding: 5px 5px; font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace; font-size: 14px; box-sizing: border-box; border: 1px solid #888; border-radius: 4px; outline: none; background-color: #eee; transition: background-color 0.2s, border 0.2s; width: calc(100% - 10px); } .dark .menu-textbox { background-color: #222; color: #eee; } #topmostdiv { transition: background-color 0.3s; } #top { height: 78px; border-bottom: 2px solid black; } .dark #top { border-bottom: 2px solid #ccc; } #dbg { display: block; } </style> <script type="text/javascript" > /////////////////////////////////////////////// /* Split.js - v1.3.5 MIT License https://github.com/nathancahill/Split.js */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.Split=t()}(this,function(){"use strict";var e=window,t=e.document,n="addEventListener",i="removeEventListener",r="getBoundingClientRect",s=function(){return!1},o=e.attachEvent&&!e[n],a=["","-webkit-","-moz-","-o-"].filter(function(e){var n=t.createElement("div");return n.style.cssText="width:"+e+"calc(9px)",!!n.style.length}).shift()+"calc",l=function(e){return"string"==typeof e||e instanceof String?t.querySelector(e):e};return function(u,c){function z(e,t,n){var i=A(y,t,n);Object.keys(i).forEach(function(t){return e.style[t]=i[t]})}function h(e,t){var n=B(y,t);Object.keys(n).forEach(function(t){return e.style[t]=n[t]})}function f(e){var t=E[this.a],n=E[this.b],i=t.size+n.size;t.size=e/this.size*i,n.size=i-e/this.size*i,z(t.element,t.size,this.aGutterSize),z(n.element,n.size,this.bGutterSize)}function m(e){var t;this.dragging&&((t="touches"in e?e.touches[0][b]-this.start:e[b]-this.start)<=E[this.a].minSize+M+this.aGutterSize?t=E[this.a].minSize+this.aGutterSize:t>=this.size-(E[this.b].minSize+M+this.bGutterSize)&&(t=this.size-(E[this.b].minSize+this.bGutterSize)),f.call(this,t),c.onDrag&&c.onDrag())}function g(){var e=E[this.a].element,t=E[this.b].element;this.size=e[r]()[y]+t[r]()[y]+this.aGutterSize+this.bGutterSize,this.start=e[r]()[G]}function d(){var t=this,n=E[t.a].element,r=E[t.b].element;t.dragging&&c.onDragEnd&&c.onDragEnd(),t.dragging=!1,e[i]("mouseup",t.stop),e[i]("touchend",t.stop),e[i]("touchcancel",t.stop),t.parent[i]("mousemove",t.move),t.parent[i]("touchmove",t.move),delete t.stop,delete t.move,n[i]("selectstart",s),n[i]("dragstart",s),r[i]("selectstart",s),r[i]("dragstart",s),n.style.userSelect="",n.style.webkitUserSelect="",n.style.MozUserSelect="",n.style.pointerEvents="",r.style.userSelect="",r.style.webkitUserSelect="",r.style.MozUserSelect="",r.style.pointerEvents="",t.gutter.style.cursor="",t.parent.style.cursor=""}function S(t){var i=this,r=E[i.a].element,o=E[i.b].element;!i.dragging&&c.onDragStart&&c.onDragStart(),t.preventDefault(),i.dragging=!0,i.move=m.bind(i),i.stop=d.bind(i),e[n]("mouseup",i.stop),e[n]("touchend",i.stop),e[n]("touchcancel",i.stop),i.parent[n]("mousemove",i.move),i.parent[n]("touchmove",i.move),r[n]("selectstart",s),r[n]("dragstart",s),o[n]("selectstart",s),o[n]("dragstart",s),r.style.userSelect="none",r.style.webkitUserSelect="none",r.style.MozUserSelect="none",r.style.pointerEvents="none",o.style.userSelect="none",o.style.webkitUserSelect="none",o.style.MozUserSelect="none",o.style.pointerEvents="none",i.gutter.style.cursor=j,i.parent.style.cursor=j,g.call(i)}function v(e){e.forEach(function(t,n){if(n>0){var i=F[n-1],r=E[i.a],s=E[i.b];r.size=e[n-1],s.size=t,z(r.element,r.size,i.aGutterSize),z(s.element,s.size,i.bGutterSize)}})}function p(){F.forEach(function(e){e.parent.removeChild(e.gutter),E[e.a].element.style[y]="",E[e.b].element.style[y]=""})}void 0===c&&(c={});var y,b,G,E,w=l(u[0]).parentNode,D=e.getComputedStyle(w).flexDirection,U=c.sizes||u.map(function(){return 100/u.length}),k=void 0!==c.minSize?c.minSize:100,x=Array.isArray(k)?k:u.map(function(){return k}),L=void 0!==c.gutterSize?c.gutterSize:10,M=void 0!==c.snapOffset?c.snapOffset:30,O=c.direction||"horizontal",j=c.cursor||("horizontal"===O?"ew-resize":"ns-resize"),C=c.gutter||function(e,n){var i=t.createElement("div");return i.className="gutter gutter-"+n,i},A=c.elementStyle||function(e,t,n){var i={};return"string"==typeof t||t instanceof String?i[e]=t:i[e]=o?t+"%":a+"("+t+"% - "+n+"px)",i},B=c.gutterStyle||function(e,t){return n={},n[e]=t+"px",n;var n};"horizontal"===O?(y="width","clientWidth",b="clientX",G="left","paddingLeft"):"vertical"===O&&(y="height","clientHeight",b="clientY",G="top","paddingTop");var F=[];return E=u.map(function(e,t){var i,s={element:l(e),size:U[t],minSize:x[t]};if(t>0&&(i={a:t-1,b:t,dragging:!1,isFirst:1===t,isLast:t===u.length-1,direction:O,parent:w},i.aGutterSize=L,i.bGutterSize=L,i.isFirst&&(i.aGutterSize=L/2),i.isLast&&(i.bGutterSize=L/2),"row-reverse"===D||"column-reverse"===D)){var a=i.a;i.a=i.b,i.b=a}if(!o&&t>0){var c=C(t,O);h(c,L),c[n]("mousedown",S.bind(i)),c[n]("touchstart",S.bind(i)),w.insertBefore(c,s.element),i.gutter=c}0===t||t===u.length-1?z(s.element,s.size,L/2):z(s.element,s.size,L);var f=s.element[r]()[y];return f<s.minSize&&(s.minSize=f),t>0&&F.push(i),s}),o?{setSizes:v,destroy:p}:{setSizes:v,getSizes:function(){return E.map(function(e){return e.size})},collapse:function(e){if(e===F.length){var t=F[e-1];g.call(t),o||f.call(t,t.size-t.bGutterSize)}else{var n=F[e];g.call(n),o||f.call(n,n.aGutterSize)}},destroy:p}}}); /////////////////////////////////////////////// /////////////////////////////////////////////// var pcbdata = {"modules": {"S1": {"layer": "F", "center": [74.17017, 164.84815999999998], "pads": [{"layers": ["F"], "angle": -90.0, "pos": [74.17017, 168.1019], "shape": "rect", "pin1": true, "type": "smd", "size": [2.794, 1.016]}, {"layers": ["F"], "angle": -90.0, "pos": [74.17017, 161.59441999999999], "shape": "rect", "pin1": false, "type": "smd", "size": [2.794, 1.016]}], "drawings": [], "ref": "S1", "bbox": {"pos": [72.350189, 160.19742], "size": [3.6399619999999997, 9.30148]}}, "U1": {"layer": "F", "center": [69.85217, 141.48015999999998], "pads": [{"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 135.48015999999998], "shape": "rect", "pin1": true, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 137.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 139.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 141.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 143.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 145.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 147.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [61.852169999999994, 149.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 149.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 147.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 143.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 141.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 139.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 137.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 135.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -270.0, "pos": [77.85217, 145.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [74.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [72.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [70.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [68.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [66.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}, {"layers": ["F"], "angle": -0.0, "pos": [64.85217, 151.48015999999998], "shape": "oval", "pin1": false, "type": "smd", "size": [1.2, 3.0]}], "drawings": [], "ref": "U1", "bbox": {"pos": [60.352169999999994, 128.405159], "size": [19.0, 24.575001]}}, "TCC1": {"layer": "F", "center": [85.02866999999999, 134.68565999999998], "pads": [{"layers": ["F"], "angle": -90.0, "pos": [84.02866999999999, 135.68565999999998], "shape": "circle", "pin1": false, "type": "smd", "size": [1.2, 1.2]}, {"layers": ["F", "B"], "angle": -90.0, "pos": [85.02866999999999, 137.18565999999998], "drillsize": [1.0, 1.0], "shape": "circle", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.0, 1.0]}, {"layers": ["F", "B"], "angle": -90.0, "pos": [84.02866999999999, 132.08566], "drillsize": [1.0, 1.0], "shape": "circle", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.0, 1.0]}, {"layers": ["F", "B"], "angle": -90.0, "pos": [86.02866999999999, 132.08566], "drillsize": [1.0, 1.0], "shape": "circle", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.0, 1.0]}, {"layers": ["F"], "angle": -90.0, "pos": [86.02866999999999, 135.68565999999998], "shape": "circle", "pin1": true, "type": "smd", "size": [1.2, 1.2]}, {"layers": ["F"], "angle": -90.0, "pos": [86.02866999999999, 133.68565999999998], "shape": "circle", "pin1": false, "type": "smd", "size": [1.2, 1.2]}, {"layers": ["F"], "angle": -90.0, "pos": [84.02866999999999, 133.68565999999998], "shape": "circle", "pin1": false, "type": "smd", "size": [1.2, 1.2]}], "drawings": [], "ref": "TCC1", "bbox": {"pos": [83.04866899999999, 131.054659], "size": [3.960002, 7.269750999999999]}}, "R7": {"layer": "F", "center": [81.15517, 153.10066], "pads": [{"layers": ["F"], "angle": -180.0, "pos": [82.58265, 153.10066], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -180.0, "pos": [79.72769, 153.10066], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R7", "bbox": {"pos": [79.21969, 152.263659], "size": [3.8709599999999997, 1.674002]}}, "R10": {"layer": "F", "center": [70.99517, 156.52966], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [69.56769, 156.52966], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -0.0, "pos": [72.42264999999999, 156.52966], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R10", "bbox": {"pos": [69.05969, 155.692659], "size": [3.8709599999999997, 1.674002]}}, "R11": {"layer": "F", "center": [83.56817, 141.54366], "pads": [{"layers": ["F"], "angle": -180.0, "pos": [84.99565, 141.54366], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -180.0, "pos": [82.14068999999999, 141.54366], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R11", "bbox": {"pos": [81.63269, 140.706659], "size": [3.8709599999999997, 1.674002]}}, "C3": {"layer": "F", "center": [65.78817, 161.03816], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [64.36068999999999, 161.03816], "shape": "rect", "pin1": true, "type": "smd", "size": [1.143, 1.651]}, {"layers": ["F"], "angle": -0.0, "pos": [67.21565, 161.03816], "shape": "rect", "pin1": false, "type": "smd", "size": [1.143, 1.651]}], "drawings": [], "ref": "C3", "bbox": {"pos": [63.78919, 160.201159], "size": [3.99796, 1.674002]}}, "C2": {"layer": "F", "center": [80.45667, 163.32416], "pads": [{"layers": ["F"], "angle": -180.0, "pos": [81.88414999999999, 163.32416], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -180.0, "pos": [79.02919, 163.32416], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "C2", "bbox": {"pos": [78.52118999999999, 162.487159], "size": [3.8709599999999997, 1.674002]}}, "C1": {"layer": "F", "center": [65.78817, 157.99016], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [64.36068999999999, 157.99016], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -0.0, "pos": [67.21565, 157.99016], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "C1", "bbox": {"pos": [63.852689999999996, 157.153159], "size": [3.8709599999999997, 1.674002]}}, "R4": {"layer": "F", "center": [79.18666999999999, 160.59366], "pads": [{"layers": ["F"], "angle": -180.0, "pos": [80.61415, 160.59366], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -180.0, "pos": [77.75918999999999, 160.59366], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R4", "bbox": {"pos": [77.25119, 159.75665899999998], "size": [3.8709599999999997, 1.674002]}}, "R5": {"layer": "F", "center": [81.21867, 156.91065999999998], "pads": [{"layers": ["F"], "angle": -180.0, "pos": [82.64614999999999, 156.91065999999998], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -180.0, "pos": [79.79119, 156.91065999999998], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R5", "bbox": {"pos": [79.28318999999999, 156.073659], "size": [3.8709599999999997, 1.674002]}}, "R6": {"layer": "F", "center": [81.79017, 148.84616], "pads": [{"layers": ["F"], "angle": -90.0, "pos": [81.79017, 150.27364], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -90.0, "pos": [81.79017, 147.41868], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R6", "bbox": {"pos": [80.953169, 146.91067999999999], "size": [1.674002, 3.8709599999999997]}}, "P1": {"layer": "B", "center": [87.63217, 147.95716], "pads": [{"layers": ["F", "B"], "angle": -180.0, "pos": [87.63217, 147.95716], "drillsize": [1.016, 1.016], "shape": "rect", "drillshape": "circle", "pin1": true, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [85.09217, 147.95716], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [87.63217, 150.49715999999998], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [85.09217, 150.49715999999998], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [87.63217, 153.03716], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [85.09217, 153.03716], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [87.63217, 155.57716], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [85.09217, 155.57716], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [87.63217, 158.11715999999998], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}, {"layers": ["F", "B"], "angle": -180.0, "pos": [85.09217, 158.11715999999998], "drillsize": [1.016, 1.016], "shape": "oval", "drillshape": "circle", "pin1": false, "type": "th", "size": [1.7271999999999998, 1.7271999999999998]}], "drawings": [], "ref": "P1", "bbox": {"pos": [74.407169, 146.18215899999998], "size": [14.600002, 13.750001999999999]}}, "R1": {"layer": "F", "center": [63.75617, 170.69016], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [62.328689999999995, 170.69016], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -0.0, "pos": [65.18365, 170.69016], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R1", "bbox": {"pos": [61.82069, 169.853159], "size": [3.8709599999999997, 1.674002]}}, "R2": {"layer": "F", "center": [64.51817, 166.43565999999998], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [63.090689999999995, 166.43565999999998], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -0.0, "pos": [65.94565, 166.43565999999998], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R2", "bbox": {"pos": [62.58269, 165.598659], "size": [3.8709599999999997, 1.674002]}}, "R3": {"layer": "F", "center": [61.21617, 156.21215999999998], "pads": [{"layers": ["F"], "angle": -270.0, "pos": [61.21617, 154.78467999999998], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -270.0, "pos": [61.21617, 157.63963999999999], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R3", "bbox": {"pos": [60.379169, 154.27668], "size": [1.674002, 3.8709599999999997]}}, "R8": {"layer": "F", "center": [69.21717, 167.89615999999998], "pads": [{"layers": ["F"], "angle": -90.0, "pos": [69.21717, 169.32363999999998], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -90.0, "pos": [69.21717, 166.46868], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R8", "bbox": {"pos": [68.380169, 165.96068], "size": [1.674002, 3.8709599999999997]}}, "R9": {"layer": "F", "center": [65.78817, 155.19616], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [64.36068999999999, 155.19616], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 1.524]}, {"layers": ["F"], "angle": -0.0, "pos": [67.21565, 155.19616], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 1.524]}], "drawings": [], "ref": "R9", "bbox": {"pos": [63.852689999999996, 154.359159], "size": [3.8709599999999997, 1.674002]}}, "T1": {"layer": "F", "center": [76.39267, 156.91065999999998], "pads": [{"layers": ["F"], "angle": -90.0, "pos": [77.26897, 157.86316], "shape": "rect", "pin1": true, "type": "smd", "size": [0.9144, 0.9144]}, {"layers": ["F"], "angle": -90.0, "pos": [77.26897, 155.95816], "shape": "rect", "pin1": false, "type": "smd", "size": [0.9144, 0.9144]}, {"layers": ["F"], "angle": -90.0, "pos": [75.34111, 156.91065999999998], "shape": "rect", "pin1": false, "type": "smd", "size": [0.9144, 1.27]}], "drawings": [], "ref": "T1", "bbox": {"pos": [74.70611, 155.435659], "size": [3.02006, 2.950002]}}, "LD1": {"layer": "F", "center": [69.21717, 173.42066], "pads": [{"layers": ["F"], "angle": -270.0, "pos": [69.21717, 171.83316], "shape": "rect", "pin1": true, "type": "smd", "size": [1.27, 1.524]}, {"layers": ["F"], "angle": -270.0, "pos": [69.21717, 175.00816], "shape": "rect", "pin1": false, "type": "smd", "size": [1.27, 1.524]}], "drawings": [], "ref": "LD1", "bbox": {"pos": [68.24216899999999, 171.19816], "size": [1.950002, 4.444999999999999]}}, "U2": {"layer": "F", "center": [80.32967, 169.80115999999998], "pads": [{"layers": ["F"], "angle": -0.0, "pos": [80.32967, 166.49916], "shape": "rect", "pin1": false, "type": "smd", "size": [3.6576, 2.032]}, {"layers": ["F"], "angle": -0.0, "pos": [80.32967, 173.10316], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 2.032]}, {"layers": ["F"], "angle": -0.0, "pos": [82.61567, 173.10316], "shape": "rect", "pin1": false, "type": "smd", "size": [1.016, 2.032]}, {"layers": ["F"], "angle": -0.0, "pos": [78.04366999999999, 173.10316], "shape": "rect", "pin1": true, "type": "smd", "size": [1.016, 2.032]}], "drawings": [], "ref": "U2", "bbox": {"pos": [76.454669, 165.48316], "size": [7.750001999999999, 8.636]}}, "G***": {"layer": "B", "center": [66.80417, 136.40016], "pads": [], "drawings": [], "ref": "G***", "bbox": {"pos": [61.229983999999995, 128.869233], "size": [11.186002, 15.061853]}}}, "edges": [{"start": [59.184169999999995, 127.95465999999999], "end": [59.184169999999995, 127.51016], "type": "segment", "width": 0.09999999999999999}, {"start": [59.184169999999995, 177.54816], "end": [59.184169999999995, 127.95465999999999], "type": "segment", "width": 0.09999999999999999}, {"start": [61.34317, 177.54816], "end": [59.184169999999995, 177.54816], "type": "segment", "width": 0.09999999999999999}, {"start": [89.28317, 177.54816], "end": [61.34317, 177.54816], "type": "segment", "width": 0.09999999999999999}, {"start": [89.28317, 127.51016], "end": [89.28317, 177.54816], "type": "segment", "width": 0.09999999999999999}, {"start": [59.184169999999995, 127.51016], "end": [89.28317, 127.51016], "type": "segment", "width": 0.09999999999999999}, {"start": [59.05717, 127.51016], "end": [59.184169999999995, 127.51016], "type": "segment", "width": 0.09999999999999999}], "bom": {"both": [[1, "10M/16V", "C1206ss", ["C1"]], [1, "10M/6V3", "C1206ss", ["C2"]], [1, "47M/6V3", "CT-A", ["C3"]], [4, "4K7", "R1206ss", ["R1", "R4", "R9", "R10"]], [2, "150R", "R1206ss", ["R3", "R5"]], [2, "1k", "R1206ss", ["R6", "R7"]], [1, "10K", "R1206ss", ["R2"]], [1, "470R", "R1206ss", ["R8"]], [1, "2k2", "R1206ss", ["R11"]], [1, "Modul_ESP12E", "Modul_ESP-12-E_SMD", ["U1"]], [1, "TS1117B_SOT223", "SOT223N", ["U2"]], [1, "LED", "LD1206L", ["LD1"]], [1, "BSS138", "SOT23A", ["T1"]], [1, "SP\u00cdNA\u010c_TLA\u010c\u00cdTKO_NO", "SW_TD-02XB_SMD", ["S1"]], [1, "CONN_02X05", "Pin_Header_Angled_2x05", ["P1"]]], "B": [[1, "CONN_02X05", "Pin_Header_Angled_2x05", ["P1"]]], "F": [[1, "10M/16V", "C1206ss", ["C1"]], [1, "10M/6V3", "C1206ss", ["C2"]], [1, "47M/6V3", "CT-A", ["C3"]], [4, "4K7", "R1206ss", ["R1", "R4", "R9", "R10"]], [2, "150R", "R1206ss", ["R3", "R5"]], [2, "1k", "R1206ss", ["R6", "R7"]], [1, "10K", "R1206ss", ["R2"]], [1, "470R", "R1206ss", ["R8"]], [1, "2k2", "R1206ss", ["R11"]], [1, "Modul_ESP12E", "Modul_ESP-12-E_SMD", ["U1"]], [1, "TS1117B_SOT223", "SOT223N", ["U2"]], [1, "LED", "LD1206L", ["LD1"]], [1, "BSS138", "SOT23A", ["T1"]], [1, "SP\u00cdNA\u010c_TLA\u010c\u00cdTKO_NO", "SW_TD-02XB_SMD", ["S1"]]]}, "silkscreen": {"B": [{"angle": 180.0, "horiz_justify": 0, "text": "(c) 2016 xPablo.cz", "pos": [74.29717, 171.19816], "height": 4.0, "width": 1.7999999999999998}, {"angle": 0.0, "horiz_justify": 0, "text": "P1", "pos": [86.61617, 143.25816], "height": 1.0, "width": 1.0}, {"start": [86.10817, 158.37116], "end": [86.61617, 158.37116], "type": "segment", "width": 0.15}, {"start": [86.10817, 157.86316], "end": [86.61617, 157.86316], "type": "segment", "width": 0.15}, {"start": [86.10817, 155.83115999999998], "end": [86.61617, 155.83115999999998], "type": "segment", "width": 0.15}, {"start": [86.10817, 155.32316], "end": [86.61617, 155.32316], "type": "segment", "width": 0.15}, {"start": [86.10817, 147.70316], "end": [86.61617, 147.70316], "type": "segment", "width": 0.15}, {"start": [86.10817, 148.21116], "end": [86.61617, 148.21116], "type": "segment", "width": 0.15}, {"start": [86.10817, 153.29116], "end": [86.61617, 153.29116], "type": "segment", "width": 0.15}, {"start": [86.10817, 152.78315999999998], "end": [86.61617, 152.78315999999998], "type": "segment", "width": 0.15}, {"start": [86.10817, 150.75116], "end": [86.61617, 150.75116], "type": "segment", "width": 0.15}, {"start": [86.10817, 150.24316], "end": [86.61617, 150.24316], "type": "segment", "width": 0.15}, {"start": [83.56817, 158.37116], "end": [84.07616999999999, 158.37116], "type": "segment", "width": 0.15}, {"start": [83.56817, 157.86316], "end": [84.07616999999999, 157.86316], "type": "segment", "width": 0.15}, {"start": [83.56817, 147.70316], "end": [84.07616999999999, 147.70316], "type": "segment", "width": 0.15}, {"start": [83.56817, 148.21116], "end": [84.07616999999999, 148.21116], "type": "segment", "width": 0.15}, {"start": [83.56817, 150.24316], "end": [84.07616999999999, 150.24316], "type": "segment", "width": 0.15}, {"start": [83.56817, 150.75116], "end": [84.07616999999999, 150.75116], "type": "segment", "width": 0.15}, {"start": [83.56817, 155.83115999999998], "end": [84.07616999999999, 155.83115999999998], "type": "segment", "width": 0.15}, {"start": [83.56817, 155.32316], "end": [84.07616999999999, 155.32316], "type": "segment", "width": 0.15}, {"start": [83.56817, 153.29116], "end": [84.07616999999999, 153.29116], "type": "segment", "width": 0.15}, {"start": [83.56817, 152.78315999999998], "end": [84.07616999999999, 152.78315999999998], "type": "segment", "width": 0.15}, {"start": [87.63217, 146.40716], "end": [88.78217, 146.40716], "type": "segment", "width": 0.15}, {"start": [88.78217, 146.40716], "end": [88.78217, 147.95716], "type": "segment", "width": 0.15}, {"start": [81.02817, 147.83016], "end": [75.05917, 147.83016], "type": "segment", "width": 0.15}, {"start": [75.05917, 147.83016], "end": [75.05917, 148.08416], "type": "segment", "width": 0.15}, {"start": [75.05917, 148.08416], "end": [80.90117, 148.08416], "type": "segment", "width": 0.15}, {"start": [80.90117, 148.08416], "end": [80.90117, 147.95716], "type": "segment", "width": 0.15}, {"start": [80.90117, 147.95716], "end": [75.05917, 147.95716], "type": "segment", "width": 0.15}, {"start": [83.56817, 156.84716], "end": [81.02817, 156.84716], "type": "segment", "width": 0.15}, {"start": [83.56817, 156.84716], "end": [83.56817, 159.38716], "type": "segment", "width": 0.15}, {"start": [81.02817, 157.86316], "end": [74.93217, 157.86316], "type": "segment", "width": 0.15}, {"start": [74.93217, 157.86316], "end": [74.93217, 158.37116], "type": "segment", "width": 0.15}, {"start": [74.93217, 158.37116], "end": [81.02817, 158.37116], "type": "segment", "width": 0.15}, {"start": [81.02817, 159.38716], "end": [81.02817, 156.84716], "type": "segment", "width": 0.15}, {"start": [83.56817, 159.38716], "end": [81.02817, 159.38716], "type": "segment", "width": 0.15}, {"start": [83.56817, 151.76716], "end": [81.02817, 151.76716], "type": "segment", "width": 0.15}, {"start": [83.56817, 151.76716], "end": [83.56817, 154.30715999999998], "type": "segment", "width": 0.15}, {"start": [83.56817, 154.30715999999998], "end": [81.02817, 154.30715999999998], "type": "segment", "width": 0.15}, {"start": [81.02817, 152.78315999999998], "end": [74.93217, 152.78315999999998], "type": "segment", "width": 0.15}, {"start": [74.93217, 152.78315999999998], "end": [74.93217, 153.29116], "type": "segment", "width": 0.15}, {"start": [74.93217, 153.29116], "end": [81.02817, 153.29116], "type": "segment", "width": 0.15}, {"start": [81.02817, 154.30715999999998], "end": [81.02817, 151.76716], "type": "segment", "width": 0.15}, {"start": [81.02817, 156.84716], "end": [81.02817, 154.30715999999998], "type": "segment", "width": 0.15}, {"start": [74.93217, 155.83115999999998], "end": [81.02817, 155.83115999999998], "type": "segment", "width": 0.15}, {"start": [74.93217, 155.32316], "end": [74.93217, 155.83115999999998], "type": "segment", "width": 0.15}, {"start": [81.02817, 155.32316], "end": [74.93217, 155.32316], "type": "segment", "width": 0.15}, {"start": [83.56817, 156.84716], "end": [81.02817, 156.84716], "type": "segment", "width": 0.15}, {"start": [83.56817, 154.30715999999998], "end": [83.56817, 156.84716], "type": "segment", "width": 0.15}, {"start": [83.56817, 154.30715999999998], "end": [81.02817, 154.30715999999998], "type": "segment", "width": 0.15}, {"start": [83.56817, 149.22716], "end": [81.02817, 149.22716], "type": "segment", "width": 0.15}, {"start": [83.56817, 149.22716], "end": [83.56817, 151.76716], "type": "segment", "width": 0.15}, {"start": [83.56817, 151.76716], "end": [81.02817, 151.76716], "type": "segment", "width": 0.15}, {"start": [81.02817, 150.24316], "end": [74.93217, 150.24316], "type": "segment", "width": 0.15}, {"start": [74.93217, 150.24316], "end": [74.93217, 150.75116], "type": "segment", "width": 0.15}, {"start": [74.93217, 150.75116], "end": [81.02817, 150.75116], "type": "segment", "width": 0.15}, {"start": [81.02817, 151.76716], "end": [81.02817, 149.22716], "type": "segment", "width": 0.15}, {"start": [81.02817, 149.22716], "end": [81.02817, 146.68716], "type": "segment", "width": 0.15}, {"start": [74.93217, 148.21116], "end": [81.02817, 148.21116], "type": "segment", "width": 0.15}, {"start": [74.93217, 147.70316], "end": [74.93217, 148.21116], "type": "segment", "width": 0.15}, {"start": [81.02817, 147.70316], "end": [74.93217, 147.70316], "type": "segment", "width": 0.15}, {"start": [83.56817, 149.22716], "end": [81.02817, 149.22716], "type": "segment", "width": 0.15}, {"start": [83.56817, 146.68716], "end": [83.56817, 149.22716], "type": "segment", "width": 0.15}, {"start": [83.56817, 146.68716], "end": [81.02817, 146.68716], "type": "segment", "width": 0.15}, {"angle": [0.0], "type": "polygon", "pos": [66.80417, 136.40016], "polygons": []}, {"angle": [0.0], "type": "polygon", "pos": [66.80417, 136.40016], "polygons": []}], "F": [{"angle": 0.0, "horiz_justify": 0, "text": "C2", "pos": [80.39317, 164.84815999999998], "height": 1.0, "width": 1.0}, {"start": [78.88186999999999, 164.08616], "end": [78.88186999999999, 162.56216], "type": "segment", "width": 0.15}, {"start": [82.03147, 164.08616], "end": [82.03147, 162.56216], "type": "segment", "width": 0.15}, {"start": [82.03147, 162.56216], "end": [78.88186999999999, 162.56216], "type": "segment", "width": 0.15}, {"start": [82.03147, 164.08616], "end": [78.88186999999999, 164.08616], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R1", "pos": [63.88317, 172.21416], "height": 1.0, "width": 1.0}, {"start": [65.33097, 169.92816], "end": [65.33097, 171.45216], "type": "segment", "width": 0.15}, {"start": [62.181369999999994, 169.92816], "end": [62.181369999999994, 171.45216], "type": "segment", "width": 0.15}, {"start": [62.181369999999994, 171.45216], "end": [65.33097, 171.45216], "type": "segment", "width": 0.15}, {"start": [62.181369999999994, 169.92816], "end": [65.33097, 169.92816], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R2", "pos": [64.51817, 168.02316], "height": 1.0, "width": 1.0}, {"start": [66.09297, 165.67365999999998], "end": [66.09297, 167.19765999999998], "type": "segment", "width": 0.15}, {"start": [62.943369999999994, 165.67365999999998], "end": [62.943369999999994, 167.19765999999998], "type": "segment", "width": 0.15}, {"start": [62.943369999999994, 167.19765999999998], "end": [66.09297, 167.19765999999998], "type": "segment", "width": 0.15}, {"start": [62.943369999999994, 165.67365999999998], "end": [66.09297, 165.67365999999998], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "R3", "pos": [62.99417, 156.21215999999998], "height": 1.0, "width": 1.0}, {"start": [61.97817, 157.78696], "end": [60.45417, 157.78696], "type": "segment", "width": 0.15}, {"start": [61.97817, 154.63736], "end": [60.45417, 154.63736], "type": "segment", "width": 0.15}, {"start": [60.45417, 154.63736], "end": [60.45417, 157.78696], "type": "segment", "width": 0.15}, {"start": [61.97817, 154.63736], "end": [61.97817, 157.78696], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R4", "pos": [79.25017, 162.05416], "height": 1.0, "width": 1.0}, {"start": [77.61187, 161.35566], "end": [77.61187, 159.83166], "type": "segment", "width": 0.15}, {"start": [80.76147, 161.35566], "end": [80.76147, 159.83166], "type": "segment", "width": 0.15}, {"start": [80.76147, 159.83166], "end": [77.61187, 159.83166], "type": "segment", "width": 0.15}, {"start": [80.76147, 161.35566], "end": [77.61187, 161.35566], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R5", "pos": [81.28217, 158.49815999999998], "height": 1.0, "width": 1.0}, {"start": [79.64386999999999, 157.67265999999998], "end": [79.64386999999999, 156.14866], "type": "segment", "width": 0.15}, {"start": [82.79347, 157.67265999999998], "end": [82.79347, 156.14866], "type": "segment", "width": 0.15}, {"start": [82.79347, 156.14866], "end": [79.64386999999999, 156.14866], "type": "segment", "width": 0.15}, {"start": [82.79347, 157.67265999999998], "end": [79.64386999999999, 157.67265999999998], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "R6", "pos": [83.44117, 148.84616], "height": 1.0, "width": 1.0}, {"start": [81.02817, 147.27136], "end": [82.55216999999999, 147.27136], "type": "segment", "width": 0.15}, {"start": [81.02817, 150.42095999999998], "end": [82.55216999999999, 150.42095999999998], "type": "segment", "width": 0.15}, {"start": [82.55216999999999, 150.42095999999998], "end": [82.55216999999999, 147.27136], "type": "segment", "width": 0.15}, {"start": [81.02817, 150.42095999999998], "end": [81.02817, 147.27136], "type": "segment", "width": 0.15}, {"start": [61.852169999999994, 134.48015999999998], "end": [61.852169999999994, 150.48015999999998], "type": "segment", "width": 0.15}, {"start": [77.85217, 134.48015999999998], "end": [77.85217, 150.48015999999998], "type": "segment", "width": 0.15}, {"start": [77.85217, 133.48015999999998], "end": [61.852169999999994, 133.48015999999998], "type": "segment", "width": 0.15}, {"start": [61.852169999999994, 134.48015999999998], "end": [61.852169999999994, 128.48015999999998], "type": "segment", "width": 0.15}, {"start": [61.852169999999994, 128.48015999999998], "end": [77.85217, 128.48015999999998], "type": "segment", "width": 0.15}, {"start": [77.85217, 128.48015999999998], "end": [77.85217, 134.48015999999998], "type": "segment", "width": 0.15}, {"start": [61.852169999999994, 150.48015999999998], "end": [61.852169999999994, 151.48015999999998], "type": "segment", "width": 0.15}, {"start": [61.852169999999994, 151.48015999999998], "end": [77.85217, 151.48015999999998], "type": "segment", "width": 0.15}, {"start": [77.85217, 151.48015999999998], "end": [77.85217, 150.48015999999998], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R7", "pos": [81.15517, 154.68815999999998], "height": 1.0, "width": 1.0}, {"start": [79.58037, 153.86266], "end": [79.58037, 152.33866], "type": "segment", "width": 0.15}, {"start": [82.72997, 153.86266], "end": [82.72997, 152.33866], "type": "segment", "width": 0.15}, {"start": [82.72997, 152.33866], "end": [79.58037, 152.33866], "type": "segment", "width": 0.15}, {"start": [82.72997, 153.86266], "end": [79.58037, 153.86266], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "R8", "pos": [70.86816999999999, 167.89615999999998], "height": 1.0, "width": 1.0}, {"start": [68.45517, 166.32136], "end": [69.97917, 166.32136], "type": "segment", "width": 0.15}, {"start": [68.45517, 169.47096], "end": [69.97917, 169.47096], "type": "segment", "width": 0.15}, {"start": [69.97917, 169.47096], "end": [69.97917, 166.32136], "type": "segment", "width": 0.15}, {"start": [68.45517, 169.47096], "end": [68.45517, 166.32136], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "LD1", "pos": [70.91717, 173.52066], "height": 1.0, "width": 1.0}, {"start": [69.21717, 172.52066], "end": [69.21717, 174.32066], "type": "segment", "width": 0.15}, {"start": [69.81716999999999, 173.02066], "end": [68.61717, 173.02066], "type": "segment", "width": 0.15}, {"start": [69.81716999999999, 173.72065999999998], "end": [69.21717, 173.02066], "type": "segment", "width": 0.15}, {"start": [69.21717, 173.02066], "end": [68.61717, 173.72065999999998], "type": "segment", "width": 0.15}, {"start": [68.61717, 173.72065999999998], "end": [69.81716999999999, 173.72065999999998], "type": "segment", "width": 0.15}, {"start": [69.21717, 173.42066], "radius": 0.8999999999999999, "type": "circle", "width": 0.15}, {"start": [68.33071, 175.2647], "end": [70.10616999999999, 175.2647], "type": "segment", "width": 0.15}, {"start": [70.10616999999999, 175.2647], "end": [70.10616999999999, 171.58424], "type": "segment", "width": 0.15}, {"start": [70.10616999999999, 171.58424], "end": [68.33071, 171.58424], "type": "segment", "width": 0.15}, {"start": [68.33071, 171.58424], "end": [68.33071, 175.2647], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "TCC1", "pos": [82.32992, 134.20941], "height": 1.0, "width": 1.0}, {"start": [86.93366999999999, 132.08216], "end": [86.93366999999999, 136.76846], "type": "segment", "width": 0.15}, {"start": [83.12366999999999, 132.08216], "end": [83.12366999999999, 136.76846], "type": "segment", "width": 0.15}, {"start": [85.75256999999999, 137.94956], "end": [86.93366999999999, 136.76846], "type": "segment", "width": 0.15}, {"start": [84.30476999999999, 137.94956], "end": [83.12366999999999, 136.76846], "type": "segment", "width": 0.15}, {"width": 0.15, "endangle": 135.0, "start": [85.02866999999999, 137.22566], "radius": 1.023749, "startangle": 45.0, "type": "arc"}, {"start": [84.07616999999999, 131.12966], "end": [85.98116999999999, 131.12966], "type": "segment", "width": 0.15}, {"width": 0.15, "endangle": 360.0, "start": [85.98116999999999, 132.08216], "radius": 0.9524999999999999, "startangle": 270.0, "type": "arc"}, {"width": 0.15, "endangle": 270.0, "start": [84.07616999999999, 132.08216], "radius": 0.9524999999999999, "startangle": 180.0, "type": "arc"}, {"start": [77.09267, 156.21066], "end": [77.39267, 156.21066], "type": "segment", "width": 0.15}, {"start": [77.39267, 156.21066], "end": [77.39267, 155.71066], "type": "segment", "width": 0.15}, {"start": [77.39267, 155.71066], "end": [77.09267, 155.71066], "type": "segment", "width": 0.15}, {"start": [77.09267, 158.11066], "end": [77.39267, 158.11066], "type": "segment", "width": 0.15}, {"start": [77.39267, 158.11066], "end": [77.39267, 157.61066], "type": "segment", "width": 0.15}, {"start": [77.39267, 157.61066], "end": [77.09267, 157.61066], "type": "segment", "width": 0.15}, {"start": [75.69266999999999, 157.21066], "end": [75.39267, 157.21066], "type": "segment", "width": 0.15}, {"start": [75.39267, 157.21066], "end": [75.39267, 156.61066], "type": "segment", "width": 0.15}, {"start": [75.39267, 156.61066], "end": [75.69266999999999, 156.61066], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "T1", "pos": [78.36117, 156.84716], "height": 1.0, "width": 1.0}, {"start": [77.09267, 156.91065999999998], "end": [77.09267, 158.31065999999998], "type": "segment", "width": 0.15}, {"start": [77.09267, 158.31065999999998], "end": [75.69266999999999, 158.31065999999998], "type": "segment", "width": 0.15}, {"start": [75.69266999999999, 158.31065999999998], "end": [75.69266999999999, 155.51066], "type": "segment", "width": 0.15}, {"start": [75.69266999999999, 155.51066], "end": [77.09267, 155.51066], "type": "segment", "width": 0.15}, {"start": [77.09267, 155.51066], "end": [77.09267, 156.91065999999998], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "C1", "pos": [65.78817, 159.51416], "height": 1.0, "width": 1.0}, {"start": [67.36296999999999, 157.22816], "end": [67.36296999999999, 158.75216], "type": "segment", "width": 0.15}, {"start": [64.21337, 157.22816], "end": [64.21337, 158.75216], "type": "segment", "width": 0.15}, {"start": [64.21337, 158.75216], "end": [67.36296999999999, 158.75216], "type": "segment", "width": 0.15}, {"start": [64.21337, 157.22816], "end": [67.36296999999999, 157.22816], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "C3", "pos": [65.78817, 162.81616], "height": 1.0, "width": 1.0}, {"start": [64.83567, 161.80016], "end": [64.83567, 160.27616], "type": "segment", "width": 0.15}, {"start": [64.70867, 161.80016], "end": [64.70867, 160.27616], "type": "segment", "width": 0.15}, {"start": [64.58167, 161.80016], "end": [64.58167, 160.27616], "type": "segment", "width": 0.15}, {"start": [64.45467, 161.80016], "end": [64.45467, 160.27616], "type": "segment", "width": 0.15}, {"start": [64.32767, 161.80016], "end": [64.32767, 160.27616], "type": "segment", "width": 0.15}, {"start": [64.20067, 161.80016], "end": [64.20067, 160.27616], "type": "segment", "width": 0.15}, {"start": [67.37567, 161.80016], "end": [67.37567, 160.27616], "type": "segment", "width": 0.15}, {"start": [67.37567, 160.27616], "end": [64.20067, 160.27616], "type": "segment", "width": 0.15}, {"start": [67.37567, 161.80016], "end": [64.20067, 161.80016], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R9", "pos": [65.78817, 156.59315999999998], "height": 1.0, "width": 1.0}, {"start": [67.36296999999999, 154.43416], "end": [67.36296999999999, 155.95816], "type": "segment", "width": 0.15}, {"start": [64.21337, 154.43416], "end": [64.21337, 155.95816], "type": "segment", "width": 0.15}, {"start": [64.21337, 155.95816], "end": [67.36296999999999, 155.95816], "type": "segment", "width": 0.15}, {"start": [64.21337, 154.43416], "end": [67.36296999999999, 154.43416], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R10", "pos": [70.99517, 158.24416], "height": 1.0, "width": 1.0}, {"start": [72.56997, 155.76766], "end": [72.56997, 157.29165999999998], "type": "segment", "width": 0.15}, {"start": [69.42036999999999, 155.76766], "end": [69.42036999999999, 157.29165999999998], "type": "segment", "width": 0.15}, {"start": [69.42036999999999, 157.29165999999998], "end": [72.56997, 157.29165999999998], "type": "segment", "width": 0.15}, {"start": [69.42036999999999, 155.76766], "end": [72.56997, 155.76766], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "U2", "pos": [80.39317, 175.13515999999998], "height": 1.0, "width": 1.0}, {"start": [82.32967, 171.70116], "end": [82.32967, 173.40116], "type": "segment", "width": 0.15}, {"start": [82.32967, 173.40116], "end": [82.92967, 173.40116], "type": "segment", "width": 0.15}, {"start": [82.92967, 173.40116], "end": [82.92967, 171.70116], "type": "segment", "width": 0.15}, {"start": [80.02967, 171.70116], "end": [80.02967, 173.40116], "type": "segment", "width": 0.15}, {"start": [80.02967, 173.40116], "end": [80.62966999999999, 173.40116], "type": "segment", "width": 0.15}, {"start": [80.62966999999999, 173.40116], "end": [80.62966999999999, 171.80115999999998], "type": "segment", "width": 0.15}, {"start": [77.72967, 171.70116], "end": [77.72967, 173.40116], "type": "segment", "width": 0.15}, {"start": [77.72967, 173.40116], "end": [78.32967, 173.40116], "type": "segment", "width": 0.15}, {"start": [78.32967, 173.40116], "end": [78.32967, 171.70116], "type": "segment", "width": 0.15}, {"start": [78.82967, 167.90116], "end": [78.82967, 166.20116], "type": "segment", "width": 0.15}, {"start": [78.82967, 166.20116], "end": [81.72967, 166.20116], "type": "segment", "width": 0.15}, {"start": [81.72967, 166.20116], "end": [81.72967, 167.90116], "type": "segment", "width": 0.15}, {"start": [76.52967, 171.70116], "end": [84.12966999999999, 171.70116], "type": "segment", "width": 0.15}, {"start": [84.12966999999999, 171.70116], "end": [84.12966999999999, 167.90116], "type": "segment", "width": 0.15}, {"start": [84.12966999999999, 167.90116], "end": [76.52967, 167.90116], "type": "segment", "width": 0.15}, {"start": [76.52967, 167.90116], "end": [76.52967, 171.70116], "type": "segment", "width": 0.15}, {"angle": 0.0, "horiz_justify": 0, "text": "R11", "pos": [83.69516999999999, 143.13116], "height": 1.0, "width": 1.0}, {"start": [81.99337, 142.30566], "end": [81.99337, 140.78166], "type": "segment", "width": 0.15}, {"start": [85.14296999999999, 142.30566], "end": [85.14296999999999, 140.78166], "type": "segment", "width": 0.15}, {"start": [85.14296999999999, 140.78166], "end": [81.99337, 140.78166], "type": "segment", "width": 0.15}, {"start": [85.14296999999999, 142.30566], "end": [81.99337, 142.30566], "type": "segment", "width": 0.15}, {"angle": 90.0, "horiz_justify": 0, "text": "S1", "pos": [76.71016999999999, 164.84815999999998], "height": 1.0, "width": 1.0}, {"start": [73.37769, 164.84815999999998], "end": [73.37769, 163.34194], "type": "segment", "width": 0.15}, {"start": [73.37769, 163.34194], "end": [74.96265, 163.34194], "type": "segment", "width": 0.15}, {"start": [74.96265, 163.34194], "end": [74.96265, 166.35438], "type": "segment", "width": 0.15}, {"start": [74.96265, 166.35438], "end": [73.37769, 166.35438], "type": "segment", "width": 0.15}, {"start": [73.37769, 166.35438], "end": [73.37769, 164.84815999999998], "type": "segment", "width": 0.15}, {"start": [75.91515, 161.83318], "end": [75.91515, 167.88854], "type": "segment", "width": 0.15}, {"start": [75.91515, 167.88854], "end": [72.42519, 167.88854], "type": "segment", "width": 0.15}, {"start": [72.42519, 167.88854], "end": [72.42519, 161.79507999999998], "type": "segment", "width": 0.15}, {"start": [72.42519, 161.79507999999998], "end": [75.91515, 161.79507999999998], "type": "segment", "width": 0.15}, {"start": [75.91515, 161.79507999999998], "end": [75.91515, 161.83318], "type": "segment", "width": 0.15}]}, "edges_bbox": {"minx": 59.007169, "miny": 127.46015899999999, "maxx": 89.333171, "maxy": 177.598161}, "metadata": {"date": "2018-08-28 08:43:15", "company": "xPablo.cz", "revision": "A", "title": "RESP"}} /////////////////////////////////////////////// /////////////////////////////////////////////// /* PCB rendering code */ var redrawOnDrag = true; function deg2rad(deg) { return deg * Math.PI / 180; } function drawtext(ctx, scalefactor, text, color, flip) { ctx.save(); ctx.translate(...text.pos); angle = -text.angle; if (flip) { ctx.scale(-1, 1); angle = -angle; } txt = text.text.split("\n") ctx.rotate(deg2rad(angle)); ctx.scale(text.width, text.height); ctx.fillStyle = color; switch (text.horiz_justify) { case -1: ctx.textAlign = "left"; break; case 0: ctx.textAlign = "center"; break; case 1: ctx.textAlign = "right"; break; } for (i = 0; i < txt.length; i++) { offset = -(txt.length - 1) * 0.8 + i * 1.6; ctx.fillText(txt[i], 0, offset); } ctx.restore(); } function drawedge(ctx, scalefactor, edge, color) { ctx.strokeStyle = color; ctx.lineWidth = Math.max(1 / scalefactor, edge.width); ctx.lineCap = "round"; if (edge.type == "segment") { ctx.beginPath(); ctx.moveTo(...edge.start); ctx.lineTo(...edge.end); ctx.stroke(); } if (edge.type == "arc") { ctx.beginPath(); ctx.arc( ...edge.start, edge.radius, deg2rad(edge.startangle), deg2rad(edge.endangle)); ctx.stroke(); } if (edge.type == "circle") { ctx.beginPath(); ctx.arc( ...edge.start, edge.radius, 0, 2 * Math.PI); ctx.stroke(); } } function drawOblong(ctx, scalefactor, color, size) { ctx.beginPath(); ctx.strokeStyle = color; ctx.lineCap = "round"; if (size[0] > size[1]) { ctx.lineWidth = size[1]; var from = [-size[0] / 2 + size[1] / 2, 0]; var to = [-from[0], 0]; } else { ctx.lineWidth = size[0]; var from = [0, -size[1] / 2 + size[0] / 2]; var to = [0, -from[1]]; } ctx.moveTo(...from); ctx.lineTo(...to); ctx.stroke(); } function drawRoundRect(ctx, scalefactor, color, size, radius) { ctx.beginPath(); ctx.strokeStyle = color; x = size[0] * -0.5; y = size[1] * -0.5; width = size[0]; height = size[1]; ctx.moveTo(x, 0); ctx.arcTo(x, y + height, x + width, y + height, radius); ctx.arcTo(x + width, y + height, x + width, y, radius); ctx.arcTo(x + width, y, x, y, radius); ctx.arcTo(x, y, x, y + height, radius); ctx.closePath(); ctx.fill(); } function drawPolygons(ctx, scalefactor, color, polygons) { ctx.fillStyle = color; for (polygon of polygons) { ctx.beginPath(); for (vertex of polygon) { ctx.lineTo(...vertex) } ctx.closePath(); ctx.fill(); } } function drawPolygonShape(ctx, scalefactor, shape, color) { ctx.save(); ctx.translate(...shape.pos); ctx.rotate(deg2rad(-shape.angle)); drawPolygons(ctx, scalefactor, color, shape.polygons); ctx.restore(); } function drawDrawing(ctx, layer, scalefactor, drawing, color) { if (["segment", "arc", "circle"].includes(drawing.type)) { drawedge(ctx, scalefactor, drawing, color); } else if (drawing.type == "polygon") { drawPolygonShape(ctx, scalefactor, drawing, color); } else { drawtext(ctx, scalefactor, drawing, color, layer == "B"); } } function drawModule(ctx, layer, scalefactor, module, highlight) { var padcolor = "#808080"; if (highlight) { padcolor = "#D04040"; // draw bounding box if (module.layer == layer) { ctx.save(); ctx.globalAlpha = 0.2; ctx.translate(...module.bbox.pos); ctx.fillStyle = "#D04040"; ctx.fillRect( 0, 0, ...module.bbox.size); ctx.globalAlpha = 1; ctx.strokeStyle = "#D04040"; ctx.lineWidth = 2 / scalefactor; ctx.strokeRect( 0, 0, ...module.bbox.size); ctx.restore(); } } // draw drawings for (drawing of module.drawings) { if (drawing.layer == layer) { drawDrawing(ctx, layer, scalefactor, drawing.drawing, padcolor); } } // draw pads for (pad of module.pads) { if (pad.layers.includes(layer)) { ctx.save(); ctx.translate(...pad.pos); ctx.rotate(deg2rad(pad.angle)); ctx.fillStyle = padcolor; if (pad.shape == "rect") { ctx.fillRect( ...pad.size.map(c => -c * 0.5), ...pad.size); } else if (pad.shape == "oval") { drawOblong(ctx, scalefactor, padcolor, pad.size) } else if (pad.shape == "circle") { ctx.beginPath(); ctx.arc(0, 0, pad.size[0] / 2, 0, 2 * Math.PI); ctx.fill(); } else if (pad.shape == "roundrect") { drawRoundRect(ctx, scalefactor, padcolor, pad.size, pad.radius) } else if (pad.shape == "custom") { drawPolygons(ctx, scalefactor, padcolor, pad.polygons) } if (pad.type == "th") { if (pad.drillshape == "oblong") { drawOblong(ctx, scalefactor, "#CCCCCC", pad.drillsize) } else { ctx.fillStyle = "#CCCCCC" ctx.beginPath(); ctx.arc(0, 0, pad.drillsize[0] / 2, 0, 2 * Math.PI); ctx.fill(); } } ctx.restore(); } } } function drawEdges(canvas, scalefactor) { var ctx = canvas.getContext("2d"); var edgecolor = getComputedStyle(topmostdiv).getPropertyValue('--pcb-edge-color'); for (edge of pcbdata.edges) { drawedge(ctx, scalefactor, edge, edgecolor); } } function drawModules(canvas, layer, scalefactor, highlightedRefs) { var ctx = canvas.getContext("2d"); for (i in pcbdata.modules) { var mod = pcbdata.modules[i]; var highlight = highlightedRefs.includes(mod.ref); if (highlightedRefs.length == 0 || highlight) { drawModule(ctx, layer, scalefactor, mod, highlight); } } } function drawSilkscreen(canvas, layer, scalefactor) { var ctx = canvas.getContext("2d"); for (d of pcbdata.silkscreen[layer]) { if (["segment", "arc", "circle"].includes(d.type)) { drawedge(ctx, scalefactor, d, "#aa4"); } else if (d.type == "polygon") { drawPolygonShape(ctx, scalefactor, d, "#4aa"); } else { drawtext(ctx, scalefactor, d, "#4aa", layer == "B"); } } } function clearCanvas(canvas) { var ctx = canvas.getContext("2d"); ctx.save(); ctx.setTransform(1, 0, 0, 1, 0, 0); ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.restore(); } function drawHighlightsOnLayer(canvasdict) { clearCanvas(canvasdict.highlight); drawModules(canvasdict.highlight, canvasdict.layer, canvasdict.transform.s, highlightedRefs); } function drawHighlights() { drawHighlightsOnLayer(allcanvas.front); drawHighlightsOnLayer(allcanvas.back); } function drawBackground(canvasdict) { clearCanvas(canvasdict.bg); clearCanvas(canvasdict.silk); drawEdges(canvasdict.bg, canvasdict.transform.s); drawModules(canvasdict.bg, canvasdict.layer, canvasdict.transform.s, []); drawSilkscreen(canvasdict.silk, canvasdict.layer, canvasdict.transform.s); } function prepareCanvas(canvas, flip, transform) { var ctx = canvas.getContext("2d"); ctx.setTransform(1, 0, 0, 1, 0, 0); fontsize = 1.55; ctx.font = "bold " + fontsize + "px Consolas,\"DejaVu Sans Mono\",Monaco,monospace"; ctx.textBaseline = "middle"; ctx.scale(transform.zoom, transform.zoom); ctx.translate(transform.panx, transform.pany); if (flip) { ctx.scale(-1, 1); } ctx.translate(transform.x, transform.y); ctx.scale(transform.s, transform.s); } function prepareLayer(canvasdict) { var flip = (canvasdict.layer == "B"); for (c of ["bg", "silk", "highlight"]) { prepareCanvas(canvasdict[c], flip, canvasdict.transform); } } function recalcLayerScale(canvasdict) { canvasdivid = { "F": "frontcanvas", "B": "backcanvas" }[canvasdict.layer]; var width = document.getElementById(canvasdivid).clientWidth * 2; var height = document.getElementById(canvasdivid).clientHeight * 2; var bbox = pcbdata.edges_bbox; var scalefactor = 0.98 * Math.min( width / (bbox.maxx - bbox.minx), height / (bbox.maxy - bbox.miny) ); if (scalefactor < 0.1) { scalefactor = 1; } canvasdict.transform.s = scalefactor; var flip = (canvasdict.layer == "B"); if (flip) { canvasdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor + width) * 0.5; } else { canvasdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor - width) * 0.5; } canvasdict.transform.y = -((bbox.maxy + bbox.miny) * scalefactor - height) * 0.5; for (c of ["bg", "silk", "highlight"]) { canvas = canvasdict[c]; canvas.width = width; canvas.height = height; canvas.style.width = (width / 2) + "px"; canvas.style.height = (height / 2) + "px"; } console.log("Scale factor " + canvasdivid + ": ", canvasdict.transform); } function redrawCanvas(layerdict) { prepareLayer(layerdict); drawBackground(layerdict); drawHighlights(layerdict); } function resizeCanvas(layerdict) { recalcLayerScale(layerdict); redrawCanvas(layerdict); } function resizeAll() { resizeCanvas(allcanvas.front); resizeCanvas(allcanvas.back); } function bboxScan(layer, x, y) { var result = []; for (var i in pcbdata.modules) { var module = pcbdata.modules[i]; if (module.layer == layer) { var b = module.bbox; if (b.pos[0] <= x && b.pos[0] + b.size[0] >= x && b.pos[1] <= y && b.pos[1] + b.size[1] >= y) { result.push(module.ref); } } } return result; } function handleMouseDown(e, layerdict) { if (e.which != 1) { return; } e.preventDefault(); e.stopPropagation(); layerdict.transform.mousestartx = e.offsetX; layerdict.transform.mousestarty = e.offsetY; layerdict.transform.mousedownx = e.offsetX; layerdict.transform.mousedowny = e.offsetY; layerdict.transform.mousedown = true; } function handleMouseClick(e, layerdict) { var x = e.offsetX; var y = e.offsetY; var t = layerdict.transform; if (layerdict.layer == "B") { x = (2 * x / t.zoom - t.panx + t.x) / -t.s; } else { x = (2 * x / t.zoom - t.panx - t.x) / t.s; } y = (2 * y / t.zoom - t.y - t.pany) / t.s; var reflist = bboxScan(layerdict.layer, x, y); if (reflist.length > 0) { modulesClicked(reflist); } } function handleMouseUp(e, layerdict) { e.preventDefault(); e.stopPropagation(); if (e.which == 1 && layerdict.transform.mousedown && layerdict.transform.mousedownx == e.offsetX && layerdict.transform.mousedowny == e.offsetY) { // This is just a click handleMouseClick(e, layerdict); } layerdict.transform.mousedown = false; if (e.which == 3) { // Reset pan and zoom on right click. layerdict.transform.panx = 0; layerdict.transform.pany = 0; layerdict.transform.zoom = 1; } redrawCanvas(layerdict); } function handleMouseMove(e, layerdict) { if (!layerdict.transform.mousedown) { return; } e.preventDefault(); e.stopPropagation(); dx = e.offsetX - layerdict.transform.mousestartx; dy = e.offsetY - layerdict.transform.mousestarty; layerdict.transform.panx += 2 * dx / layerdict.transform.zoom; layerdict.transform.pany += 2 * dy / layerdict.transform.zoom; layerdict.transform.mousestartx = e.offsetX; layerdict.transform.mousestarty = e.offsetY; if (redrawOnDrag) { redrawCanvas(layerdict); } } function handleMouseWheel(e, layerdict) { e.preventDefault(); e.stopPropagation(); var t = layerdict.transform; var wheeldelta = e.deltaY; if (e.deltaMode == 1) { // FF only, scroll by lines wheeldelta *= 30; } else if (e.deltaMode == 2) { wheeldelta *= 300; } var m = Math.pow(1.1, -wheeldelta / 40); // Limit amount of zoom per tick. if (m > 2) { m = 2; } else if (m < 0.5) { m = 0.5; } t.zoom *= m; var zoomd = (1 - m) / t.zoom; t.panx += 2 * e.offsetX * zoomd; t.pany += 2 * e.offsetY * zoomd; redrawCanvas(layerdict); console.log(layerdict.transform.zoom); } function addMouseHandlers(div, layerdict) { div.onmousedown = function(e) { handleMouseDown(e, layerdict); }; div.onmousemove = function(e) { handleMouseMove(e, layerdict); }; div.onmouseup = function(e) { handleMouseUp(e, layerdict); }; div.onmouseout = function(e) { handleMouseUp(e, layerdict); } div.onwheel = function(e) { handleMouseWheel(e, layerdict); } for (element of [div, layerdict.bg, layerdict.silk, layerdict.highlight]) { element.addEventListener("contextmenu", function(e) { e.preventDefault(); }, false); } } function setRedrawOnDrag(value) { redrawOnDrag = value; writeStorage("redrawOnDrag", value); } function initRender() { allcanvas = { front: { transform: { x: 0, y: 0, s: 1, panx: 0, pany: 0, zoom: 1, mousestartx: 0, mousestarty: 0, mousedown: false, }, bg: document.getElementById("F_bg"), silk: document.getElementById("F_slk"), highlight: document.getElementById("F_hl"), layer: "F", }, back: { transform: { x: 0, y: 0, s: 1, panx: 0, pany: 0, zoom: 1, mousestartx: 0, mousestarty: 0, mousedown: false, }, bg: document.getElementById("B_bg"), silk: document.getElementById("B_slk"), highlight: document.getElementById("B_hl"), layer: "B", } }; addMouseHandlers(document.getElementById("frontcanvas"), allcanvas.front); addMouseHandlers(document.getElementById("backcanvas"), allcanvas.back); } /////////////////////////////////////////////// /////////////////////////////////////////////// /* DOM manipulation and misc code */ var storagePrefix = 'KiCad_HTML_BOM__' + pcbdata.metadata.title + '__' + pcbdata.metadata.revision + '__'; var bomsplit; var canvassplit; var canvaslayout = "default"; var bomlayout = "default"; var currentHighlightedRowId; var highlightHandlers = []; var highlightedRefs = []; var checkboxes = []; var bomCheckboxes = ""; var storage; var lastClickedRef; function initStorage(key) { try { window.localStorage.getItem("blank"); storage = window.localStorage; } catch (e) { // localStorage not available } if (!storage) { try { window.sessionStorage.getItem("blank"); storage = window.sessionStorage; } catch (e) { // sessionStorage also not available } } } function readStorage(key) { if (storage) { return storage.getItem(storagePrefix + '#' + key); } else { return null; } } function writeStorage(key, value) { if (storage) { storage.setItem(storagePrefix + '#' + key, value); } } function dbg(html) { dbgdiv.innerHTML = html; } function setDarkMode(value) { if (value) { topmostdiv.classList.add("dark"); } else { topmostdiv.classList.remove("dark"); } writeStorage("darkmode", value); redrawCanvas(allcanvas.front); redrawCanvas(allcanvas.back); } function getStoredCheckboxRefs(checkbox) { existingRefs = readStorage("checkbox_" + checkbox); if (!existingRefs) { refsSet = new Set(); } else { refsSet = new Set(existingRefs.split(",")); } return refsSet; } function setBomCheckboxState(checkbox, element, references) { var storedRefsSet = getStoredCheckboxRefs(checkbox); var currentRefsSet = new Set(references); // Get difference of current - stored var difference = new Set(currentRefsSet); for (ref of storedRefsSet) { difference.delete(ref); } if (difference.size == 0) { // All the current refs are stored element.checked = true; } else if (difference.size == currentRefsSet.size) { // None of the current refs are stored element.checked = false; } else { // Some of the refs are stored element.checked = false; element.indeterminate = true; } } function createCheckboxChangeHandler(checkbox, references) { return function() { refsSet = getStoredCheckboxRefs(checkbox); if (this.checked) { // checkbox ticked for (ref of references) { refsSet.add(ref); } } else { // checkbox unticked for (ref of references) { refsSet.delete(ref); } } writeStorage("checkbox_" + checkbox, [...refsSet].join(",")); } } function createRowHighlightHandler(rowid, refs) { return function() { if (currentHighlightedRowId) { if (currentHighlightedRowId == rowid) { return; } document.getElementById(currentHighlightedRowId).classList.remove("highlighted"); } document.getElementById(rowid).classList.add("highlighted"); currentHighlightedRowId = rowid; highlightedRefs = refs; drawHighlights(); } } function entryMatches(entry) { // check refs for (ref of entry[3]) { if (ref.toLowerCase().indexOf(filter) >= 0) { return true; } } // check value if (entry[1].toLowerCase().indexOf(filter) >= 0) { return true; } // check footprint if (entry[2].toLowerCase().indexOf(filter) >= 0) { return true; } return false; } function findRefInEntry(entry) { for (ref of entry[3]) { if (ref.toLowerCase() == reflookup) { return [ref]; } } return false; } function highlightFilter(s) { if (!filter) { return s; } var parts = s.toLowerCase().split(filter); if (parts.length == 1) { return s; } var r = ""; var pos = 0; for (var i in parts) { if (i > 0) { r += '<mark class="highlight">' + s.substring(pos, pos + filter.length) + '</mark>'; pos += filter.length; } r += s.substring(pos, pos + parts[i].length); pos += parts[i].length; } return r; } function populateBomHeader() { var tr = document.createElement("TR"); var td = document.createElement("TH"); td.classList.add("numCol"); tr.appendChild(td); checkboxes = bomCheckboxes.split(","); for (checkbox of checkboxes) { if (checkbox) { td = document.createElement("TH"); td.classList.add("bom-checkbox"); td.innerHTML = checkbox; tr.appendChild(td); } } td = document.createElement("TH"); td.classList.add("References"); td.innerHTML = "References"; tr.appendChild(td); td = document.createElement("TH"); td.classList.add("Value"); td.innerHTML = "Value"; tr.appendChild(td); td = document.createElement("TH"); td.classList.add("Footprint"); td.innerHTML = "Footprint"; tr.appendChild(td); td = document.createElement("TH"); td.classList.add("Quantity"); td.innerHTML = "Quantity"; tr.appendChild(td); bomhead.appendChild(tr); } function populateBomBody() { highlightHandlers = []; currentHighlightedRowId = null; var first = true; switch (canvaslayout) { case 'F': bomtable = pcbdata.bom.F; break; case 'FB': bomtable = pcbdata.bom.both; break; case 'B': bomtable = pcbdata.bom.B; break; } for (var i in bomtable) { var bomentry = bomtable[i]; if (filter && !entryMatches(bomentry)) { continue; } references = bomentry[3]; if (reflookup) { references = findRefInEntry(bomentry); if (!references) { continue; } } var tr = document.createElement("TR"); var td = document.createElement("TD"); var rownum = +i + 1; tr.id = "bomrow" + rownum; td.textContent = rownum; tr.appendChild(td); // Checkboxes for (checkbox of checkboxes) { if (checkbox) { td = document.createElement("TD"); input = document.createElement("input"); input.type = "checkbox"; input.onchange = createCheckboxChangeHandler(checkbox, references); setBomCheckboxState(checkbox, input, references); td.appendChild(input); tr.appendChild(td); } } // References td = document.createElement("TD"); td.innerHTML = highlightFilter(references.join(", ")); tr.appendChild(td); // Value td = document.createElement("TD"); td.innerHTML = highlightFilter(bomentry[1]); tr.appendChild(td); // Footprint td = document.createElement("TD"); td.innerHTML = highlightFilter(bomentry[2]); tr.appendChild(td); // Quantity td = document.createElement("TD"); td.textContent = bomentry[3].length; tr.appendChild(td); bom.appendChild(tr); var handler = createRowHighlightHandler(tr.id, references); tr.onmousemove = handler; highlightHandlers.push({ id: tr.id, handler: handler, refs: references }); if ((filter || reflookup) && first) { highlightedRefs = references; drawHighlights(); first = false; } } } function smoothScrollToRow(rowid) { document.getElementById(rowid).scrollIntoView({ behavior: "smooth", block: "center", inline: "nearest" });} function highlightPreviousRow() { if (!currentHighlightedRowId) { highlightHandlers[highlightHandlers.length - 1].handler(); } else { if (highlightHandlers.length > 1 && highlightHandlers[0].id == currentHighlightedRowId) { highlightHandlers[highlightHandlers.length - 1].handler(); } else { for (var i = 0; i < highlightHandlers.length - 1; i++) { if (highlightHandlers[i + 1].id == currentHighlightedRowId) { highlightHandlers[i].handler(); break; } } } } smoothScrollToRow(currentHighlightedRowId); } function highlightNextRow() { if (!currentHighlightedRowId) { highlightHandlers[0].handler(); } else { if (highlightHandlers.length > 1 && highlightHandlers[highlightHandlers.length - 1].id == currentHighlightedRowId) { highlightHandlers[0].handler(); } else { for (var i = 1; i < highlightHandlers.length; i++) { if (highlightHandlers[i - 1].id == currentHighlightedRowId) { highlightHandlers[i].handler(); break; } } } } smoothScrollToRow(currentHighlightedRowId); } function populateBomTable() { while (bom.firstChild) { bom.removeChild(bom.firstChild); } while (bomhead.firstChild) { bomhead.removeChild(bomhead.firstChild); } populateBomHeader(); populateBomBody(); } function modulesClicked(references) { var lastClickedIndex = references.indexOf(lastClickedRef); var ref = references[(lastClickedIndex + 1) % references.length]; for (var handler of highlightHandlers) { if (handler.refs.indexOf(ref) >= 0) { lastClickedRef = ref; handler.handler(); smoothScrollToRow(currentHighlightedRowId); break; } } } function updateFilter(input) { filter = input.toLowerCase(); populateBomTable(); } function updateRefLookup(input) { reflookup = input.toLowerCase(); populateBomTable(); } function silkscreenVisible(visible) { if (visible) { allcanvas.front.silk.style.display = ""; allcanvas.back.silk.style.display = ""; writeStorage("silkscreenVisible", true); } else { allcanvas.front.silk.style.display = "none"; allcanvas.back.silk.style.display = "none"; writeStorage("silkscreenVisible", false); } } function changeCanvasLayout(layout) { document.getElementById("fl-btn").classList.remove("depressed"); document.getElementById("fb-btn").classList.remove("depressed"); document.getElementById("bl-btn").classList.remove("depressed"); switch (layout) { case 'F': document.getElementById("fl-btn").classList.add("depressed"); if (bomlayout != "BOM") { canvassplit.collapse(1); } break; case 'B': document.getElementById("bl-btn").classList.add("depressed"); if (bomlayout != "BOM") { canvassplit.collapse(0); } break; default: document.getElementById("fb-btn").classList.add("depressed"); if (bomlayout != "BOM") { canvassplit.setSizes([50, 50]); } } canvaslayout = layout; writeStorage("canvaslayout", layout); resizeAll(); populateBomTable(); } function populateMetadata() { document.getElementById("title").innerHTML = pcbdata.metadata.title; document.getElementById("revision").innerHTML = "Rev: " + pcbdata.metadata.revision; document.getElementById("company").innerHTML = pcbdata.metadata.company; document.getElementById("filedate").innerHTML = pcbdata.metadata.date; if (pcbdata.metadata.title != "") { document.title = pcbdata.metadata.title + " BOM"; } } function changeBomLayout(layout) { document.getElementById("bom-btn").classList.remove("depressed"); document.getElementById("lr-btn").classList.remove("depressed"); document.getElementById("tb-btn").classList.remove("depressed"); switch (layout) { case 'BOM': document.getElementById("bom-btn").classList.add("depressed"); if (bomsplit) { bomsplit.destroy(); bomsplit = null; canvassplit.destroy(); canvassplit = null; } document.getElementById("frontcanvas").style.display = "none"; document.getElementById("backcanvas").style.display = "none"; document.getElementById("bot").style.height = ""; break; case 'TB': document.getElementById("tb-btn").classList.add("depressed"); document.getElementById("frontcanvas").style.display = ""; document.getElementById("backcanvas").style.display = ""; document.getElementById("bot").style.height = "calc(100% - 80px)"; document.getElementById("bomdiv").classList.remove("split-horizontal"); document.getElementById("canvasdiv").classList.remove("split-horizontal"); document.getElementById("frontcanvas").classList.add("split-horizontal"); document.getElementById("backcanvas").classList.add("split-horizontal"); if (bomsplit) { bomsplit.destroy(); bomsplit = null; canvassplit.destroy(); canvassplit = null; } bomsplit = Split(['#bomdiv', '#canvasdiv'], { sizes: [50, 50], onDragEnd: resizeAll, direction: "vertical", gutterSize: 5 }); canvassplit = Split(['#frontcanvas', '#backcanvas'], { sizes: [50, 50], gutterSize: 5, onDragEnd: resizeAll }); break; case 'LR': document.getElementById("lr-btn").classList.add("depressed"); document.getElementById("frontcanvas").style.display = ""; document.getElementById("backcanvas").style.display = ""; document.getElementById("bot").style.height = "calc(100% - 80px)"; document.getElementById("bomdiv").classList.add("split-horizontal"); document.getElementById("canvasdiv").classList.add("split-horizontal"); document.getElementById("frontcanvas").classList.remove("split-horizontal"); document.getElementById("backcanvas").classList.remove("split-horizontal"); if (bomsplit) { bomsplit.destroy(); bomsplit = null; canvassplit.destroy(); canvassplit = null; } bomsplit = Split(['#bomdiv', '#canvasdiv'], { sizes: [50, 50], onDragEnd: resizeAll, gutterSize: 5 }); canvassplit = Split(['#frontcanvas', '#backcanvas'], { sizes: [50, 50], gutterSize: 5, direction: "vertical", onDragEnd: resizeAll }); } bomlayout = layout; writeStorage("bomlayout", layout); changeCanvasLayout(canvaslayout); } function focusInputField(input) { input.scrollIntoView(false); input.focus(); input.select(); } function focusFilterField() { focusInputField(document.getElementById("filter")); } function focusRefLookupField() { focusInputField(document.getElementById("reflookup")); } function toggleBomCheckbox(bomrowid, checkboxnum) { if (!bomrowid || checkboxnum > checkboxes.length) { return; } var bomrow = document.getElementById(bomrowid); var checkbox = bomrow.childNodes[checkboxnum].childNodes[0]; checkbox.checked = !checkbox.checked; checkbox.indeterminate = false; checkbox.onchange(); } function removeGutterNode(node) { for (var i = 0; i < node.childNodes.length; i++) { if (node.childNodes[i].classList && node.childNodes[i].classList.contains("gutter")) { node.removeChild(node.childNodes[i]); break; } } } function cleanGutters() { removeGutterNode(document.getElementById("bot")); removeGutterNode(document.getElementById("canvasdiv")); } function setBomCheckboxes(value) { bomCheckboxes = value; writeStorage("bomCheckboxes", value); populateBomTable(); } document.onkeydown = function(e) { switch (e.key) { case "ArrowUp": highlightPreviousRow(); e.preventDefault(); break; case "ArrowDown": highlightNextRow(); e.preventDefault(); break; default: break; } if (e.altKey) { switch (e.key) { case "f": focusFilterField(); e.preventDefault(); break; case "r": focusRefLookupField(); e.preventDefault(); break; case "z": changeBomLayout("BOM"); e.preventDefault(); break; case "x": changeBomLayout("LR"); e.preventDefault(); break; case "c": changeBomLayout("TB"); e.preventDefault(); break; case "v": changeCanvasLayout("F"); e.preventDefault(); break; case "b": changeCanvasLayout("FB"); e.preventDefault(); break; case "n": changeCanvasLayout("B"); e.preventDefault(); break; default: break; } if (e.key >= '1' && e.key <= '9') { toggleBomCheckbox(currentHighlightedRowId, parseInt(e.key)); } } } window.onload = function(e) { initStorage(); cleanGutters(); initRender(); dbgdiv = document.getElementById("dbg"); bom = document.getElementById("bombody"); bomhead = document.getElementById("bomhead"); bomlayout = readStorage("bomlayout"); if (!bomlayout) { bomlayout = "LR"; } canvaslayout = readStorage("canvaslayout"); if (!canvaslayout) { canvaslayout = "FB"; } filter = ""; reflookup = ""; populateMetadata(); bomCheckboxes = readStorage("bomCheckboxes"); if (bomCheckboxes === null) { bomCheckboxes = "Sourced,Placed"; } document.getElementById("bomCheckboxes").value = bomCheckboxes; if (readStorage("silkscreenVisible") === "false") { document.getElementById("silkscreenCheckbox").checked = false; silkscreenVisible(false); } if (readStorage("redrawOnDrag") === "false") { document.getElementById("dragCheckbox").checked = false; setRedrawOnDrag(false); } if (readStorage("darkmode") === "true") { document.getElementById("darkmodeCheckbox").checked = true; setDarkMode(true); } // Triggers render changeBomLayout(bomlayout); } window.onresize = resizeAll; window.matchMedia("print").addListener(resizeAll); /////////////////////////////////////////////// </script> </head> <body> <div id="topmostdiv" style="width: 100%; height: 100%"> <div id="top"> <div style="float: right;"> <div class="hideonprint menu" style="float: right; margin: 10px; top: 8px;"> <button class="menubtn"></button> <div class="menu-content"> <label class="menu-label menu-label-top"> <input id="darkmodeCheckbox" type="checkbox" onchange="setDarkMode(this.checked)"> Dark mode </label> <label class="menu-label"> <input id="silkscreenCheckbox" type="checkbox" checked onchange="silkscreenVisible(this.checked)"> Show silkscreen </label> <label class="menu-label"> <input id="dragCheckbox" type="checkbox" checked onchange="setRedrawOnDrag(this.checked)"> Continuous redraw on drag </label> <label class="menu-label"> <div style="margin-left: 5px">Bom checkboxes</div> <input id="bomCheckboxes" class="menu-textbox" type=text oninput="setBomCheckboxes(this.value)"> </label> </div> </div> <div class="button-container hideonprint" style="float: right; margin: 10px; position: relative; top: 8px"> <button id="fl-btn" class="left-most-button" onclick="changeCanvasLayout('F')" title="Front only">F </button> <button id="fb-btn" class="middle-button" onclick="changeCanvasLayout('FB')" title="Front and Back">FB </button> <button id="bl-btn" class="right-most-button" onclick="changeCanvasLayout('B')" title="Back only">B </button> </div> <div class="button-container hideonprint" style="float: right; margin: 10px; position: relative; top: 8px"> <button id="bom-btn" class="left-most-button" onclick="changeBomLayout('BOM')" title="BOM only"></button> <button id="lr-btn" class="middle-button" onclick="changeBomLayout('LR')" title="BOM left, drawings right"></button> <button id="tb-btn" class="right-most-button" onclick="changeBomLayout('TB')" title="BOM top, drawings bot"></button> </div> </div> <div id="fileinfodiv" style="overflow: auto;"> <table class="fileinfo"> <tbody> <tr> <td id="title" class="title" style="width: 70%"> Title </td> <td id="revision" class="title" style="width: 30%"> Revision </td> </tr> <tr> <td id="company"> Kicad version </td> <td id="filedate"> Date </td> </tr> </tbody> </table> </div> </div> <div id="bot" class="split" style="height: calc(100% - 80px)"> <div id="bomdiv" class="split split-horizontal"> <div style="width: 100%"> <input id="reflookup" class="searchbox reflookup hideonprint" type="text" placeholder="Ref lookup" oninput="updateRefLookup(this.value)"> <input id="filter" class="searchbox filter hideonprint" type="text" placeholder="Filter" oninput="updateFilter(this.value)"> </div> <div id="dbg"></div> <table class="bom"> <thead id="bomhead"> </thead> <tbody id="bombody"> </tbody> </table> </div> <div id="canvasdiv" class="split split-horizontal"> <div id="frontcanvas" class="split" style="overflow: hidden"> <div style="position: relative; width: 100%; height: 100%;"> <canvas id="F_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas> <canvas id="F_slk" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas> <canvas id="F_hl" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas> </div> </div> <div id="backcanvas" class="split" style="overflow: hidden"> <div style="position: relative; width: 100%; height: 100%;"> <canvas id="B_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas> <canvas id="B_slk" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas> <canvas id="B_hl" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas> </div> </div> </div> </div> </div> </body> </html>