diff options
Diffstat (limited to 'html')
-rw-r--r-- | html/module.png | bin | 0 -> 816309 bytes | |||
-rw-r--r-- | html/pinout-2.html | 519 | ||||
-rw-r--r-- | html/pinout.html | 682 | ||||
-rw-r--r-- | html/tables.html | 80 |
4 files changed, 1281 insertions, 0 deletions
diff --git a/html/module.png b/html/module.png Binary files differnew file mode 100644 index 0000000..d97cc47 --- /dev/null +++ b/html/module.png diff --git a/html/pinout-2.html b/html/pinout-2.html new file mode 100644 index 0000000..40a98f4 --- /dev/null +++ b/html/pinout-2.html @@ -0,0 +1,519 @@ +<html> +<head> + <style type="text/css"> + table.pinout { + border-spacing: 0; + /*border-style: solid;*/ + + font-family: "Arial", "sans-serif"; + font-weight: bold; + } + + table.pinout td.group-tim2 { + background-color: indianred; + border-style: none; + } + + table.pinout td.group-adc12 { + background-color: deepskyblue; + border-style: none; + } + + table.pinout td.group-usart2 { + background-color: lawngreen; + border-style: none; + } + + table.pinout td.group-spi1 { + background-color: sandybrown; + border-style: none; + } + + table.pinout td { + white-space: nowrap; + } + + td.connection { + } + + table.pinout td { + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + .group-top { + border: 1px solid; + border-bottom-width: 0; + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; + } + + .group-bottom { + border: 1px solid; + border-top-width: 0; + border-bottom-left-radius: 0.5rem; + border-bottom-right-radius: 0.5rem; + } + + .group-middle { + border-left: 1px solid; + border-right: 1px solid; + } + + .group-one { + border: 1px; + border-radius: 0.5rem; + + background-color: black; + color: white; + text-align: center; + } + + .group-single { + border: 1px; + border-radius: 0.5rem; + + text-align: center; + } + + .connection { + width: 3rem; + } + + </style> + <style type="text/css"> + table.container { + border-collapse: collapse; + } + + table.container td.top-spacer { + width: 190px; + /*border: 2px green;*/ + } + + table.container td.bottom-spacer { + width: 165px; + /*border: 2px green;*/ + + /* + text-align: center; + content: "spacer"; + */ + } + </style> + <script type="application/javascript"> + // group + function g(group, name, remapped) { + return { + group: group, + name: name, + remapped: !!remapped + }; + } + + // one + function o(name) { + return { + name: name + }; + } + + // empty + function e() { + return {}; + } + + function pin() { + var functions = []; + functions.push({name: arguments[0]}); + for (var i = 1; i < arguments.length; i++) { + functions.push(arguments[i]); + } + return new Pin(arguments[0], functions); + } + + /** + * @constructor + */ + function Pin(name, functions) { + function hasGroup(group) { + return functions.some(function (f) { + return f.group == group; + }); + } + + /** + * @lends Pin.prototype + */ + return { + name: name, + functions: functions, + hasGroup: hasGroup + }; + } + + /** + * @constructor + */ + function Header(columns, pins) { + var rows = pins.length / columns; + + function pinsOnColumn(column) { + var ps = []; + + for (var i = column; i < pins.length; i += columns) { + ps.push(pins[i]); + } + + return ps; + } + + /** + * @return {Pin} + */ + function at(column, row) { + return pins[row * columns + column]; + } + + /** + * @return {Pin} + */ + function above(column, row) { + return at(column, row - 1); + } + + /** + * @return {Pin} + */ + function below(column, row) { + return at(column, row + 1); + } + + function maxNumberOfFunctionsInColumn(column) { + var width = 0; + for (var i = column; i < pins.length; i += columns) { + width = Math.max(width, pins[i].functions.length); + } + + return width; + } + + /** + * @lends Header.prototype + */ + return { + at: at, + above: above, + below: below, + pinsOnColumn: pinsOnColumn, + maxNumberOfFunctionsInColumn: maxNumberOfFunctionsInColumn, + rowCount: rows + } + } + + var j8 = new Header(2, [ + pin("3V3"), + pin("3V3"), + pin("PA0", o("WKUP"), g("usart2", "USART2_CTS"), g("adc12", "ADC12_IN0"), g("tim2", "TIM2_CH1_ETR")), + pin("PA1", e(), g("usart2", "USART2_RTS"), g("adc12", "ADC12_IN1"), g("tim2", "TIM2_CH2")), + pin("PA2", e(), g("usart2", "USART2_TX"), g("adc12", "ADC12_IN2"), g("tim2", "TIM2_CH3")), + pin("PA3", e(), g("usart2", "USART2_RX"), g("adc12", "ADC12_IN3"), g("tim2", " TIM2_CH4")), + pin("PA4", g("spi1", "SPI1_NSS"), g("usart2", "USART2_CK"), g("adc12", "ADC12_IN4")), + pin("PA5", g("spi1", "SPI1_SCK"), e(), g("adc12", "ADC12_IN5")), + pin("PA6", g("spi1", "SPI1_MISO"), g("tim1", "TIM1_BKIN", true), g("adc12", "ADC12_IN6"), g("tim3", "TIM3_CH1")), + pin("PA7", g("spi1", "SPI1_MOSI"), g("tim1", "TIM1_CH1N", true), g("adc12", "ADC12_IN7"), g("tim3", "TIM3_CH2")), + pin("PB0", e(), g("tim1", "TIM1_CH2N", true), g("adc12", "ADC12_IN8"), g("tim3", "TIM3_CH3")), + pin("PB1", e(), g("tim1", "TIM1_CH3N", true), g("adc12", "ADC12_IN8"), g("tim3", "TIM3_CH3")), + pin("PB2", o("boot1")), + pin("PB10", e(), g("usart3", "USART3_TX"), g("i2c2", "I2C2_SCL"), g("tim2", "TIM2_CH3", true)), + pin("PB12", g("spi2", "SPI2_NSS"), g("usart3", "USART3_CK"), g("i2c2", "I2C2_SMBAl"), g("tim1", "TIM1_BKIN")), + pin("PB11", e(), g("usart3", "USART3_RX"), g("i2c2", "I2C2_SDA"), g("tim2", "TIM2_CH4", true)), + pin("PB14", g("spi2", "SPI2_MISO"), g("usart3", "USART3_RTS"), e(), g("tim1", "TIM1_CH2N")), + pin("PB13", g("spi2", "SPI2_SCK"), g("usart3", "USART3_CTS"), g("tim1", "TIM1_CH1N")), + pin("PB8", o("MCO"), g("usart1", "USART1_CK"), e(), g("tim1", "TIM1_CH1")), + pin("PB15", g("spi2", "SPI2_MOSI"), e(), g("tim1", "TIM1_CH3N")), + pin("PB10", e(), g("usart1", "USART1_RX"), e(), g("tim1", "TIM1_CH3")), + pin("PB9"), + pin("GND"), + pin("GND") + ]); + + var j9 = new Header(2, [ + pin("3V3"), + pin("3V3"), + pin("NRST"), + pin("PD1", g("can", "CANTX")), + pin("PD0", g("can", "CANRX")), + pin("PC15", o("OSC32_OUT")), + pin("PC14", o("OSC32_IN")), + pin("PC13", o("TAMPER-RTC")), + pin("Vbat"), + pin("PB9", g("tim4", "TIM4_CH4"), g("i2c1", "I2C1_SDA", true), g("can", "CANTX", true)), + pin("PB8", g("tim4", "TIM4_CH3"), g("i2c1", "I2C1_SCL", true), g("can", "CANRX", true)), + pin("BOOT0"), + pin("PB7", g("tim4", "TIM4_CH2"), g("i2c1", "I2C1_SDA"), g("usart1", "USART1_RX", true)), + pin("PB6", g("tim4", "TIM4_CH1"), g("i2c1", "I2C1_SCL"), g("usart1", "USART1_TX", true)), + pin("PB5", g("tim3", "TIM3_CH2", true), g("i2c1", "I2C1_SMBAl"), g("spi1", "SPI1_MOSI", true)), + pin("PB4", g("jtag", "JNTRST" /* default */), g("tim3", "TIM3_CH1", true), g("gpio", "PB4", true), g("spi1", "SPI1_MISO", true)), + pin("PB3", g("jtag", "JTDO" /* default */), g("tim2", "TIM2_CH2", true), g("gpio", "PB3", true), g("spi1", "SPI1_SCK", true), g("jtag", "TRACESWO", true)), + pin("PA15", g("jtag", "JTDI" /* default */), g("tim2", "TIM2_CH1_ETR", true), g("gpio", "PA15", true), g("spi1", "SPI1_NSS", true)), + pin("PA14", g("jtag", "JTCK/SWCLK" /* default */), e(), g("gpio", "PA14", true)), + pin("PA13", g("jtag", "JTMS/SWDIO" /* default */), e(), g("gpio", "PA13", true)), + pin("PA12", g("usb", "USBDP"), g("usart1", "USART1_RTS"), g("can", "CANTX"), g("tim1", "TIM1_ETR")), + pin("PA11", g("usb", "USBDM"), g("usart1", "USART1_CTS"), g("can", "CANRX"), g("tim1", "TIM1_CH4")), + pin("GND"), + pin("GND") + ]); + + var headers = { + j8: j8, + j9: j9 + }; + + /** + * @param {Element} table + */ + function generate(table, headerName, side) { + /** + * @type {Header} + */ + var header = headers[headerName]; + if (!header) { + return; + } + + var d = table.ownerDocument; + var left = side == "left"; + var column = left ? 0 : 1; + + var width = header.maxNumberOfFunctionsInColumn(column); + console.log('width', width); + + (function() { + for (var row = header.rowCount; row >= 0; row--) { + var pin = header.at(column, row); + + var tr = d.createElement("tr"); + table.appendChild(tr); + } + })(); + + if(false) + for (var row = 0; row < header.rowCount; row++) { + var pin = header.at(column, row); + console.log("pin: ", pin); + + var tr = d.createElement("tr"); + table.appendChild(tr); + + var spacers = [], td; + for (var j = 0; j < (width - pin.functions.length); j++) { + td = document.createElement("td"); + spacers.push(td); + td = document.createElement("td"); + td.setAttribute("class", "connection"); + spacers.push(td); + } + + if (left) { + spacers.forEach(function (e) { + tr.appendChild(e); + }); + } + + for (var fi = left ? pin.functions.length - 1 : 0; fi >= 0 && fi < pin.functions.length; fi += left ? -1 : 1) { + var f = pin.functions[fi]; +// console.log("f:", fi, f); + var text = ''; + if (f.name) { + text = f.name; + if (f.remapped) { + text += " (r)"; + } + } + + td = d.createElement("td"); + var cls = ''; + if (f.group) { + cls += " group-" + f.group; + + var above = header.above(column, row); + var below = header.below(column, row); + console.log('f', f, 'above', above, 'below', below); + above = above && above.hasGroup(f.group); + below = below && below.hasGroup(f.group); + + if (!above && !below) { + cls += " group-single"; + } else if (!above && below) { + cls += " group-top"; + } else if (above && below) { + cls += " group-middle"; + } else if (above && !below) { + cls += " group-bottom"; + } + } else { + cls = " group-one"; + } + + if (f.remapped) { + cls += " group-remapped"; + } + + if (text.trim() != "") { + td.setAttribute("class", cls); + } + + td.appendChild(document.createTextNode(text)); + tr.appendChild(td); + td = document.createElement("td"); + td.setAttribute("class", "connection"); + tr.appendChild(td); + } + + if (!left) { + spacers.forEach(function (e) { + tr.appendChild(e); + }); + } + + // <tr> + // <td class="group-top group-tim2"> + // TIM2_CH1_ETR + // </td> + // <td class="connection"></td> + // <td class="group-top group-adc12"> + // ADC12_IN0 + // </td> + // <td class="connection"></td> + // <td class="group-top group-usart2"> + // USART2_CTS + // </td> + // <td class="connection"></td> + // <td class="group-one"> + // WKUP + // </td> + // <td class="connection"></td> + // <td class="group-one"> + // PA0 + // </td> + // </tr> + } + } + + function doOnLoad() { + console.log('j8', j8); + var items = document.getElementsByClassName("pinout"); + for (var i = 0; i < items.length; i++) { + var e = items[i]; + var classes = e.attributes.class.value.split(" "); + var generatePinout = false, header, side; + for (var j = 0; j < classes.length; j++) { + var c = classes[j]; + + if (c.match(/pinout/)) { + generatePinout = true; + } else if (c.match(/^header-([0-9]*)/)) { + header = c.replace(/^header-([0-9]*)/, "$1"); + } else if (c.match(/^side-/)) { + side = c.replace(/^side-(.*)/, "$1"); + } + } + + if (generatePinout) { + console.log('generating', header, side); + generate(e, header, side); + } + } + } + window.onload = doOnLoad; + </script> +</head> +<body> +<table border="1" class="container"> + <tr> + <td class="bottom-spacer" rowspan="2"> + </td> + <td> + <table class="pinout header-j8 side-left"></table> + </td> + <!-- + <td> + <table> + <tr> + <td> + + </td> + <td> + USART1_RX + </td> + <td> + + </td> + </tr> + <tr> + <td> + + </td> + <td> + + </td> + <td> + MCO + </td> + </tr> + <tr> + <td> + GND + </td> + <td> + PB10 + </td> + <td> + PB8 + </td> + </tr> + </table> + </td> + --> + <td class="top-spacer" rowspan="2"> + top space + </td> + </tr> + <tr> + <td> + <table class="pinout header-j8 side-right"></table> + </td> + </tr> + <tr> + <td colspan="3"> + <img src="module-horizontal.png"/> + </td> + </tr> + <tr> + <!-- + <td> + <table class="pinout header-j8 side-left"></table> + </td> + <td> + <table class="pinout header-j8 side-right"></table> + </td> + <td> + <table class="pinout header-j9 side-left"></table> + </td> + <td> + <table class="pinout header-j9 side-right"></table> + </td> + --> + </tr> + <!-- + <tr> + <td colspan="2" class="bottom-spacer"></td> + </tr> + --> + <tr> + </tr> +</table> + +</body> +</html> diff --git a/html/pinout.html b/html/pinout.html new file mode 100644 index 0000000..a9f17e0 --- /dev/null +++ b/html/pinout.html @@ -0,0 +1,682 @@ +<html> +<head> + <style type="text/css"> + table.pinout { + border-spacing: 0; + /*border-style: solid;*/ + + font-family: "Arial", "sans-serif"; + font-weight: bold; + } + + table.pinout td.group-tim2 { + background-color: indianred; + border-style: none; + } + + table.pinout td.group-adc12 { + background-color: deepskyblue; + border-style: none; + } + + table.pinout td.group-usart2 { + background-color: lawngreen; + border-style: none; + } + + table.pinout td.group-spi1 { + background-color: sandybrown; + border-style: none; + } + + table.pinout td { + white-space: nowrap; + } + + td.connection { + } + + table.pinout td { + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + .group-top { + border: 1px solid; + border-bottom-width: 0; + border-top-left-radius: 0.5rem; + border-top-right-radius: 0.5rem; + } + + .group-bottom { + border: 1px solid; + border-top-width: 0; + border-bottom-left-radius: 0.5rem; + border-bottom-right-radius: 0.5rem; + } + + .group-middle { + border-left: 1px solid; + border-right: 1px solid; + } + + .group-one { + border: 1px; + border-radius: 0.5rem; + + background-color: black; + color: white; + text-align: center; + } + + .group-single { + border: 1px; + border-radius: 0.5rem; + + text-align: center; + } + + .connection { + width: 3rem; + } + + </style> + <style type="text/css"> + table.container { + border-collapse: collapse; + } + + table.container td.top-spacer { + height: 190px; + /*border: 2px green;*/ + } + + table.container td.bottom-spacer { + height: 165px; + /*border: 2px green;*/ + + /* + text-align: center; + content: "spacer"; + */ + } + </style> + <script type="application/javascript"> + // group + function g(group, name, remapped) { + return { + group: group, + name: name, + remapped: !!remapped + }; + } + + // one + function o(name) { + return { + name: name + }; + } + + // empty + function e() { + return {}; + } + + function pin() { + var functions = []; + functions.push({name: arguments[0]}); + for (var i = 1; i < arguments.length; i++) { + functions.push(arguments[i]); + } + return new Pin(arguments[0], functions); + } + + /** + * @constructor + */ + function Pin(name, functions) { + function hasGroup(group) { + return functions.some(function (f) { + return f.group == group; + }); + } + + /** + * @lends Pin.prototype + */ + return { + name: name, + functions: functions, + hasGroup: hasGroup + }; + } + + /** + * @constructor + */ + function Header(columns, pins) { + var rows = pins.length / columns; + + function pinsOnColumn(column) { + var ps = []; + + for (var i = column; i < pins.length; i += columns) { + ps.push(pins[i]); + } + + return ps; + } + + /** + * @return {Pin} + */ + function at(column, row) { + return pins[row * columns + column]; + } + + /** + * @return {Pin} + */ + function above(column, row) { + return at(column, row - 1); + } + + /** + * @return {Pin} + */ + function below(column, row) { + return at(column, row + 1); + } + + function maxNumberOfFunctionsInColumn(column) { + var width = 0; + for (var i = column; i < pins.length; i += columns) { + width = Math.max(width, pins[i].functions.length); + } + + return width; + } + + /** + * @lends Header.prototype + */ + return { + at: at, + above: above, + below: below, + pinsOnColumn: pinsOnColumn, + maxNumberOfFunctionsInColumn: maxNumberOfFunctionsInColumn, + rowCount: rows + } + } + + var j8 = new Header(2, [ + pin("3V3"), + pin("3V3"), + pin("PA0", o("WKUP"), g("usart2", "USART2_CTS"), g("adc12", "ADC12_IN0"), g("tim2", "TIM2_CH1_ETR")), + pin("PA1", e(), g("usart2", "USART2_RTS"), g("adc12", "ADC12_IN1"), g("tim2", "TIM2_CH2")), + pin("PA2", e(), g("usart2", "USART2_TX"), g("adc12", "ADC12_IN2"), g("tim2", "TIM2_CH3")), + pin("PA3", e(), g("usart2", "USART2_RX"), g("adc12", "ADC12_IN3"), g("tim2", " TIM2_CH4")), + pin("PA4", g("spi1", "SPI1_NSS"), g("usart2", "USART2_CK"), g("adc12", "ADC12_IN4")), + pin("PA5", g("spi1", "SPI1_SCK"), e(), g("adc12", "ADC12_IN5")), + pin("PA6", g("spi1", "SPI1_MISO"), g("tim1", "TIM1_BKIN", true), g("adc12", "ADC12_IN6"), g("tim3", "TIM3_CH1")), + pin("PA7", g("spi1", "SPI1_MOSI"), g("tim1", "TIM1_CH1N", true), g("adc12", "ADC12_IN7"), g("tim3", "TIM3_CH2")), + pin("PB0", e(), g("tim1", "TIM1_CH2N", true), g("adc12", "ADC12_IN8"), g("tim3", "TIM3_CH3")), + pin("PB1", e(), g("tim1", "TIM1_CH3N", true), g("adc12", "ADC12_IN8"), g("tim3", "TIM3_CH3")), + pin("PB2", o("boot1")), + pin("PB10", e(), g("usart3", "USART3_TX"), g("i2c2", "I2C2_SCL"), g("tim2", "TIM2_CH3", true)), + pin("PB12", g("spi2", "SPI2_NSS"), g("usart3", "USART3_CK"), g("i2c2", "I2C2_SMBAl"), g("tim1", "TIM1_BKIN")), + pin("PB11", e(), g("usart3", "USART3_RX"), g("i2c2", "I2C2_SDA"), g("tim2", "TIM2_CH4", true)), + pin("PB14", g("spi2", "SPI2_MISO"), g("usart3", "USART3_RTS"), e(), g("tim1", "TIM1_CH2N")), + pin("PB13", g("spi2", "SPI2_SCK"), g("usart3", "USART3_CTS"), g("tim1", "TIM1_CH1N")), + pin("PB8", o("MCO"), g("usart1", "USART1_CK"), e(), g("tim1", "TIM1_CH1")), + pin("PB15", g("spi2", "SPI2_MOSI"), e(), g("tim1", "TIM1_CH3N")), + pin("PB10", e(), g("usart1", "USART1_RX"), e(), g("tim1", "TIM1_CH3")), + pin("PB9"), + pin("GND"), + pin("GND") + ]); + + var j9 = new Header(2, [ + pin("3V3"), + pin("3V3"), + pin("NRST"), + pin("PD1", g("can", "CANTX")), + pin("PD0", g("can", "CANRX")), + pin("PC15", o("OSC32_OUT")), + pin("PC14", o("OSC32_IN")), + pin("PC13", o("TAMPER-RTC")), + pin("Vbat"), + pin("PB9", g("tim4", "TIM4_CH4"), g("i2c1", "I2C1_SDA", true), g("can", "CANTX", true)), + pin("PB8", g("tim4", "TIM4_CH3"), g("i2c1", "I2C1_SCL", true), g("can", "CANRX", true)), + pin("BOOT0"), + pin("PB7", g("tim4", "TIM4_CH2"), g("i2c1", "I2C1_SDA"), g("usart1", "USART1_RX", true)), + pin("PB6", g("tim4", "TIM4_CH1"), g("i2c1", "I2C1_SCL"), g("usart1", "USART1_TX", true)), + pin("PB5", g("tim3", "TIM3_CH2", true), g("i2c1", "I2C1_SMBAl"), g("spi1", "SPI1_MOSI", true)), + pin("PB4", g("jtag", "JNTRST" /* default */), g("tim3", "TIM3_CH1", true), g("gpio", "PB4", true), g("spi1", "SPI1_MISO", true)), + pin("PB3", g("jtag", "JTDO" /* default */), g("tim2", "TIM2_CH2", true), g("gpio", "PB3", true), g("spi1", "SPI1_SCK", true), g("jtag", "TRACESWO", true)), + pin("PA15", g("jtag", "JTDI" /* default */), g("tim2", "TIM2_CH1_ETR", true), g("gpio", "PA15", true), g("spi1", "SPI1_NSS", true)), + pin("PA14", g("jtag", "JTCK/SWCLK" /* default */), e(), g("gpio", "PA14", true)), + pin("PA13", g("jtag", "JTMS/SWDIO" /* default */), e(), g("gpio", "PA13", true)), + pin("PA12", g("usb", "USBDP"), g("usart1", "USART1_RTS"), g("can", "CANTX"), g("tim1", "TIM1_ETR")), + pin("PA11", g("usb", "USBDM"), g("usart1", "USART1_CTS"), g("can", "CANRX"), g("tim1", "TIM1_CH4")), + pin("GND"), + pin("GND") + ]); + + var headers = { + j8: j8, + j9: j9 + }; + + /** + * @param {Element} table + */ + function generate(table, headerName, side) { + /** + * @type {Header} + */ + var header = headers[headerName]; + if (!header) { + return; + } + + var d = table.ownerDocument; + var left = side == "left"; + var column = left ? 0 : 1; + + var width = header.maxNumberOfFunctionsInColumn(column); + console.log('width', width); + + for (var row = 0; row < header.rowCount; row++) { + var pin = header.at(column, row); + console.log("pin: ", pin); + + var tr = d.createElement("tr"); + table.appendChild(tr); + + var spacers = [], td; + for (var j = 0; j < (width - pin.functions.length); j++) { + td = document.createElement("td"); + spacers.push(td); + td = document.createElement("td"); + td.setAttribute("class", "connection"); + spacers.push(td); + } + + if (left) { + spacers.forEach(function (e) { + tr.appendChild(e); + }); + } + + for (var fi = left ? pin.functions.length - 1 : 0; fi >= 0 && fi < pin.functions.length; fi += left ? -1 : 1) { + var f = pin.functions[fi]; +// console.log("f:", fi, f); + var text = ''; + if (f.name) { + text = f.name; + if (f.remapped) { + text += " (r)"; + } + } + + td = d.createElement("td"); + var cls = ''; + if (f.group) { + cls += " group-" + f.group; + + var above = header.above(column, row); + var below = header.below(column, row); + console.log('f', f, 'above', above, 'below', below); + above = above && above.hasGroup(f.group); + below = below && below.hasGroup(f.group); + + if (!above && !below) { + cls += " group-single"; + } else if (!above && below) { + cls += " group-top"; + } else if (above && below) { + cls += " group-middle"; + } else if (above && !below) { + cls += " group-bottom"; + } + } else { + cls = " group-one"; + } + + if (f.remapped) { + cls += " group-remapped"; + } + + if (text.trim() != "") { + td.setAttribute("class", cls); + } + + td.appendChild(document.createTextNode(text)); + tr.appendChild(td); + td = document.createElement("td"); + td.setAttribute("class", "connection"); + tr.appendChild(td); + } + + if (!left) { + spacers.forEach(function (e) { + tr.appendChild(e); + }); + } + + // <tr> + // <td class="group-top group-tim2"> + // TIM2_CH1_ETR + // </td> + // <td class="connection"></td> + // <td class="group-top group-adc12"> + // ADC12_IN0 + // </td> + // <td class="connection"></td> + // <td class="group-top group-usart2"> + // USART2_CTS + // </td> + // <td class="connection"></td> + // <td class="group-one"> + // WKUP + // </td> + // <td class="connection"></td> + // <td class="group-one"> + // PA0 + // </td> + // </tr> + } + } + + function doOnLoad() { + console.log('j8', j8); + var items = document.getElementsByClassName("pinout"); + for (var i = 0; i < items.length; i++) { + var e = items[i]; + var classes = e.attributes.class.value.split(" "); + var generatePinout = false, header, side; + for (var j = 0; j < classes.length; j++) { + var c = classes[j]; + + if (c.match(/pinout/)) { + generatePinout = true; + } else if (c.match(/^header-([0-9]*)/)) { + header = c.replace(/^header-([0-9]*)/, "$1"); + } else if (c.match(/^side-/)) { + side = c.replace(/^side-(.*)/, "$1"); + } + } + + if (generatePinout) { + console.log('generating', header, side); + generate(e, header, side); + } + } + } + window.onload = doOnLoad; + </script> +</head> +<body> +<table border="1" class="container"> + <tr> + <td colspan="2" class="top-spacer"> + </td> + <td rowspan="3"> + <img src="module.png"> + </td> + </tr> + <tr> + <td> + <table class="pinout header-j8 side-left"></table> + </td> + <td> + <table class="pinout header-j8 side-right"></table> + </td> + <td> + <table class="pinout header-j9 side-left"></table> + </td> + <td> + <table class="pinout header-j9 side-right"></table> + </td> + </tr> + <tr> + <td colspan="2" class="bottom-spacer"></td> + </tr> + <tr> + </tr> +</table> + +<!-- +<table class="pinout"> + <tr> + <td colspan="8" class="connection"></td> + <td class="group-one"> + 3.3V + </td> + </tr> + + <tr> + <td class="group-top group-tim2"> + TIM2_CH1_ETR + </td> + <td class="connection"></td> + <td class="group-top group-adc12"> + ADC12_IN0 + </td> + <td class="connection"></td> + <td class="group-top group-usart2"> + USART2_CTS + </td> + <td class="connection"></td> + <td class="group-one"> + WKUP + </td> + <td class="connection"></td> + <td class="group-one"> + PA0 + </td> + </tr> + + <tr> + <td class="group-bottom group-tim2"> + TIM2_CH3 + </td> + <td class="connection"></td> + <td class="group-middle group-adc12"> + ADC12_IN2 + </td> + <td class="connection"></td> + <td class="group-middle group-usart2"> + USART2_TX + </td> + <td class="connection"></td> + <td> + + </td> + <td class="connection"></td> + <td class="group-one"> + PA2 + </td> + </tr> + + <tr> + <td class=""> + </td> + <td class="connection"></td> + <td class="group-middle group-adc12"> + ADC12_IN4 + </td> + <td class="connection"></td> + <td class="group-bottom group-usart2"> + USART2_CK + </td> + <td class="connection"></td> + <td class="group-top group-spi1"> + SPI1_NSS + </td> + <td class="connection"></td> + <td class="group-one"> + PA4 + </td> + </tr> + + <tr> + <td class="group-top"> + TIM3_CH1 + </td> + <td class="connection"></td> + <td class="group-middle group-adc12"> + ADC12_IN6 + </td> + <td class="connection" colspan="3"></td> + <td class="group-bottom group-spi1"> + SPI1_MISO + <td class="connection"></td> + <td class="group-one"> + PA6 + </td> + </tr> + + <!– ---------------------------------- –> + + <tr> + <td class="group-bottom"> + TIM3_CH3 + </td> + <td class="connection"></td> + <td class="group-bottom group-adc12"> + ADC12_IN8 + </td> + <td class="connection"></td> + <td> + + </td> + <td class="connection"></td> + <td> + TIM1_CH2N (r) + </td> + <td class="connection"></td> + <td class="group-one"> + PB0 + </td> + </tr> + <tr> + <td class="connection" colspan="6"></td> + <td class=""> + BOOT1 + </td> + <td class="connection"></td> + <td class="group-one"> + PB2 + </td> + </tr> + <tr> + <td class="group-top group-tim1"> + TIM1_BKIN + </td> + <td class="connection"></td> + <td class="group-i2c2"> + I2C2_SMBAl + </td> + <td class="connection"></td> + <td class="group-top group-usart3"> + USART3_CK + </td> + <td class="connection"></td> + <td class="group-top group-spi2"> + SPI2_NSS + </td> + <td class="connection"></td> + <td class="group-one"> + PB12 + </td> + </tr> + <tr> + <td class="group-middle group-tim1"> + TIM1_CH2N + </td> + <td class="connection" colspan="3"></td> + <td class="group-bottom"> + USART3_RTS + </td> + <td class="connection"></td> + <td class="group-bottom"> + SPI2_MISO + </td> + <td class="connection"></td> + <td class="group-one"> + PB14 + </td> + </tr> + <tr> + <td class="group-middle group-tim1"> + TIM1_CH1 + </td> + <td class="connection"></td> + <td class=""> + + </td> + <td class="connection"></td> + <td class="group-top group-usart1"> + USART1_CK + </td> + <td class="connection"></td> + <td class=""> + MCO + </td> + <td class="connection"></td> + <td class="group-one"> + PA8 + </td> + </tr> + <tr> + <td class="group-bottom group-tim1"> + TIM1_CH3 + </td> + <td class="connection"></td> + <td class=""> + + </td> + <td class="connection"></td> + <td class="group-bottom group-usart1"> + USART1_RX + </td> + <td class="connection"></td> + <td class=""> + + </td> + <td class="connection"></td> + <td class="group-one"> + PA10 + </td> + </tr> + <tr> + <td class="connection" colspan="8"></td> + <td class="group-one"> + GND + </td> + </tr> + + <!– + <tr> + <td> + + </td> + <td> + + </td> + <td> + + </td> + <td> + + </td> + </tr> + –> +</table> +--> +</body> +</html> diff --git a/html/tables.html b/html/tables.html new file mode 100644 index 0000000..f005ef7 --- /dev/null +++ b/html/tables.html @@ -0,0 +1,80 @@ +<html> +<head> + <style type="text/css"> + #table2 { + /*border: 1px solid red;*/ + /* + border-spacing: 10px; + */ + /*border-collapse: collapse;*/ + } + + #table2 tr { + border: 1px solid blue; + } + + #table2 td.t { + border: 1px inset green; + border-top-left-radius: 5px; + /*border-top-right-radius: 5px;*/ + /*border-bottom: hidden;*/ + } + +/* + #table2 td.m { + border: 1px solid green; + border-top: hidden; + border-bottom: hidden; + } +*/ + </style> + <style type="text/css"> + #table1 { + border: 1px solid red; + border-spacing: 10px; + } + + #table1 tr { + border: 1px solid blue; + } + + #table1 td { + border: 1px solid green; + border-radius: 5px; + } + </style> +</head> +<body> +<h4>Table 1</h4> +<table id=table2> + <tr> + <td class="t">1.1</td> + </tr> + <tr> + <td class="m">2.1</td> + </tr> + <tr> + <td class="b">3.1</td> + </tr> +</table> +<hr> +<table id=table1> + <tr> + <td>1.1</td> + <td>1.2</td> + <td>1.3</td> + </tr> + <tr> + <td>2.1</td> + <td>2.2</td> + <td>2.3</td> + </tr> + <tr> + <td>3.1</td> + <td>3.2</td> + <td>3.3</td> + </tr> +</table> +<hr> +</body> +</html> |