rusefi
/
rusefi-full
mirror of https://github.com/rusefi/rusefi-full.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Hide empty pinout columns (#2783) 

* hide empty rows

* refactor

* fix generation error

* show all if not empty

* remove old code
This commit is contained in:
David Holdeman 2021-05-31 09:37:01 -05:00 committed by GitHub
parent baa529e9dd
commit 21264f9cf2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 46 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
misc/pinout-gen/gen.sh
View File

@ -1,5 +1,5 @@
#!/usr/bin/env bash
DIR=$(cd -P -- "$(dirname -- "$0")" && pwd -P)"/"
TEXT=$(sed -e "/###CSS###/{r ${DIR}style.css" -e 'd}' -e "/###JS###/{r ${DIR}script.js" -e 'd}' ${DIR}pinout.html | sed -e "s/\/\/\/DATA\/\/\//`$(echo ${1//\//\\/} | tr -d '\n')`,\n\/\/\/DATA\/\/\//")
TEXT=$(sed -e "/###CSS###/{r ${DIR}style.css" -e 'd}' -e "/###JS###/{r ${DIR}script.js" -e 'd}' ${DIR}pinout.html | sed -e "s/\/\/\/DATA\/\/\//\`$(echo ${1//\//\\/} | tr -d '\n')\`,\n\/\/\/DATA\/\/\//")
echo "$TEXT" > $2

31
misc/pinout-gen/pinout.html
View File

@ -6,7 +6,6 @@
###CSS###
</style>
<script type="text/javascript" src="yaml.min.js"></script>
<script type="text/javascript">
###JS###
</script>
@ -19,11 +18,11 @@
<template id="table-template">
<tr class="data">
<td class="pin-data"></td>
<td class="ts-data"></td>
<td class="type-data"></td>
<td class="function-data"></td>
<td class="color-data"></td>
<td class="pin-data" data-field="pin"></td>
<td class="ts-data" data-field="ts_name"></td>
<td class="type-data" data-field="type"</td>
<td class="function-data" data-field="function"></td>
<td class="color-data" data-field="color"></td>
</tr>
</template>
@ -37,11 +36,11 @@
<table class="info-table">
<thead>
<tr>
<th class="pin-header">Pin Number</th>
<th class="ts-header">TS Name</th>
<th class="type-header">Type</th>
<th class="function-header">Typical Function</th>
<th class="color-header">Pigtail Color</th>
<th class="pin-header" data-field="pin">Pin Number</th>
<th class="ts-header" data-field="ts_name">TS Name</th>
<th class="type-header" data-field="type">Type</th>
<th class="function-header" data-field="function">Typical Function</th>
<th class="color-header" data-field="color">Pigtail Color</th>
</tr>
</thead>
<tbody>
@ -52,11 +51,11 @@
<table class="pinout-table">
<thead>
<tr>
<th class="pin-header">Pin Number</th>
<th class="ts-header">TS Name</th>
<th class="type-header">Type</th>
<th class="function-header">Typical Function</th>
<th class="color-header">Pigtail Color</th>
<th class="pin-header" data-field="pin">Pin Number</th>
<th class="ts-header" data-field="ts_name">TS Name</th>
<th class="type-header" data-field="type">Type</th>
<th class="function-header" data-field="function">Typical Function</th>
<th class="color-header" data-field="color">Pigtail Color</th>
</tr>
</thead>
<tbody>

42
misc/pinout-gen/script.js
View File

@ -2,21 +2,38 @@ var connectorData = [
///DATA///
];
function hideEmptyColumns(table) {
var rows = table.querySelector('tbody').children;
var tableHead = table.querySelector("thead>tr")
var cols = tableHead.children
for (var i = 0; i < cols.length; i++) {
var empty = true;
for (var ii = 0; ii < rows.length; ii++) {
empty = rows[ii].children[i].textContent.length > 0 ? false : empty;
}
if (empty) {
tableHead.querySelectorAll('th')[i].style.display = 'none';
for (var ii = 0; ii < rows.length; ii++) {
rows[ii].children[i].style.display = 'none';
}
} else {
tableHead.querySelectorAll('th')[i].style.display = '';
for (var ii = 0; ii < rows.length; ii++) {
rows[ii].children[i].style.display = '';
}
}
}
}
function addRow(table, pin, pdiv) {
var template = document.getElementById("table-template");
var clone = template.content.cloneNode(true);
var row = clone.querySelector(".data");
var pdata = clone.querySelector(".pin-data");
var idata = clone.querySelector(".ts-data");
var tdata = clone.querySelector(".type-data");
var fdata = clone.querySelector(".function-data");
var cdata = clone.querySelector(".color-data");
pdata.textContent = pin.pin;
pdata.dataset.type = pin.type;
idata.textContent = pin.ts_name;
tdata.textContent = pin.type
fdata.textContent = pin.function;
cdata.textContent = pin.color
var cells = row.children;
for (var i = 0; i < cells.length; i++) {
var cell = cells[i];
cell.textContent = pin[cell.dataset.field];
}
if (pdiv) {
row.addEventListener('click', function(table, pin, pdiv) {
clickPin(table.parentElement.parentElement.parentElement.querySelector(".info-table tbody"), pin, pdiv);
@ -25,7 +42,6 @@ function addRow(table, pin, pdiv) {
}
table.appendChild(clone);
}
function clickPin(table, pin, pdiv) {
table.parentElement.style.display = "table";
table.innerHTML = "";
@ -40,6 +56,7 @@ function clickPin(table, pin, pdiv) {
pins[i].classList.remove("selected");
}
pdiv.classList.add("selected");
hideEmptyColumns(table.parentElement);
}
window.addEventListener('load', function() {
@ -109,6 +126,7 @@ window.addEventListener('load', function() {
cdiv.appendChild(pdiv);
addRow(fullTable, connector.pins[i], pdiv);
}
hideEmptyColumns(sdiv.querySelector('.pinout-table'));
}.bind(null, connector, sdiv, img));
img.src = connector.info.image.file;
}