1153 lines
17 KiB
HTML
1153 lines
17 KiB
HTML
<html>
|
|
<head>
|
|
|
|
<style>
|
|
.pin-marker {
|
|
position: absolute;
|
|
z-index: 1;
|
|
border-radius: 50%;
|
|
background-color: white;
|
|
border: 2px blue solid;
|
|
cursor: pointer;
|
|
color: black;
|
|
text-align: center;
|
|
line-height: 200%;
|
|
}
|
|
|
|
.pin-marker:hover {
|
|
background-color: #f15a24;
|
|
color: white;
|
|
transform: scale(2);
|
|
z-index: 2;
|
|
}
|
|
|
|
.pin-marker.highlight {
|
|
border: 2px #f15a24 solid;
|
|
}
|
|
|
|
.pin-marker.selected {
|
|
background-color: #fc935a;
|
|
}
|
|
|
|
#connector-container {
|
|
width: 100%;
|
|
height: 50%;
|
|
overflow-x: scroll;
|
|
position: relative;
|
|
}
|
|
|
|
#connector-div {
|
|
height: 100%;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
|
|
#connector-img {
|
|
height: 100%;
|
|
z-index: 0;
|
|
}
|
|
|
|
table {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
border-collapse: collapse;
|
|
width: clamp(100%, 100%, 1000px);
|
|
text-align: left;
|
|
}
|
|
|
|
@media (min-width: 1000px) {
|
|
table {
|
|
font-size: 1rem;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1000px) {
|
|
table {
|
|
font-size: 3rem;
|
|
}
|
|
}
|
|
|
|
table tbody tr {
|
|
cursor: pointer;
|
|
}
|
|
|
|
table td, table th {
|
|
border: 1px solid black;
|
|
padding: 8px;
|
|
}
|
|
|
|
table tr:nth-child(even){
|
|
background-color: #fc935a;
|
|
}
|
|
|
|
table tr:hover {
|
|
background-color: #f15a24;
|
|
}
|
|
|
|
table th {
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
text-align: left;
|
|
background-color: #f15a24;
|
|
color: black;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
html {
|
|
background-color: black;
|
|
color: white;
|
|
}
|
|
|
|
table td, table th {
|
|
border: 1px solid #ddd;
|
|
}
|
|
|
|
table th {
|
|
color: white
|
|
}
|
|
|
|
table tr:nth-child(even){
|
|
background-color: #230c00;
|
|
color: white;
|
|
}
|
|
|
|
table tr:hover {
|
|
background-color: #f15a24;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
|
|
<script type="text/javascript" src="yaml.min.js"></script>
|
|
<script type="text/javascript">
|
|
var connectorYaml = `
|
|
pins:
|
|
- pin: A1
|
|
function: NC
|
|
|
|
- pin: A2
|
|
function: ECU power supply from ignition key
|
|
type: 12v
|
|
|
|
- pin: A3
|
|
function: power GND
|
|
type: gnd
|
|
|
|
- pin: A4
|
|
function: NC
|
|
|
|
- pin: A5
|
|
function: NC
|
|
|
|
- pin: A6
|
|
function: low side control, unknown current probably low?
|
|
type: ls
|
|
|
|
- pin: A7
|
|
function: power GND
|
|
type: gnd
|
|
|
|
- pin: A8
|
|
function: power GND
|
|
type: gnd
|
|
|
|
- pin: B1
|
|
function: NC
|
|
|
|
- pin: B2
|
|
function: NC
|
|
|
|
- pin: B3
|
|
function: NC
|
|
|
|
- pin: B4
|
|
function: 12V Constant
|
|
type: 12v
|
|
|
|
- pin: C1
|
|
function: NC
|
|
|
|
- pin: C2
|
|
function: NC
|
|
|
|
- pin: C3
|
|
function: NC
|
|
|
|
- pin: C4
|
|
function: NC
|
|
|
|
- pin: C5
|
|
function: NC
|
|
|
|
- pin: C6
|
|
function: NC
|
|
|
|
- pin: C7
|
|
function: NC
|
|
|
|
- pin: C8
|
|
function: NC
|
|
|
|
- pin: C9
|
|
function: NC
|
|
|
|
- pin: C10
|
|
function: NC
|
|
|
|
- pin: C11
|
|
function: NC
|
|
|
|
- pin: C12
|
|
function: NC
|
|
|
|
- pin: C13
|
|
function: NC
|
|
|
|
- pin: C14
|
|
function: NC
|
|
|
|
- pin: C15
|
|
function: NC
|
|
|
|
- pin: C16
|
|
function: NC
|
|
|
|
- pin: C17
|
|
function: NC
|
|
|
|
- pin: C18
|
|
function: NC
|
|
|
|
- pin: C19
|
|
function: NC
|
|
|
|
- pin: C20
|
|
function: NC
|
|
|
|
- pin: C21
|
|
function: low side solenoid control
|
|
type: ls
|
|
|
|
- pin: C22
|
|
function: sensor +5v feed
|
|
type: 5v
|
|
|
|
- pin: C23
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: C24
|
|
function: PPS1 analog input
|
|
type: av
|
|
|
|
- pin: C25
|
|
function: PPS2 analog input
|
|
type: av
|
|
|
|
- pin: C26
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: C27
|
|
function: sensor +5v feed
|
|
type: 5v
|
|
|
|
- pin: C28
|
|
function: NC
|
|
|
|
- pin: C29
|
|
function: low side relay control
|
|
type: ls
|
|
|
|
- pin: C30
|
|
function: NC
|
|
|
|
- pin: C31
|
|
function: NC
|
|
|
|
- pin: C32
|
|
function: NC
|
|
|
|
- pin: C33
|
|
function: NC
|
|
|
|
- pin: C34
|
|
function: NC
|
|
|
|
- pin: C35
|
|
function: proto via
|
|
|
|
- pin: C36
|
|
function: NC
|
|
|
|
- pin: C37
|
|
function: NC
|
|
|
|
- pin: C38
|
|
function: proto via
|
|
|
|
- pin: C39
|
|
function: NC K line
|
|
|
|
- pin: C40
|
|
function: proto via
|
|
|
|
- pin: D1
|
|
function: NC
|
|
|
|
- pin: D2
|
|
function: proto via
|
|
|
|
- pin: D3
|
|
function: proto via
|
|
|
|
- pin: D4
|
|
function: NC
|
|
|
|
- pin: D5
|
|
function: NC
|
|
|
|
- pin: D6
|
|
function: NC
|
|
|
|
- pin: D7
|
|
function: NC
|
|
|
|
- pin: D8
|
|
function: analog input WBO
|
|
type: av
|
|
|
|
- pin: D9
|
|
function: analog input WBO
|
|
type: av
|
|
|
|
- pin: D10
|
|
function: NC
|
|
|
|
- pin: D11
|
|
function: CAN_H
|
|
type: can
|
|
|
|
- pin: D12
|
|
function: CAN_L
|
|
type: can
|
|
|
|
- pin: D13
|
|
function: NC
|
|
|
|
- pin: D14
|
|
function: proto via
|
|
|
|
- pin: D15
|
|
function: NC
|
|
|
|
- pin: D16
|
|
function: NC
|
|
|
|
- pin: D17
|
|
function: NC
|
|
|
|
- pin: D18
|
|
function: NC
|
|
|
|
- pin: D19
|
|
function: proto via
|
|
|
|
- pin: D20
|
|
function: proto via
|
|
|
|
- pin: D21
|
|
function: proto via
|
|
|
|
- pin: D22
|
|
function: proto via
|
|
|
|
- pin: D23
|
|
function: proto via
|
|
|
|
- pin: D24
|
|
function: proto via
|
|
|
|
- pin: E1
|
|
function: injector output 1
|
|
type: inj
|
|
|
|
- pin: E2
|
|
function: injector output 2
|
|
type: inj
|
|
|
|
- pin: E3
|
|
function: injector output 3
|
|
type: inj
|
|
|
|
- pin: E4
|
|
function: "230: 1.5A low side VVT solenoid / 430 injector output 4"
|
|
type: inj
|
|
|
|
- pin: E5
|
|
function: NC
|
|
|
|
- pin: E6
|
|
function: NC
|
|
|
|
- pin: E7
|
|
function: NC
|
|
|
|
- pin: E8
|
|
function: NC
|
|
|
|
- pin: E9
|
|
function: NC
|
|
|
|
- pin: E10
|
|
function: NC
|
|
|
|
- pin: E11
|
|
function: NC
|
|
|
|
- pin: E12
|
|
function: NC
|
|
|
|
- pin: E13
|
|
function: injector output 5
|
|
type: inj
|
|
|
|
- pin: E14
|
|
function: injector output 6
|
|
type: inj
|
|
|
|
- pin: E15
|
|
function: proto via
|
|
|
|
- pin: E16
|
|
function: proto via
|
|
|
|
- pin: E17
|
|
function: proto via
|
|
|
|
- pin: E18
|
|
function: NC
|
|
|
|
- pin: E19
|
|
function: NC
|
|
|
|
- pin: E20
|
|
function: NC
|
|
|
|
- pin: E21
|
|
function: NC
|
|
|
|
- pin: E22
|
|
function: sensor +5v feed
|
|
type: 5v
|
|
|
|
- pin: E23
|
|
function: analog input MAP
|
|
type: av
|
|
|
|
- pin: E24
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: E25
|
|
function: injector output 7
|
|
type: inj
|
|
|
|
- pin: E26
|
|
function: injector output 8
|
|
type: inj
|
|
|
|
- pin: E27
|
|
function: NC
|
|
|
|
- pin: E28
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: E29
|
|
function: analog input CLT
|
|
type: av
|
|
|
|
- pin: E30
|
|
function: NC
|
|
|
|
- pin: E31
|
|
function: analog input TPS1
|
|
type: av
|
|
|
|
- pin: E32
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: E33
|
|
function: sensor +5v feed
|
|
type: 5v
|
|
|
|
- pin: E34
|
|
function: analog input TPS2
|
|
type: av
|
|
|
|
- pin: E35
|
|
function: NC
|
|
|
|
- pin: E36
|
|
function: NC
|
|
|
|
- pin: E37
|
|
function: VR-
|
|
type: vr
|
|
|
|
- pin: E38
|
|
function: VR+
|
|
type: vr
|
|
|
|
- pin: E39
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: E40
|
|
function: digital input CAM input
|
|
|
|
- pin: E41
|
|
function: knock sensor GND
|
|
|
|
- pin: E42
|
|
function: knock sensor signal
|
|
|
|
- pin: E43
|
|
function: NC
|
|
|
|
- pin: E44
|
|
function: NC
|
|
|
|
- pin: E45
|
|
function: analog input IAT
|
|
type: av
|
|
|
|
- pin: E46
|
|
function: sensor +5v feed
|
|
type: 5v
|
|
|
|
- pin: E47
|
|
function: analog input + proto via
|
|
type: av
|
|
|
|
- pin: E48
|
|
function: analog GND
|
|
type: gnd
|
|
|
|
- pin: F1
|
|
function: DC Motor -
|
|
|
|
- pin: F2
|
|
function: DC Motor +
|
|
|
|
- pin: F3
|
|
function: NC
|
|
|
|
- pin: F4
|
|
function: igniter
|
|
|
|
- pin: F5
|
|
function: igniter
|
|
|
|
- pin: F6
|
|
function: igniter
|
|
|
|
- pin: F7
|
|
function: igniter
|
|
|
|
- pin: F8
|
|
function: power GND
|
|
type: gnd
|
|
|
|
- pin: F9
|
|
function: igniter
|
|
|
|
- pin: F10
|
|
function: igniter
|
|
|
|
- pin: F11
|
|
function: igniter
|
|
|
|
- pin: F12
|
|
function: igniter
|
|
|
|
- pin: F13
|
|
function: igniter
|
|
|
|
- pin: F14
|
|
function: igniter
|
|
|
|
- pin: F15
|
|
function: power GND
|
|
type: gnd
|
|
|
|
- pin: F16
|
|
function: igniter
|
|
|
|
- pin: F17
|
|
function: igniter
|
|
|
|
- pin: F18
|
|
function: igniter
|
|
|
|
- pin: F19
|
|
function: igniter
|
|
|
|
- pin: F20
|
|
function: igniter
|
|
|
|
- pin: F21
|
|
function: igniter
|
|
|
|
info:
|
|
image:
|
|
file: main.jpg
|
|
pins:
|
|
- pin: A1
|
|
x: 293
|
|
y: 657
|
|
- pin: A2
|
|
x: 454
|
|
y: 657
|
|
- pin: A3
|
|
x: 615
|
|
y: 657
|
|
- pin: A4
|
|
x: 776
|
|
y: 657
|
|
- pin: A5
|
|
x: 293
|
|
y: 520
|
|
- pin: A6
|
|
x: 454
|
|
y: 520
|
|
- pin: A7
|
|
x: 615
|
|
y: 520
|
|
- pin: A8
|
|
x: 776
|
|
y: 520
|
|
- pin: B1
|
|
x: 293
|
|
y: 257
|
|
- pin: B2
|
|
x: 454
|
|
y: 257
|
|
- pin: B3
|
|
x: 615
|
|
y: 257
|
|
- pin: B4
|
|
x: 776
|
|
y: 257
|
|
- pin: C11
|
|
x: 1021
|
|
y: 572
|
|
- pin: C12
|
|
x: 1086
|
|
y: 572
|
|
- pin: C13
|
|
x: 1152
|
|
y: 572
|
|
- pin: C21
|
|
x: 1021
|
|
y: 342
|
|
- pin: C22
|
|
x: 1086
|
|
y: 342
|
|
- pin: C23
|
|
x: 1151
|
|
y: 342
|
|
- pin: C24
|
|
x: 1216
|
|
y: 342
|
|
- pin: C25
|
|
x: 1281
|
|
y: 342
|
|
- pin: C26
|
|
x: 1346
|
|
y: 342
|
|
- pin: C27
|
|
x: 1411
|
|
y: 342
|
|
- pin: C28
|
|
x: 1476
|
|
y: 342
|
|
- pin: C29
|
|
x: 1541
|
|
y: 342
|
|
- pin: C30
|
|
x: 1606
|
|
y: 342
|
|
- pin: C31
|
|
x: 1021
|
|
y: 265
|
|
- pin: C32
|
|
x: 1086
|
|
y: 265
|
|
- pin: C33
|
|
x: 1151
|
|
y: 265
|
|
- pin: C34
|
|
x: 1216
|
|
y: 265
|
|
- pin: C35
|
|
x: 1281
|
|
y: 265
|
|
- pin: C36
|
|
x: 1346
|
|
y: 265
|
|
- pin: C37
|
|
x: 1411
|
|
y: 265
|
|
- pin: C38
|
|
x: 1476
|
|
y: 265
|
|
- pin: C39
|
|
x: 1541
|
|
y: 265
|
|
- pin: C40
|
|
x: 1606
|
|
y: 265
|
|
- pin: D1
|
|
x: 1794
|
|
y: 647
|
|
- pin: D2
|
|
x: 1859
|
|
y: 647
|
|
- pin: D3
|
|
x: 1924
|
|
y: 647
|
|
- pin: D4
|
|
x: 1989
|
|
y: 647
|
|
- pin: D5
|
|
x: 2054
|
|
y: 647
|
|
- pin: D6
|
|
x: 2119
|
|
y: 647
|
|
- pin: D7
|
|
x: 1794
|
|
y: 572
|
|
- pin: D8
|
|
x: 1859
|
|
y: 572
|
|
- pin: D9
|
|
x: 1924
|
|
y: 572
|
|
- pin: D10
|
|
x: 1989
|
|
y: 572
|
|
- pin: D11
|
|
x: 2054
|
|
y: 572
|
|
- pin: D12
|
|
x: 2119
|
|
y: 572
|
|
- pin: D13
|
|
x: 1794
|
|
y: 342
|
|
- pin: D14
|
|
x: 1859
|
|
y: 342
|
|
- pin: D15
|
|
x: 1924
|
|
y: 342
|
|
- pin: D16
|
|
x: 1989
|
|
y: 342
|
|
- pin: D17
|
|
x: 2054
|
|
y: 342
|
|
- pin: D18
|
|
x: 2119
|
|
y: 342
|
|
- pin: D19
|
|
x: 1794
|
|
y: 265
|
|
- pin: D20
|
|
x: 1859
|
|
y: 265
|
|
- pin: D21
|
|
x: 1924
|
|
y: 265
|
|
- pin: D22
|
|
x: 1989
|
|
y: 265
|
|
- pin: D23
|
|
x: 2054
|
|
y: 265
|
|
- pin: D24
|
|
x: 2119
|
|
y: 265
|
|
- pin: E1
|
|
x: 2307
|
|
y: 647
|
|
- pin: E2
|
|
x: 2372
|
|
y: 647
|
|
- pin: E3
|
|
x: 2437
|
|
y: 647
|
|
- pin: E4
|
|
x: 2502
|
|
y: 647
|
|
- pin: E5
|
|
x: 2567
|
|
y: 647
|
|
- pin: E6
|
|
x: 2632
|
|
y: 647
|
|
- pin: E7
|
|
x: 2697
|
|
y: 647
|
|
- pin: E8
|
|
x: 2762
|
|
y: 647
|
|
- pin: E9
|
|
x: 2827
|
|
y: 647
|
|
- pin: E10
|
|
x: 2892
|
|
y: 647
|
|
- pin: E11
|
|
x: 2957
|
|
y: 647
|
|
- pin: E12
|
|
x: 3022
|
|
y: 647
|
|
- pin: E13
|
|
x: 2307
|
|
y: 572
|
|
- pin: E14
|
|
x: 2372
|
|
y: 572
|
|
- pin: E15
|
|
x: 2437
|
|
y: 572
|
|
- pin: E16
|
|
x: 2502
|
|
y: 572
|
|
- pin: E17
|
|
x: 2567
|
|
y: 572
|
|
- pin: E18
|
|
x: 2632
|
|
y: 572
|
|
- pin: E19
|
|
x: 2697
|
|
y: 572
|
|
- pin: E20
|
|
x: 2762
|
|
y: 572
|
|
- pin: E21
|
|
x: 2827
|
|
y: 572
|
|
- pin: E22
|
|
x: 2892
|
|
y: 572
|
|
- pin: E23
|
|
x: 2957
|
|
y: 572
|
|
- pin: E24
|
|
x: 3022
|
|
y: 572
|
|
- pin: E25
|
|
x: 2307
|
|
y: 342
|
|
- pin: E26
|
|
x: 2372
|
|
y: 342
|
|
- pin: E27
|
|
x: 2437
|
|
y: 342
|
|
- pin: E28
|
|
x: 2502
|
|
y: 342
|
|
- pin: E29
|
|
x: 2567
|
|
y: 342
|
|
- pin: E30
|
|
x: 2632
|
|
y: 342
|
|
- pin: E31
|
|
x: 2697
|
|
y: 342
|
|
- pin: E32
|
|
x: 2762
|
|
y: 342
|
|
- pin: E33
|
|
x: 2827
|
|
y: 342
|
|
- pin: E34
|
|
x: 2892
|
|
y: 342
|
|
- pin: E35
|
|
x: 2957
|
|
y: 342
|
|
- pin: E36
|
|
x: 3022
|
|
y: 342
|
|
- pin: E37
|
|
x: 2307
|
|
y: 265
|
|
- pin: E38
|
|
x: 2372
|
|
y: 265
|
|
- pin: E39
|
|
x: 2437
|
|
y: 265
|
|
- pin: E40
|
|
x: 2502
|
|
y: 265
|
|
- pin: E41
|
|
x: 2567
|
|
y: 265
|
|
- pin: E42
|
|
x: 2632
|
|
y: 265
|
|
- pin: E43
|
|
x: 2697
|
|
y: 265
|
|
- pin: E44
|
|
x: 2762
|
|
y: 265
|
|
- pin: E45
|
|
x: 2827
|
|
y: 265
|
|
- pin: E46
|
|
x: 2892
|
|
y: 265
|
|
- pin: E47
|
|
x: 2957
|
|
y: 265
|
|
- pin: E48
|
|
x: 3022
|
|
y: 265
|
|
- pin: F1
|
|
x: 3275
|
|
y: 657
|
|
- pin: F2
|
|
x: 3405
|
|
y: 657
|
|
- pin: F3
|
|
x: 3535
|
|
y: 657
|
|
- pin: F4
|
|
x: 3665
|
|
y: 657
|
|
- pin: F5
|
|
x: 3795
|
|
y: 657
|
|
- pin: F6
|
|
x: 3925
|
|
y: 657
|
|
- pin: F7
|
|
x: 4055
|
|
y: 657
|
|
- pin: F8
|
|
x: 3275
|
|
y: 515
|
|
- pin: F9
|
|
x: 3405
|
|
y: 515
|
|
- pin: F10
|
|
x: 3535
|
|
y: 515
|
|
- pin: F11
|
|
x: 3665
|
|
y: 515
|
|
- pin: F12
|
|
x: 3795
|
|
y: 515
|
|
- pin: F13
|
|
x: 3925
|
|
y: 515
|
|
- pin: F14
|
|
x: 4055
|
|
y: 515
|
|
- pin: F15
|
|
x: 3275
|
|
y: 320
|
|
- pin: F16
|
|
x: 3405
|
|
y: 320
|
|
- pin: F17
|
|
x: 3535
|
|
y: 320
|
|
- pin: F18
|
|
x: 3665
|
|
y: 320
|
|
- pin: F19
|
|
x: 3795
|
|
y: 320
|
|
- pin: F20
|
|
x: 3925
|
|
y: 320
|
|
- pin: F21
|
|
x: 4055
|
|
y: 320
|
|
`;
|
|
|
|
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(".id-data");
|
|
var tdata = clone.querySelector(".type-data");
|
|
var fdata = clone.querySelector(".function-data");
|
|
var cdata = clone.querySelector(".color-data");
|
|
pdata.textContent = pin.pin;
|
|
idata.textContent = pin.id;
|
|
tdata.textContent = pin.type
|
|
fdata.textContent = pin.function;
|
|
cdata.textContent = pin.color
|
|
row.addEventListener('click', function(pin, pdiv) {
|
|
clickPin(pin, pdiv);
|
|
}.bind(null, pin, pdiv));
|
|
table.appendChild(clone);
|
|
}
|
|
|
|
function clickPin(pin, pdiv) {
|
|
var table = document.getElementById("info-table").querySelector("tbody");
|
|
table.innerHTML = "";
|
|
if (Array.isArray(pin.id)) {
|
|
var pinIds = pin.id.filter((value, index) => {
|
|
return pin.id.indexOf(value) === index;
|
|
});
|
|
for (var i = 0; i < pinIds.length; i++) {
|
|
addRow(table, {pin: pin.pin, id: pinIds[i], function: pin.function}, pdiv);
|
|
}
|
|
} else {
|
|
addRow(table, pin, pdiv);
|
|
}
|
|
var pins = document.querySelectorAll(".pin-marker");
|
|
for (var i = 0; i < pins.length; i++) {
|
|
if (pins[i].dataset.type == pin.type) {
|
|
pins[i].classList.add("highlight");
|
|
} else {
|
|
pins[i].classList.remove("highlight");
|
|
}
|
|
pins[i].classList.remove("selected");
|
|
}
|
|
pdiv.classList.add("selected");
|
|
}
|
|
|
|
function adjustMarkers() {
|
|
var cdiv = document.getElementById("connector-div");
|
|
cdiv.style.width = document.getElementById("connector-img").clientWidth;
|
|
var pins = document.querySelectorAll(".pin-marker");
|
|
for (var i = 0; i < pins.length; i++) {
|
|
var height = cdiv.clientHeight * 0.05;
|
|
pins[i].style.height = height + "px";
|
|
pins[i].style.width = height + "px";
|
|
pins[i].style.marginTop = "-" + (height * 0.5) + "px";
|
|
pins[i].style.marginLeft = "-" + (height * 0.5) + "px";
|
|
pins[i].style.fontSize = (height * 0.5) + "px";
|
|
}
|
|
}
|
|
|
|
window.addEventListener('load', function() {
|
|
var connector = YAML.parse(connectorYaml);
|
|
document.getElementById("connector-img").addEventListener('load', function() {
|
|
for (var i = 0; i < connector.pins.length; i++) {
|
|
var pin = connector.pins[i];
|
|
if (!pin.pin) {
|
|
continue;
|
|
}
|
|
var pinfo;
|
|
for (var ii = 0; ii < connector.info.pins.length; ii++) {
|
|
if (connector.info.pins[ii].pin == pin.pin) {
|
|
pinfo = connector.info.pins[ii];
|
|
break;
|
|
}
|
|
}
|
|
var cdiv = document.getElementById("connector-div");
|
|
var template = document.getElementById("pin-template");
|
|
var clone = template.content.cloneNode(true);
|
|
var pdiv = clone.querySelector("div");
|
|
var img = document.getElementById("connector-img");
|
|
var imgHeight = img.naturalHeight;
|
|
var imgWidth = img.naturalWidth;
|
|
pdiv.textContent = pinfo.pin;
|
|
pdiv.style.top = ((pinfo.y / imgHeight) * 100) + "%";
|
|
pdiv.style.left = ((pinfo.x / imgWidth) * 100) + "%";
|
|
pdiv.dataset.type = pin.type;
|
|
pdiv.addEventListener("click", function(pin, pdiv) {
|
|
clickPin(pin, pdiv);
|
|
}.bind(null, pin, pdiv));
|
|
cdiv.appendChild(pdiv);
|
|
var fullTable = document.getElementById("pinout-table").querySelector("tbody");
|
|
addRow(fullTable, connector.pins[i], pdiv);
|
|
}
|
|
adjustMarkers();
|
|
});
|
|
document.getElementById("connector-img").src = connector.info.image.file;
|
|
});
|
|
|
|
window.addEventListener('resize', function() {
|
|
adjustMarkers();
|
|
});
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<template id="pin-template">
|
|
<div class="pin-marker"></div>
|
|
</template>
|
|
|
|
<div id="connector-container">
|
|
<div id="connector-div">
|
|
<img id="connector-img"></img>
|
|
</div>
|
|
</div>
|
|
|
|
<template id="table-template">
|
|
<tr class="data">
|
|
<td class="pin-data"></td>
|
|
<td class="id-data"></td>
|
|
<td class="type-data"></td>
|
|
<td class="function-data"></td>
|
|
<td class="color-data"></td>
|
|
</tr>
|
|
</template>
|
|
|
|
<table id="info-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Pin Number</th>
|
|
<th>Firmware ID</th>
|
|
<th>Type</th>
|
|
<th>Typical Function</th>
|
|
<th>Pigtail Color</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
<br/>
|
|
|
|
<h2>Full Pinout Table</h2>
|
|
<table id="pinout-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Pin Number</th>
|
|
<th>Firmware ID</th>
|
|
<th>Type</th>
|
|
<th>Typical Function</th>
|
|
<th>Pigtail Color</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
</body>
|
|
</html>
|