MNT Reform: Open Source Portable Computer https://mntre.com/reform
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

3625 lines
155KB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Interactive BOM for KiCAD</title>
  7. <style type="text/css">
  8. :root {
  9. --pcb-edge-color: black;
  10. --pad-color: #878787;
  11. --pad-color-highlight: #D04040;
  12. --pin1-outline-color: #ffb629;
  13. --pin1-outline-color-highlight: #b4ff03;
  14. --silkscreen-edge-color: #aa4;
  15. --silkscreen-polygon-color: #4aa;
  16. --silkscreen-text-color: #4aa;
  17. --fabrication-edge-color: #907651;
  18. --fabrication-polygon-color: #907651;
  19. --fabrication-text-color: #a27c24;
  20. --track-color: #def5f1;
  21. --track-color-highlight: #D04040;
  22. --zone-color: #def5f1;
  23. --zone-color-highlight: #d0404080;
  24. }
  25. html, body {
  26. margin: 0px;
  27. height: 100%;
  28. font-family: Verdana, sans-serif;
  29. }
  30. .dark.topmostdiv {
  31. --pcb-edge-color: #eee;
  32. --pad-color: #808080;
  33. --pin1-outline-color: #ffa800;
  34. --pin1-outline-color-highlight: #ccff00;
  35. --track-color: #42524f;
  36. --zone-color: #42524f;
  37. background-color: #252c30;
  38. color: #eee;
  39. }
  40. button {
  41. background-color: #eee;
  42. border: 1px solid #888;
  43. color: black;
  44. height: 44px;
  45. width: 44px;
  46. text-align: center;
  47. text-decoration: none;
  48. display: inline-block;
  49. font-size: 14px;
  50. font-weight: bolder;
  51. }
  52. .dark button {
  53. /* This will be inverted */
  54. background-color: #c3b7b5;
  55. }
  56. button.depressed {
  57. background-color: #0a0;
  58. color: white;
  59. }
  60. .dark button.depressed {
  61. /* This will be inverted */
  62. background-color: #b3b;
  63. }
  64. button:focus {
  65. outline: 0;
  66. }
  67. button#tb-btn {
  68. 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");
  69. }
  70. button#lr-btn {
  71. 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");
  72. }
  73. button#bom-btn {
  74. 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");
  75. }
  76. button#bom-grouped-btn {
  77. 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");
  78. }
  79. button#bom-ungrouped-btn {
  80. 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");
  81. }
  82. button#bom-netlist-btn {
  83. 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");
  84. }
  85. button#copy {
  86. 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");
  87. background-position: 6px 6px;
  88. background-repeat: no-repeat;
  89. background-size: 26px 26px;
  90. border-radius: 6px;
  91. height: 40px;
  92. width: 40px;
  93. margin: 10px 5px;
  94. }
  95. button#copy:active {
  96. box-shadow: inset 0px 0px 5px #6c6c6c;
  97. }
  98. textarea.clipboard-temp {
  99. position: fixed;
  100. top: 0;
  101. left: 0;
  102. width: 2em;
  103. height: 2em;
  104. padding: 0;
  105. border: None;
  106. outline: None;
  107. box-shadow: None;
  108. background: transparent;
  109. }
  110. .left-most-button {
  111. border-right: 0;
  112. border-top-left-radius: 6px;
  113. border-bottom-left-radius: 6px;
  114. }
  115. .middle-button {
  116. border-right: 0;
  117. }
  118. .right-most-button {
  119. border-top-right-radius: 6px;
  120. border-bottom-right-radius: 6px;
  121. }
  122. .button-container {
  123. font-size: 0;
  124. margin: 10px 10px 10px 0px;
  125. }
  126. .dark .button-container {
  127. filter: invert(1);
  128. }
  129. .button-container button {
  130. background-size: 32px 32px;
  131. background-position: 5px 5px;
  132. background-repeat: no-repeat;
  133. }
  134. @media print {
  135. .hideonprint {
  136. display: none;
  137. }
  138. }
  139. canvas {
  140. cursor: crosshair;
  141. }
  142. canvas:active {
  143. cursor: grabbing;
  144. }
  145. .fileinfo {
  146. width: 100%;
  147. max-width: 1000px;
  148. border: none;
  149. padding: 5px;
  150. }
  151. .fileinfo .title {
  152. font-size: 20pt;
  153. font-weight: bold;
  154. }
  155. .fileinfo td {
  156. overflow: hidden;
  157. white-space: nowrap;
  158. max-width: 1px;
  159. width: 50%;
  160. text-overflow: ellipsis;
  161. }
  162. .bom {
  163. border-collapse: collapse;
  164. font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
  165. font-size: 10pt;
  166. table-layout: fixed;
  167. width: 100%;
  168. margin-top: 1px;
  169. }
  170. .bom th, .bom td {
  171. border: 1px solid black;
  172. padding: 5px;
  173. word-wrap: break-word;
  174. text-align: center;
  175. position: relative;
  176. }
  177. .dark .bom th, .dark .bom td {
  178. border: 1px solid #777;
  179. }
  180. .bom th {
  181. background-color: #CCCCCC;
  182. background-clip: padding-box;
  183. }
  184. .dark .bom th {
  185. background-color: #3b4749;
  186. }
  187. .bom tr.highlighted:nth-child(n) {
  188. background-color: #cfc;
  189. }
  190. .dark .bom tr.highlighted:nth-child(n) {
  191. background-color: #226022;
  192. }
  193. .bom tr:nth-child(even) {
  194. background-color: #f2f2f2;
  195. }
  196. .dark .bom tr:nth-child(even) {
  197. background-color: #313b40;
  198. }
  199. .bom tr.checked {
  200. color: #aaa;
  201. }
  202. .dark .bom tr.checked {
  203. color: #666;
  204. }
  205. .bom tr {
  206. transition: background-color 0.2s;
  207. }
  208. .bom .numCol {
  209. width: 25px;
  210. }
  211. .bom .Description {
  212. width: 10%;
  213. }
  214. .bom .Part {
  215. width: 10%;
  216. }
  217. .bom .Value {
  218. width: 15%;
  219. }
  220. .bom .Quantity {
  221. width: 65px;
  222. }
  223. .bom th .sortmark {
  224. position: absolute;
  225. right: 1px;
  226. top: 1px;
  227. margin-top: -5px;
  228. border-width: 5px;
  229. border-style: solid;
  230. border-color: transparent transparent #221 transparent;
  231. transform-origin: 50% 85%;
  232. transition: opacity 0.2s, transform 0.4s;
  233. }
  234. .dark .bom th .sortmark {
  235. filter: invert(1);
  236. }
  237. .bom th .sortmark.none {
  238. opacity: 0;
  239. }
  240. .bom th .sortmark.desc {
  241. transform: rotate(180deg);
  242. }
  243. .bom th:hover .sortmark.none {
  244. opacity: 0.5;
  245. }
  246. .bom .bom-checkbox {
  247. width: 30px;
  248. position: relative;
  249. user-select: none;
  250. -moz-user-select: none;
  251. }
  252. .bom .bom-checkbox:before {
  253. content: "";
  254. position: absolute;
  255. border-width: 15px;
  256. border-style: solid;
  257. border-color: #51829f transparent transparent transparent;
  258. visibility: hidden;
  259. top: -15px;
  260. }
  261. .bom .bom-checkbox:after {
  262. content: "Double click to set/unset all";
  263. position: absolute;
  264. color: white;
  265. top: -35px;
  266. left: -26px;
  267. background: #51829f;
  268. padding: 5px 15px;
  269. border-radius: 8px;
  270. white-space: nowrap;
  271. visibility: hidden;
  272. }
  273. .bom .bom-checkbox:hover:before, .bom .bom-checkbox:hover:after {
  274. visibility: visible;
  275. transition: visibility 0.2s linear 1s;
  276. }
  277. .split {
  278. -webkit-box-sizing: border-box;
  279. -moz-box-sizing: border-box;
  280. box-sizing: border-box;
  281. overflow-y: auto;
  282. overflow-x: hidden;
  283. background-color: inherit;
  284. }
  285. .split.split-horizontal, .gutter.gutter-horizontal {
  286. height: 100%;
  287. float: left;
  288. }
  289. .gutter {
  290. background-color: #ddd;
  291. background-repeat: no-repeat;
  292. background-position: 50%;
  293. transition: background-color 0.3s;
  294. }
  295. .dark .gutter {
  296. background-color: #777;
  297. }
  298. .gutter.gutter-horizontal {
  299. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
  300. cursor: ew-resize;
  301. width: 5px;
  302. }
  303. .gutter.gutter-vertical {
  304. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
  305. cursor: ns-resize;
  306. height: 5px;
  307. }
  308. .searchbox {
  309. float: left;
  310. height: 40px;
  311. margin: 10px 5px;
  312. padding: 12px 32px;
  313. font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
  314. font-size: 18px;
  315. box-sizing: border-box;
  316. border: 1px solid #888;
  317. border-radius: 6px;
  318. outline: none;
  319. background-color: #eee;
  320. transition: background-color 0.2s, border 0.2s;
  321. 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==');
  322. background-position: 10px 10px;
  323. background-repeat: no-repeat;
  324. }
  325. .dark .searchbox {
  326. background-color: #111;
  327. color: #eee;
  328. }
  329. .searchbox::placeholder {
  330. color: #ccc;
  331. }
  332. .dark .searchbox::placeholder {
  333. color: #666;
  334. }
  335. .filter {
  336. width: calc(60% - 64px);
  337. }
  338. .reflookup {
  339. width: calc(40% - 10px);
  340. }
  341. input[type=text]:focus {
  342. background-color: white;
  343. border: 1px solid #333;
  344. }
  345. .dark input[type=text]:focus {
  346. background-color: #333;
  347. border: 1px solid #ccc;
  348. }
  349. mark.highlight {
  350. background-color: #5050ff;
  351. color: #fff;
  352. padding: 2px;
  353. border-radius: 6px;
  354. }
  355. .dark mark.highlight {
  356. background-color: #76a6da;
  357. color: #111;
  358. }
  359. .menubtn {
  360. background-color: white;
  361. border: none;
  362. 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");
  363. background-position: center;
  364. background-repeat: no-repeat;
  365. }
  366. .statsbtn {
  367. background-color: white;
  368. border: none;
  369. 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");
  370. background-position: center;
  371. background-repeat: no-repeat;
  372. }
  373. .iobtn {
  374. background-color: white;
  375. border: none;
  376. 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");
  377. background-position: center;
  378. background-repeat: no-repeat;
  379. }
  380. .dark .statsbtn, .dark .savebtn, .dark .menubtn, .dark .iobtn {
  381. filter: invert(1);
  382. }
  383. .flexbox {
  384. display: flex;
  385. align-items: center;
  386. justify-content: space-between;
  387. width: 100%;
  388. }
  389. .savebtn {
  390. background-color: #d6d6d6;
  391. width: auto;
  392. height: 30px;
  393. flex-grow: 1;
  394. margin: 5px;
  395. border-radius: 4px;
  396. }
  397. .savebtn:active {
  398. background-color: #0a0;
  399. color: white;
  400. }
  401. .dark .savebtn:active {
  402. /* This will be inverted */
  403. background-color: #b3b;
  404. }
  405. .stats {
  406. border-collapse: collapse;
  407. font-size: 12pt;
  408. table-layout: fixed;
  409. width: 100%;
  410. min-width: 450px;
  411. }
  412. .dark .stats td {
  413. border: 1px solid #bbb;
  414. }
  415. .stats td {
  416. border: 1px solid black;
  417. padding: 5px;
  418. word-wrap: break-word;
  419. text-align: center;
  420. position: relative;
  421. }
  422. #checkbox-stats div {
  423. position: absolute;
  424. left: 0;
  425. top: 0;
  426. height: 100%;
  427. width: 100%;
  428. display: flex;
  429. align-items: center;
  430. justify-content: center;
  431. }
  432. #checkbox-stats .bar {
  433. background-color: rgba(28, 251, 0, 0.6);
  434. }
  435. .menu {
  436. position: relative;
  437. display: inline-block;
  438. margin: 10px 10px 10px 0px;
  439. }
  440. .menu-content {
  441. display: none;
  442. position: absolute;
  443. background-color: white;
  444. right: 0;
  445. min-width: 300px;
  446. box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  447. z-index: 100;
  448. padding: 8px;
  449. }
  450. .dark .menu-content {
  451. background-color: #111;
  452. }
  453. .menu:hover .menu-content {
  454. display: block;
  455. }
  456. .menu:hover .menubtn, .menu:hover .iobtn, .menu:hover .statsbtn {
  457. background-color: #eee;
  458. }
  459. .menu-label {
  460. display: inline-block;
  461. padding: 8px;
  462. border: 1px solid #ccc;
  463. border-top: 0;
  464. width: calc(100% - 18px);
  465. }
  466. .menu-label-top {
  467. border-top: 1px solid #ccc;
  468. }
  469. .menu-textbox {
  470. float: left;
  471. height: 24px;
  472. margin: 10px 5px;
  473. padding: 5px 5px;
  474. font-family: Consolas, "DejaVu Sans Mono", Monaco, monospace;
  475. font-size: 14px;
  476. box-sizing: border-box;
  477. border: 1px solid #888;
  478. border-radius: 4px;
  479. outline: none;
  480. background-color: #eee;
  481. transition: background-color 0.2s, border 0.2s;
  482. width: calc(100% - 10px);
  483. }
  484. .menu-textbox.invalid, .dark .menu-textbox.invalid {
  485. color: red;
  486. }
  487. .dark .menu-textbox {
  488. background-color: #222;
  489. color: #eee;
  490. }
  491. .radio-container {
  492. margin: 4px;
  493. }
  494. .topmostdiv {
  495. width: 100%;
  496. height: 100%;
  497. background-color: white;
  498. transition: background-color 0.3s;
  499. }
  500. #top {
  501. height: 78px;
  502. border-bottom: 2px solid black;
  503. }
  504. .dark #top {
  505. border-bottom: 2px solid #ccc;
  506. }
  507. #dbg {
  508. display: block;
  509. }
  510. ::-webkit-scrollbar {
  511. width: 8px;
  512. }
  513. ::-webkit-scrollbar-track {
  514. background: #aaa;
  515. }
  516. ::-webkit-scrollbar-thumb {
  517. background: #666;
  518. border-radius: 3px;
  519. }
  520. ::-webkit-scrollbar-thumb:hover {
  521. background: #555;
  522. }
  523. .slider {
  524. -webkit-appearance: none;
  525. width: 100%;
  526. margin: 3px 0;
  527. padding: 0;
  528. outline: none;
  529. opacity: 0.7;
  530. -webkit-transition: .2s;
  531. transition: opacity .2s;
  532. border-radius: 3px;
  533. }
  534. .slider:hover {
  535. opacity: 1;
  536. }
  537. .slider:focus {
  538. outline: none;
  539. }
  540. .slider::-webkit-slider-runnable-track {
  541. -webkit-appearance: none;
  542. width: 100%;
  543. height: 8px;
  544. background: #d3d3d3;
  545. border-radius: 3px;
  546. border: none;
  547. }
  548. .slider::-webkit-slider-thumb {
  549. -webkit-appearance: none;
  550. width: 15px;
  551. height: 15px;
  552. border-radius: 50%;
  553. background: #0a0;
  554. cursor: pointer;
  555. margin-top: -4px;
  556. }
  557. .dark .slider::-webkit-slider-thumb {
  558. background: #3d3;
  559. }
  560. .slider::-moz-range-thumb {
  561. width: 15px;
  562. height: 15px;
  563. border-radius: 50%;
  564. background: #0a0;
  565. cursor: pointer;
  566. }
  567. .slider::-moz-range-track {
  568. height: 8px;
  569. background: #d3d3d3;
  570. border-radius: 3px;
  571. }
  572. .dark .slider::-moz-range-thumb {
  573. background: #3d3;
  574. }
  575. .slider::-ms-track {
  576. width: 100%;
  577. height: 8px;
  578. border-width: 3px 0;
  579. background: transparent;
  580. border-color: transparent;
  581. color: transparent;
  582. transition: opacity .2s;
  583. }
  584. .slider::-ms-fill-lower {
  585. background: #d3d3d3;
  586. border: none;
  587. border-radius: 3px;
  588. }
  589. .slider::-ms-fill-upper {
  590. background: #d3d3d3;
  591. border: none;
  592. border-radius: 3px;
  593. }
  594. .slider::-ms-thumb {
  595. width: 15px;
  596. height: 15px;
  597. border-radius: 50%;
  598. background: #0a0;
  599. cursor: pointer;
  600. margin: 0;
  601. }
  602. .shameless-plug {
  603. font-size: 0.8em;
  604. text-align: center;
  605. display: block;
  606. }
  607. a {
  608. color: #0278a4;
  609. }
  610. .dark a {
  611. color: #00b9fd;
  612. }
  613. #frontcanvas, #backcanvas {
  614. touch-action: none;
  615. }
  616. </style>
  617. <script type="text/javascript" >
  618. ///////////////////////////////////////////////
  619. /*
  620. Split.js - v1.3.5
  621. MIT License
  622. https://github.com/nathancahill/Split.js
  623. */
  624. !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}}});
  625. ///////////////////////////////////////////////
  626. ///////////////////////////////////////////////
  627. // Copyright (c) 2013 Pieroxy <pieroxy@pieroxy.net>
  628. // This work is free. You can redistribute it and/or modify it
  629. // under the terms of the WTFPL, Version 2
  630. // For more information see LICENSE.txt or http://www.wtfpl.net/
  631. //
  632. // For more information, the home page:
  633. // http://pieroxy.net/blog/pages/lz-string/testing.html
  634. //
  635. // LZ-based compression algorithm, version 1.4.4
  636. 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});
  637. ///////////////////////////////////////////////
  638. ///////////////////////////////////////////////
  639. /*!
  640. * PEP v0.4.3 | https://github.com/jquery/PEP
  641. * Copyright jQuery Foundation and other contributors | http://jquery.org/license
  642. */
  643. !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);
  644. for(var d,e=2;e<m.length;e++)d=m[e],c[d]=b[d]||n[e];c.buttons=b.buttons||0;
  645. 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}})}
  646. 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++)
  647. b.register.call(b,a)},unregister:function(a){for(var b,c=this.eventSourceList.length,d=0;d<c&&(b=this.eventSourceList[d]);d++)
  648. 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){
  649. for(var b=a;b.parentNode;)b=b.parentNode;
  650. 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);
  651. 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){
  652. //
  653. 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))},
  654. 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){
  655. var b=x(a,this.findElements,this);
  656. 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){}
  657. 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:[],
  658. 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++){
  659. 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);
  660. 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];
  661. c.buttons=b?b.buttons&~d:0,a.buttons=c.buttons}H.set(this.POINTER_ID,a),
  662. 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),
  663. 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),
  664. 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);
  665. 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){
  666. (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,
  667. c.altKey=b.altKey,c.ctrlKey=b.ctrlKey,c.metaKey=b.metaKey,c.shiftKey=b.shiftKey;
  668. 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))},
  669. shouldScroll:function(a){if(this.firstXY){var b,c=a.currentTarget._scrollType;if("none"===c)
  670. b=!1;else if("XY"===c)
  671. 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]);
  672. 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},
  673. vacuumTouches:function(a){var b=a.touches;
  674. if(R.size>=b.length){var c=[];R.forEach(function(a,d){
  675. 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);
  676. if(c){var d=c.out,e=c.outTarget;u.move(b),d&&e!==b.target&&(d.relatedTarget=b.target,b.relatedTarget=e,
  677. d.target=e,b.target?(u.leaveOut(d),u.enterOver(b)):(
  678. 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)},
  679. dedupSynthMouse:function(a){var b=N.lastTouches,c=a.changedTouches[0];
  680. if(this.isPrimaryTouch(c)){
  681. 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});
  682. ///////////////////////////////////////////////
  683. ///////////////////////////////////////////////
  684. 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"]}
  685. ///////////////////////////////////////////////
  686. ///////////////////////////////////////////////
  687. var pcbdata = JSON.parse(LZString.decompressFromBase64("N4IgpgJg5mDOD6AjRB7AHiAXAAlAWwEsA7DHARgBYBmAOgoHYKBOFgGmxEKIE8tt6ATDUHM2HPAEM0pbGQBs9GgPoBWAAxqy7TlN44mamioHqNLc+YC+2yDFh8A2qAAu3AA5g+IWGCh4wRM4g2rDOEgBOQTgOZCpySirsBkYAujZEEI6xABzCidjZuWppHADuBBDOABZ8hmqiFo0Wcta4IK4eXj5+AUEhYZFZcUbsgnkl4BlDTDRqoyoJE+WVNTh1DU1NLewu7p443r7+gcEcoRFR2DEquarshbMTAZnR8vFzBUVLFdW1sxubZqtXadA7dY59M4DS4xOTve5fdIvK7yRQme7xVTfFZ/eqAzbbNodfZnI69U7eaFZOGzeaLJHUtH5ejxFTY35rf74rbA9p7Lpkk79C7TWn8BYmJ5TV40j6qellH6rbDrbmNQkgkmHHpCqEi17UEafR4Mg3w7DJNnaZYclVctXmDV80GknWQyn6lEUc1jLGmr20ZkSq2KnGcvEOlhO4kCt0U86DGVM0asqXI2HJgqYkMgG3K1WRpjR/lgwXuhMw2LxdEWww555Zb1iy3s/P2yPFl3aiHxqlmsW++vSlHDZlCP2h20Fju8mOluPCxMBo0PYr+mKGoMK3NK3EA7ktCawAgAGwA1rAAMbhMABPigABijlAbhQ9hl1fuZFS2mcYDQlwgAAwgAogASgAcgAtAA8gAEgAMlBADK2BCGoFJVGABBQFUlx1tau6cvkIBVCg4QEAAXvAABWACuoQEAAZnoKq/lUBCXmeRBwO+dpqIWYggBIzjOOEjggAQYQnpxIATBIRBQCeJLJGovKvnx1zfh82QzBO7T/oBACyEEACrYGBIEPjBYFGWhswACJQRQmHYbh+FGjuYZ2iRZEUdR9GMSxtTsZx3G8biglMNoIliRJUkSDJl5yTFinKbi6lvkM34UKMgYTH+AFeKZYEAIJAQA0gAQqVCEIdgyEgRByE2Rw2hYTheF/CRebde15FUbRDHOMxrEfO0HFcTxsB8XUUUxaJ4nRJJ0myfJaUknUmWafIdT3As9AFYZXgAFJkK5nWXNphHeddHB+YNgUjcFayhVNEWcrEC1xdE61KZtYogDeTF8GQs4lq6PaLpWKgzLlBS0CYDppqK8PZBQ4w3VONBkAI4NduC5LQ6j9wY/pDYyoY9BUGq2Sk5jk5trj+NaoTuoeku1xw6MMxMBQKOvLDdCjLkFA5r1n14zszqs2Wvaelzwv8KLQ7prtwg09ydPK3Q4tEXazPS3OkNE3qnPyLQYu0/T5PDrCEo23r3mGIbRIQ92psc5WcgOwUZOq9Svv0CrrZ/K7mqxlDZve0HIfrhbuvWzrYuh5LLOR57FYkwjCTI/HNxKPciOw2qqcG1Lbtdq+J7cFAKBEBSGlDJ+BTfjmCn/Y4qkTNXtf15pDgOFB35MCoNzsFBVMCDTJRD9+VAqN6cL4trk84wIAjZGQAncrPw80AvS9yCvE9T2Q2RqHIe/z4vcRaNga/ZAITD0EW18H4vJia5sq+GEwz8GBDHPD+VBVCr20gIbei934LyoGobIr9ATgJxmoSBch9zmGyDA4wJhkFkEEPIAQ2DcbII3lGQ67BgEL00MfCe35lBi1QTAigukqC6XxHQg+9Rj7MJZKg7knCqBkD5tAyh+8qAMHqPfcRAh4HMM0BIgRD956UCYPgmBG8SFKP3s/YOl937PzYaAzhyhUEsl3mI+hcQ1D0GkfQqgQiqBX0sUoAS6D4b73PrYpgVB36xBUE4+gnCyAOJMEA/eAkKBqACdo7SBChEWKuBEgQPt8GcI0N6XxYi/4BLiL/GgPj/FYOyTQBBchNBqlPqUgJghwlUz5nIbI+Q170G8WwveVMrbwKqYITewiOk42MN/E+D8XYCBYaA0uJTYjTwdPk3pW8mADJmUIgQVSn74JuMs4w0T8lqLHk07Z8gVDCJGRE/hJyV5HO3tFZRswn7qCmUkl26gKBvOCcYAwSzpnMGXiYkhTCfmFBMeU7IM8fnB0uWc+ho8FBkGWd6MFyChGwzqTjb0ZjBGyOKc8nGNNlDDKaMi1R/NpmQNAUEu5uj2EDIEiiqgJj6D1DBbSseFB5Bqg8fYhetL4FMDBQ6YJCDVAUKuOsAJm9gkSMvvCyhLtL5MrkOk6mkDvlipxowBxDK7kaHKU4q5cqlAMBptqtePjQkAMBLPQwVATA2OkYYJpNxDmGqiT7E5PTGDGBxQ4QwYsAE9L6dE2e2kxZyAkVUkJi8yCypRFybIy8OGjKMOfMeQDtLRqqQYdRlDvwXzHhypBWa1BsLkKcq1lChBj2PhG5NBhymSkrUYOIPiPE2rxCwkNNB3XT0JY0KpcDolwi7T7OBjB2B1lxvIH134fYCUoOwee4yDBZLjXiJ+faLATuENPJporfV0BYdTbVYy+nloreqt5CCHGLoPsu3S2zp4UDWXaQQNMtklNUBI/BSjT3/2cbi1QY81G/p3V4ohn6VCtJ9kopd8Cc1JJvgoJ+oGCE+v3qPce5dlCLMScAzD2tDDlJjbavDUEq0tpvXaYjITLWbD3hRmtpql3MAQQaxDBSDmBpnikFI20hhCEgdrLezaAMGSKgcAAquddqbkuqckpV5bGimHoBWGqNEKHBqhhWmrNQZ30lpXD+ulfQe0ODA1BunecUcvaNiKJS1+BTRWTDVicowDnebOYlgbFQVmTbsyzoLNuHmnMCxHMFouGqy4vL8x7ALfZwvuciwhlzdnZiUrBVFrGTNfNG3dmzcsCWNz2eS85imXoSv8E89FwZsWCvy3Niwg+GXvwpfK8V5rX5QvZbDrlyussFzRzS8Y1u3WODtcoLkJ+XWX41diHVuWxMDRTZfSJ2b8cmvTdGyl7zMW8sE0W0N5bpTVutbK3bSbnXttef1nt/rGd4sK1UXerrMa87jYu8wF7BR0IQcZr1/jx2azBwZuJwCYEZP3Tk1dQG3m7qkQGmpoKY03rhRmr1gzjhjMA3GhZ8gC3Bu2YNAsG4vT74g+YGFjcCw1HKFfiLOgaqlNMwrhHazmciuUBJwgzRPMjA70Sal4nBTcatNuY5x5Tzmdh1ZyAJugsq30zXFp46BwgJUAuu5UGsP9bw9U0NZHmmJo6Y+j5zHv1Uqd3DNoPHsgCc2cC16GYYKyeRZYFT2ILs5B09uZl93PW077YGw7znX2Xe84KAsMwUuJvqBxt7sX+1ZgC/xHN2X8uvT+0i/pQqgEgICE1/J2QOvbqA3109DTr0tOTTR3pr6HBYqGYcNj3ENuwAg3x0Hh7hWntvKUJuiwwnZ0J9fh7vvsytZdYcWTtP9uOe94lEq0bcIfdj8X1P0BmjZ/SwzxubM2ecy568EBSHpFofa/GnDsviODfPRR9Xk36PPokUb1jy3Jn+Jt473brv7PHuNZp3YRGRExXzFzXwKSAKLVG2ny3wD3Ljn3/0rAYFmHvhAJHyZwm2QM0A3xnzgLGUsAmCqmfBli8F7jrgbm0F30ITFBE30g7g/wcFMRNA4DIP7kcEHgwy41fVmWwSPhGVPS3hT3oxcUPjhGPigLPgvgAyoVvjLW3RQ1fmkPEU/hiQkIKQAWDREJqSwwgSgVJQ41gXgUQR/lvW3jQQwRYHQxvg3h0I1TQT+xkJIVvTISLH3WUJoVuXoS9UBQMJYR8UgKaFvTgW9DVSoQYAbVgwPmETFn0LCKZXZSCOxXkRCQsLEBUWYAQyoU0U3kiOpX0RcUMRd2cKZWUHEIvWARMHKVsWcIcRCSUPoTcXeWLy8WEVXWAX8UCVMNCTHnfkiWiQHzSPS3JXPSaF6JSROUpW0m4TaLNVyUaW3UKQOQGTKQqVAyaU3zRVfkRXyCpjaXQ06Vhm6W4L6VCLXhWTmW3VxgmWMPKLOKGQuOOMWUfVWXkMgTAUfV2QWKKTRViGORGMaG1imOfihR/muQElvXgTtSeSHheXqCaNa0+QEgRSLFoWL0gU3h8JhPRWBTRNBXBVxUoEhX+MH2cNhVsQRUaTYSCNiFHgpMxWL1tTkWmXxWpknwZJJWWXJVaVJODn91xTpViG1S8OZRmLqDZULXxHhm5TRQ0F0gFUqWaOFSg2tX+AlUBLxTdVjQPW3gUEvghJVX6UNXwWoCoymL1TKKJRVPGVZJPQKS1RcPKJtTtWqLtCdUKCAT9UvgLW3VaX9R9T9U+VuSnkEPTVVPDXhhdkPhjS7XXUTUBG3ROSdVDOiQSLtGzX3TzWiROQtIBIWJLQTWJPMFnkY1bTzIbSARLNrXbWYE7VzW7THl7VA0HTiGkNnQCRsTbRTTQRnXrPnS5TvWYBLRjNYwn3jOTTfT3RVKvWPUjQ3i3kLKLNdSPSoxkVY1OJeSfRfRaVmQ/UAwCXZRuMCOTVxmfhSQGSA1hgXNuW3PA3PKgxZBLjHJkXgzcKQ2DjoyPJvKsM4ywzOI3mDivNOJHi4LXho1I1TzEUrNNSI00FozIygsSNY0PMH3fgIx9J4N4wINaBACYgkEQAokvBEgIHrnvBACfGiBfCyg/CUAeJAKOgkw4CAnriIHgE0DQEvngCMkSk8Fk0ugvzgL1xvwrxejYgf3eifzNwb0Wjfwbw2j4FUm0AADdEpLNf9/Me9zYhZ8g6L84ZhtKMZ0F3tpdwwooECNKYY9L6ZDKY8Lt0EcYrLUjFz/sTLBIzKGtvYMZUCDLHK+ShcUQ7KvLZgnZsYhC1Q3Klt/LPKlcA4ZQMY0YMZNDnL+JTK1K4tzLqQ4roqPc7L4rm0atQruRwqjtIqlZ0Y8r44fZ7K/Zyqkq5pXLUr6sIr7YqqyqeiKqFhUDZ18qUr7s/90rBZLLl8PctKGc2rarZgeq2d1L3LRRmRcgxq/LYQoqdYFrdsJr6rerpqmr5BlqQcFqJsAq+dVEpc1qCr8QiqicSrycZhjrBcDrMqqt0UjLTrJqSC+qZrYqlZHNbqIKPs1YcqGdrLBcXqNqpq0qPqSr4YQcgbfrFrjkqroafKmcQbCwLrHdmrydcgYaL04bKrOru1urQa3qtrirFZtLaAeUKrDBZFbFL4TCftqlCbUaGrDtLrYRqb7U6aiV7ghAXU/rZqeaP4mbIxAdIausxMj8DgzpC8YdL9ddr9/Jb9K9RLjdxK68X9pKLdZKrdaxZhRaNxFAPhkhnNJaOAjIUA6JAhiAoA4IUB0peKtdyAS9bRBLFbhL79Vba8McpKfojN38cclKVLO82gqDkCPz6aEEfwVcGKQA4IXIHai94cr9xpy91MRLxptM1bvbhJNa/btaP8tod8qKRxFddaTbVczaLarbFJbb7aoc+Kna5bS8U6hK06PbM6vbn9zc87hI5LrcOBlKTxVKQ7i7rhxxaLFBD8K7Y65AZb+KkrXbHo26jcO7dNs7X8tbe6dbC6R6dosCGdaTfxp7zbLaRoa67aeL67Hbi8m6XaFal7Dcq9Pa16u6fam8W9+6QBB7h7KK960QHj5Qc9p64JT8Opr6k75aW63bl6n7V7TcXlu7m9/aMoi6dpjAjQQdD7o7jIq6z6baL657G6BL76kc78V6a8X7JKc7fakH86A6B6g6f9d6BNhAAGDop6Y64INcE7ZbiGoGH6yHYGKH4H9M36ZKt6C69bUHGw9J8hkgsGwcvAT7q78G66z8G6b6+H+poHH6Va4GJKEGxHN76D6Gv7GGwZpHBZpwoDI6gHOGVBCHNGF6SGlb07UdKHDHqH37kHwx9bns7gdZy6Y7lG8Ha7L71HwHnblRF7SHlaM7hGDHRGvHxGTHW8GGh7g7f6hhrH6b5QOHAI4IC8eH57jKnGEcdHBG9GEn1bEGP7+I/Gw8X1HNlB6LAIAAFUqUyWnFQECBCRxqmPA4QbRgRuJ9xkR+vZJ4xvuz/dJn+uXUernPIe4P1cO0Yo+mOjCYpoh5x/h2JtxsSzuqhjenu1Jz+7+zJ4m8G7avvUePnAYiwMfDGW5nWMTFGkWlmwndGygJ5uagmjbVkHy7WaG4Wh0NG0PAFpOYF/5owQFu5yMEFsKj5kPXvCFtkxze5pyuGm55kGYDF3yt50Fyxr0dhvnZXRRg4CHfpg+QSRTNavF8wFTVu3R+Jx/PTPUoxk56ZnerJqxmgmnVZxoVprwbeOiJ8LZsp5O4ZvZ9u6p9e3O2hiR0x85phsGxq0m57VbDGAInGzAmYTVnGBFwqpF+fRrPV+mWNOGuPZC7m6qi1glxFzaq59Vq12izy4a+pJOMq7V4Q8as6wEMFp7F1z1rV+FjbM16q71tZ3116qguPHSDGfJ4/bhq+ovG1GlwZ+llgRlip0Zg5jx2YJfSZzl7eqR5h/sc+LrRNg4F2UVxxiB5uqV1xmV1luVmhuphS2Zi542J1tmxZ+vJ+A+R5j+QW1dUpuq5mx1tV3tvvBeEdod2dgoKmQ18641xAxsDGBdi+YQcA/tpdwZv1zYANgA0Rrd87NWMWE9oQUd+1o1stzPJZ0bKtxioplNjyTNl+DN9N+6JlypllrO8MQt45hV053WtSIlg2u0ytoVg4MgWt8V+tu+3Zpt8hlt1+ot4D6ZjtsxjJlVy5qdr5psX3K9sfeIVA4j/d167t/D8Flq8j/m8t5Z7dijomqj1mgj0jxjs9xseIX3Pd6Nlj/LNjmj3jpj+jr0Hjud5jidnl8TlcNuaDxi0B8/Tkd92l27alwsbNkZ/Z5+kR9l9D9traQgrHbCvAFACAOiZSTSUAW3EAaW7QZAdAUiqg8pIZoatvE8XfZydzUwP1ieWgVBUwC148SiEkBwG63zhc0YTjDQHwxV+SneuXCQCAazkAE8CQbgMAcITSMilKFghZguJpRjyms4KiMLm1IIupqCLD2AKoCQLsG8S8d0KjvATIbQFAJiJiHwGEMzOoCYHiQCAAcQggchAF5HS8y+y4kifB7gK6m20sdRzBC/K4Pkq58Yfhq7q4a7ACa4pBa7a44A6667AB67FD6+0AG68AAHojIYJTIABJGCCCMb6WCbrLnLmbygub6pKfJbsrxwCrhkqrzb+rrURr5r/LVrikI77rgHs75gkAS7g4K75CByUqF7toN7qb5aT7/LtB+brrPm7wf76IQH+eYHszbwLbsHnbiHgmKH9rzr2H0n+HslpHjgFHoCPp8bjL976bvL+Z/Hn7hmkr4n0LuHoUwd9b6ryn2r0HrwcHvbyHg7kAGHk7uHj4c7jgdnkACCE7qCAACjOigjaeS4EAAEoMfQAsePuBfY2CeGaifluJe1u6G+AZfAY5ftvdvKDiBzpyBfxlfoemf1eWfNeEedeABqKgAANQ1x58m9t9m52m9xav9iPBJ7jWtfpqEEAoZYp89+p4V9p6V/p5V7V9O/D7Z9D44Ct7S95+x6uFy+T+pFz4ZxThCEz5iFYcjG1lz804L/Gi95p5960yD8Z+O8r+3Wr8AjG4mAgHCAkHKEUk0gmCx68CfF5Fs7gnoApEc5kBk+uBbhExzBvE89HvIyMDLVLLuXAsKEF2d+iA6t3VRKEBgxfiZxA9UmwrcGS9X+0AX5L9ra//DgOvwOCb9pY2/bIHv1QAH9BerfGgt+H0hn8vOVaa/rWhkSYtH+VwZ/qWluRv8S4o+dbkwTA4sE/+4jQAcvygAgD6+k3LwEQS37t4vAcdGAU5xwCH9CSNBSehMBQEX8hADAILhPH4GqANAwXLvj81i4voJBGgP7PF18aUFyBFFWgXzxx4UgiCLfA0IbXuDcDO+4vaIP30jCUoDBDoZzCBzXhD8i+BwS8AQHCCXg1GbgP3qDED5dhfgAAiiCeBPDD8vA1g2wWowX6nhPBXfYwWqCME4wB+E/Znuqir79ca+IAOfm4KAEr9xGYAjgBALaDb9Z6DnWAc5wK6l1I6p/MAOf00iX8BBogoQXQBEGaAM+egq4NINQTsA6hsgkDol1/4pdiCNvfntoHUFfc0GeQnQaVxqGMEwhhg9gMEO5CmDpm5gkIJYI4A+C7B4TBwUQH96yBnBWoVwRwH8EeCvBVgmwfMIpCbDAhgwsYfiFCF58s2EwCvhr2n4xDZ+BBBIVQJoEpDcujA7/LHVPz78chf9AcOwx4GFDUBFQwQQ/GEFBdqhYXRoQ0Ji4yC6mLQxQVcGt4N9beXQu3gs33rihQc2AoYWcI/b2QsREwnWlMLOAzCQAcw+wY4ID5j8XBNQNwQEO2GzDdhfg9wYcLC7HDAQpw8IYdxD5T9+INwrwPEI2GL8HhyQhvhvzr7b9k2IAD4ewPgEK4MGPwjzv8NKHYEgRAI0QaCMcDgjsAjQ6EaWyS5tClBHQ1QUiI0El1ZR6IoIcMJMGjCLRIQqrrLyJEkiFhZIlYRSLWFUj+RNI+0fSPCYHCMRLIzYGyMMEXDORVw7kRd1iF8iQAlA4AUKLoHgDRRTAg4HBAcZZC2Bd7DcLI20Gg5eBxQ4EWUOVGKixBgwjUVqPW4wi9RcI5QY3wcC5cjRPQmRg+1sZ/cjh1o8YVaNxG2jC+8vHYb4MdFLCnBLorwOsMjGMjaRxIr0fsJHHmjcRbY9kar2DFh9rhYY24fPwFHRjN6TwtITZwTEcBCmrAuAaHQzFoiChRQxwCUMqHSJcxVQ3QWCMhH1DNRt4poVyx1GtDUuBopvmKw4DdC8e9YgJnkzVH6CWxJwmcYGOl52iuxdInsY3CdH3xLmQ4n0Z6MgnUithU4zTsBJMFBjJ+IYrXoj3DF3D+RiQ6gTGKy4iiXhXgaTHuM+H1itsJ/ZzNmNPF5o7U0eJ8rOnPH/irgtAOdKIKAnYAKavnR8SW1IG6jXxCI/nsaI6ze5Ba4ZKXBiIIivp24kwsCd73dCLDlhME/bsH0wkLjQx2vWIdHzj5183x1Y3HtKKdx0BVsb/RRA/y76ySqY8k/EYpJH509WYDPDkZpKiGLidJgEPXs4EN7q4TeyXMgJbwT4qD3xyItBtTXMndpLJsNGSUaFskdiLB4EoGCX1WFdAXJc4tyQemiFLivAek+Pq9xEmqCxJvxFAp6wsk+U2JB6HYqDjMEOTi+o/PDulMuFaTsJOvYbqN2ClVjm+dYoLKVLZJbt1ATYlbtVLoIKTOxSk0vs5PL7zj3J2knCYBE57c8CpifUST1JHARTGOg0yqTZJqljTEpE01KWCCakzSspHk+add1R7o9OpSfNaemLMmbTEqYvYaT6Tskf4CRVPJKYr0OlnBjpmU3rhH1iE3c7uj3Z7tdNWnfjjsEkxdvziGlw8Rpr0kkO9NHFfSBxR06aX9NZ48iDg3kw3hDn8kQALeBkwqaFOKlx5sRNE7ad2iDJUyEp0wpKQ6MmlpT0ZkQ06XNJ144yDe0mfGUwCCkriCJjw4UXGNIkUt3h2QqUaHRJaPUyWdE6IPvEGl5iWkY8WLlZMGEBdt4Mg29Ccli4LkcUcg+pgoPLFOBKxN0iGbJ20KktKZCCaqQo1qnjSweVdBfilPMzJcCADEP4EJgCaNTmZNfVma1NiEcy8ZpvAmUFOWkhSjJYU9dgUm9w4sEesUq2QsQRnu86pBwcIA7JRly5oJNuF2W7M5AeySI6kiIT7P+kz8vA7UiMVGKSHrjBZqQ+Ma8PVwUTxZBXMzK1V+EnjZZbcaJArNsm+cVZYXNWZIM1nqzVioJUsc+NhFGzDJ3U02dcCpjxzqqsMlnnPJyS0zCRn0tOU7KBjZy9Mec76d4F+kszi5WMjgGXLBlFTbpGrXGPpSjpPS4eS8zjCvI+kNd15DUlSf2M3kQBXZ28rxPnPH6uSD5mMnKdjP14G8/JQcwKeXNXGVye6G42ucfhfYSixZaY75g2Pk7yiL+HcwEYrJ7kxSu+/cjWcXi1lcSkEhnMeYbPhErSz5085BQE1PZXFe5t8gJsvOl4g8n5ltR2Q1MX4fyc5doHeajJ+neyuRfsobiNyJkUKSZ58vvDQsExWzLZjC++cwuTnmZn5ykzOc7K4Vfy55XsjSf/OymeTcpsfePnzMFFVzYxNc4WYpwblIKmw2lVBeZj+HoKYZXcvINgpxoYi8Fd4tuEPJ1kkLBJL49ocTPDnFTrFnHOhTgsGGOo5FNsyYSwvtlsL05nCz+e7O/m7zYA+8ouQAr0UHAT5ocrqcZNDqshBam8fSHHMiWJycAHvfabEoyDpzX55I9+YktznJK+Fe8gRVhIBmAQ8pEC/mURMMzPCJg/gMIBABEgSBSKI0ZwB/mSlMRyIeAAQFBDEgSAuIiARKCeCgg+AiAsAciBSBvCKUCAx4EigcApCXgUAeAX/jwF5EACRIWoWRLIkngUBh42QFUGoEwDyBMA08DHhKOOWkVUAtoQeDBNg4fjgIrFPVPAF2jZAjIJ3AiqcEHjARIcISXjJQjiHaA5IIabQDWwBVAQgVJaEFaCnBViRZIlCasfnlOC4x4VTfCkMitzTaARW6KzFVQGxXwJcVkKglcBGTbRlZ4iK2vqSpiCoqKQYEWlfSrBUQr8VVwasZS0XTFB2V5KrlTBI6ZdNL5vTCkLKu6YKrmV5EpIFyo5VxCuVL6EAAhBgiDcYIFIPAIECghcBTwKAOuFCurE79iV7KuCNANGEaqpVKKxisxVYpkB2KcgTitxQpBwQbBb4MAPAAfAgNZlcgZCGvBUDIQ4IIKz1cPCMhtN4AbTOsGoDwB4B4AttfyPXGkhWq7OkOCVQiudVHgzwBANwB4HTDap4Y+QJfBlgmDkURVfyuDoxX5WgrGVwq6FSfmJW+JJVSK6VaipxiNrAVl8LFS2qFXJRmVRKxdEQm7WcqXVIAalRSAxVDq6VI6vFWOpFUsriV8KadVqtnWbMOAfKpdQKtbVrroVYq2QPmrJU9rZ1Sq+VX020A3qTAKq9dWqotBOqr1lKjgHqoNVGqTVZqk8BapQA5qbVi6N9TOo/XAQ3VbFDilxTUZ+rU5PgINSGqghhqI1UamNZfDjUJqk1/OVNemsRxZqVKzK+ziqFA07rjO0QblZ+v1WGrtAxqnyX+oA1AaHVaEUjcir4zaAplgQeAEMrCCkUgIpFUoCUxw6DwD0F8UeLugEhDIxNzSF2M+j3SUBN4UGBTXzQPQshhE9QNTQYHCLCIqkkmiTeJrYR6a2iRGdTdpq02aaHU/wTTRpuv42b5AKpKTUZuk3TxKU5gszXZvM1lppCNqZzYZoM1iboKE1Rzf5qM1Wl5NcmpTRFtc0uxPNpm6zQwCtJ+bgtjm/JIptsRRblNypI0rFpy0aaqk7mgrWpu81hCPNpWhgFUls2Fbr+Wpamklv00pb1kTmprVgwPRpbMt6WtLcWiq1xaVSdWvrQFvSQOb6tw2kbBEm63mbYiJm3LWZrsRWbKt8WxgCqQW3zbr+g2w1L5o22Sas0yWkbbxnY0cAQIAmv4NNoW3aBhNg8WrZtpC35JItbWjLZNvcztantnZW7eFru1crVNz2u7VuXWDLa4tXmxLVdoa3Joytf24rSNs23IJQd82h7R1re1vb0k42jTfzEwraAwIR27Zml3YKibmtwWzstDv+32bXUf22LVUh219bDos8Vrf1qa2BaCdsW8HTTpC3MY5thOibSqRW1s7EdJO5HUtq+0I6dUS2znTlu20Q7Qt623Hfps7Lw7XtSmlUkDql09J+dt2oXWzo80Va1dM2vnfdu+1k64dsu9LRzs12aaydYugzfuku2S7DNgW8nb5sp37bdeGOm+kjoYDwwsdFG6nQrut26aXdRWwHVbovgs76dvOiXSFrD347fdAO0PbbsiTc7hdvO1HRwCghO77EXureGdux2W6w9UmhdMmh10y7ky+W77QXr23YVDVUowTY3V91u7ztB6fPbLrj3G6Ht8eszY3pO2w7ldHWtbeqjT2x660wehLetoN3tald9ejrfLuH1RaB0venxPLoD196ziJ2+bdruL23bdN2e3bYahb0m6QdkeonZelX366fdPO7TcVq1Tn6L99pJfOYI319b/dt+wPZGiX09bstA+6ffPtn2v6Xdo+w/Qpvv0x7Atz+8zb1sv2gHbU1+7SFOV/0Ra29oOlHQ7rggp7Wd7ejPR7qz0AHj92+qPeqjN2Oag91ej7egbF0279dpBygHPof0L66wZB+7YQdKQf6I9J+v3dHrN39kB9i2xPbqqd2OoP9JEWvVTE70KbMDxu7A57vn35J2DohogzTqh0EHODyEbg5xlwPTxUDIq7UkAby0g7KDBmkA2Acv3CHn9xWyfXdoMME7itYhCw5YYsPr6Y9Ohw1DQd13Hkx9mW1XUAaqTKHDN/pYQFgZ03Jo9DoBlfTLq7157oDimj0t2isORG4Q+Wpg1Ice3OGXtHhi3QfBn0kHBDD20I3ug11AGat/eXvfkiiNRGVSIhuLT0h8OhEYt7B9ZMYfk3/6xdeyWw0MjC01GoM3eg9EzuC34GmDzeko2olgOFbYd5RwbZwY4AV6/gsR3w+7qMzYUC8YxzkNoaGSqGRNlR33aLo6PTw6jMhtozan8MX7+jC2h7S0fS37GYdHOwo1Ye2PCB0jP2pQ+seM3eHej1Rhw7UfsNDHxy5RwI8YeyP07cj1xorrvomPFaJj15X7T4avicGaAihvfYW34N5HxDkaBI4puaPPHWjWhxoxscNQeGL4Eh6E8UY0Pla0THhzY5DoROZHwjWJo4m5sBOl6eVcxtMuie1RTHljZkoI5luaShpujQ2u465o5Pb6ejORy4+cYuN1oGTnxhw08cEOuH6dFWoUxYalPjai9rJiLeEZRPBG14FJrw7KesNOGyTRugU4SbuNcmvd0W5A2YagNKmwjph7rWft2Pn6bDRJzExaayM6mnT5Ju49ifcPummS6qXo5obXiImnUeJqo8mi1NiFiTTW/JK6fJKOmjjaxr3bodtNB7zTLR9k6aYGM0mzaSBv40sYu1wnKDOJ6k5ia9OyHOThqI47nrXiJmtUKpfEzybTMHGazwZqk2CYzMgBTIih4EzmaykLGVDOqAg1vtDMQH6zpxqnT5o/107cThqL0z4hONxb4D2FOtaAEr2ulyzXZ6g+kb13pHwz12zcwkboMamrTYO7c8DrG2ln1UqpoQ32c5OcHRudJ+HLCYpMTnCzOBr010b5NTkJjs59nVvseOC77D1xrrUwflMk7GtCxig7Yc7LlHcjM+zspOfPNvH1TUZsU19qf3sG9T0pg0/GeJ0+HDznOxnb3qfMtnODLkOkzkg8NrmIjoZn/RabONUWATRFglSs1dOpneDvx2s+/u0P3GZ9MmlI+OdbPo9SL1SC8xRd9MEnKzVZ+44Oev07GqzdB3g72ebMlHitAZseF+ZD3wXfzilww62YqhIHxoD5187hcJ34X59b5pvXQZgtGWGdvWmfd8fG1brGL9B7Q2wf7MvmCLMRoiw7qIJ3nAYsJ8sy9ovMd7ETpu7k8BeF0eWlL4F1gxxdsNcWGDnp/I2Fa50umWjyFnXfacNM/m3D9FyK0Wfcs5XtLeV0y2pdd0ObArJVxbQOa1MsW0rjh2Yg6Y0vZXH45ZpKyLveO9HarAu0CoOdouymeLUFsqxueTT+XjzEmtI3uc4MnQOzbxpk7mYZN1n2DhxpIwOgksfmwTqF33TZfHMZWsLbl+EwVbNNGkVLVluzeCYd3LClzx2hkxRc7MHXrTQZ1Y3daPOjmKh61p63hbWtKWKrD26c4AbQsxnVToFxow9aYNlGOrnByTHper0UXHz310a97uTQankTyu9BKSddMJndjKSHa1buTMomTrp+9CwqfevGXOra+zCzjdeOaXZNuplg0zs7JI3abV2ly9eYd0a5BLPZxk7Cb+MsXXLqmhC7yfMuuoyT/Vnq2WfKshnRb6qKS3ZZJ25HArNxka5Taat+pnzfNqm3mZj1eH5baN1K1Va1PY3b9g1hI/jeYM4GozJtuI6JZNPyX7j3NnWyidbOAb2bwZ2a+0dSMW399rW82+TcNtFX8z9t5XSDe30JXxDQd43SFeNPw2PTIZ3o7kbJMmmpLW1zi9ReMNGmrdJp+W4TdlsynQzvV2UzLeF1y2ALw1pI6TbVPSHIdedoUwHfr1Z3C7Bt8nWndv3W24Lbt7a8TesucGG4ztx667YrsRmU7DhqO5SdBORWXrB5mOzkeRtj6c7WppO7FcHtfam75OjO9cbrts7LNidvW/neGuBWq75xj22dewrwBprv5vu6z1btUw3jo97S5wbgHLmeDCxkS8dY7unX97hRxezrroN23xya97e9XdfsE3ODs9dm9ddAGZ7KL+tq8++ewtfXoHgt9VL9cuMSXADopv25raBu4Gw7J2guxveweg6Q7+Z4e/km5vT3D9DdzfYg/duAPTbVU8W1pcOtS3BzFDu/f+eCspWHbStjC+qeLOtX1dee1WwIfYcRq97/9g+5PZ+NG3oDs92U/PbN2Bat7Zt2MxI/svEPdz0B/B4Voiu32HdIynu6DfAdoHIHO9hh/dbEcf3d7W5rKz8ZkdCnl7I21e4iYxu7HP732tRxLdzsvXpbPtxu2LaGumOjzU5iS4ffcc360HPp9i8eVrOaPTtiNpC+g/qMxX5Hzj/w4qZTNSOlTaTlE+Ee8f+nqTnBnDpdeIjLXDHahsc8nZodxH47LD3zaE5WNAWEnWx+B+3tbMkginK54S6U+ZNQWan4u9VPNZCdBOqzgzva/7Z8eUP1DTZ+p9vpifzb1HSpup8Y7sdDPEzrjt7fY4p1rOVd1j+y7Y/OPv2oj8zyfQc8iPaPGHkzx65WdSOtm6IihyJ+fdydCPQjJz4UwE4+vj3izWz8fY05JNRP/rSjwG+M9YdUP27bzkm2WZKdgvrLOz7O0C9qfmPDnHDwO5wcuDtP1zxtrp7mZttfO/9sDwwzi+fT7nPnzTuA4s6ttkOgjvTuwyC4qdQu37eLswyE84MEAoTgJmG8S7pcE2fnA93+044+f5G4bX+gxxEkWcc2KXBuy4xPdPMwPRnGDkU0Sc4NQA7nLt2E486uNOOEXpz5KuE4PQ9ODY0Tvxxi/7vXbPr+LnhfE8QfBPzXRx9x8a5S10G1XNtjJ5PpGdt3aXN9859TW9thOGrYhsZ2cRUuzPSjiN3h0K+Dsl3Qr3Lncyo9lvivSDezwo3I6Z2BbM7hr6R7y+eeavXnRGHq5wYcagPyLmLz7cI4FstOo3J50t6S7Dfh3LHe58txJoKOx2UnehhN0UbTeZOPHc9rN5Ydwc5ai7wj9Fxo64dE28nLZ4dyBZDeJW2HoRmu6vpec9u4XfTuh/449dmPLXwzyp57btcNuqXTR6tzg6Re13ODbTPS+y/yucvaH27hG9K4Qe6vNLlb9M9O4tOXHbr9VzKz3vivJooz0Fz9y0j/uNXuHU2yR0+6+O1uh3Ut9W/NeHs27S7nBpgHc7Afn3qnm75S2y5Q/OuaDu7jExB/1MBuab554u4hZtfjvwrAjsdwB5HeLcLzZdy82+92u6vmHf5/p/Q4fcNmpz1Dm92W4Bed7JXHLsi++4ufCuqPkp/dwQ5jeF3FnUHgGzx7I+5WaXC9kI8xYw/PasnyunJ4x9Hdyfi3M7iN5HZI/JXQKTbzCthXmVcQ+Ij4YggRyzzQzbEy6WGpgQKU2fQlONOll+3OlZKRFvIdjiuAEN2edWn2RQN6BrC0K/PPrMdhpxGGZLj5nn6WAR0nqccYqXoeLzZ+Cpths+mwQBdF46mxfQ8gX6OSEtC9RssWyX09ql7+CqdMvIAbJW0Cs8PtmmznsL5gSeb5epZNWCr1F6q8xeavoeazyF8cpDtfxerBr0V9c+oSOv1X0AF8wLiDfr5seW4DHLK8KZBIlXib720K4xyxMc3ur3pTa8reuvk3znOt+K6JfrgDvRzK83U6Mm2p+3tbz6EUC2xXMd30HGtXS9Hl3PWXuvlN/NBNJZvF2YYDpBJw1ZXv/acbzd9q80LAfG2Xr5D/GrA+t0oP7L9197zWfWkoOJr3V/u+LfX0y3hH598O8bTRsCad1koEilSTgal3tz1HwMV4/A2XueHyJjE2WF/PrmAnwz4u/OwIvlojr50q8+h4saTKZWTawZ8C5I2xPiUr7kzKYIXPFPsb+95AA8+cvveLGqdlKSbfPs/P2LgVSHxOWmfYX0b5F7l8K+kfjWZX5JOinM+0sUMtn218p+6TqfvPlFiuGkUPe0sygQrySQZpFKsfabWX1T/0kO+TfSgEQMAWd8nfLsVv8qSdRl8G+/f+U430gUzCZYw/YdcmtfJe84/Df9vxX5pQ3YNAl8ZVC1rHgxh+fHyHvsqmS319c/M//v7PzDGL8NBS/mCJXMNXr/mBG/lhZv4Mzh/mBKvRvg773kT/5QNsNOFr0n5t+++7fNf+P42BH/Beh/YnDcL19D/j+Y/k/uP/38ayOeB2Xvgb9pWX+fsJ/HSrP9P8Fit+WA7f/lJ34X+xB7vV/8L+1+r/r+1vt/6qmSy283FI2gtAwNrJX9V/Y/NP01nulqqU8n68w2IAIHYyfWGjWoawOXw5lQFAKRDkT/UyXRIr5ZPzhh9WEAPJ8OfGAPZlgFeAIgBwFAPyQJ0AvnEKAx8EgOhktpQZhwDAZW7ge4nuAAOICCkRhBjQ7mReH5QMCT7AoDHMMgOoCSIHXiBl6A0GVr8WGdlDpoY5Q+A4DyA5gPUBWAx6kkCH0PgMq9BAkGUYChgB3i3YieWPFoBAEJlAv9hMRbhqwaAhaToDVAogKGAdA6JD0CI6QwPzh+BHUmeZ0WdgMUDxqYwOu5TAhgPMCZRDeGfRR4XJmdwIwezz+9qaRwICCKpJQI68UeNHjUDeWYElIDAgi31iCmmZ3F1loA/gMBlLpGIJHANAm+GGpaAcxGfh8/XIIiC5fKIKukRApINIDdZWPFZ9k1b3wSBlAzIK8CRwfIOPhCg37mGpBMcZGBJ/A+g3CDXA9IIWkmgioJNEilQoHz86g4am0hAKAwJhkjAwYIukueLINO9heBnzD8AkKKU3gmkCOjzR6gtwOR5kIJYOaDrgDiVtR3SHYMZo7ApQAQRxgh6T2CFgg4KOCRg8SWSDu0PPjHxTfSgMek0gyrwDkyAfGUJljgygFZBQEGOTf91fAcBmAK/dTn2COAP4IBDEAjfyQIigC2Q2xPg873eCSg3AJ8kDeQOTN5eZJESUE4vHzzR8AvEkP0h0/QsD29EfJEPUDtvX71cx5vPnHqDu/ISGu8aQ27wHBMfYaie8KQ9TlZDbkOX1W8vvPlgZDm4UUJZCM/dkOWDqFbShh8sWaHzT9+QqUNiFhQnrwx9SQ89hR9uQrvxVDhFDkOJC5/MUM0EGgnOElCqQ7n2P9aQk0KNDk/THzv9K/EIV78rQtbw4l0YIRC187/IvyNQ2/COgSpf/J0MtCp/a0KS8Gxf0Pzg3Q6gBuQhfcMPGoH/f/yBDF4H0PP8/QhHm9CS/VMOhCOfAUOdD/fB3Uoh64OAFIo61I2VYJ1lbHRyAU0fMiBYFgGtHMQQ0AuACQoEJpgOhz4PmBnQC4cNH8Q6QC+AU100abyC8bEHsITw/WBsKmxFUcXyb80Rb/zeRfqFYNcIbgcnBpwtSSsIXC+jacJXChYOUGXCEkBwhpJZgW1CiRxcZcJDRKqQQBXw6QNRFPDWQcXExBj0LeGvCjAb/yVEE0V6zLQZ0M8JSQrfRQAcR3sFYPfIjwzMV/DoSSsJoUfwpxAvhs+McKuNVAdcMjpgIvDFAjNkdPQKBwIv8MrDvcGVBzIO/VCIPhmAMahWDfkGmiAiecUIkrC2EbsNwir0KDAsJoIoNGMBMxJsOiQ9wguBSRqwxiLiBp4TcJpwWQK32dw8WENCbACUCiPuB+I9CL7x5ATMXPDvcQSM8p8/H8OfgY0DMgvZxiICMUjMiRZlUjcI3UkKABWQSIWBaiBQG0oigIdQfDc0C9iC8gvMcgeBbUc+CER9I+sl7QMsLGmiRLCByN0gokO8QeB0YXiLaJgQjVC3hUSXSAPCv0ZSPiBmAGmF8Ngo6dFtR00JsBQwlI0SP7w4oxQHwR4EMFCSjp4FKP5xQUVAhupKSRtFDCNkMFDyiQompEEjcgKBBwjvI8InDQKo64JLQvI/nwcQbgcokuwokJyIRBqkEuBnQmsdxHwVgogSF8j6o/+ECjfcPVitlQEQSL1ZqAEDCSj2UMFEKi7pKDDUQ0kAoDhgVNZ7H/h0o7VGCiWEfsOpprEFCL2i7IpaM9xHtEqMyjJojMjjwnUaqKhCX4OED8i3MIaJXwI6ebh6iGw+hGERj4YTGaiF4UX1zQ3MGmE8jVsKbFqjnoliTGikoktFCivogpB8Q5o9aPjxFo/sKvZ1IjLD1YSuMem7QmUQoF2isY/sIC5TI0qJiizojYNsjLo5GNhjyooGI4lXIy/2NAfIp6IbDaAZmO9x3o7tAZiOwhKlBCRsGyKEx7IoGLkjFojBD+jk8XKIbDi/c3wy9tIvGJQwfWa4GlifKNSNWibokWMPCI6HjkRi2wxWNiBeY0KIxBcYsaNZjSkWqNWZhMeIBBioROmK5ieoo2JWQpo22MpihEJPCLBxkOqNtjdUeDCTwSohQFoigYt/nljdog6B9gGw9GLVik8B8nhiWASKN9wFgP2MYA2otzGQwOUN2O9xMkeGOtivI0jiGQnYxLEdiMsK2L5gbYxLEai4EVbFZBeI9lAbDFue2KzA6AVBGnxa4i6NdiG49EkzigYw6NyijY+DH9i2or7G2j8Y3uNiBpo9zEjiG4zQDiiZouON7jAopOL1imsUaLTj24q4k9iKsbtDeQBo8KKbj84jrBCJfoo2Kgw4QGuPMjcgCRF4iLYo2Ozi9wprCqjGY18MLjBIxQGKi24n73djO40MPUAe4yPFKQhEfuMXjUo4OKjiw48yPiAEotaJ+9o4sBMZxZ43+MTiA42TnwRoY3+I/j146nFKQS4nOMGQnIhyJ9hOohuJviHIyyI5jZY18NTieEcyIMj/4mhW1jIowGOJYlAH2FVilI2SPjwWEjSIkj8/RGD5hvENhOOQmkYTB4TIUNhPANYYVbApol4GxAHi4qHxBoUKacNBsRb47ykkQ0YBRLHRb4gyOoBL4XaISoy0agE0SD4NoL5QYwialIwVwiyM0AFUVMLexqAbCL5IMEqJG3gMsTymiJ8SRxKLBD4c1keinEPBPZR2UXRKD8JiQxNfhCgOQLKpbURSN6jZ/K+V/D6gQSPeAS0CYmsiN2bGP8jw0OFDFj6YFqISS8gF+FmjTEg8lkQ4onjhYQzCemHwiN4VsmQJJsIdVTDckZ+I/hWiX3ATY0k5AgLQ5SCpPE0zycyPu8OouIAqT8EYpMaSvkX0mySS0HxHsSyIprH6I5E81lhhfSeqNRBikt3AMBKieqPGQcEbhPoM2w3qNyA6ccNCvic4cNF0gJwDrH5iOJFhCUT6oyZGMBU/dBEgjb4/ZK3hSMbPAUBakDZNQR+2HQJyBdyDrEFJ8UJXAfIQMReMqj9UZQFTDxkUBFSIlk8FOtZhMf2GjklkgJEBTqqf+GlQ9k1xEgQ5Q+5H8Snk64Lgok8aeH/I4o8+JuD0YCOgMjvcGNFJSU0VpHd8H4hYERQ4UeqLhAbgLDB+9F4ERLPiTsGDFWwScFEmkTQUhGNBCk8MtA0Sx4qMOC9awkJGuTzIvSn5QokYTAFS4QIVKjY7pWCMvNOUhgE2jB4pRIh86ARpBZT5U9Ql0gBWZVN1gTEgeN5hMMdlk5SsyfVD1i48KBGokScdBFkDk4iKQ6SxU2UjewnUm1BxTxUuVPWl+cTZDFTNwnNwSDcyX+LFhL5FuNVTUiBFO7QWmLuJFwxYKyhTSQ0tRHTSY0k5HJi4kWKPDT4YmwnDSJUoGPngayV1K5j4MQsnhiQiCtl/i4gFgOTjgsPmERihfEnAdSpk+GIUB3wnFOfR3wxBK0hnFGpCTxSMGsnhit4RhH5SlAYRHPhJ09QC3gZ0neBYQWIvNEUTBAemBfh+w3YMFRqqSFDOSSpJlEvkM0m6L/gucU9PjTykRNMvTU09BGiRb0kNPvTYkwQBAi48BNOAIN2V9MQj3069M/SQEFuOzTYkgJEAyL06qk3w30pAU0BgvL9IFYnKYdO2CFSMqkgRn0GFPLTVfDRKVwGUh5nQymkeDAkSCkDQGSSnUvNC5wvI/IOxMFyeGIvILk3GM7lWyFOLU1/jJP2pgt4HdKikMkbZNyQWtEqQySBks0MiTKrRLGphKAIcJzhGEc8MnT4EYwGJIhEj+B8Da03DMMpfAoX0Rg3URKgQzFU4AloBcYKxO7T0MgwFfh6gL/1HhQEfTMSxAEL/xpp2MxgFH9xwGSPQzKAXaPsy109FGczhAJ+Hhjt4R5MFp3yLzPgQlEwWmjRqYdjLCQmkfPyrRcYX8OLSnouBAjoq0b02HTbM4LwSyOwkeAfSReZgHzTCMozLRhBMZLL0jcMrTJsZc+NckKzEsBNBrIjkgdn4R30BdMmwIs5PFKI0skXEbJCeA5DiAY4mxUoscELrK6xjUHVJjiosmmC6xN4fxNiISpLTUAjRscYhjjqYaTNGzQEloILYDABBBHYy0DQGeiAuUaOYyr2Z8M3DEYeBDkIGaFhGYAhMk4LwidE71mEwKMNlAv8yIjYImQiOJ8O/8tsp8LTR3MstFNjUUTiMkkDszYPdI/swJAYyOJEoiOIIAzcMnomUV+Fky/shsMnpr+SVAZobohHOEQkcgdlHhBADTJv8P4AJN2idM7GnVT9YjDL6RksQnMFZhY4QH6SCMyEi2Jk4hNkTI+YSLAyRFkynIXhWiPfyjl+gpWOxIrAr/3JycM5bPbCBIOTJZzzswUjyTx0HOFpy20p1MDA1k1VFUywhcpHQSJct5HKRYYSLGlQqk02NCQYcyLEeRGACbI2CTAcIhsYOJflG3hFM5bJQyUwshLZj+UGVFNjbcvwLITPKCpHcSJc03PMRUwuBF2Tdc21H1zqqQcnWTbY9XNcirKBZPFyNgw4k0RUwwPUmTk4/IIWTcqNRCxyiY5gLE0k08/x1zKc2pNRMfvJJKlimknxBxSi8ynI6SmctFO6SGMsmGpyt0oZOxykwhNDODAqMFH7DFAH2DlJYciNjSSoMNzi9YaYeJKBi+kq3KTT28+HKpyrclpL/iO8jDMaQZ8p+CiToIr5KMIbYVQCGToIt4GBCrKHxIYz9knxGfhPQ+eUPyrwoGPPjoib0Hpg74Z9E3CoQuBATQMsNmPTRXOJxDRy5MzaNfzEci1IFzBc9mmawFoi1N9IyktqNc4xA1jF9i+YH9FAK/UY+EyRe4uEj5hTwusBYQ2Mh2NgpP8ojDFhBpLWJxh80PePVggMaiWrB30TEnVgrZRMiNjlARcL3Cy0GgmrBCgYNNhBEYKgsYLBAU8IppxkVdKoKwEElVzRw0Q9AWiqC0gtoLAwReBrIHY/AozIBC1JFTR0CmNE/z8guBFHTJ4xAomyBC3knUAZ0jyOgK9YgQoeR5ySlOEAjc3DCJz9CwzW8QO0zePQjzCyCJ7zMsRQpOxFw+wvyCwkedP4KKM0eHIy7YzzI8KNYfoifzGcJWXuyOC+sgULU/GmDCSX8sQtnC1EqIgaQ/IgQreQhCnODYjWMUIsPDuC1IvGRz4D8JYLUit7E3hTwu6EyxIEd/OQLSkIDAbTSinIt4D/KbuWolEYP9I/CsC4IojoKaaIlVzXOReCiKtc/lDYyKikIngLxM21JCL+Cv1G3gIC45N2RaCm1EYBci7PDcKWioxPfzIsTaK3CH8hQDWL+wmaIhTtkk5KYL9w+5IsKWImYAzisizLGjkl0hsL0g3kaosDBdILQpuLqkWIoNzlCggqFhR4BQqyTxMk5FTQKixqICR7EuTMPgJ08YvuQvClwqNQFoiosvkl05LC4LfC+orxQfM6XNhKTi3zNhLN4DeE+z0S1EoHYX8yMnxLBMLEqXz3MlcNc4QkYkuYJ/8qksCzRsaQrGQyS8WjxL6Sk/lZLN0mbNJKcS17A5KVfZXFpKMSmzyxLg4aiTrAiwBpPBKo0TaSERD0ykrMRAyaNK3ZRALQpgKISj1KF8AyG4FmKDw/omBLiubAvyIRwG1PpSFuLhAbJCSvFDNLp0M6MpLp4RpDNKvSFJGWLpM9lH0C+cBpHPgdS1BG9ALCIFn4iHS54r5hN8HvMcx5i0qyBjncMWEYBXgp6NsQOwvSAkQBBPnBVyoMU4reD2URmIlxekODOeK/CCVGZDMIkJGTibqBeBm84gfsNyAX4ELDfRD0guGrLGOGVFGjoI3pH6k6gb/JbKHSXoNrLKyq/mfQFvJbJWDIEbhH9Kr+WRGLKnUooEES7xbMo3hcykfKjkGyCwhTKvSdgoXKmkfstHK4y9wpHBMfdAhtYwy/xOjzO8r9D9LSAiCLnz9Em4E3RRyz0qRLrgKHK7DHS/BMaRJ8qDAXgH4uaGLyN4TuVmCkSQOKcxZw67IZx3QlgBYihALwuPhq1KbFUQ6inGLBQzszGh3RRBIdJmRhAfhGfRAaGshUyic9BmAxGkY/OhpXIonwAqr0VBCBZ5qNtJcCcYsirWi9qKioez7A8QNGo1ERxHDjmsafG1R6KtcjHj+UXtGgqnwnipNSREWChYqQkOFWEqbEB0tyZKKoStMlDM5DBYq5KjVKLBAuQGmIrqks4uMAWQKGixpsK8rOWiaaBdhBwsczQFQqvsKJFkCQK2Ct6jcWJdOjDo0kHFAqEEMeN+IEEa6nSxQkczLulxKswFJZOIo0o6w4gBGwpxdIUuKCrPIpUQpxS/eqNQzSiBnCcQtC6pIPyfAhzAPy3kURA3jJsflHdKdYKEnWwN42GK1QGccZHqiiqjeBKqJsmZJKqnEQ8JGTvcd5JkqjURpIyq1ECiuarekoxLKLfmEJFFLso4lOoKGcEtDgpGk+BH8TCyUYEUBxNUeJgT0UpVMmrCM38NvjswFr1R9xg5spgShEOeTWqE0DaqQSTkcRIWqV0fFAciWAaTKBYpqmTLiiE459FqQhqxxGfh3I4crSquQCxPYZXi/gCmq+YT+IwT3EBtNR9S89IqoSjAREqaYX4lgFyLiEhavWqii4GvGQn4M8s+rMEhyL5RfmZlEPSL2VGpArv0ucL7YttHWFIjEIi9huQY5UXBRrHio6kzSMErGsepgQkCL7x280mpCIiarVgXhSaqmuQU2M9muUitWSiKcqcamRNnzfmQmtxqGatmqGqj0OKIMoWQX8XBq2Eu5Ohrdq2GvvZPIygqRr2ESGvMji/bEzBq7SZwP4S9A9lgBrvq1XK4ShqxqN1S5IhaoIj1YN/NGjray0rtqkcpwIqLoUhYsepXdVdMGLJirMoVSYS8EqGLw0PnHiIwS5Ep6K0Cx6l7Dz4VCtc53UnAoPKUgvUrVKiC14MRiNSswoiVvUx6m3TDCvQruhHMfosOKBC1OrYLRCgciyKC63gutzmCwQv+reYUgurqE4NlAkLI6/Au8qE4WQv+MeAjApjqlCgIuDq1C0Is0KZyv2p3Ka6gwr9THKuGBMKy6pFHtRegtJNsL56g8snpoipwtzrHKwLyWKh6x4pnKfwmYqHr3ihzFSjbU1shkK/irusNp+imav8oYilutR8KkH6oThki/6p45mijItBqUwdQkALQipph45Cij8Pzr/68ovBKKC1+u/rNa5EpTqv61SqBrkSuOoZjN60qSfrui1AvrwH66+stLA6ripPqlZM+omL10BauUL7y22vmKcSVH37LEyV2u/yHa/hOrVV6uhrpAVo1hLhrmEo8RhzOExfC3Ah4llGBrDI38WrAjot6sNSPYgVi/qlNEqLwS84hzHATgMflHcisE3WtejTa0jgApUSVHy98CCpsAiikYihtOiSkk7AniKG3VKASdohav2jGk7+J9ikahaNijGk1+PJw0Qa6KWTuYhauUa/IprAvi3og8tkbPonlIPisy+IAUAWohhPEkt4mcvASIYkaL6R1Gw2j5jlImeN0bUogqOnjx4xKKRqso3iuxQMojJr7zu46xtR8yYg6NbjHGsqI+K64nCJZAzY4aPQzy4iJtxiQmltJwTp8L+ruj5G9DJvi3Gx6NVzGMlBI0bnGgzJ1jxcQL30b2K8xLorAvdYqDizGmxvWLiYn+L0bUY3XMFjSmzRpuj6Y+uIwaam5bPZijkqpraaeYsppkaSm4vLJifiqpsqJ4Mb8plijyeUB4bno5WIVI8mDhvViUYzWIPKJQWaN1jcKg2JULGAU1I5RTY3ZtyYVE8KolyNcypripd49ZrvQ7I8nGL814t7O9iUI/5r7iF43Cumbh4/gASob6nGPGaHMHFvYzY43RoSp541Ct6aV4/5o7iem+eEUbRgKFtwT0M1VEPjsW9zBPjNw7SG6a9mjdkUaW4g5vpbmm8ppKa8oKOQ9jno/JpRa2YmhPMreYbJq4rWg1JuYa6KhVrHioU3RqlbUQcyqrKYm8XB0CM402r0rQYgVqfj/G6FoFaiEnlIxIK4gVuPj0ECxMqjXG1lo6jm4zqocaBW6lo8bJ6EmIFa0W8ytMasW1Ftxb/IiBIJaUCAxp0bfDVFrJaB41Rr6aEWsVoUajWp1uhapGghP+b+osgosj9WsRtZbl4yhMYT+GrcDVbvminMYStI55rVjGG9hsrata9hKPFe0XqOrB7w8nEthNw6sC/CmmVto+1OBDhpyIE61X1hghY0ML0QpingMETb4vpIWj4UxsqzIx6ntt3Dp26GQkrh2hdpsDSkXqMnavEC4IyQvazqpHaH41rFqL7GkGKDqZspMqQLOqtqojqRMWomjqB4y6reBgK6AkXDB9UMP/h7StGFpa2EG2uQJdIK3JaxdYM6PaT7SJ9pEx/UbKKbStCqfCgL0vRpPKR8M0bJMLG65AiDTOSkTB+p72rmL3St2SwiA7AvPNLNKBUAxoaq2yv+J4ymwEjuAJFucjqtjqYRjm2CDG0BF2jHUOrNraykUjqI62E9jqo7qkcjoMpezTQNRQ2E73GY6yOqWq5i4Mz8rE7hO/hB472U8TpE7NpQM1rbFOygPdQuOn3JsY6wdTrY7NOtdvk7ckpjqU6f22jtE6Ky4jpSRSO8ztyTKOrTqMBlO0MNjTgvOsAc6IOcpGw6VmIyLg7ZUtDupp0WzDvg74SpdsGldC0tog5IOryLqAH8qjM6rBpP5tlb6MlqpSQ5CyOt3Qg25AjdRGkV4MgjsTTDtaq66vJPprO8ppGERs+YOvuyHmUlXC9Tc6kIjFvLCsTLCB4FYK1k2EGsKpkzMh7PmoPQhiLRF4y9sOginyrcF7D+ylssHCHMBOJHDcawrgnD9S6cJ3apuqsqMiUWk8PPyo5TVMvC7874RFxdw54pLRxkcEg3DTwg6A7aNux8M1z+AO8IcQzI/yhvDtZI2Nqi52z8IvDcIhCIW6PM/bt9w0It9KZCXuiCLVSwupCPW7fu9COm9kI1Ai+6f05XywiI6H8PwjeyoiLEz4I0iOgiKI1Syoj9o/zr/zKw+iNWxJ6brpYj9kvVBxJ8hTiKHbrgHiOe7go+UiJqm2q7tKjqe0WqtrcI6SOUS62+CIxiHIrSPZ6a2strYbI6HSIViici9kLauo5FuEaSEnNoFi4W1NpabjQCFvabGEjyIGjwY7Zr3wAoleMGj4m3JIjbxot5qA7wEjGMyi2k/1pybgozJti7vW5GKKb7GlZphitenlPvjxY9mI8bnkxqLBiGmgGIHjRYM1qZi5GzFIzbVsB6NV7LsPNt161m1Vq+bde2xqA69KF5vmjdUhLqxa9o9YolbSo6PuKaJGt+Imi4Y1NP5bqY7pshiJqS+M5iDm4tJ+iH4/6NaiSM6liTaao4Popago+/Jz6LMoZqSjregCvxajetGLoyk+wmNNixetvpSblmuFrt7m+i7Pl6neqJttjgWoXxci/GkcF+b+Y8+JWbTmgqJ+LVwEmOuaVYuWPSiDK4nKfQkMhSJ56ecs5twLiWktqx6kwmmP5igmtRoey2Y82NwKLW5bIn6HY6RuH6qY9+P1akWy3p+8EE5OMxbTe0OO77O+3+OgSW+uBL/7pWppooT440VqfrgYulobiTWguOkbr43ltqa4Ea1objbW0+JDS8+18OdahWzPtQJqwRFpbjLm46PeBo2xeMT7Te94HS7Y+ieNfCp4iPsgHqBzVq96AWoKLIGE2nlID77ulNv8aoKh+Krj2Wm5Mf6hfYuNBiXG+uMfj3+11tt7UE7/ssbf+hOOgHAEjVBmaoEwcuDbDesAd0HtG1vvgSNBoXtjaNe2fyfqL2JXuwSUB36rQHCEjAcYSJe6yNv6TYvhpoTtKOhLaqB4rho4SeatnqP6WG+9kkic4SIqdyYE7FL6KpCCxLIH7kj3OmTBGhgClyHCzQDlJDOwPOeY/cNZM6yYE8PNISlSzyijyqq27qqTxkk1HbqmwWCM1RUwopOxzCOMpK8jZErZNGrD8mDJBqjwidrxQsyRdtap9EnpNDCqwJlBnzB2xSMaTN4b9typj4FkF8TOquTVYr184JMsaW88JK1YyEOduQI8Yy3PpgJ8vdr5RqJVmuyiaFVmq01GkmHM0Behw4dNiMk2xDby+85PPySG89PNNjhch+KeYa805quSC8qPD7yN2S5E3Yfh/sIZy2w1PI+HKcxgEC59WNPOGTKc0ZKmTx8iZMdTcKqPBiQqMMqhgxWckcA6oFAccq6TAuBjM+acEewo3Y0hhXvJ7rg0QHz93c5pIbCJQClKLA1ix3K+ygYwkbjylc36OnynU7EaxzUCQMCGi3kWkaCoTUfHMuzc8hfsIzHo83OVydE4vIhGTAGnKfg6cp1OBGPI5nI01o8v4Y5z+c7nOJz88jLAgrf8hxIlzXh0XPVHjch4ZSGAuRUdlzcK04LhReR+PB1GmsLiIOqycp0cqicRjLMywzAI3LKrUR/UbNjUEAYYg5RklIbf5VK02r6T8RoLOtG/W5tF2Sgss0caT2cxGMFpfSort5z3OoX34FDRxIczzykhmleRMRtXuqGCkpUqrRYxmNqfCgxxrKgqZRvIYxQChsv15oOo4Mf8i9crIeJj8kkoYSBkhuIuERBCZDriHohiIZCHtk8IeZGxxphpebOethorbghjBPLb+WHaIciRei7oSBJY4GpcHZYqppIGZekbH2a/exNvwUtmlmJgTkEylqcax+/yJ17zG0ZpgSQ28xpMatBgNsmaIOy3sWa7GxQZH6MmgZqyrHW08YNa8I4vp8buotyOEGiwQJo96q+oXsNaTxyJuD6l4nVrcb7e5AMj6Fq9vtMklW4+uSismmZo0a8mjcYKbkmpZtTSSBlCevHbov3taap+suKwH6m4Js97q+wuNaajxjpqQHAJwvtgGFq8PsGa4Ez8fJiI49JuMbu+gXpwa6AOZoljiJugHvHlsl2NWa/x8foAmr6+vof6QJxyt8bwJ8Uev7jmvcbzy1+3JkEbNx8UYP6lEO5rlat+p5pJwZx/SdFjcmT5voT6co5oFbQ+oFskHHK0FrIKNg1/uTbGWuSaUGqW8ga9iPx0ls4GnUwAa4rCWsZv0HA2oluMGo2sKdwqoYylvjaEB2lqTb/mogZujvoyCaBYE2auI5ai+7xo8ma+sFqonNmoob8mZ5YVv4A9WvgZDTKBltr/jEpgHsHi5WkVvAHlouPtqnvDVJuLbdW5qYATYJ7gYGm0El3s3iMpyqZdaN4rKfNanBjrCtaZy/KfEGHegCYZbppiDjdbWWj1tUGFm0KaGnWpk3simw23JMfHWW1gbyH4p/acx74M/yIvH1G1KdNqE4jifWmtG2sIcH028JsMTtx25qeYdW1cc8G6QYttCbNIucesnj+5BVCH5xzhKZ68mBttyThIyVpkmGw9tue7qYZGaq60gt3WlCsKJcRy4KQTpW0AVAhgKJnDgu9Q55Mg7QDLltAOAKoB8ZcBRpngFY3iDlCZRmZxC8Q4OQpAOZLmSDkeZAXgIBUANNUUp3uYim7sB6K9mHgVAKCCgABICQCYgAAHQbhLAIAA"))
  688. ///////////////////////////////////////////////
  689. ///////////////////////////////////////////////
  690. /* Utility functions */
  691. var storagePrefix = 'KiCad_HTML_BOM__' + pcbdata.metadata.title + '__' +
  692. pcbdata.metadata.revision + '__#';
  693. var storage;
  694. function initStorage(key) {
  695. try {
  696. window.localStorage.getItem("blank");
  697. storage = window.localStorage;
  698. } catch (e) {
  699. // localStorage not available
  700. }
  701. if (!storage) {
  702. try {
  703. window.sessionStorage.getItem("blank");
  704. storage = window.sessionStorage;
  705. } catch (e) {
  706. // sessionStorage also not available
  707. }
  708. }
  709. }
  710. function readStorage(key) {
  711. if (storage) {
  712. return storage.getItem(storagePrefix + key);
  713. } else {
  714. return null;
  715. }
  716. }
  717. function writeStorage(key, value) {
  718. if (storage) {
  719. storage.setItem(storagePrefix + key, value);
  720. }
  721. }
  722. function fancyDblClickHandler(el, onsingle, ondouble) {
  723. return function() {
  724. if (el.getAttribute("data-dblclick") == null) {
  725. el.setAttribute("data-dblclick", 1);
  726. setTimeout(function() {
  727. if (el.getAttribute("data-dblclick") == 1) {
  728. onsingle();
  729. }
  730. el.removeAttribute("data-dblclick");
  731. }, 200);
  732. } else {
  733. el.removeAttribute("data-dblclick");
  734. ondouble();
  735. }
  736. }
  737. }
  738. function smoothScrollToRow(rowid) {
  739. document.getElementById(rowid).scrollIntoView({
  740. behavior: "smooth",
  741. block: "center",
  742. inline: "nearest"
  743. });
  744. }
  745. function focusInputField(input) {
  746. input.scrollIntoView(false);
  747. input.focus();
  748. input.select();
  749. }
  750. function copyToClipboard() {
  751. var text = '';
  752. for (var node of bomhead.childNodes[0].childNodes) {
  753. if (node.firstChild) {
  754. text = text + node.firstChild.nodeValue;
  755. }
  756. if (node != bomhead.childNodes[0].lastChild) {
  757. text += '\t';
  758. }
  759. }
  760. text += '\n';
  761. for (var row of bombody.childNodes) {
  762. for (var cell of row.childNodes) {
  763. for (var node of cell.childNodes) {
  764. if (node.nodeName == "INPUT") {
  765. if (node.checked) {
  766. text = text + '✓';
  767. }
  768. } else if (node.nodeName == "MARK") {
  769. text = text + node.firstChild.nodeValue;
  770. } else {
  771. text = text + node.nodeValue;
  772. }
  773. }
  774. if (cell != row.lastChild) {
  775. text += '\t';
  776. }
  777. }
  778. text += '\n';
  779. }
  780. var textArea = document.createElement("textarea");
  781. textArea.classList.add('clipboard-temp');
  782. textArea.value = text;
  783. document.body.appendChild(textArea);
  784. textArea.focus();
  785. textArea.select();
  786. try {
  787. if (document.execCommand('copy')) {
  788. console.log('Bom copied to clipboard.');
  789. }
  790. } catch (err) {
  791. console.log('Can not copy to clipboard.');
  792. }
  793. document.body.removeChild(textArea);
  794. }
  795. function removeGutterNode(node) {
  796. for (var i = 0; i < node.childNodes.length; i++) {
  797. if (node.childNodes[i].classList &&
  798. node.childNodes[i].classList.contains("gutter")) {
  799. node.removeChild(node.childNodes[i]);
  800. break;
  801. }
  802. }
  803. }
  804. function cleanGutters() {
  805. removeGutterNode(document.getElementById("bot"));
  806. removeGutterNode(document.getElementById("canvasdiv"));
  807. }
  808. var units = {
  809. prefixes: {
  810. giga: ["G", "g", "giga", "Giga", "GIGA"],
  811. mega: ["M", "mega", "Mega", "MEGA"],
  812. kilo: ["K", "k", "kilo", "Kilo", "KILO"],
  813. milli: ["m", "milli", "Milli", "MILLI"],
  814. micro: ["U", "u", "micro", "Micro", "MICRO", "μ", "µ"], // different utf8 μ
  815. nano: ["N", "n", "nano", "Nano", "NANO"],
  816. pico: ["P", "p", "pico", "Pico", "PICO"],
  817. },
  818. unitsShort: ["R", "r", "Ω", "F", "f", "H", "h"],
  819. unitsLong: [
  820. "OHM", "Ohm", "ohm", "ohms",
  821. "FARAD", "Farad", "farad",
  822. "HENRY", "Henry", "henry"
  823. ],
  824. getMultiplier: function(s) {
  825. if (this.prefixes.giga.includes(s)) return 1e9;
  826. if (this.prefixes.mega.includes(s)) return 1e6;
  827. if (this.prefixes.kilo.includes(s)) return 1e3;
  828. if (this.prefixes.milli.includes(s)) return 1e-3;
  829. if (this.prefixes.micro.includes(s)) return 1e-6;
  830. if (this.prefixes.nano.includes(s)) return 1e-9;
  831. if (this.prefixes.pico.includes(s)) return 1e-12;
  832. return 1;
  833. },
  834. valueRegex: null,
  835. }
  836. function initUtils() {
  837. var allPrefixes = units.prefixes.giga
  838. .concat(units.prefixes.mega)
  839. .concat(units.prefixes.kilo)
  840. .concat(units.prefixes.milli)
  841. .concat(units.prefixes.micro)
  842. .concat(units.prefixes.nano)
  843. .concat(units.prefixes.pico);
  844. var allUnits = units.unitsShort.concat(units.unitsLong);
  845. units.valueRegex = new RegExp("^([0-9\.]+)" +
  846. "\\s*(" + allPrefixes.join("|") + ")?" +
  847. "(" + allUnits.join("|") + ")?" +
  848. "(\\b.*)?$", "");
  849. units.valueAltRegex = new RegExp("^([0-9]*)" +
  850. "(" + units.unitsShort.join("|") + ")?" +
  851. "([GgMmKkUuNnPp])?" +
  852. "([0-9]*)" +
  853. "(\\b.*)?$", "");
  854. for (var bom_type of ["both", "F", "B"]) {
  855. for (var row of pcbdata.bom[bom_type]) {
  856. row.push(parseValue(row[1], row[3][0][0]));
  857. }
  858. }
  859. }
  860. function parseValue(val, ref) {
  861. var inferUnit = (unit, ref) => {
  862. if (unit) {
  863. unit = unit.toLowerCase();
  864. if (unit == 'Ω' || unit == "ohm" || unit == "ohms") {
  865. unit = 'r';
  866. }
  867. unit = unit[0];
  868. } else {
  869. ref = /^([a-z]+)\d+$/i.exec(ref);
  870. if (ref) {
  871. ref = ref[1].toLowerCase();
  872. if (ref == "c") unit = 'f';
  873. else if (ref == "l") unit = 'h';
  874. else if (ref == "r" || ref == "rv") unit = 'r';
  875. else unit = null;
  876. }
  877. }
  878. return unit;
  879. };
  880. val = val.replace(/,/g, "");
  881. var match = units.valueRegex.exec(val);
  882. var unit;
  883. if (match) {
  884. val = parseFloat(match[1]);
  885. if (match[2]) {
  886. val = val * units.getMultiplier(match[2]);
  887. }
  888. unit = inferUnit(match[3], ref);
  889. if (!unit) return null;
  890. else return {
  891. val: val,
  892. unit: unit,
  893. extra: match[4],
  894. }
  895. }
  896. match = units.valueAltRegex.exec(val);
  897. if (match && (match[1] || match[4])) {
  898. val = parseFloat(match[1] + "." + match[4]);
  899. if (match[3]) {
  900. val = val * units.getMultiplier(match[3]);
  901. }
  902. unit = inferUnit(match[2], ref);
  903. if (!unit) return null;
  904. else return {
  905. val: val,
  906. unit: unit,
  907. extra: match[5],
  908. }
  909. }
  910. return null;
  911. }
  912. function valueCompare(a, b, stra, strb) {
  913. if (a === null && b === null) {
  914. // Failed to parse both values, compare them as strings.
  915. if (stra != strb) return stra > strb ? 1 : -1;
  916. else return 0;
  917. } else if (a === null) {
  918. return 1;
  919. } else if (b === null) {
  920. return -1;
  921. } else {
  922. if (a.unit != b.unit) return a.unit > b.unit ? 1 : -1;
  923. else if (a.val != b.val) return a.val > b.val ? 1 : -1;
  924. else if (a.extra != b.extra) return a.extra > b.extra ? 1 : -1;
  925. else return 0;
  926. }
  927. }
  928. function validateSaveImgDimension(element) {
  929. var valid = false;
  930. var intValue = 0;
  931. if (/^[1-9]\d*$/.test(element.value)) {
  932. intValue = parseInt(element.value);
  933. if (intValue <= 16000) {
  934. valid = true;
  935. }
  936. }
  937. if (valid) {
  938. element.classList.remove("invalid");
  939. } else {
  940. element.classList.add("invalid");
  941. }
  942. return intValue;
  943. }
  944. function saveImage(layer) {
  945. var width = validateSaveImgDimension(document.getElementById("render-save-width"));
  946. var height = validateSaveImgDimension(document.getElementById("render-save-height"));
  947. var bgcolor = null;
  948. if (!document.getElementById("render-save-transparent").checked) {
  949. var style = getComputedStyle(topmostdiv);
  950. bgcolor = style.getPropertyValue("background-color");
  951. }
  952. if (!width || !height) return;
  953. // Prepare image
  954. var canvas = document.createElement("canvas");
  955. var layerdict = {
  956. transform: {
  957. x: 0,
  958. y: 0,
  959. s: 1,
  960. panx: 0,
  961. pany: 0,
  962. zoom: 1,
  963. },
  964. bg: canvas,
  965. fab: canvas,
  966. silk: canvas,
  967. highlight: canvas,
  968. layer: layer,
  969. }
  970. // Do the rendering
  971. recalcLayerScale(layerdict, width, height);
  972. prepareLayer(layerdict);
  973. clearCanvas(canvas, bgcolor);
  974. drawBackground(layerdict, false);
  975. drawHighlightsOnLayer(layerdict, false);
  976. // Save image
  977. var imgdata = canvas.toDataURL("image/png");
  978. var filename = pcbdata.metadata.title;
  979. if (pcbdata.metadata.revision) {
  980. filename += `.${pcbdata.metadata.revision}`;
  981. }
  982. filename += `.${layer}.png`;
  983. saveFile(filename, dataURLtoBlob(imgdata));
  984. }
  985. function saveSettings() {
  986. var data = {
  987. type: "InteractiveHtmlBom settings",
  988. version: 1,
  989. pcbmetadata: pcbdata.metadata,
  990. settings: settings,
  991. }
  992. var blob = new Blob([JSON.stringify(data, null, 4)], {type: "application/json"});
  993. saveFile(`${pcbdata.metadata.title}.settings.json`, blob);
  994. }
  995. function loadSettings() {
  996. var input = document.createElement("input");
  997. input.type = "file";
  998. input.accept = ".settings.json";
  999. input.onchange = function(e) {
  1000. var file = e.target.files[0];
  1001. var reader = new FileReader();
  1002. reader.onload = readerEvent => {
  1003. var content = readerEvent.target.result;
  1004. var newSettings;
  1005. try {
  1006. newSettings = JSON.parse(content);
  1007. } catch(e) {
  1008. alert("Selected file is not InteractiveHtmlBom settings file.");
  1009. return;
  1010. }
  1011. if (newSettings.type != "InteractiveHtmlBom settings") {
  1012. alert("Selected file is not InteractiveHtmlBom settings file.");
  1013. return;
  1014. }
  1015. var metadataMatches = newSettings.hasOwnProperty("pcbmetadata");
  1016. if (metadataMatches) {
  1017. for (var k in pcbdata.metadata) {
  1018. if (!newSettings.pcbmetadata.hasOwnProperty(k) || newSettings.pcbmetadata[k] != pcbdata.metadata[k]) {
  1019. metadataMatches = false;
  1020. }
  1021. }
  1022. }
  1023. if (!metadataMatches) {
  1024. var currentMetadata = JSON.stringify(pcbdata.metadata, null, 4);
  1025. var fileMetadata = JSON.stringify(newSettings.pcbmetadata, null, 4);
  1026. if (!confirm(
  1027. `Settins file metadata does not match current metadata.\n\n` +
  1028. `Page metadata:\n${currentMetadata}\n\n` +
  1029. `Settings file metadata:\n${fileMetadata}\n\n` +
  1030. `Press OK if you would like to import settings anyway.`)) {
  1031. return;
  1032. }
  1033. }
  1034. overwriteSettings(newSettings.settings);
  1035. }
  1036. reader.readAsText(file, 'UTF-8');
  1037. }
  1038. input.click();
  1039. }
  1040. function overwriteSettings(newSettings) {
  1041. initDone = false;
  1042. Object.assign(settings, newSettings);
  1043. writeStorage("bomlayout", settings.bomlayout);
  1044. writeStorage("bommode", settings.bommode);
  1045. writeStorage("canvaslayout", settings.canvaslayout);
  1046. writeStorage("bomCheckboxes", settings.checkboxes.join(","));
  1047. document.getElementById("bomCheckboxes").value = settings.checkboxes.join(",");
  1048. for (var checkbox of settings.checkboxes) {
  1049. writeStorage("checkbox_" + checkbox, settings.checkboxStoredRefs[checkbox]);
  1050. }
  1051. writeStorage("darkenWhenChecked", settings.darkenWhenChecked);
  1052. padsVisible(settings.renderPads);
  1053. document.getElementById("padsCheckbox").checked = settings.renderPads;
  1054. fabricationVisible(settings.renderFabrication);
  1055. document.getElementById("fabricationCheckbox").checked = settings.renderFabrication;
  1056. silkscreenVisible(settings.renderSilkscreen);
  1057. document.getElementById("silkscreenCheckbox").checked = settings.renderSilkscreen;
  1058. referencesVisible(settings.renderReferences);
  1059. document.getElementById("referencesCheckbox").checked = settings.renderReferences;
  1060. valuesVisible(settings.renderValues);
  1061. document.getElementById("valuesCheckbox").checked = settings.renderValues;
  1062. tracksVisible(settings.renderTracks);
  1063. document.getElementById("tracksCheckbox").checked = settings.renderTracks;
  1064. zonesVisible(settings.renderZones);
  1065. document.getElementById("zonesCheckbox").checked = settings.renderZones;
  1066. dnpOutline(settings.renderDnpOutline);
  1067. document.getElementById("dnpOutlineCheckbox").checked = settings.renderDnpOutline;
  1068. setRedrawOnDrag(settings.redrawOnDrag);
  1069. document.getElementById("dragCheckbox").checked = settings.redrawOnDrag;
  1070. setDarkMode(settings.darkMode);
  1071. document.getElementById("darkmodeCheckbox").checked = settings.darkMode;
  1072. setHighlightPin1(settings.highlightpin1);
  1073. document.getElementById("highlightpin1Checkbox").checked = settings.highlightpin1;
  1074. writeStorage("boardRotation", settings.boardRotation);
  1075. document.getElementById("boardRotation").value = settings.boardRotation / 5;
  1076. document.getElementById("rotationDegree").textContent = settings.boardRotation;
  1077. initDone = true;
  1078. prepCheckboxes();
  1079. changeBomLayout(settings.bomlayout);
  1080. }
  1081. function saveFile(filename, blob) {
  1082. var link = document.createElement("a");
  1083. var objurl = URL.createObjectURL(blob);
  1084. link.download = filename;
  1085. link.href = objurl;
  1086. link.click();
  1087. }
  1088. function dataURLtoBlob(dataurl) {
  1089. var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
  1090. bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
  1091. while(n--){
  1092. u8arr[n] = bstr.charCodeAt(n);
  1093. }
  1094. return new Blob([u8arr], {type:mime});
  1095. }
  1096. var settings = {
  1097. canvaslayout: "default",
  1098. bomlayout: "default",
  1099. bommode: "grouped",
  1100. checkboxes: [],
  1101. checkboxStoredRefs: {},
  1102. darkMode: false,
  1103. highlightpin1: false,
  1104. redrawOnDrag: true,
  1105. boardRotation: 0,
  1106. renderPads: true,
  1107. renderReferences: true,
  1108. renderValues: true,
  1109. renderSilkscreen: true,
  1110. renderFabrication: true,
  1111. renderDnpOutline: false,
  1112. renderTracks: true,
  1113. renderZones: true,
  1114. }
  1115. function initDefaults() {
  1116. settings.bomlayout = readStorage("bomlayout");
  1117. if (settings.bomlayout === null) {
  1118. settings.bomlayout = config.bom_view;
  1119. }
  1120. if (!['bom-only', 'left-right', 'top-bottom'].includes(settings.bomlayout)) {
  1121. settings.bomlayout = config.bom_view;
  1122. }
  1123. settings.bommode = readStorage("bommode");
  1124. if (settings.bommode === null) {
  1125. settings.bommode = "grouped";
  1126. }
  1127. if (!["grouped", "ungrouped", "netlist"].includes(settings.bommode)) {
  1128. settings.bommode = "grouped";
  1129. }
  1130. settings.canvaslayout = readStorage("canvaslayout");
  1131. if (settings.canvaslayout === null) {
  1132. settings.canvaslayout = config.layer_view;
  1133. }
  1134. var bomCheckboxes = readStorage("bomCheckboxes");
  1135. if (bomCheckboxes === null) {
  1136. bomCheckboxes = config.checkboxes;
  1137. }
  1138. settings.checkboxes = bomCheckboxes.split(",").filter((e) => e);
  1139. document.getElementById("bomCheckboxes").value = bomCheckboxes;
  1140. settings.darkenWhenChecked = readStorage("darkenWhenChecked") || "";
  1141. populateDarkenWhenCheckedOptions();
  1142. function initBooleanSetting(storageString, def, elementId, func) {
  1143. var b = readStorage(storageString);
  1144. if (b === null) {
  1145. b = def;
  1146. } else {
  1147. b = (b == "true");
  1148. }
  1149. document.getElementById(elementId).checked = b;
  1150. func(b);
  1151. }
  1152. initBooleanSetting("padsVisible", config.show_pads, "padsCheckbox", padsVisible);
  1153. initBooleanSetting("fabricationVisible", config.show_fabrication, "fabricationCheckbox", fabricationVisible);
  1154. initBooleanSetting("silkscreenVisible", config.show_silkscreen, "silkscreenCheckbox", silkscreenVisible);
  1155. initBooleanSetting("referencesVisible", true, "referencesCheckbox", referencesVisible);
  1156. initBooleanSetting("valuesVisible", true, "valuesCheckbox", valuesVisible);
  1157. if ("tracks" in pcbdata) {
  1158. initBooleanSetting("tracksVisible", true, "tracksCheckbox", tracksVisible);
  1159. initBooleanSetting("zonesVisible", true, "zonesCheckbox", zonesVisible);
  1160. } else {
  1161. document.getElementById("tracksAndZonesCheckboxes").style.display = "none";
  1162. tracksVisible(false);
  1163. zonesVisible(false);
  1164. }
  1165. initBooleanSetting("dnpOutline", false, "dnpOutlineCheckbox", dnpOutline);
  1166. initBooleanSetting("redrawOnDrag", config.redraw_on_drag, "dragCheckbox", setRedrawOnDrag);
  1167. initBooleanSetting("darkmode", config.dark_mode, "darkmodeCheckbox", setDarkMode);
  1168. initBooleanSetting("highlightpin1", config.highlight_pin1, "highlightpin1Checkbox", setHighlightPin1);
  1169. settings.boardRotation = readStorage("boardRotation");
  1170. if (settings.boardRotation === null) {
  1171. settings.boardRotation = config.board_rotation * 5;
  1172. } else {
  1173. settings.boardRotation = parseInt(settings.boardRotation);
  1174. }
  1175. document.getElementById("boardRotation").value = settings.boardRotation / 5;
  1176. document.getElementById("rotationDegree").textContent = settings.boardRotation;
  1177. }
  1178. // Helper classes for user js callbacks.
  1179. const IBOM_EVENT_TYPES = {
  1180. ALL: "all",
  1181. HIGHLIGHT_EVENT: "highlightEvent",
  1182. CHECKBOX_CHANGE_EVENT: "checkboxChangeEvent",
  1183. BOM_BODY_CHANGE_EVENT: "bomBodyChangeEvent",
  1184. }
  1185. const EventHandler = {
  1186. callbacks: {},
  1187. init: function() {
  1188. for (eventType of Object.values(IBOM_EVENT_TYPES))
  1189. this.callbacks[eventType] = [];
  1190. },
  1191. registerCallback: function(eventType, callback) {
  1192. this.callbacks[eventType].push(callback);
  1193. },
  1194. emitEvent: function(eventType, eventArgs) {
  1195. event = {
  1196. eventType: eventType,
  1197. args: eventArgs,
  1198. }
  1199. var callback;
  1200. for(callback of this.callbacks[eventType])
  1201. callback(event);
  1202. for(callback of this.callbacks[IBOM_EVENT_TYPES.ALL])
  1203. callback(event);
  1204. }
  1205. }
  1206. EventHandler.init();
  1207. ///////////////////////////////////////////////
  1208. ///////////////////////////////////////////////
  1209. /* PCB rendering code */
  1210. var emptyContext2d = document.createElement("canvas").getContext("2d");
  1211. function deg2rad(deg) {
  1212. return deg * Math.PI / 180;
  1213. }
  1214. function calcFontPoint(linepoint, text, offsetx, offsety, tilt) {
  1215. var point = [
  1216. linepoint[0] * text.width + offsetx,
  1217. linepoint[1] * text.height + offsety
  1218. ];
  1219. // This approximates pcbnew behavior with how text tilts depending on horizontal justification
  1220. point[0] -= (linepoint[1] + 0.5 * (1 + text.horiz_justify)) * text.height * tilt;
  1221. return point;
  1222. }
  1223. function drawtext(ctx, text, color, flip) {
  1224. if ("ref" in text && !settings.renderReferences) return;
  1225. if ("val" in text && !settings.renderValues) return;
  1226. ctx.save();
  1227. ctx.fillStyle = color;
  1228. ctx.strokeStyle = color;
  1229. ctx.lineCap = "round";
  1230. ctx.lineJoin = "round";
  1231. ctx.lineWidth = text.thickness;
  1232. if (text.svgpath) {
  1233. ctx.stroke(new Path2D(text.svgpath));
  1234. ctx.restore();
  1235. return;
  1236. }
  1237. ctx.translate(...text.pos);
  1238. ctx.translate(text.thickness * 0.5, 0);
  1239. var angle = -text.angle;
  1240. if (text.attr.includes("mirrored")) {
  1241. ctx.scale(-1, 1);
  1242. angle = -angle;
  1243. }
  1244. var tilt = 0;
  1245. if (text.attr.includes("italic")) {
  1246. tilt = 0.125;
  1247. }
  1248. var interline = (text.height * 1.5 + text.thickness) / 2;
  1249. var txt = text.text.split("\n");
  1250. // KiCad ignores last empty line.
  1251. if (txt[txt.length - 1] == '') txt.pop();
  1252. ctx.rotate(deg2rad(angle));
  1253. for (var i in txt) {
  1254. var offsety = (-(txt.length - 1) + i * 2) * interline + text.height / 2;
  1255. var lineWidth = text.thickness + interline * tilt;
  1256. for (var j = 0; j < txt[i].length; j++) {
  1257. if (txt[i][j] == '\t') {
  1258. var fourSpaces = 4 * pcbdata.font_data[' '].w * text.width;
  1259. lineWidth += fourSpaces - lineWidth % fourSpaces;
  1260. } else {
  1261. if (txt[i][j] == '~') {
  1262. j++;
  1263. if (j == txt[i].length)
  1264. break;
  1265. }
  1266. lineWidth += pcbdata.font_data[txt[i][j]].w * text.width;
  1267. }
  1268. }
  1269. var offsetx = 0;
  1270. switch (text.horiz_justify) {
  1271. case -1:
  1272. // Justify left, do nothing
  1273. break;
  1274. case 0:
  1275. // Justify center
  1276. offsetx -= lineWidth / 2;
  1277. break;
  1278. case 1:
  1279. // Justify right
  1280. offsetx -= lineWidth;
  1281. break;
  1282. }
  1283. var inOverbar = false;
  1284. for (var j = 0; j < txt[i].length; j++) {
  1285. if (txt[i][j] == '\t') {
  1286. var fourSpaces = 4 * pcbdata.font_data[' '].w * text.width;
  1287. offsetx += fourSpaces - offsetx % fourSpaces;
  1288. continue;
  1289. } else if (txt[i][j] == '~') {
  1290. j++;
  1291. if (j == txt[i].length)
  1292. break;
  1293. if (txt[i][j] != '~') {
  1294. inOverbar = !inOverbar;
  1295. }
  1296. }
  1297. var glyph = pcbdata.font_data[txt[i][j]];
  1298. if (inOverbar) {
  1299. var overbarStart = [offsetx, -text.height * 1.4 + offsety];
  1300. var overbarEnd = [offsetx + text.width * glyph.w, overbarStart[1]];
  1301. if (!lastHadOverbar) {
  1302. overbarStart[0] += text.height * 1.4 * tilt;
  1303. lastHadOverbar = true;
  1304. }
  1305. ctx.beginPath();
  1306. ctx.moveTo(...overbarStart);
  1307. ctx.lineTo(...overbarEnd);
  1308. ctx.stroke();
  1309. } else {
  1310. lastHadOverbar = false;
  1311. }
  1312. for (var line of glyph.l) {
  1313. ctx.beginPath();
  1314. ctx.moveTo(...calcFontPoint(line[0], text, offsetx, offsety, tilt));
  1315. for (var k = 1; k < line.length; k++) {
  1316. ctx.lineTo(...calcFontPoint(line[k], text, offsetx, offsety, tilt));
  1317. }
  1318. ctx.stroke();
  1319. }
  1320. offsetx += glyph.w * text.width;
  1321. }
  1322. }
  1323. ctx.restore();
  1324. }
  1325. function drawedge(ctx, scalefactor, edge, color) {
  1326. ctx.strokeStyle = color;
  1327. ctx.lineWidth = Math.max(1 / scalefactor, edge.width);
  1328. ctx.lineCap = "round";
  1329. if (edge.svgpath) {
  1330. ctx.stroke(new Path2D(edge.svgpath));
  1331. } else {
  1332. ctx.beginPath();
  1333. if (edge.type == "segment") {
  1334. ctx.moveTo(...edge.start);
  1335. ctx.lineTo(...edge.end);
  1336. }
  1337. if (edge.type == "arc") {
  1338. ctx.arc(
  1339. ...edge.start,
  1340. edge.radius,
  1341. deg2rad(edge.startangle),
  1342. deg2rad(edge.endangle));
  1343. }
  1344. if (edge.type == "circle") {
  1345. ctx.arc(
  1346. ...edge.start,
  1347. edge.radius,
  1348. 0, 2 * Math.PI);
  1349. ctx.closePath();
  1350. }
  1351. if (edge.type == "curve") {
  1352. ctx.moveTo(...edge.start);
  1353. ctx.bezierCurveTo(...edge.cpa, ...edge.cpb, ...edge.end);
  1354. }
  1355. ctx.stroke();
  1356. }
  1357. }
  1358. function getChamferedRectPath(size, radius, chamfpos, chamfratio) {
  1359. // chamfpos is a bitmask, left = 1, right = 2, bottom left = 4, bottom right = 8
  1360. var path = new Path2D();
  1361. var width = size[0];
  1362. var height = size[1];
  1363. var x = width * -0.5;
  1364. var y = height * -0.5;
  1365. var chamfOffset = Math.min(width, height) * chamfratio;
  1366. path.moveTo(x, 0);
  1367. if (chamfpos & 4) {
  1368. path.lineTo(x, y + height - chamfOffset);
  1369. path.lineTo(x + chamfOffset, y + height);
  1370. path.lineTo(0, y + height);
  1371. } else {
  1372. path.arcTo(x, y + height, x + width, y + height, radius);
  1373. }
  1374. if (chamfpos & 8) {
  1375. path.lineTo(x + width - chamfOffset, y + height);
  1376. path.lineTo(x + width, y + height - chamfOffset);
  1377. path.lineTo(x + width, 0);
  1378. } else {
  1379. path.arcTo(x + width, y + height, x + width, y, radius);
  1380. }
  1381. if (chamfpos & 2) {
  1382. path.lineTo(x + width, y + chamfOffset);
  1383. path.lineTo(x + width - chamfOffset, y);
  1384. path.lineTo(0, y);
  1385. } else {
  1386. path.arcTo(x + width, y, x, y, radius);
  1387. }
  1388. if (chamfpos & 1) {
  1389. path.lineTo(x + chamfOffset, y);
  1390. path.lineTo(x, y + chamfOffset);
  1391. path.lineTo(x, 0);
  1392. } else {
  1393. path.arcTo(x, y, x, y + height, radius);
  1394. }
  1395. path.closePath();
  1396. return path;
  1397. }
  1398. function getOblongPath(size) {
  1399. return getChamferedRectPath(size, Math.min(size[0], size[1]) / 2, 0, 0);
  1400. }
  1401. function getPolygonsPath(shape) {
  1402. if (shape.path2d) {
  1403. return shape.path2d;
  1404. }
  1405. if (shape.svgpath) {
  1406. shape.path2d = new Path2D(shape.svgpath);
  1407. } else {
  1408. var path = new Path2D();
  1409. for (var polygon of shape.polygons) {
  1410. path.moveTo(...polygon[0]);
  1411. for (var i = 1; i < polygon.length; i++) {
  1412. path.lineTo(...polygon[i]);
  1413. }
  1414. path.closePath();
  1415. }
  1416. shape.path2d = path;
  1417. }
  1418. return shape.path2d;
  1419. }
  1420. function drawPolygonShape(ctx, shape, color) {
  1421. ctx.save();
  1422. ctx.fillStyle = color;
  1423. if (!shape.svgpath) {
  1424. ctx.translate(...shape.pos);
  1425. ctx.rotate(deg2rad(-shape.angle));
  1426. }
  1427. ctx.fill(getPolygonsPath(shape));
  1428. ctx.restore();
  1429. }
  1430. function drawDrawing(ctx, layer, scalefactor, drawing, color) {
  1431. if (["segment", "arc", "circle", "curve"].includes(drawing.type)) {
  1432. drawedge(ctx, scalefactor, drawing, color);
  1433. } else if (drawing.type == "polygon") {
  1434. drawPolygonShape(ctx, drawing, color);
  1435. } else {
  1436. drawtext(ctx, drawing, color, layer == "B");
  1437. }
  1438. }
  1439. function getCirclePath(radius) {
  1440. var path = new Path2D();
  1441. path.arc(0, 0, radius, 0, 2 * Math.PI);
  1442. path.closePath();
  1443. return path;
  1444. }
  1445. function getCachedPadPath(pad) {
  1446. if (!pad.path2d) {
  1447. // if path2d is not set, build one and cache it on pad object
  1448. if (pad.shape == "rect") {
  1449. pad.path2d = new Path2D();
  1450. pad.path2d.rect(...pad.size.map(c => -c * 0.5), ...pad.size);
  1451. } else if (pad.shape == "oval") {
  1452. pad.path2d = getOblongPath(pad.size);
  1453. } else if (pad.shape == "circle") {
  1454. pad.path2d = getCirclePath(pad.size[0] / 2);
  1455. } else if (pad.shape == "roundrect") {
  1456. pad.path2d = getChamferedRectPath(pad.size, pad.radius, 0, 0);
  1457. } else if (pad.shape == "chamfrect") {
  1458. pad.path2d = getChamferedRectPath(pad.size, pad.radius, pad.chamfpos, pad.chamfratio)
  1459. } else if (pad.shape == "custom") {
  1460. pad.path2d = getPolygonsPath(pad);
  1461. }
  1462. }
  1463. return pad.path2d;
  1464. }
  1465. function drawPad(ctx, pad, color, outline, hole) {
  1466. ctx.save();
  1467. ctx.translate(...pad.pos);
  1468. ctx.rotate(deg2rad(pad.angle));
  1469. if (pad.offset) {
  1470. ctx.translate(...pad.offset);
  1471. }
  1472. ctx.fillStyle = color;
  1473. ctx.strokeStyle = color;
  1474. var path = getCachedPadPath(pad);
  1475. if (outline) {
  1476. ctx.stroke(path);
  1477. } else {
  1478. ctx.fill(path);
  1479. }
  1480. if (pad.type == "th" && hole) {
  1481. if (pad.offset) {
  1482. ctx.translate(-pad.offset[0], -pad.offset[1]);
  1483. }
  1484. ctx.fillStyle = "#CCCCCC";
  1485. if (pad.drillshape == "oblong") {
  1486. ctx.fill(getOblongPath(pad.drillsize));
  1487. } else {
  1488. ctx.fill(getCirclePath(pad.drillsize[0] / 2));
  1489. }
  1490. }
  1491. ctx.restore();
  1492. }
  1493. function drawModule(ctx, layer, scalefactor, module, padcolor, outlinecolor, highlight, outline) {
  1494. if (highlight) {
  1495. // draw bounding box
  1496. if (module.layer == layer) {
  1497. ctx.save();
  1498. ctx.globalAlpha = 0.2;
  1499. ctx.translate(...module.bbox.pos);
  1500. ctx.rotate(deg2rad(-module.bbox.angle));
  1501. ctx.translate(...module.bbox.relpos);
  1502. ctx.fillStyle = padcolor;
  1503. ctx.fillRect(0, 0, ...module.bbox.size);
  1504. ctx.globalAlpha = 1;
  1505. ctx.strokeStyle = padcolor;
  1506. ctx.strokeRect(0, 0, ...module.bbox.size);
  1507. ctx.restore();
  1508. }
  1509. }
  1510. // draw drawings
  1511. for (var drawing of module.drawings) {
  1512. if (drawing.layer == layer) {
  1513. drawDrawing(ctx, layer, scalefactor, drawing.drawing, padcolor);
  1514. }
  1515. }
  1516. // draw pads
  1517. if (settings.renderPads) {
  1518. for (var pad of module.pads) {
  1519. if (pad.layers.includes(layer)) {
  1520. drawPad(ctx, pad, padcolor, outline, true);
  1521. if (pad.pin1 && settings.highlightpin1) {
  1522. drawPad(ctx, pad, outlinecolor, true, false);
  1523. }
  1524. }
  1525. }
  1526. }
  1527. }
  1528. function drawEdgeCuts(canvas, scalefactor) {
  1529. var ctx = canvas.getContext("2d");
  1530. var edgecolor = getComputedStyle(topmostdiv).getPropertyValue('--pcb-edge-color');
  1531. for (var edge of pcbdata.edges) {
  1532. drawedge(ctx, scalefactor, edge, edgecolor);
  1533. }
  1534. }
  1535. function drawModules(canvas, layer, scalefactor, highlight) {
  1536. var ctx = canvas.getContext("2d");
  1537. ctx.lineWidth = 3 / scalefactor;
  1538. var style = getComputedStyle(topmostdiv);
  1539. var padcolor = style.getPropertyValue('--pad-color');
  1540. var outlinecolor = style.getPropertyValue('--pin1-outline-color');
  1541. if (highlight) {
  1542. padcolor = style.getPropertyValue('--pad-color-highlight');
  1543. outlinecolor = style.getPropertyValue('--pin1-outline-color-highlight');
  1544. }
  1545. for (var i = 0; i < pcbdata.modules.length; i++) {
  1546. var mod = pcbdata.modules[i];
  1547. var outline = settings.renderDnpOutline && pcbdata.bom.skipped.includes(i);
  1548. if (!highlight || highlightedModules.includes(i)) {
  1549. drawModule(ctx, layer, scalefactor, mod, padcolor, outlinecolor, highlight, outline);
  1550. }
  1551. }
  1552. }
  1553. function drawBgLayer(layername, canvas, layer, scalefactor, edgeColor, polygonColor, textColor) {
  1554. var ctx = canvas.getContext("2d");
  1555. for (var d of pcbdata[layername][layer]) {
  1556. if (["segment", "arc", "circle", "curve"].includes(d.type)) {
  1557. drawedge(ctx, scalefactor, d, edgeColor);
  1558. } else if (d.type == "polygon") {
  1559. drawPolygonShape(ctx, d, polygonColor);
  1560. } else {
  1561. drawtext(ctx, d, textColor, layer == "B");
  1562. }
  1563. }
  1564. }
  1565. function drawTracks(canvas, layer, color, highlight) {
  1566. ctx = canvas.getContext("2d");
  1567. ctx.strokeStyle = color;
  1568. ctx.lineCap = "round";
  1569. for(var track of pcbdata.tracks[layer]) {
  1570. if (highlight && highlightedNet != track.net) continue;
  1571. ctx.lineWidth = track.width;
  1572. ctx.beginPath();
  1573. ctx.moveTo(...track.start);
  1574. ctx.lineTo(...track.end);
  1575. ctx.stroke();
  1576. }
  1577. }
  1578. function drawZones(canvas, layer, color, highlight) {
  1579. ctx = canvas.getContext("2d");
  1580. ctx.strokeStyle = color;
  1581. ctx.fillStyle = color;
  1582. ctx.lineJoin = "round";
  1583. for(var zone of pcbdata.zones[layer]) {
  1584. if (!zone.path2d) {
  1585. zone.path2d = getPolygonsPath(zone);
  1586. }
  1587. if (highlight && highlightedNet != zone.net) continue;
  1588. ctx.lineWidth = zone.width ? zone.width : 0;
  1589. ctx.fill(zone.path2d);
  1590. ctx.stroke(zone.path2d);
  1591. }
  1592. }
  1593. function clearCanvas(canvas, color = null) {
  1594. var ctx = canvas.getContext("2d");
  1595. ctx.save();
  1596. ctx.setTransform(1, 0, 0, 1, 0, 0);
  1597. if (color) {
  1598. ctx.fillStyle = color;
  1599. ctx.fillRect(0, 0, canvas.width, canvas.height);
  1600. } else {
  1601. ctx.clearRect(0, 0, canvas.width, canvas.height);
  1602. }
  1603. ctx.restore();
  1604. }
  1605. function drawNets(canvas, layer, highlight) {
  1606. var style = getComputedStyle(topmostdiv);
  1607. if (settings.renderTracks) {
  1608. var trackColor = style.getPropertyValue(highlight ? '--track-color-highlight' : '--track-color');
  1609. drawTracks(canvas, layer, trackColor, highlight);
  1610. }
  1611. if (settings.renderZones) {
  1612. var zoneColor = style.getPropertyValue(highlight ? '--zone-color-highlight' : '--zone-color');
  1613. drawZones(canvas, layer, zoneColor, highlight);
  1614. }
  1615. if (highlight && settings.renderPads) {
  1616. var padColor = style.getPropertyValue('--pad-color-highlight');
  1617. var ctx = canvas.getContext("2d");
  1618. for (var mod of pcbdata.modules) {
  1619. // draw pads
  1620. for (var pad of mod.pads) {
  1621. if (highlightedNet != pad.net) continue;
  1622. if (pad.layers.includes(layer)) {
  1623. drawPad(ctx, pad, padColor, false, true);
  1624. }
  1625. }
  1626. }
  1627. }
  1628. }
  1629. function drawHighlightsOnLayer(canvasdict, clear = true) {
  1630. if (clear) {
  1631. clearCanvas(canvasdict.highlight);
  1632. }
  1633. if (highlightedModules.length > 0) {
  1634. drawModules(canvasdict.highlight, canvasdict.layer,
  1635. canvasdict.transform.s * canvasdict.transform.zoom, true);
  1636. }
  1637. if (highlightedNet !== null) {
  1638. drawNets(canvasdict.highlight, canvasdict.layer, true);
  1639. }
  1640. }
  1641. function drawHighlights() {
  1642. drawHighlightsOnLayer(allcanvas.front);
  1643. drawHighlightsOnLayer(allcanvas.back);
  1644. }
  1645. function drawBackground(canvasdict, clear = true) {
  1646. if (clear) {
  1647. clearCanvas(canvasdict.bg);
  1648. clearCanvas(canvasdict.fab);
  1649. clearCanvas(canvasdict.silk);
  1650. }
  1651. drawNets(canvasdict.bg, canvasdict.layer, false);
  1652. drawModules(canvasdict.bg, canvasdict.layer,
  1653. canvasdict.transform.s * canvasdict.transform.zoom, false);
  1654. drawEdgeCuts(canvasdict.bg, canvasdict.transform.s);
  1655. var style = getComputedStyle(topmostdiv);
  1656. var edgeColor = style.getPropertyValue('--silkscreen-edge-color');
  1657. var polygonColor = style.getPropertyValue('--silkscreen-polygon-color');
  1658. var textColor = style.getPropertyValue('--silkscreen-text-color');
  1659. if (settings.renderSilkscreen) {
  1660. drawBgLayer(
  1661. "silkscreen", canvasdict.silk, canvasdict.layer,
  1662. canvasdict.transform.s * canvasdict.transform.zoom,
  1663. edgeColor, polygonColor, textColor);
  1664. }
  1665. edgeColor = style.getPropertyValue('--fabrication-edge-color');
  1666. polygonColor = style.getPropertyValue('--fabrication-polygon-color');
  1667. textColor = style.getPropertyValue('--fabrication-text-color');
  1668. if (settings.renderFabrication) {
  1669. drawBgLayer(
  1670. "fabrication", canvasdict.fab, canvasdict.layer,
  1671. canvasdict.transform.s * canvasdict.transform.zoom,
  1672. edgeColor, polygonColor, textColor);
  1673. }
  1674. }
  1675. function prepareCanvas(canvas, flip, transform) {
  1676. var ctx = canvas.getContext("2d");
  1677. ctx.setTransform(1, 0, 0, 1, 0, 0);
  1678. var fontsize = 1.55;
  1679. ctx.scale(transform.zoom, transform.zoom);
  1680. ctx.translate(transform.panx, transform.pany);
  1681. if (flip) {
  1682. ctx.scale(-1, 1);
  1683. }
  1684. ctx.translate(transform.x, transform.y);
  1685. ctx.rotate(deg2rad(settings.boardRotation));
  1686. ctx.scale(transform.s, transform.s);
  1687. }
  1688. function prepareLayer(canvasdict) {
  1689. var flip = (canvasdict.layer == "B");
  1690. for (var c of ["bg", "fab", "silk", "highlight"]) {
  1691. prepareCanvas(canvasdict[c], flip, canvasdict.transform);
  1692. }
  1693. }
  1694. function rotateVector(v, angle) {
  1695. angle = deg2rad(angle);
  1696. return [
  1697. v[0] * Math.cos(angle) - v[1] * Math.sin(angle),
  1698. v[0] * Math.sin(angle) + v[1] * Math.cos(angle)
  1699. ];
  1700. }
  1701. function applyRotation(bbox) {
  1702. var corners = [
  1703. [bbox.minx, bbox.miny],
  1704. [bbox.minx, bbox.maxy],
  1705. [bbox.maxx, bbox.miny],
  1706. [bbox.maxx, bbox.maxy],
  1707. ];
  1708. corners = corners.map((v) => rotateVector(v, settings.boardRotation));
  1709. return {
  1710. minx: corners.reduce((a, v) => Math.min(a, v[0]), Infinity),
  1711. miny: corners.reduce((a, v) => Math.min(a, v[1]), Infinity),
  1712. maxx: corners.reduce((a, v) => Math.max(a, v[0]), -Infinity),
  1713. maxy: corners.reduce((a, v) => Math.max(a, v[1]), -Infinity),
  1714. }
  1715. }
  1716. function recalcLayerScale(layerdict, width, height) {
  1717. var bbox = applyRotation(pcbdata.edges_bbox);
  1718. var scalefactor = 0.98 * Math.min(
  1719. width / (bbox.maxx - bbox.minx),
  1720. height / (bbox.maxy - bbox.miny)
  1721. );
  1722. if (scalefactor < 0.1) {
  1723. scalefactor = 1;
  1724. }
  1725. layerdict.transform.s = scalefactor;
  1726. var flip = (layerdict.layer == "B");
  1727. if (flip) {
  1728. layerdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor + width) * 0.5;
  1729. } else {
  1730. layerdict.transform.x = -((bbox.maxx + bbox.minx) * scalefactor - width) * 0.5;
  1731. }
  1732. layerdict.transform.y = -((bbox.maxy + bbox.miny) * scalefactor - height) * 0.5;
  1733. for (var c of ["bg", "fab", "silk", "highlight"]) {
  1734. canvas = layerdict[c];
  1735. canvas.width = width;
  1736. canvas.height = height;
  1737. canvas.style.width = (width / devicePixelRatio) + "px";
  1738. canvas.style.height = (height / devicePixelRatio) + "px";
  1739. }
  1740. }
  1741. function redrawCanvas(layerdict) {
  1742. prepareLayer(layerdict);
  1743. drawBackground(layerdict);
  1744. drawHighlightsOnLayer(layerdict);
  1745. }
  1746. function resizeCanvas(layerdict) {
  1747. var canvasdivid = {
  1748. "F": "frontcanvas",
  1749. "B": "backcanvas"
  1750. } [layerdict.layer];
  1751. var width = document.getElementById(canvasdivid).clientWidth * devicePixelRatio;
  1752. var height = document.getElementById(canvasdivid).clientHeight * devicePixelRatio;
  1753. recalcLayerScale(layerdict, width, height);
  1754. redrawCanvas(layerdict);
  1755. }
  1756. function resizeAll() {
  1757. resizeCanvas(allcanvas.front);
  1758. resizeCanvas(allcanvas.back);
  1759. }
  1760. function pointWithinDistanceToSegment(x, y, x1, y1, x2, y2, d) {
  1761. var A = x - x1;
  1762. var B = y - y1;
  1763. var C = x2 - x1;
  1764. var D = y2 - y1;
  1765. var dot = A * C + B * D;
  1766. var len_sq = C * C + D * D;
  1767. var dx, dy;
  1768. if (len_sq == 0) {
  1769. // start and end of the segment coincide
  1770. dx = x - x1;
  1771. dy = y - y1;
  1772. } else {
  1773. var param = dot / len_sq;
  1774. var xx, yy;
  1775. if (param < 0) {
  1776. xx = x1;
  1777. yy = y1;
  1778. } else if (param > 1) {
  1779. xx = x2;
  1780. yy = y2;
  1781. } else {
  1782. xx = x1 + param * C;
  1783. yy = y1 + param * D;
  1784. }
  1785. dx = x - xx;
  1786. dy = y - yy;
  1787. }
  1788. return dx * dx + dy * dy <= d * d;
  1789. }
  1790. function pointWithinPad(x, y, pad) {
  1791. var v = [x - pad.pos[0], y - pad.pos[1]];
  1792. v = rotateVector(v, -pad.angle);
  1793. if (pad.offset) {
  1794. v[0] -= pad.offset[0];
  1795. v[1] -= pad.offset[1];
  1796. }
  1797. return emptyContext2d.isPointInPath(getCachedPadPath(pad), ...v);
  1798. }
  1799. function netHitScan(layer, x, y) {
  1800. // Check track segments
  1801. if (settings.renderTracks && pcbdata.tracks) {
  1802. for(var track of pcbdata.tracks[layer]) {
  1803. if (pointWithinDistanceToSegment(x, y, ...track.start, ...track.end, track.width / 2)) {
  1804. return track.net;
  1805. }
  1806. }
  1807. }
  1808. // Check pads
  1809. if (settings.renderPads) {
  1810. for (var mod of pcbdata.modules) {
  1811. for(var pad of mod.pads) {
  1812. if (pad.layers.includes(layer) && pointWithinPad(x, y, pad)) {
  1813. return pad.net;
  1814. }
  1815. }
  1816. }
  1817. }
  1818. return null;
  1819. }
  1820. function pointWithinModuleBbox(x, y, bbox) {
  1821. var v = [x - bbox.pos[0], y - bbox.pos[1]];
  1822. v = rotateVector(v, bbox.angle);
  1823. return bbox.relpos[0] <= v[0] && v[0] <= bbox.relpos[0] + bbox.size[0] &&
  1824. bbox.relpos[1] <= v[1] && v[1] <= bbox.relpos[1] + bbox.size[1];
  1825. }
  1826. function bboxHitScan(layer, x, y) {
  1827. var result = [];
  1828. for (var i = 0; i < pcbdata.modules.length; i++) {
  1829. var module = pcbdata.modules[i];
  1830. if (module.layer == layer) {
  1831. if (pointWithinModuleBbox(x, y, module.bbox)) {
  1832. result.push(i);
  1833. }
  1834. }
  1835. }
  1836. return result;
  1837. }
  1838. function handlePointerDown(e, layerdict) {
  1839. if (e.button != 0) {
  1840. return;
  1841. }
  1842. e.preventDefault();
  1843. e.stopPropagation();
  1844. if (!e.hasOwnProperty("offsetX")) {
  1845. // The polyfill doesn't set this properly
  1846. e.offsetX = e.pageX - e.currentTarget.offsetLeft;
  1847. e.offsetY = e.pageY - e.currentTarget.offsetTop;
  1848. }
  1849. layerdict.pointerStates[e.pointerId] = {
  1850. distanceTravelled: 0,
  1851. lastX: e.offsetX,
  1852. lastY: e.offsetY,
  1853. downTime: Date.now(),
  1854. };
  1855. }
  1856. function handleMouseClick(e, layerdict) {
  1857. if (!e.hasOwnProperty("offsetX")) {
  1858. // The polyfill doesn't set this properly
  1859. e.offsetX = e.pageX - e.currentTarget.offsetLeft;
  1860. e.offsetY = e.pageY - e.currentTarget.offsetTop;
  1861. }
  1862. var x = e.offsetX;
  1863. var y = e.offsetY;
  1864. var t = layerdict.transform;
  1865. if (layerdict.layer == "B") {
  1866. x = (devicePixelRatio * x / t.zoom - t.panx + t.x) / -t.s;
  1867. } else {
  1868. x = (devicePixelRatio * x / t.zoom - t.panx - t.x) / t.s;
  1869. }
  1870. y = (devicePixelRatio * y / t.zoom - t.y - t.pany) / t.s;
  1871. var v = rotateVector([x, y], -settings.boardRotation);
  1872. if ("nets" in pcbdata) {
  1873. var net = netHitScan(layerdict.layer, ...v);
  1874. if (net !== highlightedNet) {
  1875. netClicked(net);
  1876. }
  1877. }
  1878. if (highlightedNet === null) {
  1879. var modules = bboxHitScan(layerdict.layer, ...v);
  1880. if (modules.length > 0) {
  1881. modulesClicked(modules);
  1882. }
  1883. }
  1884. }
  1885. function handlePointerLeave(e, layerdict) {
  1886. e.preventDefault();
  1887. e.stopPropagation();
  1888. if (!settings.redrawOnDrag) {
  1889. redrawCanvas(layerdict);
  1890. }
  1891. delete layerdict.pointerStates[e.pointerId];
  1892. }
  1893. function resetTransform(layerdict) {
  1894. layerdict.transform.panx = 0;
  1895. layerdict.transform.pany = 0;
  1896. layerdict.transform.zoom = 1;
  1897. redrawCanvas(layerdict);
  1898. }
  1899. function handlePointerUp(e, layerdict) {
  1900. if (!e.hasOwnProperty("offsetX")) {
  1901. // The polyfill doesn't set this properly
  1902. e.offsetX = e.pageX - e.currentTarget.offsetLeft;
  1903. e.offsetY = e.pageY - e.currentTarget.offsetTop;
  1904. }
  1905. e.preventDefault();
  1906. e.stopPropagation();
  1907. if (e.button == 2) {
  1908. // Reset pan and zoom on right click.
  1909. resetTransform(layerdict);
  1910. layerdict.anotherPointerTapped = false;
  1911. return;
  1912. }
  1913. // We haven't necessarily had a pointermove event since the interaction started, so make sure we update this now
  1914. var ptr = layerdict.pointerStates[e.pointerId];
  1915. ptr.distanceTravelled += Math.abs(e.offsetX - ptr.lastX) + Math.abs(e.offsetY - ptr.lastY);
  1916. if (e.button == 0 && ptr.distanceTravelled < 10 && Date.now() - ptr.downTime <= 500) {
  1917. if (Object.keys(layerdict.pointerStates).length == 1) {
  1918. if (layerdict.anotherPointerTapped) {
  1919. // This is the second pointer coming off of a two-finger tap
  1920. resetTransform(layerdict);
  1921. } else {
  1922. // This is just a regular tap
  1923. handleMouseClick(e, layerdict);
  1924. }
  1925. layerdict.anotherPointerTapped = false;
  1926. } else {
  1927. // This is the first finger coming off of what could become a two-finger tap
  1928. layerdict.anotherPointerTapped = true;
  1929. }
  1930. } else {
  1931. if (!settings.redrawOnDrag) {
  1932. redrawCanvas(layerdict);
  1933. }
  1934. layerdict.anotherPointerTapped = false;
  1935. }
  1936. delete layerdict.pointerStates[e.pointerId];
  1937. }
  1938. function handlePointerMove(e, layerdict) {
  1939. if (!layerdict.pointerStates.hasOwnProperty(e.pointerId)) {
  1940. return;
  1941. }
  1942. e.preventDefault();
  1943. e.stopPropagation();
  1944. if (!e.hasOwnProperty("offsetX")) {
  1945. // The polyfill doesn't set this properly
  1946. e.offsetX = e.pageX - e.currentTarget.offsetLeft;
  1947. e.offsetY = e.pageY - e.currentTarget.offsetTop;
  1948. }
  1949. var thisPtr = layerdict.pointerStates[e.pointerId];
  1950. var dx = e.offsetX - thisPtr.lastX;
  1951. var dy = e.offsetY - thisPtr.lastY;
  1952. // If this number is low on pointer up, we count the action as a click
  1953. thisPtr.distanceTravelled += Math.abs(dx) + Math.abs(dy);
  1954. if (Object.keys(layerdict.pointerStates).length == 1) {
  1955. // This is a simple drag
  1956. layerdict.transform.panx += devicePixelRatio * dx / layerdict.transform.zoom;
  1957. layerdict.transform.pany += devicePixelRatio * dy / layerdict.transform.zoom;
  1958. } else if (Object.keys(layerdict.pointerStates).length == 2) {
  1959. var otherPtr = Object.values(layerdict.pointerStates).filter((ptr) => ptr != thisPtr)[0];
  1960. var oldDist = Math.sqrt(Math.pow(thisPtr.lastX - otherPtr.lastX, 2) + Math.pow(thisPtr.lastY - otherPtr.lastY, 2));
  1961. var newDist = Math.sqrt(Math.pow(e.offsetX - otherPtr.lastX, 2) + Math.pow(e.offsetY - otherPtr.lastY, 2));
  1962. var scaleFactor = newDist/oldDist;
  1963. if (scaleFactor != NaN) {
  1964. layerdict.transform.zoom *= scaleFactor;
  1965. var zoomd = (1 - scaleFactor) / layerdict.transform.zoom;
  1966. layerdict.transform.panx += devicePixelRatio * otherPtr.lastX * zoomd;
  1967. layerdict.transform.pany += devicePixelRatio * otherPtr.lastY * zoomd;
  1968. }
  1969. }
  1970. thisPtr.lastX = e.offsetX;
  1971. thisPtr.lastY = e.offsetY;
  1972. if (settings.redrawOnDrag) {
  1973. redrawCanvas(layerdict);
  1974. }
  1975. }
  1976. function handleMouseWheel(e, layerdict) {
  1977. e.preventDefault();
  1978. e.stopPropagation();
  1979. var t = layerdict.transform;
  1980. var wheeldelta = e.deltaY;
  1981. if (e.deltaMode == 1) {
  1982. // FF only, scroll by lines
  1983. wheeldelta *= 30;
  1984. } else if (e.deltaMode == 2) {
  1985. wheeldelta *= 300;
  1986. }
  1987. var m = Math.pow(1.1, -wheeldelta / 40);
  1988. // Limit amount of zoom per tick.
  1989. if (m > 2) {
  1990. m = 2;
  1991. } else if (m < 0.5) {
  1992. m = 0.5;
  1993. }
  1994. t.zoom *= m;
  1995. var zoomd = (1 - m) / t.zoom;
  1996. t.panx += devicePixelRatio * e.offsetX * zoomd;
  1997. t.pany += devicePixelRatio * e.offsetY * zoomd;
  1998. redrawCanvas(layerdict);
  1999. }
  2000. function addMouseHandlers(div, layerdict) {
  2001. div.addEventListener("pointerdown", function(e) {
  2002. handlePointerDown(e, layerdict);
  2003. });
  2004. div.addEventListener("pointermove", function(e) {
  2005. handlePointerMove(e, layerdict);
  2006. });
  2007. div.addEventListener("pointerup", function(e) {
  2008. handlePointerUp(e, layerdict);
  2009. });
  2010. var pointerleave = function(e) {
  2011. handlePointerLeave(e, layerdict);
  2012. }
  2013. div.addEventListener("pointercancel", pointerleave);
  2014. div.addEventListener("pointerleave", pointerleave);
  2015. div.addEventListener("pointerout", pointerleave);
  2016. div.onwheel = function(e) {
  2017. handleMouseWheel(e, layerdict);
  2018. }
  2019. for (var element of [div, layerdict.bg, layerdict.fab, layerdict.silk, layerdict.highlight]) {
  2020. element.addEventListener("contextmenu", function(e) {
  2021. e.preventDefault();
  2022. }, false);
  2023. }
  2024. }
  2025. function setRedrawOnDrag(value) {
  2026. settings.redrawOnDrag = value;
  2027. writeStorage("redrawOnDrag", value);
  2028. }
  2029. function setBoardRotation(value) {
  2030. settings.boardRotation = value * 5;
  2031. writeStorage("boardRotation", settings.boardRotation);
  2032. document.getElementById("rotationDegree").textContent = settings.boardRotation;
  2033. resizeAll();
  2034. }
  2035. function initRender() {
  2036. allcanvas = {
  2037. front: {
  2038. transform: {
  2039. x: 0,
  2040. y: 0,
  2041. s: 1,
  2042. panx: 0,
  2043. pany: 0,
  2044. zoom: 1,
  2045. },
  2046. pointerStates: {},
  2047. anotherPointerTapped: false,
  2048. bg: document.getElementById("F_bg"),
  2049. fab: document.getElementById("F_fab"),
  2050. silk: document.getElementById("F_slk"),
  2051. highlight: document.getElementById("F_hl"),
  2052. layer: "F",
  2053. },
  2054. back: {
  2055. transform: {
  2056. x: 0,
  2057. y: 0,
  2058. s: 1,
  2059. panx: 0,
  2060. pany: 0,
  2061. zoom: 1,
  2062. },
  2063. pointerStates: {},
  2064. anotherPointerTapped: false,
  2065. bg: document.getElementById("B_bg"),
  2066. fab: document.getElementById("B_fab"),
  2067. silk: document.getElementById("B_slk"),
  2068. highlight: document.getElementById("B_hl"),
  2069. layer: "B",
  2070. }
  2071. };
  2072. addMouseHandlers(document.getElementById("frontcanvas"), allcanvas.front);
  2073. addMouseHandlers(document.getElementById("backcanvas"), allcanvas.back);
  2074. }
  2075. ///////////////////////////////////////////////
  2076. ///////////////////////////////////////////////
  2077. /* DOM manipulation and misc code */
  2078. var bomsplit;
  2079. var canvassplit;
  2080. var initDone = false;
  2081. var bomSortFunction = null;
  2082. var currentSortColumn = null;
  2083. var currentSortOrder = null;
  2084. var currentHighlightedRowId;
  2085. var highlightHandlers = [];
  2086. var moduleIndexToHandler = {};
  2087. var netsToHandler = {};
  2088. var highlightedModules = [];
  2089. var highlightedNet = null;
  2090. var lastClicked;
  2091. function dbg(html) {
  2092. dbgdiv.innerHTML = html;
  2093. }
  2094. function redrawIfInitDone() {
  2095. if (initDone) {
  2096. redrawCanvas(allcanvas.front);
  2097. redrawCanvas(allcanvas.back);
  2098. }
  2099. }
  2100. function padsVisible(value) {
  2101. writeStorage("padsVisible", value);
  2102. settings.renderPads = value;
  2103. redrawIfInitDone();
  2104. }
  2105. function referencesVisible(value) {
  2106. writeStorage("referencesVisible", value);
  2107. settings.renderReferences = value;
  2108. redrawIfInitDone();
  2109. }
  2110. function valuesVisible(value) {
  2111. writeStorage("valuesVisible", value);
  2112. settings.renderValues = value;
  2113. redrawIfInitDone();
  2114. }
  2115. function tracksVisible(value) {
  2116. writeStorage("tracksVisible", value);
  2117. settings.renderTracks = value;
  2118. redrawIfInitDone();
  2119. }
  2120. function zonesVisible(value) {
  2121. writeStorage("zonesVisible", value);
  2122. settings.renderZones = value;
  2123. redrawIfInitDone();
  2124. }
  2125. function dnpOutline(value) {
  2126. writeStorage("dnpOutline", value);
  2127. settings.renderDnpOutline = value;
  2128. redrawIfInitDone();
  2129. }
  2130. function setDarkMode(value) {
  2131. if (value) {
  2132. topmostdiv.classList.add("dark");
  2133. } else {
  2134. topmostdiv.classList.remove("dark");
  2135. }
  2136. writeStorage("darkmode", value);
  2137. settings.darkMode = value;
  2138. redrawIfInitDone();
  2139. }
  2140. function setFullscreen(value) {
  2141. if (value) {
  2142. document.documentElement.requestFullscreen();
  2143. } else {
  2144. document.exitFullscreen();
  2145. }
  2146. }
  2147. function fabricationVisible(value) {
  2148. writeStorage("fabricationVisible", value);
  2149. settings.renderFabrication = value;
  2150. redrawIfInitDone();
  2151. }
  2152. function silkscreenVisible(value) {
  2153. writeStorage("silkscreenVisible", value);
  2154. settings.renderSilkscreen = value;
  2155. redrawIfInitDone();
  2156. }
  2157. function setHighlightPin1(value) {
  2158. writeStorage("highlightpin1", value);
  2159. settings.highlightpin1 = value;
  2160. redrawIfInitDone();
  2161. }
  2162. function getStoredCheckboxRefs(checkbox) {
  2163. function convert(ref) {
  2164. var intref = parseInt(ref);
  2165. if (isNaN(intref)) {
  2166. for (var i = 0; i < pcbdata.modules.length; i++) {
  2167. if (pcbdata.modules[i].ref == ref) {
  2168. return i;
  2169. }
  2170. }
  2171. return -1;
  2172. } else {
  2173. return intref;
  2174. }
  2175. }
  2176. if (!(checkbox in settings.checkboxStoredRefs)) {
  2177. var val = readStorage("checkbox_" + checkbox);
  2178. settings.checkboxStoredRefs[checkbox] = val ? val : "";
  2179. }
  2180. if (!settings.checkboxStoredRefs[checkbox]) {
  2181. return new Set();
  2182. } else {
  2183. return new Set(settings.checkboxStoredRefs[checkbox].split(",").map(r => convert(r)).filter(a => a >= 0));
  2184. }
  2185. }
  2186. function getCheckboxState(checkbox, references) {
  2187. var storedRefsSet = getStoredCheckboxRefs(checkbox);
  2188. var currentRefsSet = new Set(references.map(r => r[1]));
  2189. // Get difference of current - stored
  2190. var difference = new Set(currentRefsSet);
  2191. for (ref of storedRefsSet) {
  2192. difference.delete(ref);
  2193. }
  2194. if (difference.size == 0) {
  2195. // All the current refs are stored
  2196. return "checked";
  2197. } else if (difference.size == currentRefsSet.size) {
  2198. // None of the current refs are stored
  2199. return "unchecked";
  2200. } else {
  2201. // Some of the refs are stored
  2202. return "indeterminate";
  2203. }
  2204. }
  2205. function setBomCheckboxState(checkbox, element, references) {
  2206. var state = getCheckboxState(checkbox, references);
  2207. element.checked = (state == "checked");
  2208. element.indeterminate = (state == "indeterminate");
  2209. }
  2210. function createCheckboxChangeHandler(checkbox, references) {
  2211. return function(evt) {
  2212. refsSet = getStoredCheckboxRefs(checkbox);
  2213. var darkenWhenChecked = settings.darkenWhenChecked == checkbox;
  2214. eventArgs = {
  2215. checkbox: checkbox,
  2216. refs: references,
  2217. }
  2218. if (this.checked) {
  2219. // checkbox ticked
  2220. for (var ref of references) {
  2221. refsSet.add(ref[1]);
  2222. }
  2223. if (darkenWhenChecked) {
  2224. evt.target.parentElement.parentElement.classList.add("checked");
  2225. }
  2226. eventArgs.state = 'checked';
  2227. } else {
  2228. // checkbox unticked
  2229. for (var ref of references) {
  2230. refsSet.delete(ref[1]);
  2231. }
  2232. if (darkenWhenChecked) {
  2233. evt.target.parentElement.parentElement.classList.remove("checked");
  2234. }
  2235. eventArgs.state = 'unchecked';
  2236. }
  2237. settings.checkboxStoredRefs[checkbox] = [...refsSet].join(",");
  2238. writeStorage("checkbox_" + checkbox, settings.checkboxStoredRefs[checkbox]);
  2239. updateCheckboxStats(checkbox);
  2240. EventHandler.emitEvent(IBOM_EVENT_TYPES.CHECKBOX_CHANGE_EVENT, eventArgs);
  2241. }
  2242. }
  2243. function clearHighlightedModules() {
  2244. if (currentHighlightedRowId) {
  2245. document.getElementById(currentHighlightedRowId).classList.remove("highlighted");
  2246. currentHighlightedRowId = null;
  2247. highlightedModules = [];
  2248. highlightedNet = null;
  2249. }
  2250. }
  2251. function createRowHighlightHandler(rowid, refs, net) {
  2252. return function() {
  2253. if (currentHighlightedRowId) {
  2254. if (currentHighlightedRowId == rowid) {
  2255. return;
  2256. }
  2257. document.getElementById(currentHighlightedRowId).classList.remove("highlighted");
  2258. }
  2259. document.getElementById(rowid).classList.add("highlighted");
  2260. currentHighlightedRowId = rowid;
  2261. highlightedModules = refs ? refs.map(r => r[1]) : [];
  2262. highlightedNet = net;
  2263. drawHighlights();
  2264. EventHandler.emitEvent(
  2265. IBOM_EVENT_TYPES.HIGHLIGHT_EVENT,
  2266. {
  2267. rowid: rowid,
  2268. refs: refs,
  2269. net: net
  2270. });
  2271. }
  2272. }
  2273. function entryMatches(entry) {
  2274. if (settings.bommode == "netlist") {
  2275. // entry is just a net name
  2276. return entry.toLowerCase().indexOf(filter) >= 0;
  2277. }
  2278. // check refs
  2279. for (var ref of entry[3]) {
  2280. if (ref[0].toLowerCase().indexOf(filter) >= 0) {
  2281. return true;
  2282. }
  2283. }
  2284. // check extra fields
  2285. for (var i in config.extra_fields) {
  2286. if (entry[4][i].toLowerCase().indexOf(filter) >= 0) {
  2287. return true;
  2288. }
  2289. }
  2290. // check value
  2291. if (entry[1].toLowerCase().indexOf(filter) >= 0) {
  2292. return true;
  2293. }
  2294. // check footprint
  2295. if (entry[2].toLowerCase().indexOf(filter) >= 0) {
  2296. return true;
  2297. }
  2298. return false;
  2299. }
  2300. function findRefInEntry(entry) {
  2301. return entry[3].filter(r => r[0].toLowerCase() == reflookup);
  2302. }
  2303. function highlightFilter(s) {
  2304. if (!filter) {
  2305. return s;
  2306. }
  2307. var parts = s.toLowerCase().split(filter);
  2308. if (parts.length == 1) {
  2309. return s;
  2310. }
  2311. var r = "";
  2312. var pos = 0;
  2313. for (var i in parts) {
  2314. if (i > 0) {
  2315. r += '<mark class="highlight">' +
  2316. s.substring(pos, pos + filter.length) +
  2317. '</mark>';
  2318. pos += filter.length;
  2319. }
  2320. r += s.substring(pos, pos + parts[i].length);
  2321. pos += parts[i].length;
  2322. }
  2323. return r;
  2324. }
  2325. function checkboxSetUnsetAllHandler(checkboxname) {
  2326. return function() {
  2327. var checkboxnum = 0;
  2328. while (checkboxnum < settings.checkboxes.length &&
  2329. settings.checkboxes[checkboxnum].toLowerCase() != checkboxname.toLowerCase()) {
  2330. checkboxnum++;
  2331. }
  2332. if (checkboxnum >= settings.checkboxes.length) {
  2333. return;
  2334. }
  2335. var allset = true;
  2336. var checkbox;
  2337. var row;
  2338. for (row of bombody.childNodes) {
  2339. checkbox = row.childNodes[checkboxnum + 1].childNodes[0];
  2340. if (!checkbox.checked || checkbox.indeterminate) {
  2341. allset = false;
  2342. break;
  2343. }
  2344. }
  2345. for (row of bombody.childNodes) {
  2346. checkbox = row.childNodes[checkboxnum + 1].childNodes[0];
  2347. checkbox.checked = !allset;
  2348. checkbox.indeterminate = false;
  2349. checkbox.onchange();
  2350. }
  2351. }
  2352. }
  2353. function createColumnHeader(name, cls, comparator) {
  2354. var th = document.createElement("TH");
  2355. th.innerHTML = name;
  2356. th.classList.add(cls);
  2357. th.style.cursor = "pointer";
  2358. var span = document.createElement("SPAN");
  2359. span.classList.add("sortmark");
  2360. span.classList.add("none");
  2361. th.appendChild(span);
  2362. th.onclick = function() {
  2363. if (currentSortColumn && this !== currentSortColumn) {
  2364. // Currently sorted by another column
  2365. currentSortColumn.childNodes[1].classList.remove(currentSortOrder);
  2366. currentSortColumn.childNodes[1].classList.add("none");
  2367. currentSortColumn = null;
  2368. currentSortOrder = null;
  2369. }
  2370. if (currentSortColumn && this === currentSortColumn) {
  2371. // Already sorted by this column
  2372. if (currentSortOrder == "asc") {
  2373. // Sort by this column, descending order
  2374. bomSortFunction = function(a, b) {
  2375. return -comparator(a, b);
  2376. }
  2377. currentSortColumn.childNodes[1].classList.remove("asc");
  2378. currentSortColumn.childNodes[1].classList.add("desc");
  2379. currentSortOrder = "desc";
  2380. } else {
  2381. // Unsort
  2382. bomSortFunction = null;
  2383. currentSortColumn.childNodes[1].classList.remove("desc");
  2384. currentSortColumn.childNodes[1].classList.add("none");
  2385. currentSortColumn = null;
  2386. currentSortOrder = null;
  2387. }
  2388. } else {
  2389. // Sort by this column, ascending order
  2390. bomSortFunction = comparator;
  2391. currentSortColumn = this;
  2392. currentSortColumn.childNodes[1].classList.remove("none");
  2393. currentSortColumn.childNodes[1].classList.add("asc");
  2394. currentSortOrder = "asc";
  2395. }
  2396. populateBomBody();
  2397. }
  2398. return th;
  2399. }
  2400. function populateBomHeader() {
  2401. while (bomhead.firstChild) {
  2402. bomhead.removeChild(bomhead.firstChild);
  2403. }
  2404. var tr = document.createElement("TR");
  2405. var th = document.createElement("TH");
  2406. th.classList.add("numCol");
  2407. tr.appendChild(th);
  2408. var checkboxCompareClosure = function(checkbox) {
  2409. return (a, b) => {
  2410. var stateA = getCheckboxState(checkbox, a[3]);
  2411. var stateB = getCheckboxState(checkbox, b[3]);
  2412. if (stateA > stateB) return -1;
  2413. if (stateA < stateB) return 1;
  2414. return 0;
  2415. }
  2416. }
  2417. if (settings.bommode == "netlist") {
  2418. th = createColumnHeader("Net name", "bom-netname", (a, b) => {
  2419. if (a > b) return -1;
  2420. if (a < b) return 1;
  2421. return 0;
  2422. });
  2423. tr.appendChild(th);
  2424. } else {
  2425. for (var checkbox of settings.checkboxes) {
  2426. th = createColumnHeader(
  2427. checkbox, "bom-checkbox", checkboxCompareClosure(checkbox));
  2428. th.onclick = fancyDblClickHandler(
  2429. th, th.onclick.bind(th), checkboxSetUnsetAllHandler(checkbox));
  2430. tr.appendChild(th);
  2431. }
  2432. tr.appendChild(createColumnHeader("References", "References", (a, b) => {
  2433. var i = 0;
  2434. while (i < a[3].length && i < b[3].length) {
  2435. if (a[3][i] != b[3][i]) return a[3][i] > b[3][i] ? 1 : -1;
  2436. i++;
  2437. }
  2438. return a[3].length - b[3].length;
  2439. }));
  2440. // Extra fields
  2441. if (config.extra_fields.length > 0) {
  2442. var extraFieldCompareClosure = function(fieldIndex) {
  2443. return (a, b) => {
  2444. var fa = a[4][fieldIndex];
  2445. var fb = b[4][fieldIndex];
  2446. if (fa != fb) return fa > fb ? 1 : -1;
  2447. else return 0;
  2448. }
  2449. }
  2450. for (var i in config.extra_fields) {
  2451. tr.appendChild(createColumnHeader(
  2452. config.extra_fields[i], "extra", extraFieldCompareClosure(i)));
  2453. }
  2454. }
  2455. tr.appendChild(createColumnHeader("Value", "Value", (a, b) => {
  2456. return valueCompare(a[5], b[5], a[1], b[1]);
  2457. }));
  2458. tr.appendChild(createColumnHeader("Footprint", "Footprint", (a, b) => {
  2459. if (a[2] != b[2]) return a[2] > b[2] ? 1 : -1;
  2460. else return 0;
  2461. }));
  2462. if (settings.bommode == "grouped") {
  2463. tr.appendChild(createColumnHeader("Quantity", "Quantity", (a, b) => {
  2464. return a[3].length - b[3].length;
  2465. }));
  2466. }
  2467. }
  2468. bomhead.appendChild(tr);
  2469. }
  2470. function populateBomBody() {
  2471. while (bom.firstChild) {
  2472. bom.removeChild(bom.firstChild);
  2473. }
  2474. highlightHandlers = [];
  2475. moduleIndexToHandler = {};
  2476. netsToHandler = {};
  2477. currentHighlightedRowId = null;
  2478. var first = true;
  2479. if (settings.bommode == "netlist") {
  2480. bomtable = pcbdata.nets.slice();
  2481. } else {
  2482. switch (settings.canvaslayout) {
  2483. case 'F':
  2484. bomtable = pcbdata.bom.F.slice();
  2485. break;
  2486. case 'FB':
  2487. bomtable = pcbdata.bom.both.slice();
  2488. break;
  2489. case 'B':
  2490. bomtable = pcbdata.bom.B.slice();
  2491. break;
  2492. }
  2493. if (settings.bommode == "ungrouped") {
  2494. // expand bom table
  2495. expandedTable = []
  2496. for (var bomentry of bomtable) {
  2497. for (var ref of bomentry[3]) {
  2498. expandedTable.push([1, bomentry[1], bomentry[2], [ref], bomentry[4], bomentry[5]]);
  2499. }
  2500. }
  2501. bomtable = expandedTable;
  2502. }
  2503. }
  2504. if (bomSortFunction) {
  2505. bomtable = bomtable.sort(bomSortFunction);
  2506. }
  2507. for (var i in bomtable) {
  2508. var bomentry = bomtable[i];
  2509. if (filter && !entryMatches(bomentry)) {
  2510. continue;
  2511. }
  2512. var references = null;
  2513. var netname = null;
  2514. var tr = document.createElement("TR");
  2515. var td = document.createElement("TD");
  2516. var rownum = +i + 1;
  2517. tr.id = "bomrow" + rownum;
  2518. td.textContent = rownum;
  2519. tr.appendChild(td);
  2520. if (settings.bommode == "netlist") {
  2521. netname = bomentry;
  2522. td = document.createElement("TD");
  2523. td.innerHTML = highlightFilter(netname ? netname : "&lt;no net&gt;");
  2524. tr.appendChild(td);
  2525. } else {
  2526. if (reflookup) {
  2527. references = findRefInEntry(bomentry);
  2528. if (references.length == 0) {
  2529. continue;
  2530. }
  2531. } else {
  2532. references = bomentry[3];
  2533. }
  2534. // Checkboxes
  2535. for (var checkbox of settings.checkboxes) {
  2536. if (checkbox) {
  2537. td = document.createElement("TD");
  2538. var input = document.createElement("input");
  2539. input.type = "checkbox";
  2540. input.onchange = createCheckboxChangeHandler(checkbox, references);
  2541. setBomCheckboxState(checkbox, input, references);
  2542. if (input.checked && settings.darkenWhenChecked == checkbox) {
  2543. tr.classList.add("checked");
  2544. }
  2545. td.appendChild(input);
  2546. tr.appendChild(td);
  2547. }
  2548. }
  2549. // References
  2550. td = document.createElement("TD");
  2551. td.innerHTML = highlightFilter(references.map(r => r[0]).join(", "));
  2552. tr.appendChild(td);
  2553. // Extra fields
  2554. for (var i in config.extra_fields) {
  2555. td = document.createElement("TD");
  2556. td.innerHTML = highlightFilter(bomentry[4][i]);
  2557. tr.appendChild(td);
  2558. }
  2559. // Value
  2560. td = document.createElement("TD");
  2561. td.innerHTML = highlightFilter(bomentry[1]);
  2562. tr.appendChild(td);
  2563. // Footprint
  2564. td = document.createElement("TD");
  2565. td.innerHTML = highlightFilter(bomentry[2]);
  2566. tr.appendChild(td);
  2567. if (settings.bommode == "grouped") {
  2568. // Quantity
  2569. td = document.createElement("TD");
  2570. td.textContent = bomentry[3].length;
  2571. tr.appendChild(td);
  2572. }
  2573. }
  2574. bom.appendChild(tr);
  2575. var handler = createRowHighlightHandler(tr.id, references, netname);
  2576. tr.onmousemove = handler;
  2577. highlightHandlers.push({
  2578. id: tr.id,
  2579. handler: handler,
  2580. });
  2581. if (references !== null) {
  2582. for (var refIndex of references.map(r => r[1])) {
  2583. moduleIndexToHandler[refIndex] = handler;
  2584. }
  2585. }
  2586. if (netname !== null) {
  2587. netsToHandler[netname] = handler;
  2588. }
  2589. if ((filter || reflookup) && first) {
  2590. handler();
  2591. first = false;
  2592. }
  2593. }
  2594. EventHandler.emitEvent(
  2595. IBOM_EVENT_TYPES.BOM_BODY_CHANGE_EVENT,
  2596. {
  2597. filter: filter,
  2598. reflookup: reflookup,
  2599. checkboxes: settings.checkboxes,
  2600. bommode: settings.bommode,
  2601. });
  2602. }
  2603. function highlightPreviousRow() {
  2604. if (!currentHighlightedRowId) {
  2605. highlightHandlers[highlightHandlers.length - 1].handler();
  2606. } else {
  2607. if (highlightHandlers.length > 1 &&
  2608. highlightHandlers[0].id == currentHighlightedRowId) {
  2609. highlightHandlers[highlightHandlers.length - 1].handler();
  2610. } else {
  2611. for (var i = 0; i < highlightHandlers.length - 1; i++) {
  2612. if (highlightHandlers[i + 1].id == currentHighlightedRowId) {
  2613. highlightHandlers[i].handler();
  2614. break;
  2615. }
  2616. }
  2617. }
  2618. }
  2619. smoothScrollToRow(currentHighlightedRowId);
  2620. }
  2621. function highlightNextRow() {
  2622. if (!currentHighlightedRowId) {
  2623. highlightHandlers[0].handler();
  2624. } else {
  2625. if (highlightHandlers.length > 1 &&
  2626. highlightHandlers[highlightHandlers.length - 1].id == currentHighlightedRowId) {
  2627. highlightHandlers[0].handler();
  2628. } else {
  2629. for (var i = 1; i < highlightHandlers.length; i++) {
  2630. if (highlightHandlers[i - 1].id == currentHighlightedRowId) {
  2631. highlightHandlers[i].handler();
  2632. break;
  2633. }
  2634. }
  2635. }
  2636. }
  2637. smoothScrollToRow(currentHighlightedRowId);
  2638. }
  2639. function populateBomTable() {
  2640. populateBomHeader();
  2641. populateBomBody();
  2642. }
  2643. function modulesClicked(moduleIndexes) {
  2644. var lastClickedIndex = moduleIndexes.indexOf(lastClicked);
  2645. for (var i = 1; i <= moduleIndexes.length; i++) {
  2646. var refIndex = moduleIndexes[(lastClickedIndex + i) % moduleIndexes.length];
  2647. if (refIndex in moduleIndexToHandler) {
  2648. lastClicked = refIndex;
  2649. moduleIndexToHandler[refIndex]();
  2650. smoothScrollToRow(currentHighlightedRowId);
  2651. break;
  2652. }
  2653. }
  2654. }
  2655. function netClicked(net) {
  2656. if (net in netsToHandler) {
  2657. netsToHandler[net]();
  2658. smoothScrollToRow(currentHighlightedRowId);
  2659. } else {
  2660. clearHighlightedModules();
  2661. highlightedNet = net;
  2662. drawHighlights();
  2663. }
  2664. }
  2665. function updateFilter(input) {
  2666. filter = input.toLowerCase();
  2667. populateBomTable();
  2668. }
  2669. function updateRefLookup(input) {
  2670. reflookup = input.toLowerCase();
  2671. populateBomTable();
  2672. }
  2673. function changeCanvasLayout(layout) {
  2674. document.getElementById("fl-btn").classList.remove("depressed");
  2675. document.getElementById("fb-btn").classList.remove("depressed");
  2676. document.getElementById("bl-btn").classList.remove("depressed");
  2677. switch (layout) {
  2678. case 'F':
  2679. document.getElementById("fl-btn").classList.add("depressed");
  2680. if (settings.bomlayout != "bom-only") {
  2681. canvassplit.collapse(1);
  2682. }
  2683. break;
  2684. case 'B':
  2685. document.getElementById("bl-btn").classList.add("depressed");
  2686. if (settings.bomlayout != "bom-only") {
  2687. canvassplit.collapse(0);
  2688. }
  2689. break;
  2690. default:
  2691. document.getElementById("fb-btn").classList.add("depressed");
  2692. if (settings.bomlayout != "bom-only") {
  2693. canvassplit.setSizes([50, 50]);
  2694. }
  2695. }
  2696. settings.canvaslayout = layout;
  2697. writeStorage("canvaslayout", layout);
  2698. resizeAll();
  2699. changeBomMode(settings.bommode);
  2700. }
  2701. function populateMetadata() {
  2702. document.getElementById("title").innerHTML = pcbdata.metadata.title;
  2703. document.getElementById("revision").innerHTML = "Rev: " + pcbdata.metadata.revision;
  2704. document.getElementById("company").innerHTML = pcbdata.metadata.company;
  2705. document.getElementById("filedate").innerHTML = pcbdata.metadata.date;
  2706. if (pcbdata.metadata.title != "") {
  2707. document.title = pcbdata.metadata.title + " BOM";
  2708. }
  2709. // Calculate board stats
  2710. var fp_f = 0, fp_b = 0, pads_f = 0, pads_b = 0, pads_th = 0;
  2711. for (var i = 0; i < pcbdata.modules.length; i++) {
  2712. if (pcbdata.bom.skipped.includes(i)) continue;
  2713. var mod = pcbdata.modules[i];
  2714. if (mod.layer == "F") {
  2715. fp_f++;
  2716. } else {
  2717. fp_b++;
  2718. }
  2719. for (var pad of mod.pads) {
  2720. if (pad.type == "th") {
  2721. pads_th++;
  2722. } else {
  2723. if (pad.layers.includes("F")) {
  2724. pads_f++;
  2725. }
  2726. if (pad.layers.includes("B")) {
  2727. pads_b++;
  2728. }
  2729. }
  2730. }
  2731. }
  2732. document.getElementById("stats-components-front").innerHTML = fp_f;
  2733. document.getElementById("stats-components-back").innerHTML = fp_b;
  2734. document.getElementById("stats-components-total").innerHTML = fp_f + fp_b;
  2735. document.getElementById("stats-groups-front").innerHTML = pcbdata.bom.F.length;
  2736. document.getElementById("stats-groups-back").innerHTML = pcbdata.bom.B.length;
  2737. document.getElementById("stats-groups-total").innerHTML = pcbdata.bom.both.length;
  2738. document.getElementById("stats-smd-pads-front").innerHTML = pads_f;
  2739. document.getElementById("stats-smd-pads-back").innerHTML = pads_b;
  2740. document.getElementById("stats-smd-pads-total").innerHTML = pads_f + pads_b;
  2741. document.getElementById("stats-th-pads").innerHTML = pads_th;
  2742. // Update version string
  2743. document.getElementById("github-link").innerHTML = "InteractiveHtmlBom&nbsp;" +
  2744. /^v\d+\.\d+/.exec(pcbdata.ibom_version)[0];
  2745. }
  2746. function changeBomLayout(layout) {
  2747. document.getElementById("bom-btn").classList.remove("depressed");
  2748. document.getElementById("lr-btn").classList.remove("depressed");
  2749. document.getElementById("tb-btn").classList.remove("depressed");
  2750. switch (layout) {
  2751. case 'bom-only':
  2752. document.getElementById("bom-btn").classList.add("depressed");
  2753. if (bomsplit) {
  2754. bomsplit.destroy();
  2755. bomsplit = null;
  2756. canvassplit.destroy();
  2757. canvassplit = null;
  2758. }
  2759. document.getElementById("frontcanvas").style.display = "none";
  2760. document.getElementById("backcanvas").style.display = "none";
  2761. document.getElementById("bot").style.height = "";
  2762. break;
  2763. case 'top-bottom':
  2764. document.getElementById("tb-btn").classList.add("depressed");
  2765. document.getElementById("frontcanvas").style.display = "";
  2766. document.getElementById("backcanvas").style.display = "";
  2767. document.getElementById("bot").style.height = "calc(100% - 80px)";
  2768. document.getElementById("bomdiv").classList.remove("split-horizontal");
  2769. document.getElementById("canvasdiv").classList.remove("split-horizontal");
  2770. document.getElementById("frontcanvas").classList.add("split-horizontal");
  2771. document.getElementById("backcanvas").classList.add("split-horizontal");
  2772. if (bomsplit) {
  2773. bomsplit.destroy();
  2774. bomsplit = null;
  2775. canvassplit.destroy();
  2776. canvassplit = null;
  2777. }
  2778. bomsplit = Split(['#bomdiv', '#canvasdiv'], {
  2779. sizes: [50, 50],
  2780. onDragEnd: resizeAll,
  2781. direction: "vertical",
  2782. gutterSize: 5
  2783. });
  2784. canvassplit = Split(['#frontcanvas', '#backcanvas'], {
  2785. sizes: [50, 50],
  2786. gutterSize: 5,
  2787. onDragEnd: resizeAll
  2788. });
  2789. break;
  2790. case 'left-right':
  2791. document.getElementById("lr-btn").classList.add("depressed");
  2792. document.getElementById("frontcanvas").style.display = "";
  2793. document.getElementById("backcanvas").style.display = "";
  2794. document.getElementById("bot").style.height = "calc(100% - 80px)";
  2795. document.getElementById("bomdiv").classList.add("split-horizontal");
  2796. document.getElementById("canvasdiv").classList.add("split-horizontal");
  2797. document.getElementById("frontcanvas").classList.remove("split-horizontal");
  2798. document.getElementById("backcanvas").classList.remove("split-horizontal");
  2799. if (bomsplit) {
  2800. bomsplit.destroy();
  2801. bomsplit = null;
  2802. canvassplit.destroy();
  2803. canvassplit = null;
  2804. }
  2805. bomsplit = Split(['#bomdiv', '#canvasdiv'], {
  2806. sizes: [50, 50],
  2807. onDragEnd: resizeAll,
  2808. gutterSize: 5
  2809. });
  2810. canvassplit = Split(['#frontcanvas', '#backcanvas'], {
  2811. sizes: [50, 50],
  2812. gutterSize: 5,
  2813. direction: "vertical",
  2814. onDragEnd: resizeAll
  2815. });
  2816. }
  2817. settings.bomlayout = layout;
  2818. writeStorage("bomlayout", layout);
  2819. changeCanvasLayout(settings.canvaslayout);
  2820. }
  2821. function changeBomMode(mode) {
  2822. document.getElementById("bom-grouped-btn").classList.remove("depressed");
  2823. document.getElementById("bom-ungrouped-btn").classList.remove("depressed");
  2824. document.getElementById("bom-netlist-btn").classList.remove("depressed");
  2825. switch (mode) {
  2826. case 'grouped':
  2827. document.getElementById("bom-grouped-btn").classList.add("depressed");
  2828. break;
  2829. case 'ungrouped':
  2830. document.getElementById("bom-ungrouped-btn").classList.add("depressed");
  2831. break;
  2832. case 'netlist':
  2833. document.getElementById("bom-netlist-btn").classList.add("depressed");
  2834. }
  2835. writeStorage("bommode", mode);
  2836. if (mode != settings.bommode) {
  2837. settings.bommode = mode;
  2838. bomSortFunction = null;
  2839. currentSortColumn = null;
  2840. currentSortOrder = null;
  2841. clearHighlightedModules();
  2842. }
  2843. populateBomTable();
  2844. }
  2845. function focusFilterField() {
  2846. focusInputField(document.getElementById("filter"));
  2847. }
  2848. function focusRefLookupField() {
  2849. focusInputField(document.getElementById("reflookup"));
  2850. }
  2851. function toggleBomCheckbox(bomrowid, checkboxnum) {
  2852. if (!bomrowid || checkboxnum > settings.checkboxes.length) {
  2853. return;
  2854. }
  2855. var bomrow = document.getElementById(bomrowid);
  2856. var checkbox = bomrow.childNodes[checkboxnum].childNodes[0];
  2857. checkbox.checked = !checkbox.checked;
  2858. checkbox.indeterminate = false;
  2859. checkbox.onchange();
  2860. }
  2861. function checkBomCheckbox(bomrowid, checkboxname) {
  2862. var checkboxnum = 0;
  2863. while (checkboxnum < settings.checkboxes.length &&
  2864. settings.checkboxes[checkboxnum].toLowerCase() != checkboxname.toLowerCase()) {
  2865. checkboxnum++;
  2866. }
  2867. if (!bomrowid || checkboxnum >= settings.checkboxes.length) {
  2868. return;
  2869. }
  2870. var bomrow = document.getElementById(bomrowid);
  2871. var checkbox = bomrow.childNodes[checkboxnum + 1].childNodes[0];
  2872. checkbox.checked = true;
  2873. checkbox.indeterminate = false;
  2874. checkbox.onchange();
  2875. }
  2876. function setBomCheckboxes(value) {
  2877. writeStorage("bomCheckboxes", value);
  2878. settings.checkboxes = value.split(",").filter((e) => e);
  2879. prepCheckboxes();
  2880. populateBomTable();
  2881. populateDarkenWhenCheckedOptions();
  2882. }
  2883. function setDarkenWhenChecked(value) {
  2884. writeStorage("darkenWhenChecked", value);
  2885. settings.darkenWhenChecked = value;
  2886. populateBomTable();
  2887. }
  2888. function prepCheckboxes() {
  2889. var table = document.getElementById("checkbox-stats");
  2890. while (table.childElementCount > 1) {
  2891. table.removeChild(table.lastChild);
  2892. }
  2893. if (settings.checkboxes.length) {
  2894. table.style.display = "";
  2895. } else {
  2896. table.style.display = "none";
  2897. }
  2898. for (var checkbox of settings.checkboxes) {
  2899. var tr = document.createElement("TR");
  2900. var td = document.createElement("TD");
  2901. td.innerHTML = checkbox;
  2902. tr.appendChild(td);
  2903. td = document.createElement("TD");
  2904. td.id = "checkbox-stats-" + checkbox;
  2905. var progressbar = document.createElement("div");
  2906. progressbar.classList.add("bar");
  2907. td.appendChild(progressbar);
  2908. var text = document.createElement("div");
  2909. text.classList.add("text");
  2910. td.appendChild(text);
  2911. tr.appendChild(td);
  2912. table.appendChild(tr);
  2913. updateCheckboxStats(checkbox);
  2914. }
  2915. }
  2916. function populateDarkenWhenCheckedOptions() {
  2917. var container = document.getElementById("darkenWhenCheckedContainer");
  2918. if (settings.checkboxes.length == 0) {
  2919. container.parentElement.style.display = "none";
  2920. return;
  2921. }
  2922. container.innerHTML = '';
  2923. container.parentElement.style.display = "inline-block";
  2924. function createOption(name, displayName) {
  2925. var id = "darkenWhenChecked-" + name;
  2926. var div = document.createElement("div");
  2927. div.classList.add("radio-container");
  2928. var input = document.createElement("input");
  2929. input.type = "radio";
  2930. input.name = "darkenWhenChecked";
  2931. input.value = name;
  2932. input.id = id;
  2933. input.onchange = () => setDarkenWhenChecked(name);
  2934. div.appendChild(input);
  2935. // Preserve the selected element when the checkboxes change
  2936. if (name == settings.darkenWhenChecked) {
  2937. input.checked = true;
  2938. }
  2939. var label = document.createElement("label");
  2940. label.innerHTML = displayName;
  2941. label.htmlFor = id;
  2942. div.appendChild(label);
  2943. container.appendChild(div);
  2944. }
  2945. createOption("", "None");
  2946. for (var checkbox of settings.checkboxes) {
  2947. createOption(checkbox, checkbox);
  2948. }
  2949. }
  2950. function updateCheckboxStats(checkbox) {
  2951. var checked = getStoredCheckboxRefs(checkbox).size;
  2952. var total = pcbdata.modules.length - pcbdata.bom.skipped.length;
  2953. var percent = checked * 100.0 / total;
  2954. var td = document.getElementById("checkbox-stats-" + checkbox);
  2955. td.firstChild.style.width = percent + "%";
  2956. td.lastChild.innerHTML = checked + "/" + total + " (" + Math.round(percent) + "%)";
  2957. }
  2958. document.onkeydown = function(e) {
  2959. switch (e.key) {
  2960. case "n":
  2961. if (document.activeElement.type == "text") {
  2962. return;
  2963. }
  2964. if (currentHighlightedRowId !== null) {
  2965. checkBomCheckbox(currentHighlightedRowId, "placed");
  2966. highlightNextRow();
  2967. e.preventDefault();
  2968. }
  2969. break;
  2970. case "ArrowUp":
  2971. highlightPreviousRow();
  2972. e.preventDefault();
  2973. break;
  2974. case "ArrowDown":
  2975. highlightNextRow();
  2976. e.preventDefault();
  2977. break;
  2978. default:
  2979. break;
  2980. }
  2981. if (e.altKey) {
  2982. switch (e.key) {
  2983. case "f":
  2984. focusFilterField();
  2985. e.preventDefault();
  2986. break;
  2987. case "r":
  2988. focusRefLookupField();
  2989. e.preventDefault();
  2990. break;
  2991. case "z":
  2992. changeBomLayout("bom-only");
  2993. e.preventDefault();
  2994. break;
  2995. case "x":
  2996. changeBomLayout("left-right");
  2997. e.preventDefault();
  2998. break;
  2999. case "c":
  3000. changeBomLayout("top-bottom");
  3001. e.preventDefault();
  3002. break;
  3003. case "v":
  3004. changeCanvasLayout("F");
  3005. e.preventDefault();
  3006. break;
  3007. case "b":
  3008. changeCanvasLayout("FB");
  3009. e.preventDefault();
  3010. break;
  3011. case "n":
  3012. changeCanvasLayout("B");
  3013. e.preventDefault();
  3014. break;
  3015. default:
  3016. break;
  3017. }
  3018. if (e.key >= '1' && e.key <= '9') {
  3019. toggleBomCheckbox(currentHighlightedRowId, parseInt(e.key));
  3020. }
  3021. }
  3022. }
  3023. function hideNetlistButton() {
  3024. document.getElementById("bom-ungrouped-btn").classList.remove("middle-button");
  3025. document.getElementById("bom-ungrouped-btn").classList.add("right-most-button");
  3026. document.getElementById("bom-netlist-btn").style.display = "none";
  3027. }
  3028. window.onload = function(e) {
  3029. initUtils();
  3030. initRender();
  3031. initStorage();
  3032. initDefaults();
  3033. cleanGutters();
  3034. populateMetadata();
  3035. dbgdiv = document.getElementById("dbg");
  3036. bom = document.getElementById("bombody");
  3037. bomhead = document.getElementById("bomhead");
  3038. filter = "";
  3039. reflookup = "";
  3040. if (!("nets" in pcbdata)) {
  3041. hideNetlistButton();
  3042. }
  3043. initDone = true;
  3044. prepCheckboxes();
  3045. // Triggers render
  3046. changeBomLayout(settings.bomlayout);
  3047. // Users may leave fullscreen without touching the checkbox. Uncheck.
  3048. document.addEventListener('fullscreenchange', () => {
  3049. if (!document.fullscreenElement)
  3050. document.getElementById('fullscreenCheckbox').checked = false;
  3051. });
  3052. }
  3053. window.onresize = resizeAll;
  3054. window.matchMedia("print").addListener(resizeAll);
  3055. ///////////////////////////////////////////////
  3056. ///////////////////////////////////////////////
  3057. window.setTimeout(function() {
  3058. //tracksVisible(true);
  3059. },1000);
  3060. ///////////////////////////////////////////////
  3061. </script>
  3062. </head>
  3063. <body>
  3064. <div id="topmostdiv" class="topmostdiv">
  3065. <div id="top">
  3066. <div style="float: right; height: 100%;">
  3067. <div class="hideonprint menu" style="float: right; top: 8px;">
  3068. <button class="menubtn"></button>
  3069. <div class="menu-content">
  3070. <label class="menu-label menu-label-top" style="width: calc(50% - 18px)">
  3071. <input id="darkmodeCheckbox" type="checkbox" onchange="setDarkMode(this.checked)">
  3072. Dark mode
  3073. </label><!-- This comment eats space! All of it!
  3074. --><label class="menu-label menu-label-top" style="width: calc(50% - 17px); border-left: 0;">
  3075. <input id="fullscreenCheckbox" type="checkbox" onchange="setFullscreen(this.checked)">
  3076. Full Screen
  3077. </label>
  3078. <label class="menu-label" style="width: calc(50% - 18px)">
  3079. <input id="fabricationCheckbox" type="checkbox" checked onchange="fabricationVisible(this.checked)">
  3080. Fab layer
  3081. </label><!-- This comment eats space! All of it!
  3082. --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
  3083. <input id="silkscreenCheckbox" type="checkbox" checked onchange="silkscreenVisible(this.checked)">
  3084. Silkscreen
  3085. </label>
  3086. <label class="menu-label" style="width: calc(50% - 18px)">
  3087. <input id="referencesCheckbox" type="checkbox" checked onchange="referencesVisible(this.checked)">
  3088. References
  3089. </label><!-- This comment eats space! All of it!
  3090. --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
  3091. <input id="valuesCheckbox" type="checkbox" checked onchange="valuesVisible(this.checked)">
  3092. Values
  3093. </label>
  3094. <div id="tracksAndZonesCheckboxes">
  3095. <label class="menu-label" style="width: calc(50% - 18px)">
  3096. <input id="tracksCheckbox" type="checkbox" checked onchange="tracksVisible(this.checked)">
  3097. Tracks
  3098. </label><!-- This comment eats space! All of it!
  3099. --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
  3100. <input id="zonesCheckbox" type="checkbox" checked onchange="zonesVisible(this.checked)">
  3101. Zones
  3102. </label>
  3103. </div>
  3104. <label class="menu-label" style="width: calc(50% - 18px)">
  3105. <input id="padsCheckbox" type="checkbox" checked onchange="padsVisible(this.checked)">
  3106. Pads
  3107. </label><!-- This comment eats space! All of it!
  3108. --><label class="menu-label" style="width: calc(50% - 17px); border-left: 0;">
  3109. <input id="dnpOutlineCheckbox" type="checkbox" checked onchange="dnpOutline(this.checked)">
  3110. DNP outlined
  3111. </label>
  3112. <label class="menu-label">
  3113. <input id="highlightpin1Checkbox" type="checkbox" onchange="setHighlightPin1(this.checked)">
  3114. Highlight first pin
  3115. </label>
  3116. <label class="menu-label">
  3117. <input id="dragCheckbox" type="checkbox" checked onchange="setRedrawOnDrag(this.checked)">
  3118. Continuous redraw on drag
  3119. </label>
  3120. <label class="menu-label">
  3121. <span>Board rotation</span>
  3122. <span style="float: right"><span id="rotationDegree">0</span>&#176;</span>
  3123. <input id="boardRotation" type="range" min="-36" max="36" value="0" class="slider" oninput="setBoardRotation(this.value)">
  3124. </label>
  3125. <label class="menu-label">
  3126. <div style="margin-left: 5px">Bom checkboxes</div>
  3127. <input id="bomCheckboxes" class="menu-textbox" type=text
  3128. oninput="setBomCheckboxes(this.value)">
  3129. </label>
  3130. <label class="menu-label">
  3131. <div style="margin-left: 5px">Darken when checked</div>
  3132. <div id="darkenWhenCheckedContainer"></div>
  3133. </label>
  3134. <label class="menu-label">
  3135. <span class="shameless-plug">
  3136. <span>Created using</span>
  3137. <a id="github-link" target="blank" href="https://github.com/openscopeproject/InteractiveHtmlBom">InteractiveHtmlBom</a>
  3138. </span>
  3139. </label>
  3140. </div>
  3141. </div>
  3142. <div class="button-container hideonprint"
  3143. style="float: right; position: relative; top: 8px">
  3144. <button id="fl-btn" class="left-most-button" onclick="changeCanvasLayout('F')"
  3145. title="Front only">F
  3146. </button>
  3147. <button id="fb-btn" class="middle-button" onclick="changeCanvasLayout('FB')"
  3148. title="Front and Back">FB
  3149. </button>
  3150. <button id="bl-btn" class="right-most-button" onclick="changeCanvasLayout('B')"
  3151. title="Back only">B
  3152. </button>
  3153. </div>
  3154. <div class="button-container hideonprint"
  3155. style="float: right; position: relative; top: 8px">
  3156. <button id="bom-btn" class="left-most-button" onclick="changeBomLayout('bom-only')"
  3157. title="BOM only"></button>
  3158. <button id="lr-btn" class="middle-button" onclick="changeBomLayout('left-right')"
  3159. title="BOM left, drawings right"></button>
  3160. <button id="tb-btn" class="right-most-button" onclick="changeBomLayout('top-bottom')"
  3161. title="BOM top, drawings bot"></button>
  3162. </div>
  3163. <div class="button-container hideonprint"
  3164. style="float: right; position: relative; top: 8px">
  3165. <button id="bom-grouped-btn" class="left-most-button" onclick="changeBomMode('grouped')"
  3166. title="Grouped BOM"></button>
  3167. <button id="bom-ungrouped-btn" class="middle-button" onclick="changeBomMode('ungrouped')"
  3168. title="Ungrouped BOM"></button>
  3169. <button id="bom-netlist-btn" class="right-most-button" onclick="changeBomMode('netlist')"
  3170. title="Netlist"></button>
  3171. </div>
  3172. <div class="hideonprint menu" style="float: right; top: 8px;">
  3173. <button class="statsbtn"></button>
  3174. <div class="menu-content">
  3175. <table class="stats">
  3176. <tbody>
  3177. <tr>
  3178. <td width="40%">Board stats</td>
  3179. <td>Front</td>
  3180. <td>Back</td>
  3181. <td>Total</td>
  3182. </tr>
  3183. <tr>
  3184. <td>Components</td>
  3185. <td id="stats-components-front">~</td>
  3186. <td id="stats-components-back">~</td>
  3187. <td id="stats-components-total">~</td>
  3188. </tr>
  3189. <tr>
  3190. <td>Groups</td>
  3191. <td id="stats-groups-front">~</td>
  3192. <td id="stats-groups-back">~</td>
  3193. <td id="stats-groups-total">~</td>
  3194. </tr>
  3195. <tr>
  3196. <td>SMD pads</td>
  3197. <td id="stats-smd-pads-front">~</td>
  3198. <td id="stats-smd-pads-back">~</td>
  3199. <td id="stats-smd-pads-total">~</td>
  3200. </tr>
  3201. <tr>
  3202. <td>TH pads</td>
  3203. <td colspan=3 id="stats-th-pads">~</td>
  3204. </tr>
  3205. </tbody>
  3206. </table>
  3207. <table class="stats">
  3208. <col width="40%"/><col />
  3209. <tbody id="checkbox-stats">
  3210. <tr>
  3211. <td colspan=2 style="border-top: 0">Checkboxes</td>
  3212. </tr>
  3213. </tbody>
  3214. </table>
  3215. </div>
  3216. </div>
  3217. <div class="hideonprint menu" style="float: right; top: 8px;">
  3218. <button class="iobtn"></button>
  3219. <div class="menu-content">
  3220. <div class="menu-label menu-label-top">
  3221. <div style="margin-left: 5px;">Save board image</div>
  3222. <div class="flexbox">
  3223. <input id="render-save-width" class="menu-textbox" type="text" value="1000" placeholder="Width"
  3224. style="flex-grow: 1; width: 50px;" oninput="validateSaveImgDimension(this)">
  3225. <span>X</span>
  3226. <input id="render-save-height" class="menu-textbox" type="text" value="1000" placeholder="Height"
  3227. style="flex-grow: 1; width: 50px;" oninput="validateSaveImgDimension(this)">
  3228. </div>
  3229. <label>
  3230. <input id="render-save-transparent" type="checkbox">
  3231. Transparent background
  3232. </label>
  3233. <div class="flexbox">
  3234. <button class="savebtn" onclick="saveImage('F')">Front</button>
  3235. <button class="savebtn" onclick="saveImage('B')">Back</button>
  3236. </div>
  3237. </div>
  3238. <div class="menu-label">
  3239. <span style="margin-left: 5px;">Config and checkbox state</span>
  3240. <div class="flexbox">
  3241. <button class="savebtn" onclick="saveSettings()">Export</button>
  3242. <button class="savebtn" onclick="loadSettings()">Import</button>
  3243. </div>
  3244. </div>
  3245. </div>
  3246. </div>
  3247. </div>
  3248. <div id="fileinfodiv" style="overflow: auto;">
  3249. <table class="fileinfo">
  3250. <tbody>
  3251. <tr>
  3252. <td id="title" class="title" style="width: 70%">
  3253. Title
  3254. </td>
  3255. <td id="revision" class="title" style="width: 30%">
  3256. Revision
  3257. </td>
  3258. </tr>
  3259. <tr>
  3260. <td id="company">
  3261. Company
  3262. </td>
  3263. <td id="filedate">
  3264. Date
  3265. </td>
  3266. </tr>
  3267. </tbody>
  3268. </table>
  3269. </div>
  3270. </div>
  3271. <div id="bot" class="split" style="height: calc(100% - 80px)">
  3272. <div id="bomdiv" class="split split-horizontal">
  3273. <div style="width: 100%">
  3274. <input id="reflookup" class="textbox searchbox reflookup hideonprint" type="text" placeholder="Ref lookup"
  3275. oninput="updateRefLookup(this.value)">
  3276. <input id="filter" class="textbox searchbox filter hideonprint" type="text" placeholder="Filter"
  3277. oninput="updateFilter(this.value)">
  3278. <div class="button-container hideonprint" style="float: left; margin: 0;">
  3279. <button id="copy" title="Copy bom table to clipboard"
  3280. onclick="copyToClipboard()"></button>
  3281. </div>
  3282. </div>
  3283. <div id="dbg"></div>
  3284. <table class="bom">
  3285. <thead id="bomhead">
  3286. </thead>
  3287. <tbody id="bombody">
  3288. </tbody>
  3289. </table>
  3290. </div>
  3291. <div id="canvasdiv" class="split split-horizontal">
  3292. <div id="frontcanvas" class="split" touch-action="none" style="overflow: hidden">
  3293. <div style="position: relative; width: 100%; height: 100%;">
  3294. <canvas id="F_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
  3295. <canvas id="F_fab" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
  3296. <canvas id="F_slk" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas>
  3297. <canvas id="F_hl" style="position: absolute; left: 0; top: 0; z-index: 3;"></canvas>
  3298. </div>
  3299. </div>
  3300. <div id="backcanvas" class="split" touch-action="none" style="overflow: hidden">
  3301. <div style="position: relative; width: 100%; height: 100%;">
  3302. <canvas id="B_bg" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
  3303. <canvas id="B_fab" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
  3304. <canvas id="B_slk" style="position: absolute; left: 0; top: 0; z-index: 2;"></canvas>
  3305. <canvas id="B_hl" style="position: absolute; left: 0; top: 0; z-index: 3;"></canvas>
  3306. </div>
  3307. </div>
  3308. </div>
  3309. </div>
  3310. </div>
  3311. </body>
  3312. </html>