ibom.html - reform - MNT Reform: Open Source Portable Computer

ibom.html (158851B)
      1 <!DOCTYPE html>
      2 <html lang="en">
      3 
      4 <head>
      5   <meta charset="UTF-8">
      6   <meta name="viewport" content="width=device-width, initial-scale=1.0">
      7   <title>Interactive BOM for KiCAD</title>
      8   <style type="text/css">
      9 :root {
     10   --pcb-edge-color: black;
     11   --pad-color: #878787;
     12   --pad-color-highlight: #D04040;
     13   --pin1-outline-color: #ffb629;
     14   --pin1-outline-color-highlight: #b4ff03;
     15   --silkscreen-edge-color: #aa4;
     16   --silkscreen-polygon-color: #4aa;
     17   --silkscreen-text-color: #4aa;
     18   --fabrication-edge-color: #907651;
     19   --fabrication-polygon-color: #907651;
     20   --fabrication-text-color: #a27c24;
     21   --track-color: #def5f1;
     22   --track-color-highlight: #D04040;
     23   --zone-color: #def5f1;
     24   --zone-color-highlight: #d0404080;
     25 }
     26 
     27 html, body {
     28   margin: 0px;
     29   height: 100%;
     30   font-family: Verdana, sans-serif;
     31 }
     32 
     33 .dark.topmostdiv {
     34   --pcb-edge-color: #eee;
     35   --pad-color: #808080;
     36   --pin1-outline-color: #ffa800;
     37   --pin1-outline-color-highlight: #ccff00;
     38   --track-color: #42524f;
     39   --zone-color: #42524f;
     40   background-color: #252c30;
     41   color: #eee;
     42 }
     43 
     44 button {
     45   background-color: #eee;
     46   border: 1px solid #888;
     47   color: black;
     48   height: 44px;
     49   width: 44px;
     50   text-align: center;
     51   text-decoration: none;
     52   display: inline-block;
     53   font-size: 14px;
     54   font-weight: bolder;
     55 }
     56 
     57 .dark button {
     58   /* This will be inverted */
     59   background-color: #c3b7b5;
     60 }
     61 
     62 button.depressed {
     63   background-color: #0a0;
     64   color: white;
     65 }
     66 
     67 .dark button.depressed {
     68   /* This will be inverted */
     69   background-color: #b3b;
     70 }
     71 
     72 button:focus {
     73   outline: 0;
     74 }
     75 
     76 button#tb-btn {
     77   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.47 8.47'%3E%3Crect transform='translate(0 -288.53)' ry='1.17' y='288.8' x='.27' height='7.94' width='7.94' fill='%23f9f9f9'/%3E%3Cg transform='translate(0 -288.53)'%3E%3Crect width='7.94' height='7.94' x='.27' y='288.8' ry='1.17' fill='none' stroke='%23000' stroke-width='.4' stroke-linejoin='round'/%3E%3Cpath d='M1.32 290.12h5.82M1.32 291.45h5.82' fill='none' stroke='%23000' stroke-width='.4'/%3E%3Cpath d='M4.37 292.5v4.23M.26 292.63H8.2' fill='none' stroke='%23000' stroke-width='.3'/%3E%3Ctext font-weight='700' font-size='3.17' font-family='sans-serif'%3E%3Ctspan x='1.35' y='295.73'%3EF%3C/tspan%3E%3Ctspan x='5.03' y='295.68'%3EB%3C/tspan%3E%3C/text%3E%3C/g%3E%3C/svg%3E%0A");
     78 }
     79 
     80 button#lr-btn {
     81   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.47 8.47'%3E%3Crect transform='translate(0 -288.53)' ry='1.17' y='288.8' x='.27' height='7.94' width='7.94' fill='%23f9f9f9'/%3E%3Cg transform='translate(0 -288.53)'%3E%3Crect width='7.94' height='7.94' x='.27' y='288.8' ry='1.17' fill='none' stroke='%23000' stroke-width='.4' stroke-linejoin='round'/%3E%3Cpath d='M1.06 290.12H3.7m-2.64 1.33H3.7m-2.64 1.32H3.7m-2.64 1.3H3.7m-2.64 1.33H3.7' fill='none' stroke='%23000' stroke-width='.4'/%3E%3Cpath d='M4.37 288.8v7.94m0-4.11h3.96' fill='none' stroke='%23000' stroke-width='.3'/%3E%3Ctext font-weight='700' font-size='3.17' font-family='sans-serif'%3E%3Ctspan x='5.11' y='291.96'%3EF%3C/tspan%3E%3Ctspan x='5.03' y='295.68'%3EB%3C/tspan%3E%3C/text%3E%3C/g%3E%3C/svg%3E%0A");
     82 }
     83 
     84 button#bom-btn {
     85   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.47 8.47'%3E%3Crect transform='translate(0 -288.53)' ry='1.17' y='288.8' x='.27' height='7.94' width='7.94' fill='%23f9f9f9'/%3E%3Cg transform='translate(0 -288.53)' fill='none' stroke='%23000' stroke-width='.4'%3E%3Crect width='7.94' height='7.94' x='.27' y='288.8' ry='1.17' stroke-linejoin='round'/%3E%3Cpath d='M1.59 290.12h5.29M1.59 291.45h5.33M1.59 292.75h5.33M1.59 294.09h5.33M1.59 295.41h5.33'/%3E%3C/g%3E%3C/svg%3E");
     86 }
     87 
     88 button#bom-grouped-btn {
     89   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cg stroke='%23000' stroke-linejoin='round' class='layer'%3E%3Crect width='29' height='29' x='1.5' y='1.5' stroke-width='2' fill='%23fff' rx='5' ry='5'/%3E%3Cpath stroke-linecap='square' stroke-width='2' d='M6 10h4m4 0h5m4 0h3M6.1 22h3m3.9 0h5m4 0h4m-16-8h4m4 0h4'/%3E%3Cpath stroke-linecap='null' d='M5 17.5h22M5 26.6h22M5 5.5h22'/%3E%3C/g%3E%3C/svg%3E");
     90 }
     91 
     92 button#bom-ungrouped-btn {
     93   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cg stroke='%23000' stroke-linejoin='round' class='layer'%3E%3Crect width='29' height='29' x='1.5' y='1.5' stroke-width='2' fill='%23fff' rx='5' ry='5'/%3E%3Cpath stroke-linecap='square' stroke-width='2' d='M6 10h4m-4 8h3m-3 8h4'/%3E%3Cpath stroke-linecap='null' d='M5 13.5h22m-22 8h22M5 5.5h22'/%3E%3C/g%3E%3C/svg%3E");
     94 }
     95 
     96 button#bom-netlist-btn {
     97   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cg fill='none' stroke='%23000' class='layer'%3E%3Crect width='29' height='29' x='1.5' y='1.5' stroke-width='2' fill='%23fff' rx='5' ry='5'/%3E%3Cpath stroke-width='2' d='M6 26l6-6v-8m13.8-6.3l-6 6v8'/%3E%3Ccircle cx='11.8' cy='9.5' r='2.8' stroke-width='2'/%3E%3Ccircle cx='19.8' cy='22.8' r='2.8' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
     98 }
     99 
    100 button#copy {
    101   background-image: url("data:image/svg+xml,%3Csvg height='48' viewBox='0 0 48 48' width='48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h48v48h-48z' fill='none'/%3E%3Cpath d='M32 2h-24c-2.21 0-4 1.79-4 4v28h4v-28h24v-4zm6 8h-22c-2.21 0-4 1.79-4 4v28c0 2.21 1.79 4 4 4h22c2.21 0 4-1.79 4-4v-28c0-2.21-1.79-4-4-4zm0 32h-22v-28h22v28z'/%3E%3C/svg%3E");
    102   background-position: 6px 6px;
    103   background-repeat: no-repeat;
    104   background-size: 26px 26px;
    105   border-radius: 6px;
    106   height: 40px;
    107   width: 40px;
    108   margin: 10px 5px;
    109 }
    110 
    111 button#copy:active {
    112     box-shadow: inset 0px 0px 5px #6c6c6c;
    113 }
    114 
    115 textarea.clipboard-temp {
    116   position: fixed;
    117   top: 0;
    118   left: 0;
    119   width: 2em;
    120   height: 2em;
    121   padding: 0;
    122   border: None;
    123   outline: None;
    124   box-shadow: None;
    125   background: transparent;
    126 }
    127 
    128 .left-most-button {
    129   border-right: 0;
    130   border-top-left-radius: 6px;
    131   border-bottom-left-radius: 6px;
    132 }
    133 
    134 .middle-button {
    135   border-right: 0;
    136 }
    137 
    138 .right-most-button {
    139   border-top-right-radius: 6px;
    140   border-bottom-right-radius: 6px;
    141 }
    142 
    143 .button-container {
    144   font-size: 0;
    145   margin: 10px 10px 10px 0px;
    146 }
    147 
    148 .dark .button-container {
    149   filter: invert(1);
    150 }
    151 
    152 .button-container button {
    153   background-size: 32px 32px;
    154   background-position: 5px 5px;
    155   background-repeat: no-repeat;
    156 }
    157 
    158 @media print {
    159   .hideonprint {
    160     display: none;
    161   }
    162 }
    163 
    164 canvas {
    165   cursor: crosshair;
    166 }
    167 
    168 canvas:active {
    169   cursor: grabbing;
    170 }
    171 
    172 .fileinfo {
    173   width: 100%;
    174   max-width: 1000px;
    175   border: none;
    176   padding: 5px;
    177 }
    178 
    179 .fileinfo .title {
    180   font-size: 20pt;
    181   font-weight: bold;
    182 }
    183 
    184 .fileinfo td {
    185   overflow: hidden;
    186   white-space: nowrap;
    187   max-width: 1px;
    188   width: 50%;
    189   text-overflow: ellipsis;
    190 }
    191 
    192 .bom {
    193   border-collapse: collapse;
    194   font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
    195   font-size: 10pt;
    196   table-layout: fixed;
    197   width: 100%;
    198   margin-top: 1px;
    199 }
    200 
    201 .bom th, .bom td {
    202   border: 1px solid black;
    203   padding: 5px;
    204   word-wrap: break-word;
    205   text-align: center;
    206   position: relative;
    207 }
    208 
    209 .dark .bom th, .dark .bom td {
    210   border: 1px solid #777;
    211 }
    212 
    213 .bom th {
    214   background-color: #CCCCCC;
    215   background-clip: padding-box;
    216 }
    217 
    218 .dark .bom th {
    219   background-color: #3b4749;
    220 }
    221 
    222 .bom tr.highlighted:nth-child(n) {
    223   background-color: #cfc;
    224 }
    225 
    226 .dark .bom tr.highlighted:nth-child(n) {
    227   background-color: #226022;
    228 }
    229 
    230 .bom tr:nth-child(even) {
    231   background-color: #f2f2f2;
    232 }
    233 
    234 .dark .bom tr:nth-child(even) {
    235   background-color: #313b40;
    236 }
    237 
    238 .bom tr.checked {
    239   color: #aaa;
    240 }
    241 
    242 .dark .bom tr.checked {
    243   color: #666;
    244 }
    245 
    246 .bom tr {
    247   transition: background-color 0.2s;
    248 }
    249 
    250 .bom .numCol {
    251   width: 25px;
    252 }
    253 
    254 .bom .Description {
    255   width: 10%;
    256 }
    257 
    258 .bom .Part {
    259   width: 10%;
    260 }
    261 
    262 .bom .Value {
    263   width: 15%;
    264 }
    265 
    266 .bom .Quantity {
    267   width: 65px;
    268 }
    269 
    270 .bom th .sortmark {
    271   position: absolute;
    272   right: 1px;
    273   top: 1px;
    274   margin-top: -5px;
    275   border-width: 5px;
    276   border-style: solid;
    277   border-color: transparent transparent #221 transparent;
    278   transform-origin: 50% 85%;
    279   transition: opacity 0.2s, transform 0.4s;
    280 }
    281 
    282 .dark .bom th .sortmark {
    283   filter: invert(1);
    284 }
    285 
    286 .bom th .sortmark.none {
    287   opacity: 0;
    288 }
    289 
    290 .bom th .sortmark.desc {
    291   transform: rotate(180deg);
    292 }
    293 
    294 .bom th:hover .sortmark.none {
    295   opacity: 0.5;
    296 }
    297 
    298 .bom .bom-checkbox {
    299   width: 30px;
    300   position: relative;
    301   user-select: none;
    302   -moz-user-select: none;
    303 }
    304 
    305 .bom .bom-checkbox:before {
    306   content: "";
    307   position: absolute;
    308   border-width: 15px;
    309   border-style: solid;
    310   border-color: #51829f transparent transparent transparent;
    311   visibility: hidden;
    312   top: -15px;
    313 }
    314 
    315 .bom .bom-checkbox:after {
    316   content: "Double click to set/unset all";
    317   position: absolute;
    318   color: white;
    319   top: -35px;
    320   left: -26px;
    321   background: #51829f;
    322   padding: 5px 15px;
    323   border-radius: 8px;
    324   white-space: nowrap;
    325   visibility: hidden;
    326 }
    327 
    328 .bom .bom-checkbox:hover:before, .bom .bom-checkbox:hover:after {
    329   visibility: visible;
    330   transition: visibility 0.2s linear 1s;
    331 }
    332 
    333 .split {
    334   -webkit-box-sizing: border-box;
    335   -moz-box-sizing: border-box;
    336   box-sizing: border-box;
    337   overflow-y: auto;
    338   overflow-x: hidden;
    339   background-color: inherit;
    340 }
    341 
    342 .split.split-horizontal, .gutter.gutter-horizontal {
    343   height: 100%;
    344   float: left;
    345 }
    346 
    347 .gutter {
    348   background-color: #ddd;
    349   background-repeat: no-repeat;
    350   background-position: 50%;
    351   transition: background-color 0.3s;
    352 }
    353 
    354 .dark .gutter {
    355   background-color: #777;
    356 }
    357 
    358 .gutter.gutter-horizontal {
    359   background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
    360   cursor: ew-resize;
    361   width: 5px;
    362 }
    363 
    364 .gutter.gutter-vertical {
    365   background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
    366   cursor: ns-resize;
    367   height: 5px;
    368 }
    369 
    370 .searchbox {
    371   float: left;
    372   height: 40px;
    373   margin: 10px 5px;
    374   padding: 12px 32px;
    375   font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
    376   font-size: 18px;
    377   box-sizing: border-box;
    378   border: 1px solid #888;
    379   border-radius: 6px;
    380   outline: none;
    381   background-color: #eee;
    382   transition: background-color 0.2s, border 0.2s;
    383   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==');
    384   background-position: 10px 10px;
    385   background-repeat: no-repeat;
    386 }
    387 
    388 .dark .searchbox {
    389   background-color: #111;
    390   color: #eee;
    391 }
    392 
    393 .searchbox::placeholder {
    394   color: #ccc;
    395 }
    396 
    397 .dark .searchbox::placeholder {
    398   color: #666;
    399 }
    400 
    401 .filter {
    402   width: calc(60% - 64px);
    403 }
    404 
    405 .reflookup {
    406   width: calc(40% - 10px);
    407 }
    408 
    409 input[type=text]:focus {
    410   background-color: white;
    411   border: 1px solid #333;
    412 }
    413 
    414 .dark input[type=text]:focus {
    415   background-color: #333;
    416   border: 1px solid #ccc;
    417 }
    418 
    419 mark.highlight {
    420   background-color: #5050ff;
    421   color: #fff;
    422   padding: 2px;
    423   border-radius: 6px;
    424 }
    425 
    426 .dark mark.highlight {
    427   background-color: #76a6da;
    428   color: #111;
    429 }
    430 
    431 .menubtn {
    432   background-color: white;
    433   border: none;
    434   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");
    435   background-position: center;
    436   background-repeat: no-repeat;
    437 }
    438 
    439 .statsbtn {
    440   background-color: white;
    441   border: none;
    442   background-image: url("data:image/svg+xml,%3Csvg width='36' height='36' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6h28v24H4V6zm0 8h28v8H4m9-16v24h10V5.8' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E");
    443   background-position: center;
    444   background-repeat: no-repeat;
    445 }
    446 
    447 .iobtn {
    448   background-color: white;
    449   border: none;
    450   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' d='M3 33v-7l6.8-7h16.5l6.7 7v7H3zM3.2 26H33M21 9l5-5.9 5 6h-2.5V15h-5V9H21zm-4.9 0l-5 6-5-6h2.5V3h5v6h2.5z'/%3E%3Cpath fill='none' stroke='%23000' d='M6.1 29.5H10'/%3E%3C/svg%3E");
    451   background-position: center;
    452   background-repeat: no-repeat;
    453 }
    454 
    455 .dark .statsbtn, .dark .savebtn, .dark .menubtn, .dark .iobtn {
    456   filter: invert(1);
    457 }
    458 
    459 .flexbox {
    460   display: flex;
    461   align-items: center;
    462   justify-content: space-between;
    463   width: 100%;
    464 }
    465 
    466 .savebtn {
    467   background-color: #d6d6d6;
    468   width: auto;
    469   height: 30px;
    470   flex-grow: 1;
    471   margin: 5px;
    472   border-radius: 4px;
    473 }
    474 
    475 .savebtn:active {
    476   background-color: #0a0;
    477   color: white;
    478 }
    479 
    480 .dark .savebtn:active {
    481   /* This will be inverted */
    482   background-color: #b3b;
    483 }
    484 
    485 .stats {
    486   border-collapse: collapse;
    487   font-size: 12pt;
    488   table-layout: fixed;
    489   width: 100%;
    490   min-width: 450px;
    491 }
    492 
    493 .dark .stats td {
    494   border: 1px solid #bbb;
    495 }
    496 
    497 .stats td {
    498   border: 1px solid black;
    499   padding: 5px;
    500   word-wrap: break-word;
    501   text-align: center;
    502   position: relative;
    503 }
    504 
    505 #checkbox-stats div {
    506   position: absolute;
    507   left: 0;
    508   top: 0;
    509   height: 100%;
    510   width: 100%;
    511   display: flex;
    512   align-items: center;
    513   justify-content: center;
    514 }
    515 
    516 #checkbox-stats .bar {
    517   background-color: rgba(28, 251, 0, 0.6);
    518 }
    519 
    520 .menu {
    521   position: relative;
    522   display: inline-block;
    523   margin: 10px 10px 10px 0px;
    524 }
    525 
    526 .menu-content {
    527   display: none;
    528   position: absolute;
    529   background-color: white;
    530   right: 0;
    531   min-width: 300px;
    532   box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    533   z-index: 100;
    534   padding: 8px;
    535 }
    536 
    537 .dark .menu-content {
    538   background-color: #111;
    539 }
    540 
    541 .menu:hover .menu-content {
    542   display: block;
    543 }
    544 
    545 .menu:hover .menubtn, .menu:hover .iobtn, .menu:hover .statsbtn {
    546   background-color: #eee;
    547 }
    548 
    549 .menu-label {
    550   display: inline-block;
    551   padding: 8px;
    552   border: 1px solid #ccc;
    553   border-top: 0;
    554   width: calc(100% - 18px);
    555 }
    556 
    557 .menu-label-top {
    558   border-top: 1px solid #ccc;
    559 }
    560 
    561 .menu-textbox {
    562   float: left;
    563   height: 24px;
    564   margin: 10px 5px;
    565   padding: 5px 5px;
    566   font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
    567   font-size: 14px;
    568   box-sizing: border-box;
    569   border: 1px solid #888;
    570   border-radius: 4px;
    571   outline: none;
    572   background-color: #eee;
    573   transition: background-color 0.2s, border 0.2s;
    574   width: calc(100% - 10px);
    575 }
    576 
    577 .menu-textbox.invalid, .dark .menu-textbox.invalid {
    578   color: red;
    579 }
    580 
    581 .dark .menu-textbox {
    582   background-color: #222;
    583   color: #eee;
    584 }
    585 
    586 .radio-container {
    587   margin: 4px;
    588 }
    589 
    590 .topmostdiv {
    591   width: 100%;
    592   height: 100%;
    593   background-color: white;
    594   transition: background-color 0.3s;
    595 }
    596 
    597 #top {
    598   height: 78px;
    599   border-bottom: 2px solid black;
    600 }
    601 
    602 .dark #top {
    603   border-bottom: 2px solid #ccc;
    604 }
    605 
    606 #dbg {
    607   display: block;
    608 }
    609 
    610 ::-webkit-scrollbar {
    611   width: 8px;
    612 }
    613 
    614 ::-webkit-scrollbar-track {
    615   background: #aaa;
    616 }
    617 
    618 ::-webkit-scrollbar-thumb {
    619   background: #666;
    620   border-radius: 3px;
    621 }
    622 
    623 ::-webkit-scrollbar-thumb:hover {
    624   background: #555;
    625 }
    626 
    627 .slider {
    628   -webkit-appearance: none;
    629   width: 100%;
    630   margin: 3px 0;
    631   padding: 0;
    632   outline: none;
    633   opacity: 0.7;
    634   -webkit-transition: .2s;
    635   transition: opacity .2s;
    636   border-radius: 3px;
    637 }
    638 
    639 .slider:hover {
    640   opacity: 1;
    641 }
    642 
    643 .slider:focus {
    644   outline: none;
    645 }
    646 
    647 .slider::-webkit-slider-runnable-track {
    648   -webkit-appearance: none;
    649   width: 100%;
    650   height: 8px;
    651   background: #d3d3d3;
    652   border-radius: 3px;
    653   border: none;
    654 }
    655 
    656 .slider::-webkit-slider-thumb {
    657   -webkit-appearance: none;
    658   width: 15px;
    659   height: 15px;
    660   border-radius: 50%;
    661   background: #0a0;
    662   cursor: pointer;
    663   margin-top: -4px;
    664 }
    665 
    666 .dark .slider::-webkit-slider-thumb {
    667   background: #3d3;
    668 }
    669 
    670 .slider::-moz-range-thumb {
    671   width: 15px;
    672   height: 15px;
    673   border-radius: 50%;
    674   background: #0a0;
    675   cursor: pointer;
    676 }
    677 
    678 .slider::-moz-range-track {
    679   height: 8px;
    680   background: #d3d3d3;
    681   border-radius: 3px;
    682 }
    683 
    684 .dark .slider::-moz-range-thumb {
    685   background: #3d3;
    686 }
    687 
    688 .slider::-ms-track {
    689   width: 100%;
    690   height: 8px;
    691   border-width: 3px 0;
    692   background: transparent;
    693   border-color: transparent;
    694   color: transparent;
    695   transition: opacity .2s;
    696 }
    697 
    698 .slider::-ms-fill-lower {
    699   background: #d3d3d3;
    700   border: none;
    701   border-radius: 3px;
    702 }
    703 
    704 .slider::-ms-fill-upper {
    705   background: #d3d3d3;
    706   border: none;
    707   border-radius: 3px;
    708 }
    709 
    710 .slider::-ms-thumb {
    711   width: 15px;
    712   height: 15px;
    713   border-radius: 50%;
    714   background: #0a0;
    715   cursor: pointer;
    716   margin: 0;
    717 }
    718 
    719 .shameless-plug {
    720   font-size: 0.8em;
    721   text-align: center;
    722   display: block;
    723 }
    724 
    725 a {
    726   color: #0278a4;
    727 }
    728 
    729 .dark a {
    730   color: #00b9fd;
    731 }
    732 
    733 #frontcanvas, #backcanvas {
    734     touch-action: none;
    735 }
    736 
    737 
    738   </style>
    739   <script type="text/javascript" >
    740 ///////////////////////////////////////////////
    741 /*
    742   Split.js - v1.3.5
    743   MIT License
    744   https://github.com/nathancahill/Split.js
    745 */
    746 !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}}});
    747 
    748 ///////////////////////////////////////////////
    749 
    750 ///////////////////////////////////////////////
    751 // Copyright (c) 2013 Pieroxy <pieroxy@pieroxy.net>
    752 // This work is free. You can redistribute it and/or modify it
    753 // under the terms of the WTFPL, Version 2
    754 // For more information see LICENSE.txt or http://www.wtfpl.net/
    755 //
    756 // For more information, the home page:
    757 // http://pieroxy.net/blog/pages/lz-string/testing.html
    758 //
    759 // LZ-based compression algorithm, version 1.4.4
    760 var LZString=function(){var o=String.fromCharCode,i={};var n={decompressFromBase64:function(o){return null==o?"":""==o?null:n._decompress(o.length,32,function(n){return function(o,n){if(!i[o]){i[o]={};for(var t=0;t<o.length;t++)i[o][o.charAt(t)]=t}return i[o][n]}("ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",o.charAt(n))})},_decompress:function(i,n,t){var r,e,a,s,p,u,l,f=[],c=4,d=4,h=3,v="",g=[],m={val:t(0),position:n,index:1};for(r=0;r<3;r+=1)f[r]=r;for(a=0,p=Math.pow(2,2),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;switch(a){case 0:for(a=0,p=Math.pow(2,8),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;l=o(a);break;case 1:for(a=0,p=Math.pow(2,16),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;l=o(a);break;case 2:return""}for(f[3]=l,e=l,g.push(l);;){if(m.index>i)return"";for(a=0,p=Math.pow(2,h),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;switch(l=a){case 0:for(a=0,p=Math.pow(2,8),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;f[d++]=o(a),l=d-1,c--;break;case 1:for(a=0,p=Math.pow(2,16),u=1;u!=p;)s=m.val&m.position,m.position>>=1,0==m.position&&(m.position=n,m.val=t(m.index++)),a|=(s>0?1:0)*u,u<<=1;f[d++]=o(a),l=d-1,c--;break;case 2:return g.join("")}if(0==c&&(c=Math.pow(2,h),h++),f[l])v=f[l];else{if(l!==d)return null;v=e+e.charAt(0)}g.push(v),f[d++]=e+v.charAt(0),e=v,0==--c&&(c=Math.pow(2,h),h++)}}};return n}();"function"==typeof define&&define.amd?define(function(){return LZString}):"undefined"!=typeof module&&null!=module?module.exports=LZString:"undefined"!=typeof angular&&null!=angular&&angular.module("LZString",[]).factory("LZString",function(){return LZString});
    761 ///////////////////////////////////////////////
    762 
    763 ///////////////////////////////////////////////
    764 /*!
    765  * PEP v0.4.3 | https://github.com/jquery/PEP
    766  * Copyright jQuery Foundation and other contributors | http://jquery.org/license
    767  */
    768 !function(a,b){"object"==typeof exports&&"undefined"!=typeof module?module.exports=b():"function"==typeof define&&define.amd?define(b):a.PointerEventsPolyfill=b()}(this,function(){"use strict";function a(a,b){b=b||Object.create(null);var c=document.createEvent("Event");c.initEvent(a,b.bubbles||!1,b.cancelable||!1);
    769 for(var d,e=2;e<m.length;e++)d=m[e],c[d]=b[d]||n[e];c.buttons=b.buttons||0;
    770 var f=0;return f=b.pressure&&c.buttons?b.pressure:c.buttons?.5:0,c.x=c.clientX,c.y=c.clientY,c.pointerId=b.pointerId||0,c.width=b.width||0,c.height=b.height||0,c.pressure=f,c.tiltX=b.tiltX||0,c.tiltY=b.tiltY||0,c.twist=b.twist||0,c.tangentialPressure=b.tangentialPressure||0,c.pointerType=b.pointerType||"",c.hwTimestamp=b.hwTimestamp||0,c.isPrimary=b.isPrimary||!1,c}function b(){this.array=[],this.size=0}function c(a,b,c,d){this.addCallback=a.bind(d),this.removeCallback=b.bind(d),this.changedCallback=c.bind(d),A&&(this.observer=new A(this.mutationWatcher.bind(this)))}function d(a){return"body /shadow-deep/ "+e(a)}function e(a){return'[touch-action="'+a+'"]'}function f(a){return"{ -ms-touch-action: "+a+"; touch-action: "+a+"; }"}function g(){if(F){D.forEach(function(a){String(a)===a?(E+=e(a)+f(a)+"\n",G&&(E+=d(a)+f(a)+"\n")):(E+=a.selectors.map(e)+f(a.rule)+"\n",G&&(E+=a.selectors.map(d)+f(a.rule)+"\n"))});var a=document.createElement("style");a.textContent=E,document.head.appendChild(a)}}function h(){if(!window.PointerEvent){if(window.PointerEvent=a,window.navigator.msPointerEnabled){var b=window.navigator.msMaxTouchPoints;Object.defineProperty(window.navigator,"maxTouchPoints",{value:b,enumerable:!0}),u.registerSource("ms",_)}else Object.defineProperty(window.navigator,"maxTouchPoints",{value:0,enumerable:!0}),u.registerSource("mouse",N),void 0!==window.ontouchstart&&u.registerSource("touch",V);u.register(document)}}function i(a){if(!u.pointermap.has(a)){var b=new Error("InvalidPointerId");throw b.name="InvalidPointerId",b}}function j(a){for(var b=a.parentNode;b&&b!==a.ownerDocument;)b=b.parentNode;if(!b){var c=new Error("InvalidStateError");throw c.name="InvalidStateError",c}}function k(a){var b=u.pointermap.get(a);return 0!==b.buttons}function l(){window.Element&&!Element.prototype.setPointerCapture&&Object.defineProperties(Element.prototype,{setPointerCapture:{value:W},releasePointerCapture:{value:X},hasPointerCapture:{value:Y}})}
    771 var m=["bubbles","cancelable","view","detail","screenX","screenY","clientX","clientY","ctrlKey","altKey","shiftKey","metaKey","button","relatedTarget","pageX","pageY"],n=[!1,!1,null,null,0,0,0,0,!1,!1,!1,!1,0,null,0,0],o=window.Map&&window.Map.prototype.forEach,p=o?Map:b;b.prototype={set:function(a,b){return void 0===b?this["delete"](a):(this.has(a)||this.size++,void(this.array[a]=b))},has:function(a){return void 0!==this.array[a]},"delete":function(a){this.has(a)&&(delete this.array[a],this.size--)},get:function(a){return this.array[a]},clear:function(){this.array.length=0,this.size=0},forEach:function(a,b){return this.array.forEach(function(c,d){a.call(b,c,d,this)},this)}};var q=["bubbles","cancelable","view","detail","screenX","screenY","clientX","clientY","ctrlKey","altKey","shiftKey","metaKey","button","relatedTarget","buttons","pointerId","width","height","pressure","tiltX","tiltY","pointerType","hwTimestamp","isPrimary","type","target","currentTarget","which","pageX","pageY","timeStamp"],r=[!1,!1,null,null,0,0,0,0,!1,!1,!1,!1,0,null,0,0,0,0,0,0,0,"",0,!1,"",null,null,0,0,0,0],s={pointerover:1,pointerout:1,pointerenter:1,pointerleave:1},t="undefined"!=typeof SVGElementInstance,u={pointermap:new p,eventMap:Object.create(null),captureInfo:Object.create(null),eventSources:Object.create(null),eventSourceList:[],registerSource:function(a,b){var c=b,d=c.events;d&&(d.forEach(function(a){c[a]&&(this.eventMap[a]=c[a].bind(c))},this),this.eventSources[a]=c,this.eventSourceList.push(c))},register:function(a){for(var b,c=this.eventSourceList.length,d=0;d<c&&(b=this.eventSourceList[d]);d++)
    772 b.register.call(b,a)},unregister:function(a){for(var b,c=this.eventSourceList.length,d=0;d<c&&(b=this.eventSourceList[d]);d++)
    773 b.unregister.call(b,a)},contains:function(a,b){try{return a.contains(b)}catch(c){return!1}},down:function(a){a.bubbles=!0,this.fireEvent("pointerdown",a)},move:function(a){a.bubbles=!0,this.fireEvent("pointermove",a)},up:function(a){a.bubbles=!0,this.fireEvent("pointerup",a)},enter:function(a){a.bubbles=!1,this.fireEvent("pointerenter",a)},leave:function(a){a.bubbles=!1,this.fireEvent("pointerleave",a)},over:function(a){a.bubbles=!0,this.fireEvent("pointerover",a)},out:function(a){a.bubbles=!0,this.fireEvent("pointerout",a)},cancel:function(a){a.bubbles=!0,this.fireEvent("pointercancel",a)},leaveOut:function(a){this.out(a),this.propagate(a,this.leave,!1)},enterOver:function(a){this.over(a),this.propagate(a,this.enter,!0)},eventHandler:function(a){if(!a._handledByPE){var b=a.type,c=this.eventMap&&this.eventMap[b];c&&c(a),a._handledByPE=!0}},listen:function(a,b){b.forEach(function(b){this.addEvent(a,b)},this)},unlisten:function(a,b){b.forEach(function(b){this.removeEvent(a,b)},this)},addEvent:function(a,b){a.addEventListener(b,this.boundHandler)},removeEvent:function(a,b){a.removeEventListener(b,this.boundHandler)},makeEvent:function(b,c){this.captureInfo[c.pointerId]&&(c.relatedTarget=null);var d=new a(b,c);return c.preventDefault&&(d.preventDefault=c.preventDefault),d._target=d._target||c.target,d},fireEvent:function(a,b){var c=this.makeEvent(a,b);return this.dispatchEvent(c)},cloneEvent:function(a){for(var b,c=Object.create(null),d=0;d<q.length;d++)b=q[d],c[b]=a[b]||r[d],!t||"target"!==b&&"relatedTarget"!==b||c[b]instanceof SVGElementInstance&&(c[b]=c[b].correspondingUseElement);return a.preventDefault&&(c.preventDefault=function(){a.preventDefault()}),c},getTarget:function(a){var b=this.captureInfo[a.pointerId];return b?a._target!==b&&a.type in s?void 0:b:a._target},propagate:function(a,b,c){for(var d=a.target,e=[];d!==document&&!d.contains(a.relatedTarget);) if(e.push(d),d=d.parentNode,!d)return;c&&e.reverse(),e.forEach(function(c){a.target=c,b.call(this,a)},this)},setCapture:function(b,c,d){this.captureInfo[b]&&this.releaseCapture(b,d),this.captureInfo[b]=c,this.implicitRelease=this.releaseCapture.bind(this,b,d),document.addEventListener("pointerup",this.implicitRelease),document.addEventListener("pointercancel",this.implicitRelease);var e=new a("gotpointercapture");e.pointerId=b,e._target=c,d||this.asyncDispatchEvent(e)},releaseCapture:function(b,c){var d=this.captureInfo[b];if(d){this.captureInfo[b]=void 0,document.removeEventListener("pointerup",this.implicitRelease),document.removeEventListener("pointercancel",this.implicitRelease);var e=new a("lostpointercapture");e.pointerId=b,e._target=d,c||this.asyncDispatchEvent(e)}},dispatchEvent:/*scope.external.dispatchEvent || */function(a){var b=this.getTarget(a);if(b)return b.dispatchEvent(a)},asyncDispatchEvent:function(a){requestAnimationFrame(this.dispatchEvent.bind(this,a))}};u.boundHandler=u.eventHandler.bind(u);var v={shadow:function(a){if(a)return a.shadowRoot||a.webkitShadowRoot},canTarget:function(a){return a&&Boolean(a.elementFromPoint)},targetingShadow:function(a){var b=this.shadow(a);if(this.canTarget(b))return b},olderShadow:function(a){var b=a.olderShadowRoot;if(!b){var c=a.querySelector("shadow");c&&(b=c.olderShadowRoot)}return b},allShadows:function(a){for(var b=[],c=this.shadow(a);c;)b.push(c),c=this.olderShadow(c);return b},searchRoot:function(a,b,c){if(a){var d,e,f=a.elementFromPoint(b,c);for(e=this.targetingShadow(f);e;){if(d=e.elementFromPoint(b,c)){var g=this.targetingShadow(d);return this.searchRoot(g,b,c)||d} e=this.olderShadow(e)} return f}},owner:function(a){
    774 for(var b=a;b.parentNode;)b=b.parentNode;
    775 return b.nodeType!==Node.DOCUMENT_NODE&&b.nodeType!==Node.DOCUMENT_FRAGMENT_NODE&&(b=document),b},findTarget:function(a){var b=a.clientX,c=a.clientY,d=this.owner(a.target);
    776 return d.elementFromPoint(b,c)||(d=document),this.searchRoot(d,b,c)}},w=Array.prototype.forEach.call.bind(Array.prototype.forEach),x=Array.prototype.map.call.bind(Array.prototype.map),y=Array.prototype.slice.call.bind(Array.prototype.slice),z=Array.prototype.filter.call.bind(Array.prototype.filter),A=window.MutationObserver||window.WebKitMutationObserver,B="[touch-action]",C={subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0,attributeFilter:["touch-action"]};c.prototype={watchSubtree:function(a){
    777 //
    778 this.observer&&v.canTarget(a)&&this.observer.observe(a,C)},enableOnSubtree:function(a){this.watchSubtree(a),a===document&&"complete"!==document.readyState?this.installOnLoad():this.installNewSubtree(a)},installNewSubtree:function(a){w(this.findElements(a),this.addElement,this)},findElements:function(a){return a.querySelectorAll?a.querySelectorAll(B):[]},removeElement:function(a){this.removeCallback(a)},addElement:function(a){this.addCallback(a)},elementChanged:function(a,b){this.changedCallback(a,b)},concatLists:function(a,b){return a.concat(y(b))},
    779 installOnLoad:function(){document.addEventListener("readystatechange",function(){"complete"===document.readyState&&this.installNewSubtree(document)}.bind(this))},isElement:function(a){return a.nodeType===Node.ELEMENT_NODE},flattenMutationTree:function(a){
    780 var b=x(a,this.findElements,this);
    781 return b.push(z(a,this.isElement)),b.reduce(this.concatLists,[])},mutationWatcher:function(a){a.forEach(this.mutationHandler,this)},mutationHandler:function(a){if("childList"===a.type){var b=this.flattenMutationTree(a.addedNodes);b.forEach(this.addElement,this);var c=this.flattenMutationTree(a.removedNodes);c.forEach(this.removeElement,this)}else"attributes"===a.type&&this.elementChanged(a.target,a.oldValue)}};var D=["none","auto","pan-x","pan-y",{rule:"pan-x pan-y",selectors:["pan-x pan-y","pan-y pan-x"]}],E="",F=window.PointerEvent||window.MSPointerEvent,G=!window.ShadowDOMPolyfill&&document.head.createShadowRoot,H=u.pointermap,I=25,J=[1,4,2,8,16],K=!1;try{K=1===new MouseEvent("test",{buttons:1}).buttons}catch(L){}
    782 var M,N={POINTER_ID:1,POINTER_TYPE:"mouse",events:["mousedown","mousemove","mouseup","mouseover","mouseout"],register:function(a){u.listen(a,this.events)},unregister:function(a){u.unlisten(a,this.events)},lastTouches:[],
    783 isEventSimulatedFromTouch:function(a){for(var b,c=this.lastTouches,d=a.clientX,e=a.clientY,f=0,g=c.length;f<g&&(b=c[f]);f++){
    784 var h=Math.abs(d-b.x),i=Math.abs(e-b.y);if(h<=I&&i<=I)return!0}},prepareEvent:function(a){var b=u.cloneEvent(a),c=b.preventDefault;return b.preventDefault=function(){a.preventDefault(),c()},b.pointerId=this.POINTER_ID,b.isPrimary=!0,b.pointerType=this.POINTER_TYPE,b},prepareButtonsForMove:function(a,b){var c=H.get(this.POINTER_ID);
    785 0!==b.which&&c?a.buttons=c.buttons:a.buttons=0,b.buttons=a.buttons},mousedown:function(a){if(!this.isEventSimulatedFromTouch(a)){var b=H.get(this.POINTER_ID),c=this.prepareEvent(a);K||(c.buttons=J[c.button],b&&(c.buttons|=b.buttons),a.buttons=c.buttons),H.set(this.POINTER_ID,a),b&&0!==b.buttons?u.move(c):u.down(c)}},mousemove:function(a){if(!this.isEventSimulatedFromTouch(a)){var b=this.prepareEvent(a);K||this.prepareButtonsForMove(b,a),b.button=-1,H.set(this.POINTER_ID,a),u.move(b)}},mouseup:function(a){if(!this.isEventSimulatedFromTouch(a)){var b=H.get(this.POINTER_ID),c=this.prepareEvent(a);if(!K){var d=J[c.button];
    786 c.buttons=b?b.buttons&~d:0,a.buttons=c.buttons}H.set(this.POINTER_ID,a),
    787 c.buttons&=~J[c.button],0===c.buttons?u.up(c):u.move(c)}},mouseover:function(a){if(!this.isEventSimulatedFromTouch(a)){var b=this.prepareEvent(a);K||this.prepareButtonsForMove(b,a),b.button=-1,H.set(this.POINTER_ID,a),u.enterOver(b)}},mouseout:function(a){if(!this.isEventSimulatedFromTouch(a)){var b=this.prepareEvent(a);K||this.prepareButtonsForMove(b,a),b.button=-1,u.leaveOut(b)}},cancel:function(a){var b=this.prepareEvent(a);u.cancel(b),this.deactivateMouse()},deactivateMouse:function(){H["delete"](this.POINTER_ID)}},O=u.captureInfo,P=v.findTarget.bind(v),Q=v.allShadows.bind(v),R=u.pointermap,S=2500,T=200,U="touch-action",V={events:["touchstart","touchmove","touchend","touchcancel"],register:function(a){M.enableOnSubtree(a)},unregister:function(){},elementAdded:function(a){var b=a.getAttribute(U),c=this.touchActionToScrollType(b);c&&(a._scrollType=c,u.listen(a,this.events),
    788 Q(a).forEach(function(a){a._scrollType=c,u.listen(a,this.events)},this))},elementRemoved:function(a){a._scrollType=void 0,u.unlisten(a,this.events),
    789 Q(a).forEach(function(a){a._scrollType=void 0,u.unlisten(a,this.events)},this)},elementChanged:function(a,b){var c=a.getAttribute(U),d=this.touchActionToScrollType(c),e=this.touchActionToScrollType(b);
    790 d&&e?(a._scrollType=d,Q(a).forEach(function(a){a._scrollType=d},this)):e?this.elementRemoved(a):d&&this.elementAdded(a)},scrollTypes:{EMITTER:"none",XSCROLLER:"pan-x",YSCROLLER:"pan-y",SCROLLER:/^(?:pan-x pan-y)|(?:pan-y pan-x)|auto$/},touchActionToScrollType:function(a){var b=a,c=this.scrollTypes;return"none"===b?"none":b===c.XSCROLLER?"X":b===c.YSCROLLER?"Y":c.SCROLLER.exec(b)?"XY":void 0},POINTER_TYPE:"touch",firstTouch:null,isPrimaryTouch:function(a){return this.firstTouch===a.identifier},setPrimaryTouch:function(a){
    791 (0===R.size||1===R.size&&R.has(1))&&(this.firstTouch=a.identifier,this.firstXY={X:a.clientX,Y:a.clientY},this.scrolling=!1,this.cancelResetClickCount())},removePrimaryPointer:function(a){a.isPrimary&&(this.firstTouch=null,this.firstXY=null,this.resetClickCount())},clickCount:0,resetId:null,resetClickCount:function(){var a=function(){this.clickCount=0,this.resetId=null}.bind(this);this.resetId=setTimeout(a,T)},cancelResetClickCount:function(){this.resetId&&clearTimeout(this.resetId)},typeToButtons:function(a){var b=0;return"touchstart"!==a&&"touchmove"!==a||(b=1),b},touchToPointer:function(a){var b=this.currentTouchEvent,c=u.cloneEvent(a),d=c.pointerId=a.identifier+2;c.target=O[d]||P(c),c.bubbles=!0,c.cancelable=!0,c.detail=this.clickCount,c.button=0,c.buttons=this.typeToButtons(b.type),c.width=2*(a.radiusX||a.webkitRadiusX||0),c.height=2*(a.radiusY||a.webkitRadiusY||0),c.pressure=a.force||a.webkitForce||.5,c.isPrimary=this.isPrimaryTouch(a),c.pointerType=this.POINTER_TYPE,
    792 c.altKey=b.altKey,c.ctrlKey=b.ctrlKey,c.metaKey=b.metaKey,c.shiftKey=b.shiftKey;
    793 var e=this;return c.preventDefault=function(){e.scrolling=!1,e.firstXY=null,b.preventDefault()},c},processTouches:function(a,b){var c=a.changedTouches;this.currentTouchEvent=a;for(var d,e=0;e<c.length;e++)d=c[e],b.call(this,this.touchToPointer(d))},
    794 shouldScroll:function(a){if(this.firstXY){var b,c=a.currentTarget._scrollType;if("none"===c)
    795 b=!1;else if("XY"===c)
    796 b=!0;else{var d=a.changedTouches[0],e=c,f="Y"===c?"X":"Y",g=Math.abs(d["client"+e]-this.firstXY[e]),h=Math.abs(d["client"+f]-this.firstXY[f]);
    797 b=g>=h}return this.firstXY=null,b}},findTouch:function(a,b){for(var c,d=0,e=a.length;d<e&&(c=a[d]);d++)if(c.identifier===b)return!0},
    798 vacuumTouches:function(a){var b=a.touches;
    799 if(R.size>=b.length){var c=[];R.forEach(function(a,d){
    800 if(1!==d&&!this.findTouch(b,d-2)){var e=a.out;c.push(e)}},this),c.forEach(this.cancelOut,this)}},touchstart:function(a){this.vacuumTouches(a),this.setPrimaryTouch(a.changedTouches[0]),this.dedupSynthMouse(a),this.scrolling||(this.clickCount++,this.processTouches(a,this.overDown))},overDown:function(a){R.set(a.pointerId,{target:a.target,out:a,outTarget:a.target}),u.enterOver(a),u.down(a)},touchmove:function(a){this.scrolling||(this.shouldScroll(a)?(this.scrolling=!0,this.touchcancel(a)):(a.preventDefault(),this.processTouches(a,this.moveOverOut)))},moveOverOut:function(a){var b=a,c=R.get(b.pointerId);
    801 if(c){var d=c.out,e=c.outTarget;u.move(b),d&&e!==b.target&&(d.relatedTarget=b.target,b.relatedTarget=e,
    802 d.target=e,b.target?(u.leaveOut(d),u.enterOver(b)):(
    803 b.target=e,b.relatedTarget=null,this.cancelOut(b))),c.out=b,c.outTarget=b.target}},touchend:function(a){this.dedupSynthMouse(a),this.processTouches(a,this.upOut)},upOut:function(a){this.scrolling||(u.up(a),u.leaveOut(a)),this.cleanUpPointer(a)},touchcancel:function(a){this.processTouches(a,this.cancelOut)},cancelOut:function(a){u.cancel(a),u.leaveOut(a),this.cleanUpPointer(a)},cleanUpPointer:function(a){R["delete"](a.pointerId),this.removePrimaryPointer(a)},
    804 dedupSynthMouse:function(a){var b=N.lastTouches,c=a.changedTouches[0];
    805 if(this.isPrimaryTouch(c)){
    806 var d={x:c.clientX,y:c.clientY};b.push(d);var e=function(a,b){var c=a.indexOf(b);c>-1&&a.splice(c,1)}.bind(null,b,d);setTimeout(e,S)}}};M=new c(V.elementAdded,V.elementRemoved,V.elementChanged,V);var W,X,Y,Z=u.pointermap,$=window.MSPointerEvent&&"number"==typeof window.MSPointerEvent.MSPOINTER_TYPE_MOUSE,_={events:["MSPointerDown","MSPointerMove","MSPointerUp","MSPointerOut","MSPointerOver","MSPointerCancel","MSGotPointerCapture","MSLostPointerCapture"],register:function(a){u.listen(a,this.events)},unregister:function(a){u.unlisten(a,this.events)},POINTER_TYPES:["","unavailable","touch","pen","mouse"],prepareEvent:function(a){var b=a;return $&&(b=u.cloneEvent(a),b.pointerType=this.POINTER_TYPES[a.pointerType]),b},cleanup:function(a){Z["delete"](a)},MSPointerDown:function(a){Z.set(a.pointerId,a);var b=this.prepareEvent(a);u.down(b)},MSPointerMove:function(a){var b=this.prepareEvent(a);u.move(b)},MSPointerUp:function(a){var b=this.prepareEvent(a);u.up(b),this.cleanup(a.pointerId)},MSPointerOut:function(a){var b=this.prepareEvent(a);u.leaveOut(b)},MSPointerOver:function(a){var b=this.prepareEvent(a);u.enterOver(b)},MSPointerCancel:function(a){var b=this.prepareEvent(a);u.cancel(b),this.cleanup(a.pointerId)},MSLostPointerCapture:function(a){var b=u.makeEvent("lostpointercapture",a);u.dispatchEvent(b)},MSGotPointerCapture:function(a){var b=u.makeEvent("gotpointercapture",a);u.dispatchEvent(b)}},aa=window.navigator;aa.msPointerEnabled?(W=function(a){i(a),j(this),k(a)&&(u.setCapture(a,this,!0),this.msSetPointerCapture(a))},X=function(a){i(a),u.releaseCapture(a,!0),this.msReleasePointerCapture(a)}):(W=function(a){i(a),j(this),k(a)&&u.setCapture(a,this)},X=function(a){i(a),u.releaseCapture(a)}),Y=function(a){return!!u.captureInfo[a]},g(),h(),l();var ba={dispatcher:u,Installer:c,PointerEvent:a,PointerMap:p,targetFinding:v};return ba});
    807 
    808 ///////////////////////////////////////////////
    809 
    810 ///////////////////////////////////////////////
    811 var config = {"dark_mode": true, "show_pads": true, "show_fabrication": false, "show_silkscreen": true, "highlight_pin1": false, "redraw_on_drag": true, "board_rotation": 0.0, "checkboxes": "Sourced,Placed", "bom_view": "top-bottom", "layer_view": "F", "extra_fields": ["Manufacturer", "Manufacturer_No"]}
    812 ///////////////////////////////////////////////
    813 
    814 ///////////////////////////////////////////////
    815 var pcbdata = JSON.parse(LZString.decompressFromBase64("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"))
    816 ///////////////////////////////////////////////
    817 
    818 ///////////////////////////////////////////////
    819 /* Utility functions */
    820 
    821 var storagePrefix = 'KiCad_HTML_BOM__' + pcbdata.metadata.title + '__' +
    822   pcbdata.metadata.revision + '__#';
    823 var storage;
    824 
    825 function initStorage(key) {
    826   try {
    827     window.localStorage.getItem("blank");
    828     storage = window.localStorage;
    829   } catch (e) {
    830     // localStorage not available
    831   }
    832   if (!storage) {
    833     try {
    834       window.sessionStorage.getItem("blank");
    835       storage = window.sessionStorage;
    836     } catch (e) {
    837       // sessionStorage also not available
    838     }
    839   }
    840 }
    841 
    842 function readStorage(key) {
    843   if (storage) {
    844     return storage.getItem(storagePrefix + key);
    845   } else {
    846     return null;
    847   }
    848 }
    849 
    850 function writeStorage(key, value) {
    851   if (storage) {
    852     storage.setItem(storagePrefix + key, value);
    853   }
    854 }
    855 
    856 function fancyDblClickHandler(el, onsingle, ondouble) {
    857   return function() {
    858     if (el.getAttribute("data-dblclick") == null) {
    859       el.setAttribute("data-dblclick", 1);
    860       setTimeout(function() {
    861         if (el.getAttribute("data-dblclick") == 1) {
    862           onsingle();
    863         }
    864         el.removeAttribute("data-dblclick");
    865       }, 200);
    866     } else {
    867       el.removeAttribute("data-dblclick");
    868       ondouble();
    869     }
    870   }
    871 }
    872 
    873 function smoothScrollToRow(rowid) {
    874   document.getElementById(rowid).scrollIntoView({
    875     behavior: "smooth",
    876     block: "center",
    877     inline: "nearest"
    878   });
    879 }
    880 
    881 function focusInputField(input) {
    882   input.scrollIntoView(false);
    883   input.focus();
    884   input.select();
    885 }
    886 
    887 function copyToClipboard() {
    888   var text = '';
    889   for (var node of bomhead.childNodes[0].childNodes) {
    890     if (node.firstChild) {
    891       text = text + node.firstChild.nodeValue;
    892     }
    893     if (node != bomhead.childNodes[0].lastChild) {
    894       text += '\t';
    895     }
    896   }
    897   text += '\n';
    898   for (var row of bombody.childNodes) {
    899     for (var cell of row.childNodes) {
    900       for (var node of cell.childNodes) {
    901         if (node.nodeName == "INPUT") {
    902           if (node.checked) {
    903             text = text + '✓';
    904           }
    905         } else if (node.nodeName == "MARK") {
    906           text = text + node.firstChild.nodeValue;
    907         } else {
    908           text = text + node.nodeValue;
    909         }
    910       }
    911       if (cell != row.lastChild) {
    912         text += '\t';
    913       }
    914     }
    915     text += '\n';
    916   }
    917   var textArea = document.createElement("textarea");
    918   textArea.classList.add('clipboard-temp');
    919   textArea.value = text;
    920 
    921   document.body.appendChild(textArea);
    922   textArea.focus();
    923   textArea.select();
    924 
    925   try {
    926     if (document.execCommand('copy')) {
    927       console.log('Bom copied to clipboard.');
    928     }
    929   } catch (err) {
    930     console.log('Can not copy to clipboard.');
    931   }
    932 
    933   document.body.removeChild(textArea);
    934 }
    935 
    936 function removeGutterNode(node) {
    937   for (var i = 0; i < node.childNodes.length; i++) {
    938     if (node.childNodes[i].classList &&
    939       node.childNodes[i].classList.contains("gutter")) {
    940       node.removeChild(node.childNodes[i]);
    941       break;
    942     }
    943   }
    944 }
    945 
    946 function cleanGutters() {
    947   removeGutterNode(document.getElementById("bot"));
    948   removeGutterNode(document.getElementById("canvasdiv"));
    949 }
    950 
    951 var units = {
    952   prefixes: {
    953     giga: ["G", "g", "giga", "Giga", "GIGA"],
    954     mega: ["M", "mega", "Mega", "MEGA"],
    955     kilo: ["K", "k", "kilo", "Kilo", "KILO"],
    956     milli: ["m", "milli", "Milli", "MILLI"],
    957     micro: ["U", "u", "micro", "Micro", "MICRO", "μ", "µ"], // different utf8 μ
    958     nano: ["N", "n", "nano", "Nano", "NANO"],
    959     pico: ["P", "p", "pico", "Pico", "PICO"],
    960   },
    961   unitsShort: ["R", "r", "Ω", "F", "f", "H", "h"],
    962   unitsLong: [
    963     "OHM", "Ohm", "ohm", "ohms",
    964     "FARAD", "Farad", "farad",
    965     "HENRY", "Henry", "henry"
    966   ],
    967   getMultiplier: function(s) {
    968     if (this.prefixes.giga.includes(s)) return 1e9;
    969     if (this.prefixes.mega.includes(s)) return 1e6;
    970     if (this.prefixes.kilo.includes(s)) return 1e3;
    971     if (this.prefixes.milli.includes(s)) return 1e-3;
    972     if (this.prefixes.micro.includes(s)) return 1e-6;
    973     if (this.prefixes.nano.includes(s)) return 1e-9;
    974     if (this.prefixes.pico.includes(s)) return 1e-12;
    975     return 1;
    976   },
    977   valueRegex: null,
    978 }
    979 
    980 function initUtils() {
    981   var allPrefixes = units.prefixes.giga
    982                     .concat(units.prefixes.mega)
    983                     .concat(units.prefixes.kilo)
    984                     .concat(units.prefixes.milli)
    985                     .concat(units.prefixes.micro)
    986                     .concat(units.prefixes.nano)
    987                     .concat(units.prefixes.pico);
    988   var allUnits = units.unitsShort.concat(units.unitsLong);
    989   units.valueRegex = new RegExp("^([0-9\.]+)" +
    990                          "\\s*(" + allPrefixes.join("|") + ")?" +
    991                          "(" + allUnits.join("|") + ")?" +
    992                          "(\\b.*)?$", "");
    993   units.valueAltRegex = new RegExp("^([0-9]*)" +
    994                          "(" + units.unitsShort.join("|") + ")?" +
    995                          "([GgMmKkUuNnPp])?" +
    996                          "([0-9]*)" +
    997                          "(\\b.*)?$", "");
    998   for (var bom_type of ["both", "F", "B"]) {
    999     for (var row of pcbdata.bom[bom_type]) {
   1000       row.push(parseValue(row[1], row[3][0][0]));
   1001     }
   1002   }
   1003 }
   1004 
   1005 function parseValue(val, ref) {
   1006   var inferUnit = (unit, ref) => {
   1007     if (unit) {
   1008       unit = unit.toLowerCase();
   1009       if (unit == 'Ω' || unit == "ohm" || unit == "ohms") {
   1010         unit = 'r';
   1011       }
   1012       unit = unit[0];
   1013     } else {
   1014       ref = /^([a-z]+)\d+$/i.exec(ref);
   1015       if (ref) {
   1016         ref = ref[1].toLowerCase();
   1017         if (ref == "c") unit = 'f';
   1018         else if (ref == "l") unit = 'h';
   1019         else if (ref == "r" || ref == "rv") unit = 'r';
   1020         else unit = null;
   1021       }
   1022     }
   1023     return unit;
   1024   };
   1025   val = val.replace(/,/g, "");
   1026   var match = units.valueRegex.exec(val);
   1027   var unit;
   1028   if (match) {
   1029     val = parseFloat(match[1]);
   1030     if (match[2]) {
   1031       val = val * units.getMultiplier(match[2]);
   1032     }
   1033     unit = inferUnit(match[3], ref);
   1034     if (!unit) return null;
   1035     else return {
   1036       val: val,
   1037       unit: unit,
   1038       extra: match[4],
   1039     }
   1040   }
   1041   match = units.valueAltRegex.exec(val);
   1042   if (match && (match[1] || match[4])) {
   1043     val = parseFloat(match[1] + "." + match[4]);
   1044     if (match[3]) {
   1045       val = val * units.getMultiplier(match[3]);
   1046     }
   1047     unit = inferUnit(match[2], ref);
   1048     if (!unit) return null;
   1049     else return {
   1050       val: val,
   1051       unit: unit,
   1052       extra: match[5],
   1053     }
   1054   }
   1055   return null;
   1056 }
   1057 
   1058 function valueCompare(a, b, stra, strb) {
   1059   if (a === null && b === null) {
   1060     // Failed to parse both values, compare them as strings.
   1061     if (stra != strb) return stra > strb ? 1 : -1;
   1062     else return 0;
   1063   } else if (a === null) {
   1064     return 1;
   1065   } else if (b === null) {
   1066     return -1;
   1067   } else {
   1068     if (a.unit != b.unit) return a.unit > b.unit ? 1 : -1;
   1069     else if (a.val != b.val) return a.val > b.val ? 1 : -1;
   1070     else if (a.extra != b.extra) return a.extra > b.extra ? 1 : -1;
   1071     else return 0;
   1072   }
   1073 }
   1074 
   1075 function validateSaveImgDimension(element) {
   1076   var valid = false;
   1077   var intValue = 0;
   1078   if (/^[1-9]\d*$/.test(element.value)) {
   1079     intValue = parseInt(element.value);
   1080     if (intValue <= 16000) {
   1081       valid = true;
   1082     }
   1083   }
   1084   if (valid) {
   1085     element.classList.remove("invalid");
   1086   } else {
   1087     element.classList.add("invalid");
   1088   }
   1089   return intValue;
   1090 }
   1091 
   1092 function saveImage(layer) {
   1093   var width = validateSaveImgDimension(document.getElementById("render-save-width"));
   1094   var height = validateSaveImgDimension(document.getElementById("render-save-height"));
   1095   var bgcolor = null;
   1096   if (!document.getElementById("render-save-transparent").checked) {
   1097     var style = getComputedStyle(topmostdiv);
   1098     bgcolor = style.getPropertyValue("background-color");
   1099   }
   1100   if (!width || !height) return;
   1101 
   1102   // Prepare image
   1103   var canvas = document.createElement("canvas");
   1104   var layerdict = {
   1105     transform: {
   1106       x: 0,
   1107       y: 0,
   1108       s: 1,
   1109       panx: 0,
   1110       pany: 0,
   1111       zoom: 1,
   1112     },
   1113     bg: canvas,
   1114     fab: canvas,
   1115     silk: canvas,
   1116     highlight: canvas,
   1117     layer: layer,
   1118   }
   1119   // Do the rendering
   1120   recalcLayerScale(layerdict, width, height);
   1121   prepareLayer(layerdict);
   1122   clearCanvas(canvas, bgcolor);
   1123   drawBackground(layerdict, false);
   1124   drawHighlightsOnLayer(layerdict, false);
   1125 
   1126   // Save image
   1127   var imgdata = canvas.toDataURL("image/png");
   1128 
   1129   var filename = pcbdata.metadata.title;
   1130   if (pcbdata.metadata.revision) {
   1131     filename += `.${pcbdata.metadata.revision}`;
   1132   }
   1133   filename += `.${layer}.png`;
   1134   saveFile(filename, dataURLtoBlob(imgdata));
   1135 }
   1136 
   1137 function saveSettings() {
   1138   var data = {
   1139     type: "InteractiveHtmlBom settings",
   1140     version: 1,
   1141     pcbmetadata: pcbdata.metadata,
   1142     settings: settings,
   1143   }
   1144   var blob = new Blob([JSON.stringify(data, null, 4)], {type: "application/json"});
   1145   saveFile(`${pcbdata.metadata.title}.settings.json`, blob);
   1146 }
   1147 
   1148 function loadSettings() {
   1149   var input = document.createElement("input");
   1150   input.type = "file";
   1151   input.accept = ".settings.json";
   1152   input.onchange = function(e) {
   1153     var file = e.target.files[0];
   1154     var reader = new FileReader();
   1155     reader.onload = readerEvent => {
   1156       var content = readerEvent.target.result;
   1157       var newSettings;
   1158       try {
   1159         newSettings = JSON.parse(content);
   1160       } catch(e) {
   1161         alert("Selected file is not InteractiveHtmlBom settings file.");
   1162         return;
   1163       }
   1164       if (newSettings.type != "InteractiveHtmlBom settings") {
   1165         alert("Selected file is not InteractiveHtmlBom settings file.");
   1166         return;
   1167       }
   1168       var metadataMatches = newSettings.hasOwnProperty("pcbmetadata");
   1169       if (metadataMatches) {
   1170         for (var k in pcbdata.metadata) {
   1171           if (!newSettings.pcbmetadata.hasOwnProperty(k) || newSettings.pcbmetadata[k] != pcbdata.metadata[k]) {
   1172             metadataMatches = false;
   1173           }
   1174         }
   1175       }
   1176       if (!metadataMatches) {
   1177         var currentMetadata = JSON.stringify(pcbdata.metadata, null, 4);
   1178         var fileMetadata = JSON.stringify(newSettings.pcbmetadata, null, 4);
   1179         if (!confirm(
   1180           `Settins file metadata does not match current metadata.\n\n` +
   1181           `Page metadata:\n${currentMetadata}\n\n` +
   1182           `Settings file metadata:\n${fileMetadata}\n\n` +
   1183           `Press OK if you would like to import settings anyway.`)) {
   1184           return;
   1185         }
   1186       }
   1187       overwriteSettings(newSettings.settings);
   1188     }
   1189     reader.readAsText(file, 'UTF-8');
   1190   }
   1191   input.click();
   1192 }
   1193 
   1194 function overwriteSettings(newSettings) {
   1195   initDone = false;
   1196   Object.assign(settings, newSettings);
   1197   writeStorage("bomlayout", settings.bomlayout);
   1198   writeStorage("bommode", settings.bommode);
   1199   writeStorage("canvaslayout", settings.canvaslayout);
   1200   writeStorage("bomCheckboxes", settings.checkboxes.join(","));
   1201   document.getElementById("bomCheckboxes").value = settings.checkboxes.join(",");
   1202   for (var checkbox of settings.checkboxes) {
   1203     writeStorage("checkbox_" + checkbox, settings.checkboxStoredRefs[checkbox]);
   1204   }
   1205   writeStorage("darkenWhenChecked", settings.darkenWhenChecked);
   1206   padsVisible(settings.renderPads);
   1207   document.getElementById("padsCheckbox").checked = settings.renderPads;
   1208   fabricationVisible(settings.renderFabrication);
   1209   document.getElementById("fabricationCheckbox").checked = settings.renderFabrication;
   1210   silkscreenVisible(settings.renderSilkscreen);
   1211   document.getElementById("silkscreenCheckbox").checked = settings.renderSilkscreen;
   1212   referencesVisible(settings.renderReferences);
   1213   document.getElementById("referencesCheckbox").checked = settings.renderReferences;
   1214   valuesVisible(settings.renderValues);
   1215   document.getElementById("valuesCheckbox").checked = settings.renderValues;
   1216   tracksVisible(settings.renderTracks);
   1217   document.getElementById("tracksCheckbox").checked = settings.renderTracks;
   1218   zonesVisible(settings.renderZones);
   1219   document.getElementById("zonesCheckbox").checked = settings.renderZones;
   1220   dnpOutline(settings.renderDnpOutline);
   1221   document.getElementById("dnpOutlineCheckbox").checked = settings.renderDnpOutline;
   1222   setRedrawOnDrag(settings.redrawOnDrag);
   1223   document.getElementById("dragCheckbox").checked = settings.redrawOnDrag;
   1224   setDarkMode(settings.darkMode);
   1225   document.getElementById("darkmodeCheckbox").checked = settings.darkMode;
   1226   setHighlightPin1(settings.highlightpin1);
   1227   document.getElementById("highlightpin1Checkbox").checked = settings.highlightpin1;
   1228   writeStorage("boardRotation", settings.boardRotation);
   1229   document.getElementById("boardRotation").value = settings.boardRotation / 5;
   1230   document.getElementById("rotationDegree").textContent = settings.boardRotation;
   1231   initDone = true;
   1232   prepCheckboxes();
   1233   changeBomLayout(settings.bomlayout);
   1234 }
   1235 
   1236 function saveFile(filename, blob) {
   1237   var link = document.createElement("a");
   1238   var objurl = URL.createObjectURL(blob);
   1239   link.download = filename;
   1240   link.href = objurl;
   1241   link.click();
   1242 }
   1243 
   1244 function dataURLtoBlob(dataurl) {
   1245   var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
   1246       bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
   1247   while(n--){
   1248       u8arr[n] = bstr.charCodeAt(n);
   1249   }
   1250   return new Blob([u8arr], {type:mime});
   1251 }
   1252 
   1253 var settings = {
   1254   canvaslayout: "default",
   1255   bomlayout: "default",
   1256   bommode: "grouped",
   1257   checkboxes: [],
   1258   checkboxStoredRefs: {},
   1259   darkMode: false,
   1260   highlightpin1: false,
   1261   redrawOnDrag: true,
   1262   boardRotation: 0,
   1263   renderPads: true,
   1264   renderReferences: true,
   1265   renderValues: true,
   1266   renderSilkscreen: true,
   1267   renderFabrication: true,
   1268   renderDnpOutline: false,
   1269   renderTracks: true,
   1270   renderZones: true,
   1271 }
   1272 
   1273 function initDefaults() {
   1274   settings.bomlayout = readStorage("bomlayout");
   1275   if (settings.bomlayout === null) {
   1276     settings.bomlayout = config.bom_view;
   1277   }
   1278   if (!['bom-only', 'left-right', 'top-bottom'].includes(settings.bomlayout)) {
   1279     settings.bomlayout = config.bom_view;
   1280   }
   1281   settings.bommode = readStorage("bommode");
   1282   if (settings.bommode === null) {
   1283     settings.bommode = "grouped";
   1284   }
   1285   if (!["grouped", "ungrouped", "netlist"].includes(settings.bommode)) {
   1286     settings.bommode = "grouped";
   1287   }
   1288   settings.canvaslayout = readStorage("canvaslayout");
   1289   if (settings.canvaslayout === null) {
   1290     settings.canvaslayout = config.layer_view;
   1291   }
   1292   var bomCheckboxes = readStorage("bomCheckboxes");
   1293   if (bomCheckboxes === null) {
   1294     bomCheckboxes = config.checkboxes;
   1295   }
   1296   settings.checkboxes = bomCheckboxes.split(",").filter((e) => e);
   1297   document.getElementById("bomCheckboxes").value = bomCheckboxes;
   1298 
   1299   settings.darkenWhenChecked = readStorage("darkenWhenChecked") || "";
   1300   populateDarkenWhenCheckedOptions();
   1301 
   1302   function initBooleanSetting(storageString, def, elementId, func) {
   1303     var b = readStorage(storageString);
   1304     if (b === null) {
   1305       b = def;
   1306     } else {
   1307       b = (b == "true");
   1308     }
   1309     document.getElementById(elementId).checked = b;
   1310     func(b);
   1311   }
   1312 
   1313   initBooleanSetting("padsVisible", config.show_pads, "padsCheckbox", padsVisible);
   1314   initBooleanSetting("fabricationVisible", config.show_fabrication, "fabricationCheckbox", fabricationVisible);
   1315   initBooleanSetting("silkscreenVisible", config.show_silkscreen, "silkscreenCheckbox", silkscreenVisible);
   1316   initBooleanSetting("referencesVisible", true, "referencesCheckbox", referencesVisible);
   1317   initBooleanSetting("valuesVisible", true, "valuesCheckbox", valuesVisible);
   1318   if ("tracks" in pcbdata) {
   1319     initBooleanSetting("tracksVisible", true, "tracksCheckbox", tracksVisible);
   1320     initBooleanSetting("zonesVisible", true, "zonesCheckbox", zonesVisible);
   1321   } else {
   1322     document.getElementById("tracksAndZonesCheckboxes").style.display = "none";
   1323     tracksVisible(false);
   1324     zonesVisible(false);
   1325   }
   1326   initBooleanSetting("dnpOutline", false, "dnpOutlineCheckbox", dnpOutline);
   1327   initBooleanSetting("redrawOnDrag", config.redraw_on_drag, "dragCheckbox", setRedrawOnDrag);
   1328   initBooleanSetting("darkmode", config.dark_mode, "darkmodeCheckbox", setDarkMode);
   1329   initBooleanSetting("highlightpin1", config.highlight_pin1, "highlightpin1Checkbox", setHighlightPin1);
   1330   settings.boardRotation = readStorage("boardRotation");
   1331   if (settings.boardRotation === null) {
   1332     settings.boardRotation = config.board_rotation * 5;
   1333   } else {
   1334     settings.boardRotation = parseInt(settings.boardRotation);
   1335   }
   1336   document.getElementById("boardRotation").value = settings.boardRotation / 5;
   1337   document.getElementById("rotationDegree").textContent = settings.boardRotation;
   1338 }
   1339 
   1340 // Helper classes for user js callbacks.
   1341 
   1342 const IBOM_EVENT_TYPES = {
   1343   ALL: "all",
   1344   HIGHLIGHT_EVENT: "highlightEvent",
   1345   CHECKBOX_CHANGE_EVENT: "checkboxChangeEvent",
   1346   BOM_BODY_CHANGE_EVENT: "bomBodyChangeEvent",
   1347 }
   1348 
   1349 const EventHandler = {
   1350   callbacks: {},
   1351   init: function() {
   1352     for (eventType of Object.values(IBOM_EVENT_TYPES))
   1353       this.callbacks[eventType] = [];
   1354   },
   1355   registerCallback: function(eventType, callback) {
   1356     this.callbacks[eventType].push(callback);
   1357   },
   1358   emitEvent: function(eventType, eventArgs) {
   1359     event = {
   1360       eventType: eventType,
   1361       args: eventArgs,
   1362     }
   1363     var callback;
   1364     for(callback of this.callbacks[eventType])
   1365       callback(event);
   1366     for(callback of this.callbacks[IBOM_EVENT_TYPES.ALL])
   1367       callback(event);
   1368   }
   1369 }
   1370 EventHandler.init();
   1371 
   1372 ///////////////////////////////////////////////
   1373 
   1374 ///////////////////////////////////////////////
   1375 /* PCB rendering code */
   1376 
   1377 var emptyContext2d = document.createElement("canvas").getContext("2d");
   1378 
   1379 function deg2rad(deg) {
   1380   return deg * Math.PI / 180;
   1381 }
   1382 
   1383 function calcFontPoint(linepoint, text, offsetx, offsety, tilt) {
   1384   var point = [
   1385     linepoint[0] * text.width + offsetx,
   1386     linepoint[1] * text.height + offsety
   1387   ];
   1388   // This approximates pcbnew behavior with how text tilts depending on horizontal justification
   1389   point[0] -= (linepoint[1] + 0.5 * (1 + text.horiz_justify)) * text.height * tilt;
   1390   return point;
   1391 }
   1392 
   1393 function drawtext(ctx, text, color, flip) {
   1394   if ("ref" in text && !settings.renderReferences) return;
   1395   if ("val" in text && !settings.renderValues) return;
   1396   ctx.save();
   1397   ctx.fillStyle = color;
   1398   ctx.strokeStyle = color;
   1399   ctx.lineCap = "round";
   1400   ctx.lineJoin = "round";
   1401   ctx.lineWidth = text.thickness;
   1402   if (text.svgpath) {
   1403     ctx.stroke(new Path2D(text.svgpath));
   1404     ctx.restore();
   1405     return;
   1406   }
   1407   ctx.translate(...text.pos);
   1408   ctx.translate(text.thickness * 0.5, 0);
   1409   var angle = -text.angle;
   1410   if (text.attr.includes("mirrored")) {
   1411     ctx.scale(-1, 1);
   1412     angle = -angle;
   1413   }
   1414   var tilt = 0;
   1415   if (text.attr.includes("italic")) {
   1416     tilt = 0.125;
   1417   }
   1418   var interline = (text.height * 1.5 + text.thickness) / 2;
   1419   var txt = text.text.split("\n");
   1420   // KiCad ignores last empty line.
   1421   if (txt[txt.length - 1] == '') txt.pop();
   1422   ctx.rotate(deg2rad(angle));
   1423   for (var i in txt) {
   1424     var offsety = (-(txt.length - 1) + i * 2) * interline + text.height / 2;
   1425     var lineWidth = text.thickness + interline * tilt;
   1426     for (var j = 0; j < txt[i].length; j++) {
   1427       if (txt[i][j] == '\t') {
   1428         var fourSpaces = 4 * pcbdata.font_data[' '].w * text.width;
   1429         lineWidth += fourSpaces - lineWidth % fourSpaces;
   1430       } else {
   1431         if (txt[i][j] == '~') {
   1432           j++;
   1433           if (j == txt[i].length)
   1434             break;
   1435         }
   1436         lineWidth += pcbdata.font_data[txt[i][j]].w * text.width;
   1437       }
   1438     }
   1439     var offsetx = 0;
   1440     switch (text.horiz_justify) {
   1441       case -1:
   1442         // Justify left, do nothing
   1443         break;
   1444       case 0:
   1445         // Justify center
   1446         offsetx -= lineWidth / 2;
   1447         break;
   1448       case 1:
   1449         // Justify right
   1450         offsetx -= lineWidth;
   1451         break;
   1452     }
   1453     var inOverbar = false;
   1454     for (var j = 0; j < txt[i].length; j++) {
   1455       if (txt[i][j] == '\t') {
   1456         var fourSpaces = 4 * pcbdata.font_data[' '].w * text.width;
   1457         offsetx += fourSpaces - offsetx % fourSpaces;
   1458         continue;
   1459       } else if (txt[i][j] == '~') {
   1460         j++;
   1461         if (j == txt[i].length)
   1462           break;
   1463         if (txt[i][j] != '~') {
   1464           inOverbar = !inOverbar;
   1465         }
   1466       }
   1467       var glyph = pcbdata.font_data[txt[i][j]];
   1468       if (inOverbar) {
   1469         var overbarStart = [offsetx, -text.height * 1.4 + offsety];
   1470         var overbarEnd = [offsetx + text.width * glyph.w, overbarStart[1]];
   1471 
   1472         if (!lastHadOverbar) {
   1473           overbarStart[0] += text.height * 1.4 * tilt;
   1474           lastHadOverbar = true;
   1475         }
   1476         ctx.beginPath();
   1477         ctx.moveTo(...overbarStart);
   1478         ctx.lineTo(...overbarEnd);
   1479         ctx.stroke();
   1480       } else {
   1481         lastHadOverbar = false;
   1482       }
   1483       for (var line of glyph.l) {
   1484         ctx.beginPath();
   1485         ctx.moveTo(...calcFontPoint(line[0], text, offsetx, offsety, tilt));
   1486         for (var k = 1; k < line.length; k++) {
   1487           ctx.lineTo(...calcFontPoint(line[k], text, offsetx, offsety, tilt));
   1488         }
   1489         ctx.stroke();
   1490       }
   1491       offsetx += glyph.w * text.width;
   1492     }
   1493   }
   1494   ctx.restore();
   1495 }
   1496 
   1497 function drawedge(ctx, scalefactor, edge, color) {
   1498   ctx.strokeStyle = color;
   1499   ctx.lineWidth = Math.max(1 / scalefactor, edge.width);
   1500   ctx.lineCap = "round";
   1501   if (edge.svgpath) {
   1502     ctx.stroke(new Path2D(edge.svgpath));
   1503   } else {
   1504     ctx.beginPath();
   1505     if (edge.type == "segment") {
   1506       ctx.moveTo(...edge.start);
   1507       ctx.lineTo(...edge.end);
   1508     }
   1509     if (edge.type == "arc") {
   1510       ctx.arc(
   1511         ...edge.start,
   1512         edge.radius,
   1513         deg2rad(edge.startangle),
   1514         deg2rad(edge.endangle));
   1515     }
   1516     if (edge.type == "circle") {
   1517       ctx.arc(
   1518         ...edge.start,
   1519         edge.radius,
   1520         0, 2 * Math.PI);
   1521       ctx.closePath();
   1522     }
   1523     if (edge.type == "curve") {
   1524       ctx.moveTo(...edge.start);
   1525       ctx.bezierCurveTo(...edge.cpa, ...edge.cpb, ...edge.end);
   1526     }
   1527     ctx.stroke();
   1528   }
   1529 }
   1530 
   1531 function getChamferedRectPath(size, radius, chamfpos, chamfratio) {
   1532   // chamfpos is a bitmask, left = 1, right = 2, bottom left = 4, bottom right = 8
   1533   var path = new Path2D();
   1534   var width = size[0];
   1535   var height = size[1];
   1536   var x = width * -0.5;
   1537   var y = height * -0.5;
   1538   var chamfOffset = Math.min(width, height) * chamfratio;
   1539   path.moveTo(x, 0);
   1540   if (chamfpos & 4) {
   1541     path.lineTo(x, y + height - chamfOffset);
   1542     path.lineTo(x + chamfOffset, y + height);
   1543     path.lineTo(0, y + height);
   1544   } else {
   1545     path.arcTo(x, y + height, x + width, y + height, radius);
   1546   }
   1547   if (chamfpos & 8) {
   1548     path.lineTo(x + width - chamfOffset, y + height);
   1549     path.lineTo(x + width, y + height - chamfOffset);
   1550     path.lineTo(x + width, 0);
   1551   } else {
   1552     path.arcTo(x + width, y + height, x + width, y, radius);
   1553   }
   1554   if (chamfpos & 2) {
   1555     path.lineTo(x + width, y + chamfOffset);
   1556     path.lineTo(x + width - chamfOffset, y);
   1557     path.lineTo(0, y);
   1558   } else {
   1559     path.arcTo(x + width, y, x, y, radius);
   1560   }
   1561   if (chamfpos & 1) {
   1562     path.lineTo(x + chamfOffset, y);
   1563     path.lineTo(x, y + chamfOffset);
   1564     path.lineTo(x, 0);
   1565   } else {
   1566     path.arcTo(x, y, x, y + height, radius);
   1567   }
   1568   path.closePath();
   1569   return path;
   1570 }
   1571 
   1572 function getOblongPath(size) {
   1573   return getChamferedRectPath(size, Math.min(size[0], size[1]) / 2, 0, 0);
   1574 }
   1575 
   1576 function getPolygonsPath(shape) {
   1577   if (shape.path2d) {
   1578     return shape.path2d;
   1579   }
   1580   if (shape.svgpath) {
   1581     shape.path2d = new Path2D(shape.svgpath);
   1582   } else {
   1583     var path = new Path2D();
   1584     for (var polygon of shape.polygons) {
   1585       path.moveTo(...polygon[0]);
   1586       for (var i = 1; i < polygon.length; i++) {
   1587         path.lineTo(...polygon[i]);
   1588       }
   1589       path.closePath();
   1590     }
   1591     shape.path2d = path;
   1592   }
   1593   return shape.path2d;
   1594 }
   1595 
   1596 function drawPolygonShape(ctx, shape, color) {
   1597   ctx.save();
   1598   ctx.fillStyle = color;
   1599   if (!shape.svgpath) {
   1600     ctx.translate(...shape.pos);
   1601     ctx.rotate(deg2rad(-shape.angle));
   1602   }
   1603   ctx.fill(getPolygonsPath(shape));
   1604   ctx.restore();
   1605 }
   1606 
   1607 function drawDrawing(ctx, layer, scalefactor, drawing, color) {
   1608   if (["segment", "arc", "circle", "curve"].includes(drawing.type)) {
   1609     drawedge(ctx, scalefactor, drawing, color);
   1610   } else if (drawing.type == "polygon") {
   1611     drawPolygonShape(ctx, drawing, color);
   1612   } else {
   1613     drawtext(ctx, drawing, color, layer == "B");
   1614   }
   1615 }
   1616 
   1617 function getCirclePath(radius) {
   1618   var path = new Path2D();
   1619   path.arc(0, 0, radius, 0, 2 * Math.PI);
   1620   path.closePath();
   1621   return path;
   1622 }
   1623 
   1624 function getCachedPadPath(pad) {
   1625   if (!pad.path2d) {
   1626     // if path2d is not set, build one and cache it on pad object
   1627     if (pad.shape == "rect") {
   1628       pad.path2d = new Path2D();
   1629       pad.path2d.rect(...pad.size.map(c => -c * 0.5), ...pad.size);
   1630     } else if (pad.shape == "oval") {
   1631       pad.path2d = getOblongPath(pad.size);
   1632     } else if (pad.shape == "circle") {
   1633       pad.path2d = getCirclePath(pad.size[0] / 2);
   1634     } else if (pad.shape == "roundrect") {
   1635       pad.path2d = getChamferedRectPath(pad.size, pad.radius, 0, 0);
   1636     } else if (pad.shape == "chamfrect") {
   1637       pad.path2d = getChamferedRectPath(pad.size, pad.radius, pad.chamfpos, pad.chamfratio)
   1638     } else if (pad.shape == "custom") {
   1639       pad.path2d = getPolygonsPath(pad);
   1640     }
   1641   }
   1642   return pad.path2d;
   1643 }
   1644 
   1645 function drawPad(ctx, pad, color, outline, hole) {
   1646   ctx.save();
   1647   ctx.translate(...pad.pos);
   1648   ctx.rotate(deg2rad(pad.angle));
   1649   if (pad.offset) {
   1650     ctx.translate(...pad.offset);
   1651   }
   1652   ctx.fillStyle = color;
   1653   ctx.strokeStyle = color;
   1654   var path = getCachedPadPath(pad);
   1655   if (outline) {
   1656     ctx.stroke(path);
   1657   } else {
   1658     ctx.fill(path);
   1659   }
   1660   if (pad.type == "th" && hole) {
   1661     if (pad.offset) {
   1662       ctx.translate(-pad.offset[0], -pad.offset[1]);
   1663     }
   1664     ctx.fillStyle = "#CCCCCC";
   1665     if (pad.drillshape == "oblong") {
   1666       ctx.fill(getOblongPath(pad.drillsize));
   1667     } else {
   1668       ctx.fill(getCirclePath(pad.drillsize[0] / 2));
   1669     }
   1670   }
   1671   ctx.restore();
   1672 }
   1673 
   1674 function drawModule(ctx, layer, scalefactor, module, padcolor, outlinecolor, highlight, outline) {
   1675   if (highlight) {
   1676     // draw bounding box
   1677     if (module.layer == layer) {
   1678       ctx.save();
   1679       ctx.globalAlpha = 0.2;
   1680       ctx.translate(...module.bbox.pos);
   1681       ctx.rotate(deg2rad(-module.bbox.angle));
   1682       ctx.translate(...module.bbox.relpos);
   1683       ctx.fillStyle = padcolor;
   1684       ctx.fillRect(0, 0, ...module.bbox.size);
   1685       ctx.globalAlpha = 1;
   1686       ctx.strokeStyle = padcolor;
   1687       ctx.strokeRect(0, 0, ...module.bbox.size);
   1688       ctx.restore();
   1689     }
   1690   }
   1691   // draw drawings
   1692   for (var drawing of module.drawings) {
   1693     if (drawing.layer == layer) {
   1694       drawDrawing(ctx, layer, scalefactor, drawing.drawing, padcolor);
   1695     }
   1696   }
   1697   // draw pads
   1698   if (settings.renderPads) {
   1699     for (var pad of module.pads) {
   1700       if (pad.layers.includes(layer)) {
   1701         drawPad(ctx, pad, padcolor, outline, true);
   1702         if (pad.pin1 && settings.highlightpin1) {
   1703           drawPad(ctx, pad, outlinecolor, true, false);
   1704         }
   1705       }
   1706     }
   1707   }
   1708 }
   1709 
   1710 function drawEdgeCuts(canvas, scalefactor) {
   1711   var ctx = canvas.getContext("2d");
   1712   var edgecolor = getComputedStyle(topmostdiv).getPropertyValue('--pcb-edge-color');
   1713   for (var edge of pcbdata.edges) {
   1714     drawedge(ctx, scalefactor, edge, edgecolor);
   1715   }
   1716 }
   1717 
   1718 function drawModules(canvas, layer, scalefactor, highlight) {
   1719   var ctx = canvas.getContext("2d");
   1720   ctx.lineWidth = 3 / scalefactor;
   1721   var style = getComputedStyle(topmostdiv);
   1722   var padcolor = style.getPropertyValue('--pad-color');
   1723   var outlinecolor = style.getPropertyValue('--pin1-outline-color');
   1724   if (highlight) {
   1725     padcolor = style.getPropertyValue('--pad-color-highlight');
   1726     outlinecolor = style.getPropertyValue('--pin1-outline-color-highlight');
   1727   }
   1728   for (var i = 0; i < pcbdata.modules.length; i++) {
   1729     var mod = pcbdata.modules[i];
   1730     var outline = settings.renderDnpOutline && pcbdata.bom.skipped.includes(i);
   1731     if (!highlight || highlightedModules.includes(i)) {
   1732       drawModule(ctx, layer, scalefactor, mod, padcolor, outlinecolor, highlight, outline);
   1733     }
   1734   }
   1735 }
   1736 
   1737 function drawBgLayer(layername, canvas, layer, scalefactor, edgeColor, polygonColor, textColor) {
   1738   var ctx = canvas.getContext("2d");
   1739   for (var d of pcbdata[layername][layer]) {
   1740     if (["segment", "arc", "circle", "curve"].includes(d.type)) {
   1741       drawedge(ctx, scalefactor, d, edgeColor);
   1742     } else if (d.type == "polygon") {
   1743       drawPolygonShape(ctx, d, polygonColor);
   1744     } else {
   1745       drawtext(ctx, d, textColor, layer == "B");
   1746     }
   1747   }
   1748 }
   1749 
   1750 function drawTracks(canvas, layer, color, highlight) {
   1751   ctx = canvas.getContext("2d");
   1752   ctx.strokeStyle = color;
   1753   ctx.lineCap = "round";
   1754   for(var track of pcbdata.tracks[layer]) {
   1755     if (highlight && highlightedNet != track.net) continue;
   1756     ctx.lineWidth = track.width;
   1757     ctx.beginPath();
   1758     ctx.moveTo(...track.start);
   1759     ctx.lineTo(...track.end);
   1760     ctx.stroke();
   1761   }
   1762 }
   1763 
   1764 function drawZones(canvas, layer, color, highlight) {
   1765   ctx = canvas.getContext("2d");
   1766   ctx.strokeStyle = color;
   1767   ctx.fillStyle = color;
   1768   ctx.lineJoin = "round";
   1769   for(var zone of pcbdata.zones[layer]) {
   1770     if (!zone.path2d) {
   1771       zone.path2d = getPolygonsPath(zone);
   1772     }
   1773     if (highlight && highlightedNet != zone.net) continue;
   1774     ctx.lineWidth = zone.width ? zone.width : 0;
   1775     ctx.fill(zone.path2d);
   1776     ctx.stroke(zone.path2d);
   1777   }
   1778 }
   1779 
   1780 function clearCanvas(canvas, color = null) {
   1781   var ctx = canvas.getContext("2d");
   1782   ctx.save();
   1783   ctx.setTransform(1, 0, 0, 1, 0, 0);
   1784   if (color) {
   1785     ctx.fillStyle = color;
   1786     ctx.fillRect(0, 0, canvas.width, canvas.height);
   1787   } else {
   1788     ctx.clearRect(0, 0, canvas.width, canvas.height);
   1789   }
   1790   ctx.restore();
   1791 }
   1792 
   1793 function drawNets(canvas, layer, highlight) {
   1794   var style = getComputedStyle(topmostdiv);
   1795   if (settings.renderTracks) {
   1796     var trackColor = style.getPropertyValue(highlight ? '--track-color-highlight' : '--track-color');
   1797     drawTracks(canvas, layer, trackColor, highlight);
   1798   }
   1799   if (settings.renderZones) {
   1800     var zoneColor = style.getPropertyValue(highlight ? '--zone-color-highlight' : '--zone-color');
   1801     drawZones(canvas, layer, zoneColor, highlight);
   1802   }
   1803   if (highlight && settings.renderPads) {
   1804     var padColor = style.getPropertyValue('--pad-color-highlight');
   1805     var ctx = canvas.getContext("2d");
   1806     for (var mod of pcbdata.modules) {
   1807       // draw pads
   1808       for (var pad of mod.pads) {
   1809         if (highlightedNet != pad.net) continue;
   1810         if (pad.layers.includes(layer)) {
   1811           drawPad(ctx, pad, padColor, false, true);
   1812         }
   1813       }
   1814     }
   1815   }
   1816 }
   1817 
   1818 function drawHighlightsOnLayer(canvasdict, clear = true) {
   1819   if (clear) {
   1820     clearCanvas(canvasdict.highlight);
   1821   }
   1822   if (highlightedModules.length > 0) {
   1823     drawModules(canvasdict.highlight, canvasdict.layer,
   1824       canvasdict.transform.s * canvasdict.transform.zoom, true);
   1825   }
   1826   if (highlightedNet !== null) {
   1827     drawNets(canvasdict.highlight, canvasdict.layer, true);
   1828   }
   1829 }
   1830 
   1831 function drawHighlights() {
   1832   drawHighlightsOnLayer(allcanvas.front);
   1833   drawHighlightsOnLayer(allcanvas.back);
   1834 }
   1835 
   1836 function drawBackground(canvasdict, clear = true) {
   1837   if (clear) {
   1838     clearCanvas(canvasdict.bg);
   1839     clearCanvas(canvasdict.fab);
   1840     clearCanvas(canvasdict.silk);
   1841   }
   1842 
   1843   drawNets(canvasdict.bg, canvasdict.layer, false);
   1844   drawModules(canvasdict.bg, canvasdict.layer,
   1845     canvasdict.transform.s * canvasdict.transform.zoom, false);
   1846 
   1847   drawEdgeCuts(canvasdict.bg, canvasdict.transform.s);
   1848 
   1849   var style = getComputedStyle(topmostdiv);
   1850   var edgeColor = style.getPropertyValue('--silkscreen-edge-color');
   1851   var polygonColor = style.getPropertyValue('--silkscreen-polygon-color');
   1852   var textColor = style.getPropertyValue('--silkscreen-text-color');
   1853   if (settings.renderSilkscreen) {
   1854     drawBgLayer(
   1855       "silkscreen", canvasdict.silk, canvasdict.layer,
   1856       canvasdict.transform.s * canvasdict.transform.zoom,
   1857       edgeColor, polygonColor, textColor);
   1858   }
   1859   edgeColor = style.getPropertyValue('--fabrication-edge-color');
   1860   polygonColor = style.getPropertyValue('--fabrication-polygon-color');
   1861   textColor = style.getPropertyValue('--fabrication-text-color');
   1862   if (settings.renderFabrication) {
   1863     drawBgLayer(
   1864       "fabrication", canvasdict.fab, canvasdict.layer,
   1865       canvasdict.transform.s * canvasdict.transform.zoom,
   1866       edgeColor, polygonColor, textColor);
   1867   }
   1868 }
   1869 
   1870 function prepareCanvas(canvas, flip, transform) {
   1871   var ctx = canvas.getContext("2d");
   1872   ctx.setTransform(1, 0, 0, 1, 0, 0);
   1873   var fontsize = 1.55;
   1874   ctx.scale(transform.zoom, transform.zoom);
   1875   ctx.translate(transform.panx, transform.pany);
   1876   if (flip) {
   1877     ctx.scale(-1, 1);
   1878   }
   1879   ctx.translate(transform.x, transform.y);
   1880   ctx.rotate(deg2rad(settings.boardRotation));
   1881   ctx.scale(transform.s, transform.s);
   1882 }
   1883 
   1884 function prepareLayer(canvasdict) {
   1885   var flip = (canvasdict.layer == "B");
   1886   for (var c of ["bg", "fab", "silk", "highlight"]) {
   1887     prepareCanvas(canvasdict[c], flip, canvasdict.transform);
   1888   }
   1889 }
   1890 
   1891 function rotateVector(v, angle) {
   1892   angle = deg2rad(angle);
   1893   return [
   1894     v[0] * Math.cos(angle) - v[1] * Math.sin(angle),
   1895     v[0] * Math.sin(angle) + v[1] * Math.cos(angle)
   1896   ];
   1897 }
   1898 
   1899 function applyRotation(bbox) {
   1900   var corners = [
   1901     [bbox.minx, bbox.miny],
   1902     [bbox.minx, bbox.maxy],
   1903     [bbox.maxx, bbox.miny],
   1904     [bbox.maxx, bbox.maxy],
   1905   ];
   1906   corners = corners.map((v) => rotateVector(v, settings.boardRotation));
   1907   return {
   1908     minx: corners.reduce((a, v) => Math.min(a, v[0]), Infinity),
   1909     miny: corners.reduce((a, v) => Math.min(a, v[1]), Infinity),
   1910     maxx: corners.reduce((a, v) => Math.max(a, v[0]), -Infinity),
   1911     maxy: corners.reduce((a, v) => Math.max(a, v[1]), -Infinity),
   1912   }
   1913 }
   1914 
   1915 function recalcLayerScale(layerdict, width, height) {
   1916   var bbox = applyRotation(pcbdata.edges_bbox);
   1917   var scalefactor = 0.98 * Math.min(
   1918     width / (bbox.maxx - bbox.minx),
   1919     height / (bbox.maxy - bbox.miny)
   1920   );
   1921   if (scalefactor < 0.1) {
   1922     scalefactor = 1;
   1923   }
   1924   layerdict.transform.s = scalefactor;
   1925   var flip = (layerdict.layer == "B");
   1926   if (flip) {
   1927     layerdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor + width) * 0.5;
   1928   } else {
   1929     layerdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor - width) * 0.5;
   1930   }
   1931   layerdict.transform.y = -((bbox.maxy + bbox.miny) * scalefactor - height) * 0.5;
   1932   for (var c of ["bg", "fab", "silk", "highlight"]) {
   1933     canvas = layerdict[c];
   1934     canvas.width = width;
   1935     canvas.height = height;
   1936     canvas.style.width = (width / devicePixelRatio) + "px";
   1937     canvas.style.height = (height / devicePixelRatio) + "px";
   1938   }
   1939 }
   1940 
   1941 function redrawCanvas(layerdict) {
   1942   prepareLayer(layerdict);
   1943   drawBackground(layerdict);
   1944   drawHighlightsOnLayer(layerdict);
   1945 }
   1946 
   1947 function resizeCanvas(layerdict) {
   1948   var canvasdivid = {
   1949     "F": "frontcanvas",
   1950     "B": "backcanvas"
   1951   } [layerdict.layer];
   1952   var width = document.getElementById(canvasdivid).clientWidth * devicePixelRatio;
   1953   var height = document.getElementById(canvasdivid).clientHeight * devicePixelRatio;
   1954   recalcLayerScale(layerdict, width, height);
   1955   redrawCanvas(layerdict);
   1956 }
   1957 
   1958 function resizeAll() {
   1959   resizeCanvas(allcanvas.front);
   1960   resizeCanvas(allcanvas.back);
   1961 }
   1962 
   1963 function pointWithinDistanceToSegment(x, y, x1, y1, x2, y2, d) {
   1964   var A = x - x1;
   1965   var B = y - y1;
   1966   var C = x2 - x1;
   1967   var D = y2 - y1;
   1968 
   1969   var dot = A * C + B * D;
   1970   var len_sq = C * C + D * D;
   1971   var dx, dy;
   1972   if (len_sq == 0) {
   1973     // start and end of the segment coincide
   1974     dx = x - x1;
   1975     dy = y - y1;
   1976   } else {
   1977     var param = dot / len_sq;
   1978     var xx, yy;
   1979     if (param < 0) {
   1980       xx = x1;
   1981       yy = y1;
   1982     } else if (param > 1) {
   1983       xx = x2;
   1984       yy = y2;
   1985     } else {
   1986       xx = x1 + param * C;
   1987       yy = y1 + param * D;
   1988     }
   1989     dx = x - xx;
   1990     dy = y - yy;
   1991   }
   1992   return dx * dx + dy * dy <= d * d;
   1993 }
   1994 
   1995 function pointWithinPad(x, y, pad) {
   1996   var v = [x - pad.pos[0], y - pad.pos[1]];
   1997   v = rotateVector(v, -pad.angle);
   1998   if (pad.offset) {
   1999     v[0] -= pad.offset[0];
   2000     v[1] -= pad.offset[1];
   2001   }
   2002   return emptyContext2d.isPointInPath(getCachedPadPath(pad), ...v);
   2003 }
   2004 
   2005 function netHitScan(layer, x, y) {
   2006   // Check track segments
   2007   if (settings.renderTracks && pcbdata.tracks) {
   2008     for(var track of pcbdata.tracks[layer]) {
   2009       if (pointWithinDistanceToSegment(x, y, ...track.start, ...track.end, track.width / 2)) {
   2010         return track.net;
   2011       }
   2012     }
   2013   }
   2014   // Check pads
   2015   if (settings.renderPads) {
   2016     for (var mod of pcbdata.modules) {
   2017       for(var pad of mod.pads) {
   2018         if (pad.layers.includes(layer) && pointWithinPad(x, y, pad)) {
   2019           return pad.net;
   2020         }
   2021       }
   2022     }
   2023   }
   2024   return null;
   2025 }
   2026 
   2027 function pointWithinModuleBbox(x, y, bbox) {
   2028   var v = [x - bbox.pos[0], y - bbox.pos[1]];
   2029   v = rotateVector(v, bbox.angle);
   2030   return bbox.relpos[0] <= v[0] && v[0] <= bbox.relpos[0] + bbox.size[0] &&
   2031          bbox.relpos[1] <= v[1] && v[1] <= bbox.relpos[1] + bbox.size[1];
   2032 }
   2033 
   2034 function bboxHitScan(layer, x, y) {
   2035   var result = [];
   2036   for (var i = 0; i < pcbdata.modules.length; i++) {
   2037     var module = pcbdata.modules[i];
   2038     if (module.layer == layer) {
   2039       if (pointWithinModuleBbox(x, y, module.bbox)) {
   2040         result.push(i);
   2041       }
   2042     }
   2043   }
   2044   return result;
   2045 }
   2046 
   2047 function handlePointerDown(e, layerdict) {
   2048   if (e.button != 0) {
   2049     return;
   2050   }
   2051   e.preventDefault();
   2052   e.stopPropagation();
   2053 
   2054   if (!e.hasOwnProperty("offsetX")) {
   2055     // The polyfill doesn't set this properly
   2056     e.offsetX = e.pageX - e.currentTarget.offsetLeft;
   2057     e.offsetY = e.pageY - e.currentTarget.offsetTop;
   2058   }
   2059 
   2060   layerdict.pointerStates[e.pointerId] = {
   2061     distanceTravelled: 0,
   2062     lastX: e.offsetX,
   2063     lastY: e.offsetY,
   2064     downTime: Date.now(),
   2065   };
   2066 }
   2067 
   2068 function handleMouseClick(e, layerdict) {
   2069   if (!e.hasOwnProperty("offsetX")) {
   2070     // The polyfill doesn't set this properly
   2071     e.offsetX = e.pageX - e.currentTarget.offsetLeft;
   2072     e.offsetY = e.pageY - e.currentTarget.offsetTop;
   2073   }
   2074 
   2075   var x = e.offsetX;
   2076   var y = e.offsetY;
   2077   var t = layerdict.transform;
   2078   if (layerdict.layer == "B") {
   2079     x = (devicePixelRatio * x / t.zoom - t.panx + t.x) / -t.s;
   2080   } else {
   2081     x = (devicePixelRatio * x / t.zoom - t.panx - t.x) / t.s;
   2082   }
   2083   y = (devicePixelRatio * y / t.zoom - t.y - t.pany) / t.s;
   2084   var v = rotateVector([x, y], -settings.boardRotation);
   2085   if ("nets" in pcbdata) {
   2086     var net = netHitScan(layerdict.layer, ...v);
   2087     if (net !== highlightedNet) {
   2088       netClicked(net);
   2089     }
   2090   }
   2091   if (highlightedNet === null) {
   2092     var modules = bboxHitScan(layerdict.layer, ...v);
   2093     if (modules.length > 0) {
   2094       modulesClicked(modules);
   2095     }
   2096   }
   2097 }
   2098 
   2099 function handlePointerLeave(e, layerdict) {
   2100   e.preventDefault();
   2101   e.stopPropagation();
   2102 
   2103   if (!settings.redrawOnDrag) {
   2104     redrawCanvas(layerdict);
   2105   }
   2106 
   2107   delete layerdict.pointerStates[e.pointerId];
   2108 }
   2109 
   2110 function resetTransform(layerdict) {
   2111   layerdict.transform.panx = 0;
   2112   layerdict.transform.pany = 0;
   2113   layerdict.transform.zoom = 1;
   2114   redrawCanvas(layerdict);
   2115 }
   2116 
   2117 function handlePointerUp(e, layerdict) {
   2118   if (!e.hasOwnProperty("offsetX")) {
   2119     // The polyfill doesn't set this properly
   2120     e.offsetX = e.pageX - e.currentTarget.offsetLeft;
   2121     e.offsetY = e.pageY - e.currentTarget.offsetTop;
   2122   }
   2123 
   2124   e.preventDefault();
   2125   e.stopPropagation();
   2126 
   2127   if (e.button == 2) {
   2128     // Reset pan and zoom on right click.
   2129     resetTransform(layerdict);
   2130     layerdict.anotherPointerTapped = false;
   2131     return;
   2132   }
   2133 
   2134   // We haven't necessarily had a pointermove event since the interaction started, so make sure we update this now
   2135   var ptr = layerdict.pointerStates[e.pointerId];
   2136   ptr.distanceTravelled += Math.abs(e.offsetX - ptr.lastX) + Math.abs(e.offsetY - ptr.lastY);
   2137 
   2138   if (e.button == 0 && ptr.distanceTravelled < 10 && Date.now() - ptr.downTime <= 500) {
   2139     if (Object.keys(layerdict.pointerStates).length == 1) {
   2140       if (layerdict.anotherPointerTapped) {
   2141         // This is the second pointer coming off of a two-finger tap
   2142         resetTransform(layerdict);
   2143       } else {
   2144         // This is just a regular tap
   2145         handleMouseClick(e, layerdict);
   2146       }
   2147       layerdict.anotherPointerTapped = false;
   2148     } else {
   2149       // This is the first finger coming off of what could become a two-finger tap
   2150       layerdict.anotherPointerTapped = true;
   2151     }
   2152   } else {
   2153     if (!settings.redrawOnDrag) {
   2154       redrawCanvas(layerdict);
   2155     }
   2156     layerdict.anotherPointerTapped = false;
   2157   }
   2158 
   2159   delete layerdict.pointerStates[e.pointerId];
   2160 }
   2161 
   2162 function handlePointerMove(e, layerdict) {
   2163   if (!layerdict.pointerStates.hasOwnProperty(e.pointerId)) {
   2164     return;
   2165   }
   2166   e.preventDefault();
   2167   e.stopPropagation();
   2168 
   2169   if (!e.hasOwnProperty("offsetX")) {
   2170     // The polyfill doesn't set this properly
   2171     e.offsetX = e.pageX - e.currentTarget.offsetLeft;
   2172     e.offsetY = e.pageY - e.currentTarget.offsetTop;
   2173   }
   2174 
   2175   var thisPtr = layerdict.pointerStates[e.pointerId];
   2176 
   2177   var dx = e.offsetX - thisPtr.lastX;
   2178   var dy = e.offsetY - thisPtr.lastY;
   2179 
   2180   // If this number is low on pointer up, we count the action as a click
   2181   thisPtr.distanceTravelled += Math.abs(dx) + Math.abs(dy);
   2182 
   2183   if (Object.keys(layerdict.pointerStates).length == 1) {
   2184     // This is a simple drag
   2185     layerdict.transform.panx += devicePixelRatio * dx / layerdict.transform.zoom;
   2186     layerdict.transform.pany += devicePixelRatio * dy / layerdict.transform.zoom;
   2187   } else if (Object.keys(layerdict.pointerStates).length == 2) {
   2188     var otherPtr = Object.values(layerdict.pointerStates).filter((ptr) => ptr != thisPtr)[0];
   2189 
   2190     var oldDist = Math.sqrt(Math.pow(thisPtr.lastX - otherPtr.lastX, 2) + Math.pow(thisPtr.lastY - otherPtr.lastY, 2));
   2191     var newDist = Math.sqrt(Math.pow(e.offsetX - otherPtr.lastX, 2)     + Math.pow(e.offsetY - otherPtr.lastY, 2));
   2192 
   2193     var scaleFactor = newDist/oldDist;
   2194 
   2195     if (scaleFactor != NaN) {
   2196       layerdict.transform.zoom *= scaleFactor;
   2197 
   2198       var zoomd = (1 - scaleFactor) / layerdict.transform.zoom;
   2199       layerdict.transform.panx += devicePixelRatio * otherPtr.lastX * zoomd;
   2200       layerdict.transform.pany += devicePixelRatio * otherPtr.lastY * zoomd;
   2201     }
   2202   }
   2203 
   2204   thisPtr.lastX = e.offsetX;
   2205   thisPtr.lastY = e.offsetY;
   2206 
   2207   if (settings.redrawOnDrag) {
   2208     redrawCanvas(layerdict);
   2209   }
   2210 }
   2211 
   2212 function handleMouseWheel(e, layerdict) {
   2213   e.preventDefault();
   2214   e.stopPropagation();
   2215   var t = layerdict.transform;
   2216   var wheeldelta = e.deltaY;
   2217   if (e.deltaMode == 1) {
   2218     // FF only, scroll by lines
   2219     wheeldelta *= 30;
   2220   } else if (e.deltaMode == 2) {
   2221     wheeldelta *= 300;
   2222   }
   2223   var m = Math.pow(1.1, -wheeldelta / 40);
   2224   // Limit amount of zoom per tick.
   2225   if (m > 2) {
   2226     m = 2;
   2227   } else if (m < 0.5) {
   2228     m = 0.5;
   2229   }
   2230   t.zoom *= m;
   2231   var zoomd = (1 - m) / t.zoom;
   2232   t.panx += devicePixelRatio * e.offsetX * zoomd;
   2233   t.pany += devicePixelRatio * e.offsetY * zoomd;
   2234   redrawCanvas(layerdict);
   2235 }
   2236 
   2237 function addMouseHandlers(div, layerdict) {
   2238   div.addEventListener("pointerdown", function(e) {
   2239     handlePointerDown(e, layerdict);
   2240   });
   2241   div.addEventListener("pointermove", function(e) {
   2242     handlePointerMove(e, layerdict);
   2243   });
   2244   div.addEventListener("pointerup", function(e) {
   2245     handlePointerUp(e, layerdict);
   2246   });
   2247   var pointerleave = function(e) {
   2248     handlePointerLeave(e, layerdict);
   2249   }
   2250   div.addEventListener("pointercancel", pointerleave);
   2251   div.addEventListener("pointerleave", pointerleave);
   2252   div.addEventListener("pointerout", pointerleave);
   2253 
   2254   div.onwheel = function(e) {
   2255     handleMouseWheel(e, layerdict);
   2256   }
   2257   for (var element of [div, layerdict.bg, layerdict.fab, layerdict.silk, layerdict.highlight]) {
   2258     element.addEventListener("contextmenu", function(e) {
   2259       e.preventDefault();
   2260     }, false);
   2261   }
   2262 }
   2263 
   2264 function setRedrawOnDrag(value) {
   2265   settings.redrawOnDrag = value;
   2266   writeStorage("redrawOnDrag", value);
   2267 }
   2268 
   2269 function setBoardRotation(value) {
   2270   settings.boardRotation = value * 5;
   2271   writeStorage("boardRotation", settings.boardRotation);
   2272   document.getElementById("rotationDegree").textContent = settings.boardRotation;
   2273   resizeAll();
   2274 }
   2275 
   2276 function initRender() {
   2277   allcanvas = {
   2278     front: {
   2279       transform: {
   2280         x: 0,
   2281         y: 0,
   2282         s: 1,
   2283         panx: 0,
   2284         pany: 0,
   2285         zoom: 1,
   2286       },
   2287       pointerStates: {},
   2288       anotherPointerTapped: false,
   2289       bg: document.getElementById("F_bg"),
   2290       fab: document.getElementById("F_fab"),
   2291       silk: document.getElementById("F_slk"),
   2292       highlight: document.getElementById("F_hl"),
   2293       layer: "F",
   2294     },
   2295     back: {
   2296       transform: {
   2297         x: 0,
   2298         y: 0,
   2299         s: 1,
   2300         panx: 0,
   2301         pany: 0,
   2302         zoom: 1,
   2303       },
   2304       pointerStates: {},
   2305       anotherPointerTapped: false,
   2306       bg: document.getElementById("B_bg"),
   2307       fab: document.getElementById("B_fab"),
   2308       silk: document.getElementById("B_slk"),
   2309       highlight: document.getElementById("B_hl"),
   2310       layer: "B",
   2311     }
   2312   };
   2313   addMouseHandlers(document.getElementById("frontcanvas"), allcanvas.front);
   2314   addMouseHandlers(document.getElementById("backcanvas"), allcanvas.back);
   2315 }
   2316 
   2317 ///////////////////////////////////////////////
   2318 
   2319 ///////////////////////////////////////////////
   2320 /* DOM manipulation and misc code */
   2321 
   2322 var bomsplit;
   2323 var canvassplit;
   2324 var initDone = false;
   2325 var bomSortFunction = null;
   2326 var currentSortColumn = null;
   2327 var currentSortOrder = null;
   2328 var currentHighlightedRowId;
   2329 var highlightHandlers = [];
   2330 var moduleIndexToHandler = {};
   2331 var netsToHandler = {};
   2332 var highlightedModules = [];
   2333 var highlightedNet = null;
   2334 var lastClicked;
   2335 
   2336 function dbg(html) {
   2337   dbgdiv.innerHTML = html;
   2338 }
   2339 
   2340 function redrawIfInitDone() {
   2341   if (initDone) {
   2342     redrawCanvas(allcanvas.front);
   2343     redrawCanvas(allcanvas.back);
   2344   }
   2345 }
   2346 
   2347 function padsVisible(value) {
   2348   writeStorage("padsVisible", value);
   2349   settings.renderPads = value;
   2350   redrawIfInitDone();
   2351 }
   2352 
   2353 function referencesVisible(value) {
   2354   writeStorage("referencesVisible", value);
   2355   settings.renderReferences = value;
   2356   redrawIfInitDone();
   2357 }
   2358 
   2359 function valuesVisible(value) {
   2360   writeStorage("valuesVisible", value);
   2361   settings.renderValues = value;
   2362   redrawIfInitDone();
   2363 }
   2364 
   2365 function tracksVisible(value) {
   2366   writeStorage("tracksVisible", value);
   2367   settings.renderTracks = value;
   2368   redrawIfInitDone();
   2369 }
   2370 
   2371 function zonesVisible(value) {
   2372   writeStorage("zonesVisible", value);
   2373   settings.renderZones = value;
   2374   redrawIfInitDone();
   2375 }
   2376 
   2377 function dnpOutline(value) {
   2378   writeStorage("dnpOutline", value);
   2379   settings.renderDnpOutline = value;
   2380   redrawIfInitDone();
   2381 }
   2382 
   2383 function setDarkMode(value) {
   2384   if (value) {
   2385     topmostdiv.classList.add("dark");
   2386   } else {
   2387     topmostdiv.classList.remove("dark");
   2388   }
   2389   writeStorage("darkmode", value);
   2390   settings.darkMode = value;
   2391   redrawIfInitDone();
   2392 }
   2393 
   2394 function setFullscreen(value) {
   2395   if (value) {
   2396     document.documentElement.requestFullscreen();
   2397   } else {
   2398     document.exitFullscreen();
   2399   }
   2400 }
   2401 
   2402 function fabricationVisible(value) {
   2403   writeStorage("fabricationVisible", value);
   2404   settings.renderFabrication = value;
   2405   redrawIfInitDone();
   2406 }
   2407 
   2408 function silkscreenVisible(value) {
   2409   writeStorage("silkscreenVisible", value);
   2410   settings.renderSilkscreen = value;
   2411   redrawIfInitDone();
   2412 }
   2413 
   2414 function setHighlightPin1(value) {
   2415   writeStorage("highlightpin1", value);
   2416   settings.highlightpin1 = value;
   2417   redrawIfInitDone();
   2418 }
   2419 
   2420 function getStoredCheckboxRefs(checkbox) {
   2421   function convert(ref) {
   2422     var intref = parseInt(ref);
   2423     if (isNaN(intref)) {
   2424       for (var i = 0; i < pcbdata.modules.length; i++) {
   2425         if (pcbdata.modules[i].ref == ref) {
   2426           return i;
   2427         }
   2428       }
   2429       return -1;
   2430     } else {
   2431       return intref;
   2432     }
   2433   }
   2434   if (!(checkbox in settings.checkboxStoredRefs)) {
   2435     var val = readStorage("checkbox_" + checkbox);
   2436     settings.checkboxStoredRefs[checkbox] = val ? val : "";
   2437   }
   2438   if (!settings.checkboxStoredRefs[checkbox]) {
   2439     return new Set();
   2440   } else {
   2441     return new Set(settings.checkboxStoredRefs[checkbox].split(",").map(r => convert(r)).filter(a => a >= 0));
   2442   }
   2443 }
   2444 
   2445 function getCheckboxState(checkbox, references) {
   2446   var storedRefsSet = getStoredCheckboxRefs(checkbox);
   2447   var currentRefsSet = new Set(references.map(r => r[1]));
   2448   // Get difference of current - stored
   2449   var difference = new Set(currentRefsSet);
   2450   for (ref of storedRefsSet) {
   2451     difference.delete(ref);
   2452   }
   2453   if (difference.size == 0) {
   2454     // All the current refs are stored
   2455     return "checked";
   2456   } else if (difference.size == currentRefsSet.size) {
   2457     // None of the current refs are stored
   2458     return "unchecked";
   2459   } else {
   2460     // Some of the refs are stored
   2461     return "indeterminate";
   2462   }
   2463 }
   2464 
   2465 function setBomCheckboxState(checkbox, element, references) {
   2466   var state = getCheckboxState(checkbox, references);
   2467   element.checked = (state == "checked");
   2468   element.indeterminate = (state == "indeterminate");
   2469 }
   2470 
   2471 function createCheckboxChangeHandler(checkbox, references) {
   2472   return function(evt) {
   2473     refsSet = getStoredCheckboxRefs(checkbox);
   2474     var darkenWhenChecked = settings.darkenWhenChecked == checkbox;
   2475     eventArgs = {
   2476       checkbox: checkbox,
   2477       refs: references,
   2478     }
   2479     if (this.checked) {
   2480       // checkbox ticked
   2481       for (var ref of references) {
   2482         refsSet.add(ref[1]);
   2483       }
   2484       if (darkenWhenChecked) {
   2485         evt.target.parentElement.parentElement.classList.add("checked");
   2486       }
   2487       eventArgs.state = 'checked';
   2488     } else {
   2489       // checkbox unticked
   2490       for (var ref of references) {
   2491         refsSet.delete(ref[1]);
   2492       }
   2493       if (darkenWhenChecked) {
   2494         evt.target.parentElement.parentElement.classList.remove("checked");
   2495       }
   2496       eventArgs.state = 'unchecked';
   2497     }
   2498     settings.checkboxStoredRefs[checkbox] = [...refsSet].join(",");
   2499     writeStorage("checkbox_" + checkbox, settings.checkboxStoredRefs[checkbox]);
   2500     updateCheckboxStats(checkbox);
   2501     EventHandler.emitEvent(IBOM_EVENT_TYPES.CHECKBOX_CHANGE_EVENT, eventArgs);
   2502   }
   2503 }
   2504 
   2505 function clearHighlightedModules() {
   2506   if (currentHighlightedRowId) {
   2507     document.getElementById(currentHighlightedRowId).classList.remove("highlighted");
   2508     currentHighlightedRowId = null;
   2509     highlightedModules = [];
   2510     highlightedNet = null;
   2511   }
   2512 }
   2513 
   2514 function createRowHighlightHandler(rowid, refs, net) {
   2515   return function() {
   2516     if (currentHighlightedRowId) {
   2517       if (currentHighlightedRowId == rowid) {
   2518         return;
   2519       }
   2520       document.getElementById(currentHighlightedRowId).classList.remove("highlighted");
   2521     }
   2522     document.getElementById(rowid).classList.add("highlighted");
   2523     currentHighlightedRowId = rowid;
   2524     highlightedModules = refs ? refs.map(r => r[1]) : [];
   2525     highlightedNet = net;
   2526     drawHighlights();
   2527     EventHandler.emitEvent(
   2528       IBOM_EVENT_TYPES.HIGHLIGHT_EVENT,
   2529       {
   2530         rowid: rowid,
   2531         refs: refs,
   2532         net: net
   2533       });
   2534   }
   2535 }
   2536 
   2537 function entryMatches(entry) {
   2538   if (settings.bommode == "netlist") {
   2539     // entry is just a net name
   2540     return entry.toLowerCase().indexOf(filter) >= 0;
   2541   }
   2542   // check refs
   2543   for (var ref of entry[3]) {
   2544     if (ref[0].toLowerCase().indexOf(filter) >= 0) {
   2545       return true;
   2546     }
   2547   }
   2548   // check extra fields
   2549   for (var i in config.extra_fields) {
   2550     if (entry[4][i].toLowerCase().indexOf(filter) >= 0) {
   2551       return true;
   2552     }
   2553   }
   2554   // check value
   2555   if (entry[1].toLowerCase().indexOf(filter) >= 0) {
   2556     return true;
   2557   }
   2558   // check footprint
   2559   if (entry[2].toLowerCase().indexOf(filter) >= 0) {
   2560     return true;
   2561   }
   2562   return false;
   2563 }
   2564 
   2565 function findRefInEntry(entry) {
   2566   return entry[3].filter(r => r[0].toLowerCase() == reflookup);
   2567 }
   2568 
   2569 function highlightFilter(s) {
   2570   if (!filter) {
   2571     return s;
   2572   }
   2573   var parts = s.toLowerCase().split(filter);
   2574   if (parts.length == 1) {
   2575     return s;
   2576   }
   2577   var r = "";
   2578   var pos = 0;
   2579   for (var i in parts) {
   2580     if (i > 0) {
   2581       r += '<mark class="highlight">' +
   2582         s.substring(pos, pos + filter.length) +
   2583         '</mark>';
   2584       pos += filter.length;
   2585     }
   2586     r += s.substring(pos, pos + parts[i].length);
   2587     pos += parts[i].length;
   2588   }
   2589   return r;
   2590 }
   2591 
   2592 function checkboxSetUnsetAllHandler(checkboxname) {
   2593   return function() {
   2594     var checkboxnum = 0;
   2595     while (checkboxnum < settings.checkboxes.length &&
   2596       settings.checkboxes[checkboxnum].toLowerCase() != checkboxname.toLowerCase()) {
   2597       checkboxnum++;
   2598     }
   2599     if (checkboxnum >= settings.checkboxes.length) {
   2600       return;
   2601     }
   2602     var allset = true;
   2603     var checkbox;
   2604     var row;
   2605     for (row of bombody.childNodes) {
   2606       checkbox = row.childNodes[checkboxnum + 1].childNodes[0];
   2607       if (!checkbox.checked || checkbox.indeterminate) {
   2608         allset = false;
   2609         break;
   2610       }
   2611     }
   2612     for (row of bombody.childNodes) {
   2613       checkbox = row.childNodes[checkboxnum + 1].childNodes[0];
   2614       checkbox.checked = !allset;
   2615       checkbox.indeterminate = false;
   2616       checkbox.onchange();
   2617     }
   2618   }
   2619 }
   2620 
   2621 function createColumnHeader(name, cls, comparator) {
   2622   var th = document.createElement("TH");
   2623   th.innerHTML = name;
   2624   th.classList.add(cls);
   2625   th.style.cursor = "pointer";
   2626   var span = document.createElement("SPAN");
   2627   span.classList.add("sortmark");
   2628   span.classList.add("none");
   2629   th.appendChild(span);
   2630   th.onclick = function() {
   2631     if (currentSortColumn && this !== currentSortColumn) {
   2632       // Currently sorted by another column
   2633       currentSortColumn.childNodes[1].classList.remove(currentSortOrder);
   2634       currentSortColumn.childNodes[1].classList.add("none");
   2635       currentSortColumn = null;
   2636       currentSortOrder = null;
   2637     }
   2638     if (currentSortColumn && this === currentSortColumn) {
   2639       // Already sorted by this column
   2640       if (currentSortOrder == "asc") {
   2641         // Sort by this column, descending order
   2642         bomSortFunction = function(a, b) {
   2643           return -comparator(a, b);
   2644         }
   2645         currentSortColumn.childNodes[1].classList.remove("asc");
   2646         currentSortColumn.childNodes[1].classList.add("desc");
   2647         currentSortOrder = "desc";
   2648       } else {
   2649         // Unsort
   2650         bomSortFunction = null;
   2651         currentSortColumn.childNodes[1].classList.remove("desc");
   2652         currentSortColumn.childNodes[1].classList.add("none");
   2653         currentSortColumn = null;
   2654         currentSortOrder = null;
   2655       }
   2656     } else {
   2657       // Sort by this column, ascending order
   2658       bomSortFunction = comparator;
   2659       currentSortColumn = this;
   2660       currentSortColumn.childNodes[1].classList.remove("none");
   2661       currentSortColumn.childNodes[1].classList.add("asc");
   2662       currentSortOrder = "asc";
   2663     }
   2664     populateBomBody();
   2665   }
   2666   return th;
   2667 }
   2668 
   2669 function populateBomHeader() {
   2670   while (bomhead.firstChild) {
   2671     bomhead.removeChild(bomhead.firstChild);
   2672   }
   2673   var tr = document.createElement("TR");
   2674   var th = document.createElement("TH");
   2675   th.classList.add("numCol");
   2676   tr.appendChild(th);
   2677   var checkboxCompareClosure = function(checkbox) {
   2678     return (a, b) => {
   2679       var stateA = getCheckboxState(checkbox, a[3]);
   2680       var stateB = getCheckboxState(checkbox, b[3]);
   2681       if (stateA > stateB) return -1;
   2682       if (stateA < stateB) return 1;
   2683       return 0;
   2684     }
   2685   }
   2686   if (settings.bommode == "netlist") {
   2687     th = createColumnHeader("Net name", "bom-netname", (a, b) => {
   2688       if (a > b) return -1;
   2689       if (a < b) return 1;
   2690       return 0;
   2691     });
   2692     tr.appendChild(th);
   2693   } else {
   2694     for (var checkbox of settings.checkboxes) {
   2695       th = createColumnHeader(
   2696         checkbox, "bom-checkbox", checkboxCompareClosure(checkbox));
   2697       th.onclick = fancyDblClickHandler(
   2698         th, th.onclick.bind(th), checkboxSetUnsetAllHandler(checkbox));
   2699       tr.appendChild(th);
   2700     }
   2701     tr.appendChild(createColumnHeader("References", "References", (a, b) => {
   2702       var i = 0;
   2703       while (i < a[3].length && i < b[3].length) {
   2704         if (a[3][i] != b[3][i]) return a[3][i] > b[3][i] ? 1 : -1;
   2705         i++;
   2706       }
   2707       return a[3].length - b[3].length;
   2708     }));
   2709     // Extra fields
   2710     if (config.extra_fields.length > 0) {
   2711       var extraFieldCompareClosure = function(fieldIndex) {
   2712         return (a, b) => {
   2713           var fa = a[4][fieldIndex];
   2714           var fb = b[4][fieldIndex];
   2715           if (fa != fb) return fa > fb ? 1 : -1;
   2716           else return 0;
   2717         }
   2718       }
   2719       for (var i in config.extra_fields) {
   2720         tr.appendChild(createColumnHeader(
   2721           config.extra_fields[i], "extra", extraFieldCompareClosure(i)));
   2722       }
   2723     }
   2724     tr.appendChild(createColumnHeader("Value", "Value", (a, b) => {
   2725       return valueCompare(a[5], b[5], a[1], b[1]);
   2726     }));
   2727     tr.appendChild(createColumnHeader("Footprint", "Footprint", (a, b) => {
   2728       if (a[2] != b[2]) return a[2] > b[2] ? 1 : -1;
   2729       else return 0;
   2730     }));
   2731     if (settings.bommode == "grouped") {
   2732       tr.appendChild(createColumnHeader("Quantity", "Quantity", (a, b) => {
   2733         return a[3].length - b[3].length;
   2734       }));
   2735     }
   2736   }
   2737   bomhead.appendChild(tr);
   2738 }
   2739 
   2740 function populateBomBody() {
   2741   while (bom.firstChild) {
   2742     bom.removeChild(bom.firstChild);
   2743   }
   2744   highlightHandlers = [];
   2745   moduleIndexToHandler = {};
   2746   netsToHandler = {};
   2747   currentHighlightedRowId = null;
   2748   var first = true;
   2749   if (settings.bommode == "netlist") {
   2750     bomtable = pcbdata.nets.slice();
   2751   } else {
   2752     switch (settings.canvaslayout) {
   2753       case 'F':
   2754         bomtable = pcbdata.bom.F.slice();
   2755         break;
   2756       case 'FB':
   2757         bomtable = pcbdata.bom.both.slice();
   2758         break;
   2759       case 'B':
   2760         bomtable = pcbdata.bom.B.slice();
   2761         break;
   2762     }
   2763     if (settings.bommode == "ungrouped") {
   2764       // expand bom table
   2765       expandedTable = []
   2766       for (var bomentry of bomtable) {
   2767         for (var ref of bomentry[3]) {
   2768           expandedTable.push([1, bomentry[1], bomentry[2], [ref], bomentry[4], bomentry[5]]);
   2769         }
   2770       }
   2771       bomtable = expandedTable;
   2772     }
   2773   }
   2774   if (bomSortFunction) {
   2775     bomtable = bomtable.sort(bomSortFunction);
   2776   }
   2777   for (var i in bomtable) {
   2778     var bomentry = bomtable[i];
   2779     if (filter && !entryMatches(bomentry)) {
   2780       continue;
   2781     }
   2782     var references = null;
   2783     var netname = null;
   2784     var tr = document.createElement("TR");
   2785     var td = document.createElement("TD");
   2786     var rownum = +i + 1;
   2787     tr.id = "bomrow" + rownum;
   2788     td.textContent = rownum;
   2789     tr.appendChild(td);
   2790     if (settings.bommode == "netlist") {
   2791       netname = bomentry;
   2792       td = document.createElement("TD");
   2793       td.innerHTML = highlightFilter(netname ? netname : "&lt;no net&gt;");
   2794       tr.appendChild(td);
   2795     } else {
   2796       if (reflookup) {
   2797         references = findRefInEntry(bomentry);
   2798         if (references.length == 0) {
   2799           continue;
   2800         }
   2801       } else {
   2802         references = bomentry[3];
   2803       }
   2804       // Checkboxes
   2805       for (var checkbox of settings.checkboxes) {
   2806         if (checkbox) {
   2807           td = document.createElement("TD");
   2808           var input = document.createElement("input");
   2809           input.type = "checkbox";
   2810           input.onchange = createCheckboxChangeHandler(checkbox, references);
   2811           setBomCheckboxState(checkbox, input, references);
   2812           if (input.checked && settings.darkenWhenChecked == checkbox) {
   2813             tr.classList.add("checked");
   2814           }
   2815           td.appendChild(input);
   2816           tr.appendChild(td);
   2817         }
   2818       }
   2819       // References
   2820       td = document.createElement("TD");
   2821       td.innerHTML = highlightFilter(references.map(r => r[0]).join(", "));
   2822       tr.appendChild(td);
   2823       // Extra fields
   2824       for (var i in config.extra_fields) {
   2825         td = document.createElement("TD");
   2826         td.innerHTML = highlightFilter(bomentry[4][i]);
   2827         tr.appendChild(td);
   2828       }
   2829       // Value
   2830       td = document.createElement("TD");
   2831       td.innerHTML = highlightFilter(bomentry[1]);
   2832       tr.appendChild(td);
   2833       // Footprint
   2834       td = document.createElement("TD");
   2835       td.innerHTML = highlightFilter(bomentry[2]);
   2836       tr.appendChild(td);
   2837       if (settings.bommode == "grouped") {
   2838         // Quantity
   2839         td = document.createElement("TD");
   2840         td.textContent = bomentry[3].length;
   2841         tr.appendChild(td);
   2842       }
   2843     }
   2844     bom.appendChild(tr);
   2845     var handler = createRowHighlightHandler(tr.id, references, netname);
   2846     tr.onmousemove = handler;
   2847     highlightHandlers.push({
   2848       id: tr.id,
   2849       handler: handler,
   2850     });
   2851     if (references !== null) {
   2852       for (var refIndex of references.map(r => r[1])) {
   2853         moduleIndexToHandler[refIndex] = handler;
   2854       }
   2855     }
   2856     if (netname !== null) {
   2857       netsToHandler[netname] = handler;
   2858     }
   2859     if ((filter || reflookup) && first) {
   2860       handler();
   2861       first = false;
   2862     }
   2863   }
   2864   EventHandler.emitEvent(
   2865     IBOM_EVENT_TYPES.BOM_BODY_CHANGE_EVENT,
   2866     {
   2867       filter: filter,
   2868       reflookup: reflookup,
   2869       checkboxes: settings.checkboxes,
   2870       bommode: settings.bommode,
   2871     });
   2872 }
   2873 
   2874 function highlightPreviousRow() {
   2875   if (!currentHighlightedRowId) {
   2876     highlightHandlers[highlightHandlers.length - 1].handler();
   2877   } else {
   2878     if (highlightHandlers.length > 1 &&
   2879       highlightHandlers[0].id == currentHighlightedRowId) {
   2880       highlightHandlers[highlightHandlers.length - 1].handler();
   2881     } else {
   2882       for (var i = 0; i < highlightHandlers.length - 1; i++) {
   2883         if (highlightHandlers[i + 1].id == currentHighlightedRowId) {
   2884           highlightHandlers[i].handler();
   2885           break;
   2886         }
   2887       }
   2888     }
   2889   }
   2890   smoothScrollToRow(currentHighlightedRowId);
   2891 }
   2892 
   2893 function highlightNextRow() {
   2894   if (!currentHighlightedRowId) {
   2895     highlightHandlers[0].handler();
   2896   } else {
   2897     if (highlightHandlers.length > 1 &&
   2898       highlightHandlers[highlightHandlers.length - 1].id == currentHighlightedRowId) {
   2899       highlightHandlers[0].handler();
   2900     } else {
   2901       for (var i = 1; i < highlightHandlers.length; i++) {
   2902         if (highlightHandlers[i - 1].id == currentHighlightedRowId) {
   2903           highlightHandlers[i].handler();
   2904           break;
   2905         }
   2906       }
   2907     }
   2908   }
   2909   smoothScrollToRow(currentHighlightedRowId);
   2910 }
   2911 
   2912 function populateBomTable() {
   2913   populateBomHeader();
   2914   populateBomBody();
   2915 }
   2916 
   2917 function modulesClicked(moduleIndexes) {
   2918   var lastClickedIndex = moduleIndexes.indexOf(lastClicked);
   2919   for (var i = 1; i <= moduleIndexes.length; i++) {
   2920     var refIndex = moduleIndexes[(lastClickedIndex + i) % moduleIndexes.length];
   2921     if (refIndex in moduleIndexToHandler) {
   2922       lastClicked = refIndex;
   2923       moduleIndexToHandler[refIndex]();
   2924       smoothScrollToRow(currentHighlightedRowId);
   2925       break;
   2926     }
   2927   }
   2928 }
   2929 
   2930 function netClicked(net) {
   2931   if (net in netsToHandler) {
   2932     netsToHandler[net]();
   2933     smoothScrollToRow(currentHighlightedRowId);
   2934   } else {
   2935     clearHighlightedModules();
   2936     highlightedNet = net;
   2937     drawHighlights();
   2938   }
   2939 }
   2940 
   2941 function updateFilter(input) {
   2942   filter = input.toLowerCase();
   2943   populateBomTable();
   2944 }
   2945 
   2946 function updateRefLookup(input) {
   2947   reflookup = input.toLowerCase();
   2948   populateBomTable();
   2949 }
   2950 
   2951 function changeCanvasLayout(layout) {
   2952   document.getElementById("fl-btn").classList.remove("depressed");
   2953   document.getElementById("fb-btn").classList.remove("depressed");
   2954   document.getElementById("bl-btn").classList.remove("depressed");
   2955   switch (layout) {
   2956     case 'F':
   2957       document.getElementById("fl-btn").classList.add("depressed");
   2958       if (settings.bomlayout != "bom-only") {
   2959         canvassplit.collapse(1);
   2960       }
   2961       break;
   2962     case 'B':
   2963       document.getElementById("bl-btn").classList.add("depressed");
   2964       if (settings.bomlayout != "bom-only") {
   2965         canvassplit.collapse(0);
   2966       }
   2967       break;
   2968     default:
   2969       document.getElementById("fb-btn").classList.add("depressed");
   2970       if (settings.bomlayout != "bom-only") {
   2971         canvassplit.setSizes([50, 50]);
   2972       }
   2973   }
   2974   settings.canvaslayout = layout;
   2975   writeStorage("canvaslayout", layout);
   2976   resizeAll();
   2977   changeBomMode(settings.bommode);
   2978 }
   2979 
   2980 function populateMetadata() {
   2981   document.getElementById("title").innerHTML = pcbdata.metadata.title;
   2982   document.getElementById("revision").innerHTML = "Rev: " + pcbdata.metadata.revision;
   2983   document.getElementById("company").innerHTML = pcbdata.metadata.company;
   2984   document.getElementById("filedate").innerHTML = pcbdata.metadata.date;
   2985   if (pcbdata.metadata.title != "") {
   2986     document.title = pcbdata.metadata.title + " BOM";
   2987   }
   2988   // Calculate board stats
   2989   var fp_f = 0, fp_b = 0, pads_f = 0, pads_b = 0, pads_th = 0;
   2990   for (var i = 0; i < pcbdata.modules.length; i++) {
   2991     if (pcbdata.bom.skipped.includes(i)) continue;
   2992     var mod = pcbdata.modules[i];
   2993     if (mod.layer == "F") {
   2994       fp_f++;
   2995     } else {
   2996       fp_b++;
   2997     }
   2998     for (var pad of mod.pads) {
   2999       if (pad.type == "th") {
   3000         pads_th++;
   3001       } else {
   3002         if (pad.layers.includes("F")) {
   3003           pads_f++;
   3004         }
   3005         if (pad.layers.includes("B")) {
   3006           pads_b++;
   3007         }
   3008       }
   3009     }
   3010   }
   3011   document.getElementById("stats-components-front").innerHTML = fp_f;
   3012   document.getElementById("stats-components-back").innerHTML = fp_b;
   3013   document.getElementById("stats-components-total").innerHTML = fp_f + fp_b;
   3014   document.getElementById("stats-groups-front").innerHTML = pcbdata.bom.F.length;
   3015   document.getElementById("stats-groups-back").innerHTML = pcbdata.bom.B.length;
   3016   document.getElementById("stats-groups-total").innerHTML = pcbdata.bom.both.length;
   3017   document.getElementById("stats-smd-pads-front").innerHTML = pads_f;
   3018   document.getElementById("stats-smd-pads-back").innerHTML = pads_b;
   3019   document.getElementById("stats-smd-pads-total").innerHTML = pads_f + pads_b;
   3020   document.getElementById("stats-th-pads").innerHTML = pads_th;
   3021   // Update version string
   3022   document.getElementById("github-link").innerHTML = "InteractiveHtmlBom&nbsp;" +
   3023     /^v\d+\.\d+/.exec(pcbdata.ibom_version)[0];
   3024 }
   3025 
   3026 function changeBomLayout(layout) {
   3027   document.getElementById("bom-btn").classList.remove("depressed");
   3028   document.getElementById("lr-btn").classList.remove("depressed");
   3029   document.getElementById("tb-btn").classList.remove("depressed");
   3030   switch (layout) {
   3031     case 'bom-only':
   3032       document.getElementById("bom-btn").classList.add("depressed");
   3033       if (bomsplit) {
   3034         bomsplit.destroy();
   3035         bomsplit = null;
   3036         canvassplit.destroy();
   3037         canvassplit = null;
   3038       }
   3039       document.getElementById("frontcanvas").style.display = "none";
   3040       document.getElementById("backcanvas").style.display = "none";
   3041       document.getElementById("bot").style.height = "";
   3042       break;
   3043     case 'top-bottom':
   3044       document.getElementById("tb-btn").classList.add("depressed");
   3045       document.getElementById("frontcanvas").style.display = "";
   3046       document.getElementById("backcanvas").style.display = "";
   3047       document.getElementById("bot").style.height = "calc(100% - 80px)";
   3048       document.getElementById("bomdiv").classList.remove("split-horizontal");
   3049       document.getElementById("canvasdiv").classList.remove("split-horizontal");
   3050       document.getElementById("frontcanvas").classList.add("split-horizontal");
   3051       document.getElementById("backcanvas").classList.add("split-horizontal");
   3052       if (bomsplit) {
   3053         bomsplit.destroy();
   3054         bomsplit = null;
   3055         canvassplit.destroy();
   3056         canvassplit = null;
   3057       }
   3058       bomsplit = Split(['#bomdiv', '#canvasdiv'], {
   3059         sizes: [50, 50],
   3060         onDragEnd: resizeAll,
   3061         direction: "vertical",
   3062         gutterSize: 5
   3063       });
   3064       canvassplit = Split(['#frontcanvas', '#backcanvas'], {
   3065         sizes: [50, 50],
   3066         gutterSize: 5,
   3067         onDragEnd: resizeAll
   3068       });
   3069       break;
   3070     case 'left-right':
   3071       document.getElementById("lr-btn").classList.add("depressed");
   3072       document.getElementById("frontcanvas").style.display = "";
   3073       document.getElementById("backcanvas").style.display = "";
   3074       document.getElementById("bot").style.height = "calc(100% - 80px)";
   3075       document.getElementById("bomdiv").classList.add("split-horizontal");
   3076       document.getElementById("canvasdiv").classList.add("split-horizontal");
   3077       document.getElementById("frontcanvas").classList.remove("split-horizontal");
   3078       document.getElementById("backcanvas").classList.remove("split-horizontal");
   3079       if (bomsplit) {
   3080         bomsplit.destroy();
   3081         bomsplit = null;
   3082         canvassplit.destroy();
   3083         canvassplit = null;
   3084       }
   3085       bomsplit = Split(['#bomdiv', '#canvasdiv'], {
   3086         sizes: [50, 50],
   3087         onDragEnd: resizeAll,
   3088         gutterSize: 5
   3089       });
   3090       canvassplit = Split(['#frontcanvas', '#backcanvas'], {
   3091         sizes: [50, 50],
   3092         gutterSize: 5,
   3093         direction: "vertical",
   3094         onDragEnd: resizeAll
   3095       });
   3096   }
   3097   settings.bomlayout = layout;
   3098   writeStorage("bomlayout", layout);
   3099   changeCanvasLayout(settings.canvaslayout);
   3100 }
   3101 
   3102 function changeBomMode(mode) {
   3103   document.getElementById("bom-grouped-btn").classList.remove("depressed");
   3104   document.getElementById("bom-ungrouped-btn").classList.remove("depressed");
   3105   document.getElementById("bom-netlist-btn").classList.remove("depressed");
   3106   switch (mode) {
   3107     case 'grouped':
   3108       document.getElementById("bom-grouped-btn").classList.add("depressed");
   3109       break;
   3110     case 'ungrouped':
   3111       document.getElementById("bom-ungrouped-btn").classList.add("depressed");
   3112       break;
   3113     case 'netlist':
   3114       document.getElementById("bom-netlist-btn").classList.add("depressed");
   3115   }
   3116   writeStorage("bommode", mode);
   3117   if (mode != settings.bommode) {
   3118     settings.bommode = mode;
   3119     bomSortFunction = null;
   3120     currentSortColumn = null;
   3121     currentSortOrder = null;
   3122     clearHighlightedModules();
   3123   }
   3124   populateBomTable();
   3125 }
   3126 
   3127 function focusFilterField() {
   3128   focusInputField(document.getElementById("filter"));
   3129 }
   3130 
   3131 function focusRefLookupField() {
   3132   focusInputField(document.getElementById("reflookup"));
   3133 }
   3134 
   3135 function toggleBomCheckbox(bomrowid, checkboxnum) {
   3136   if (!bomrowid || checkboxnum > settings.checkboxes.length) {
   3137     return;
   3138   }
   3139   var bomrow = document.getElementById(bomrowid);
   3140   var checkbox = bomrow.childNodes[checkboxnum].childNodes[0];
   3141   checkbox.checked = !checkbox.checked;
   3142   checkbox.indeterminate = false;
   3143   checkbox.onchange();
   3144 }
   3145 
   3146 function checkBomCheckbox(bomrowid, checkboxname) {
   3147   var checkboxnum = 0;
   3148   while (checkboxnum < settings.checkboxes.length &&
   3149     settings.checkboxes[checkboxnum].toLowerCase() != checkboxname.toLowerCase()) {
   3150     checkboxnum++;
   3151   }
   3152   if (!bomrowid || checkboxnum >= settings.checkboxes.length) {
   3153     return;
   3154   }
   3155   var bomrow = document.getElementById(bomrowid);
   3156   var checkbox = bomrow.childNodes[checkboxnum + 1].childNodes[0];
   3157   checkbox.checked = true;
   3158   checkbox.indeterminate = false;
   3159   checkbox.onchange();
   3160 }
   3161 
   3162 function setBomCheckboxes(value) {
   3163   writeStorage("bomCheckboxes", value);
   3164   settings.checkboxes = value.split(",").filter((e) => e);
   3165   prepCheckboxes();
   3166   populateBomTable();
   3167   populateDarkenWhenCheckedOptions();
   3168 }
   3169 
   3170 function setDarkenWhenChecked(value) {
   3171   writeStorage("darkenWhenChecked", value);
   3172   settings.darkenWhenChecked = value;
   3173   populateBomTable();
   3174 }
   3175 
   3176 function prepCheckboxes() {
   3177   var table = document.getElementById("checkbox-stats");
   3178   while (table.childElementCount > 1) {
   3179     table.removeChild(table.lastChild);
   3180   }
   3181   if (settings.checkboxes.length) {
   3182     table.style.display = "";
   3183   } else {
   3184     table.style.display = "none";
   3185   }
   3186   for (var checkbox of settings.checkboxes) {
   3187     var tr = document.createElement("TR");
   3188     var td = document.createElement("TD");
   3189     td.innerHTML = checkbox;
   3190     tr.appendChild(td);
   3191     td = document.createElement("TD");
   3192     td.id = "checkbox-stats-" + checkbox;
   3193     var progressbar = document.createElement("div");
   3194     progressbar.classList.add("bar");
   3195     td.appendChild(progressbar);
   3196     var text = document.createElement("div");
   3197     text.classList.add("text");
   3198     td.appendChild(text);
   3199     tr.appendChild(td);
   3200     table.appendChild(tr);
   3201     updateCheckboxStats(checkbox);
   3202   }
   3203 }
   3204 
   3205 function populateDarkenWhenCheckedOptions() {
   3206   var container = document.getElementById("darkenWhenCheckedContainer");
   3207 
   3208   if (settings.checkboxes.length == 0) {
   3209     container.parentElement.style.display = "none";
   3210     return;
   3211   }
   3212 
   3213   container.innerHTML = '';
   3214   container.parentElement.style.display = "inline-block";
   3215 
   3216   function createOption(name, displayName) {
   3217     var id = "darkenWhenChecked-" + name;
   3218 
   3219     var div = document.createElement("div");
   3220     div.classList.add("radio-container");
   3221 
   3222     var input = document.createElement("input");
   3223     input.type = "radio";
   3224     input.name = "darkenWhenChecked";
   3225     input.value = name;
   3226     input.id = id;
   3227     input.onchange = () => setDarkenWhenChecked(name);
   3228     div.appendChild(input);
   3229 
   3230     // Preserve the selected element when the checkboxes change
   3231     if (name == settings.darkenWhenChecked) {
   3232       input.checked = true;
   3233     }
   3234 
   3235     var label = document.createElement("label");
   3236     label.innerHTML = displayName;
   3237     label.htmlFor = id;
   3238     div.appendChild(label);
   3239 
   3240     container.appendChild(div);
   3241   }
   3242   createOption("", "None");
   3243   for (var checkbox of settings.checkboxes) {
   3244     createOption(checkbox, checkbox);
   3245   }
   3246 }
   3247 
   3248 function updateCheckboxStats(checkbox) {
   3249   var checked = getStoredCheckboxRefs(checkbox).size;
   3250   var total = pcbdata.modules.length - pcbdata.bom.skipped.length;
   3251   var percent = checked * 100.0 / total;
   3252   var td = document.getElementById("checkbox-stats-" + checkbox);
   3253   td.firstChild.style.width = percent + "%";
   3254   td.lastChild.innerHTML = checked + "/" + total + " (" + Math.round(percent) + "%)";
   3255 }
   3256 
   3257 document.onkeydown = function(e) {
   3258   switch (e.key) {
   3259     case "n":
   3260       if (document.activeElement.type == "text") {
   3261         return;
   3262       }
   3263       if (currentHighlightedRowId !== null) {
   3264         checkBomCheckbox(currentHighlightedRowId, "placed");
   3265         highlightNextRow();
   3266         e.preventDefault();
   3267       }
   3268       break;
   3269     case "ArrowUp":
   3270       highlightPreviousRow();
   3271       e.preventDefault();
   3272       break;
   3273     case "ArrowDown":
   3274       highlightNextRow();
   3275       e.preventDefault();
   3276       break;
   3277     default:
   3278       break;
   3279   }
   3280   if (e.altKey) {
   3281     switch (e.key) {
   3282       case "f":
   3283         focusFilterField();
   3284         e.preventDefault();
   3285         break;
   3286       case "r":
   3287         focusRefLookupField();
   3288         e.preventDefault();
   3289         break;
   3290       case "z":
   3291         changeBomLayout("bom-only");
   3292         e.preventDefault();
   3293         break;
   3294       case "x":
   3295         changeBomLayout("left-right");
   3296         e.preventDefault();
   3297         break;
   3298       case "c":
   3299         changeBomLayout("top-bottom");
   3300         e.preventDefault();
   3301         break;
   3302       case "v":
   3303         changeCanvasLayout("F");
   3304         e.preventDefault();
   3305         break;
   3306       case "b":
   3307         changeCanvasLayout("FB");
   3308         e.preventDefault();
   3309         break;
   3310       case "n":
   3311         changeCanvasLayout("B");
   3312         e.preventDefault();
   3313         break;
   3314       default:
   3315         break;
   3316     }
   3317     if (e.key >= '1' && e.key <= '9') {
   3318       toggleBomCheckbox(currentHighlightedRowId, parseInt(e.key));
   3319     }
   3320   }
   3321 }
   3322 
   3323 function hideNetlistButton() {
   3324   document.getElementById("bom-ungrouped-btn").classList.remove("middle-button");
   3325   document.getElementById("bom-ungrouped-btn").classList.add("right-most-button");
   3326   document.getElementById("bom-netlist-btn").style.display = "none";
   3327 }
   3328 
   3329 window.onload = function(e) {
   3330   initUtils();
   3331   initRender();
   3332   initStorage();
   3333   initDefaults();
   3334   cleanGutters();
   3335   populateMetadata();
   3336   dbgdiv = document.getElementById("dbg");
   3337   bom = document.getElementById("bombody");
   3338   bomhead = document.getElementById("bomhead");
   3339   filter = "";
   3340   reflookup = "";
   3341   if (!("nets" in pcbdata)) {
   3342     hideNetlistButton();
   3343   }
   3344   initDone = true;
   3345   prepCheckboxes();
   3346   // Triggers render
   3347   changeBomLayout(settings.bomlayout);
   3348 
   3349   // Users may leave fullscreen without touching the checkbox. Uncheck.
   3350   document.addEventListener('fullscreenchange', () => {
   3351     if (!document.fullscreenElement)
   3352       document.getElementById('fullscreenCheckbox').checked = false;
   3353   });
   3354 }
   3355 
   3356 window.onresize = resizeAll;
   3357 window.matchMedia("print").addListener(resizeAll);
   3358 
   3359 ///////////////////////////////////////////////
   3360 
   3361 ///////////////////////////////////////////////
   3362 
   3363 window.setTimeout(function() {
   3364 	//tracksVisible(true);
   3365 },1000);
   3366 
   3367 
   3368 ///////////////////////////////////////////////
   3369   </script>
   3370 </head>
   3371 
   3372 <body>
   3373 
   3374 <div id="topmostdiv" class="topmostdiv">
   3375   <div id="top">
   3376     <div style="float: right; height: 100%;">
   3377       <div class="hideonprint menu" style="float: right; top: 8px;">
   3378         <button class="menubtn"></button>
   3379         <div class="menu-content">
   3380           <label class="menu-label menu-label-top" style="width: calc(50% - 18px)">
   3381             <input id="darkmodeCheckbox" type="checkbox" onchange="setDarkMode(this.checked)">
   3382             Dark mode
   3383           </label><!-- This comment eats space! All of it!
   3384           --><label class="menu-label menu-label-top" style="width: calc(50% - 17px); border-left: 0;">
   3385             <input id="fullscreenCheckbox" type="checkbox" onchange="setFullscreen(this.checked)">
   3386             Full Screen
   3387           </label>
   3388           <label class="menu-label" style="width: calc(50% - 18px)">
   3389             <input id="fabricationCheckbox" type="checkbox" checked onchange="fabricationVisible(this.checked)">
   3390             Fab layer
   3391           </label><!-- This comment eats space! All of it!
   3392           --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
   3393             <input id="silkscreenCheckbox" type="checkbox" checked onchange="silkscreenVisible(this.checked)">
   3394             Silkscreen
   3395           </label>
   3396           <label class="menu-label" style="width: calc(50% - 18px)">
   3397             <input id="referencesCheckbox" type="checkbox" checked onchange="referencesVisible(this.checked)">
   3398             References
   3399           </label><!-- This comment eats space! All of it!
   3400           --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
   3401             <input id="valuesCheckbox" type="checkbox" checked onchange="valuesVisible(this.checked)">
   3402             Values
   3403           </label>
   3404           <div id="tracksAndZonesCheckboxes">
   3405             <label class="menu-label" style="width: calc(50% - 18px)">
   3406               <input id="tracksCheckbox" type="checkbox" checked onchange="tracksVisible(this.checked)">
   3407               Tracks
   3408             </label><!-- This comment eats space! All of it!
   3409             --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
   3410               <input id="zonesCheckbox" type="checkbox" checked onchange="zonesVisible(this.checked)">
   3411               Zones
   3412             </label>
   3413           </div>
   3414           <label class="menu-label" style="width: calc(50% - 18px)">
   3415             <input id="padsCheckbox" type="checkbox" checked onchange="padsVisible(this.checked)">
   3416             Pads
   3417           </label><!-- This comment eats space! All of it!
   3418           --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
   3419             <input id="dnpOutlineCheckbox" type="checkbox" checked onchange="dnpOutline(this.checked)">
   3420             DNP outlined
   3421           </label>
   3422           <label class="menu-label">
   3423             <input id="highlightpin1Checkbox" type="checkbox" onchange="setHighlightPin1(this.checked)">
   3424             Highlight first pin
   3425           </label>
   3426           <label class="menu-label">
   3427             <input id="dragCheckbox" type="checkbox" checked onchange="setRedrawOnDrag(this.checked)">
   3428             Continuous redraw on drag
   3429           </label>
   3430           <label class="menu-label">
   3431             <span>Board rotation</span>
   3432             <span style="float: right"><span id="rotationDegree">0</span>&#176;</span>
   3433             <input id="boardRotation" type="range" min="-36" max="36" value="0" class="slider" oninput="setBoardRotation(this.value)">
   3434           </label>
   3435           <label class="menu-label">
   3436             <div style="margin-left: 5px">Bom checkboxes</div>
   3437             <input id="bomCheckboxes" class="menu-textbox" type=text
   3438                    oninput="setBomCheckboxes(this.value)">
   3439           </label>
   3440           <label class="menu-label">
   3441             <div style="margin-left: 5px">Darken when checked</div>
   3442             <div id="darkenWhenCheckedContainer"></div>
   3443           </label>
   3444           <label class="menu-label">
   3445             <span class="shameless-plug">
   3446               <span>Created using</span>
   3447               <a id="github-link" target="blank" href="https://github.com/openscopeproject/InteractiveHtmlBom">InteractiveHtmlBom</a>
   3448             </span>
   3449           </label>
   3450         </div>
   3451       </div>
   3452       <div class="button-container hideonprint"
   3453            style="float: right; position: relative; top: 8px">
   3454         <button id="fl-btn" class="left-most-button" onclick="changeCanvasLayout('F')"
   3455                 title="Front only">F
   3456         </button>
   3457         <button id="fb-btn" class="middle-button" onclick="changeCanvasLayout('FB')"
   3458                 title="Front and Back">FB
   3459         </button>
   3460         <button id="bl-btn" class="right-most-button" onclick="changeCanvasLayout('B')"
   3461                 title="Back only">B
   3462         </button>
   3463       </div>
   3464       <div class="button-container hideonprint"
   3465            style="float: right; position: relative; top: 8px">
   3466         <button id="bom-btn" class="left-most-button" onclick="changeBomLayout('bom-only')"
   3467                 title="BOM only"></button>
   3468         <button id="lr-btn" class="middle-button" onclick="changeBomLayout('left-right')"
   3469                 title="BOM left, drawings right"></button>
   3470         <button id="tb-btn" class="right-most-button" onclick="changeBomLayout('top-bottom')"
   3471                 title="BOM top, drawings bot"></button>
   3472       </div>
   3473       <div class="button-container hideonprint"
   3474            style="float: right; position: relative; top: 8px">
   3475         <button id="bom-grouped-btn" class="left-most-button" onclick="changeBomMode('grouped')"
   3476                 title="Grouped BOM"></button>
   3477         <button id="bom-ungrouped-btn" class="middle-button" onclick="changeBomMode('ungrouped')"
   3478                 title="Ungrouped BOM"></button>
   3479         <button id="bom-netlist-btn" class="right-most-button" onclick="changeBomMode('netlist')"
   3480                 title="Netlist"></button>
   3481       </div>
   3482       <div class="hideonprint menu" style="float: right; top: 8px;">
   3483         <button class="statsbtn"></button>
   3484         <div class="menu-content">
   3485           <table class="stats">
   3486             <tbody>
   3487               <tr>
   3488                 <td width="40%">Board stats</td>
   3489                 <td>Front</td>
   3490                 <td>Back</td>
   3491                 <td>Total</td>
   3492               </tr>
   3493               <tr>
   3494                 <td>Components</td>
   3495                 <td id="stats-components-front">~</td>
   3496                 <td id="stats-components-back">~</td>
   3497                 <td id="stats-components-total">~</td>
   3498               </tr>
   3499               <tr>
   3500                 <td>Groups</td>
   3501                 <td id="stats-groups-front">~</td>
   3502                 <td id="stats-groups-back">~</td>
   3503                 <td id="stats-groups-total">~</td>
   3504               </tr>
   3505               <tr>
   3506                 <td>SMD pads</td>
   3507                 <td id="stats-smd-pads-front">~</td>
   3508                 <td id="stats-smd-pads-back">~</td>
   3509                 <td id="stats-smd-pads-total">~</td>
   3510               </tr>
   3511               <tr>
   3512                 <td>TH pads</td>
   3513                 <td colspan=3 id="stats-th-pads">~</td>
   3514               </tr>
   3515             </tbody>
   3516           </table>
   3517           <table class="stats">
   3518             <col width="40%"/><col />
   3519             <tbody id="checkbox-stats">
   3520               <tr>
   3521                 <td colspan=2 style="border-top: 0">Checkboxes</td>
   3522               </tr>
   3523             </tbody>
   3524           </table>
   3525         </div>
   3526       </div>
   3527       <div class="hideonprint menu" style="float: right; top: 8px;">
   3528         <button class="iobtn"></button>
   3529         <div class="menu-content">
   3530           <div class="menu-label menu-label-top">
   3531             <div style="margin-left: 5px;">Save board image</div>
   3532             <div class="flexbox">
   3533               <input id="render-save-width" class="menu-textbox" type="text" value="1000" placeholder="Width"
   3534                   style="flex-grow: 1; width: 50px;" oninput="validateSaveImgDimension(this)">
   3535               <span>X</span>
   3536               <input id="render-save-height" class="menu-textbox" type="text" value="1000" placeholder="Height"
   3537                   style="flex-grow: 1; width: 50px;" oninput="validateSaveImgDimension(this)">
   3538             </div>
   3539             <label>
   3540               <input id="render-save-transparent" type="checkbox">
   3541               Transparent background
   3542             </label>
   3543             <div class="flexbox">
   3544               <button class="savebtn" onclick="saveImage('F')">Front</button>
   3545               <button class="savebtn" onclick="saveImage('B')">Back</button>
   3546             </div>
   3547           </div>
   3548           <div class="menu-label">
   3549             <span style="margin-left: 5px;">Config and checkbox state</span>
   3550             <div class="flexbox">
   3551               <button class="savebtn" onclick="saveSettings()">Export</button>
   3552               <button class="savebtn" onclick="loadSettings()">Import</button>
   3553             </div>
   3554           </div>
   3555         </div>
   3556       </div>
   3557     </div>
   3558     <div id="fileinfodiv" style="overflow: auto;">
   3559       <table class="fileinfo">
   3560         <tbody>
   3561           <tr>
   3562             <td id="title" class="title" style="width: 70%">
   3563               Title
   3564             </td>
   3565             <td id="revision" class="title" style="width: 30%">
   3566               Revision
   3567             </td>
   3568           </tr>
   3569           <tr>
   3570             <td id="company">
   3571               Company
   3572             </td>
   3573             <td id="filedate">
   3574               Date
   3575             </td>
   3576           </tr>
   3577         </tbody>
   3578       </table>
   3579     </div>
   3580   </div>
   3581   <div id="bot" class="split" style="height: calc(100% - 80px)">
   3582     <div id="bomdiv" class="split split-horizontal">
   3583       <div style="width: 100%">
   3584         <input id="reflookup" class="textbox searchbox reflookup hideonprint" type="text" placeholder="Ref lookup"
   3585                oninput="updateRefLookup(this.value)">
   3586         <input id="filter" class="textbox searchbox filter hideonprint" type="text" placeholder="Filter"
   3587                oninput="updateFilter(this.value)">
   3588         <div class="button-container hideonprint" style="float: left; margin: 0;">
   3589           <button id="copy" title="Copy bom table to clipboard"
   3590                onclick="copyToClipboard()"></button>
   3591         </div>
   3592       </div>
   3593       <div id="dbg"></div>
   3594       <table class="bom">
   3595         <thead id="bomhead">
   3596         </thead>
   3597         <tbody id="bombody">
   3598         </tbody>
   3599       </table>
   3600     </div>
   3601     <div id="canvasdiv" class="split split-horizontal">
   3602       <div id="frontcanvas" class="split" touch-action="none" style="overflow: hidden">
   3603         <div style="position: relative; width: 100%; height: 100%;">
   3604           <canvas id="F_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
   3605           <canvas id="F_fab" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
   3606           <canvas id="F_slk" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas>
   3607           <canvas id="F_hl" style="position: absolute; left: 0; top: 0; z-index: 3;"></canvas>
   3608         </div>
   3609       </div>
   3610       <div id="backcanvas" class="split" touch-action="none" style="overflow: hidden">
   3611         <div style="position: relative; width: 100%; height: 100%;">
   3612           <canvas id="B_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
   3613           <canvas id="B_fab" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
   3614           <canvas id="B_slk" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas>
   3615           <canvas id="B_hl" style="position: absolute; left: 0; top: 0; z-index: 3;"></canvas>
   3616         </div>
   3617       </div>
   3618     </div>
   3619   </div>
   3620 </div>
   3621 
   3622 </body>
   3623 
   3624 </html>
	reform MNT Reform: Open Source Portable Computer
	Log (Feed) \| Files \| Refs (Tags) \| README