CANBitPattern/index.html at main · Watchcattimer/CANBitPattern · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Online CAN Bit Pattern Generator</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <h1>Online CAN Bit Pattern Generator</h1>
	<h2>Controller Area Network according to ISO 11898</h2>
        <form id="can-form">
            <div class="form-group">
                <label for="can-id">CAN ID (11 bits):</label>
				<div class="form-group">
					<label>
						<input type="radio" name="can-id-format" value="dec" checked> Dec
						<input type="radio" name="can-id-format" value="hex"> Hex
					</label>
				</div>

                <input type="text" id="can-id" name="can-id" min="0" max="2047" required value="123">
				<label style="margin-left:10px;">
					<input type="checkbox" id="rtr-checkbox" name="rtr">RTR
				</label>
            </div>
            <div class="form-group">
                <label for="dlc">DLC (0-8):</label>
                <input type="number" id="dlc" name="dlc" min="0" max="8" required value="8">
            </div>
            <div class="form-group">
                <label for="data">Data:</label>
                <input type="text" id="data" name="data" value="00 11 22 33 AA BB CC DD">
            </div>
            <div class="form-group">
                <label>
                    <input type="checkbox" id="flip-bits">
                    Flip 0 &harr; 1
                </label>
            </div>
            <button type="button" id="generate-btn">Generate Bit Pattern</button>
        </form>
        <div id="bit-pattern-output"></div>
		<br>
		<div class="form-group">
			<label for="bit-pattern-stream">Bit Pattern Stream:</label>
			<input type="text" id="bit-pattern-stream" readonly style="width:100%;font-family:monospace;">
			<span id="bit-pattern-count" style="margin-left:8px;font-weight:bold;"></span>
		</div>

		<div class="legend" style="margin-top:2em;">
			<h3>Legend</h3>
				<table class="legend-table">
				<tr>
					<td><span class="bit dominant">X</span></td>
					<td>Dominant Bit</td>
				</tr>
				<tr>
					<td><span class="bit recessive">X</span></td>
					<td>Recessive Bit</td>
				</tr>
				<tr>
					<td><span class="bit stuff">X</span></td>
					<td>Stuff Bit</td>
				</tr>
				<tr>
					<td><b>RTR</b></td>
					<td>Remote Transmission Request</td>
				</tr>
				<tr>
					<td><b>IDE</b></td>
					<td>Identifier Extension</td>
				</tr>
				<tr>
					<td><b>r0</b></td>
					<td>reserved for future</td>
				</tr>
				<tr>
					<td><b>DLC</b></td>
					<td>Data Length Code</td>
				</tr>
				<tr>
					<td><b>CRC</b></td>
					<td>Cyclic Redundancy Check bits for error detection</td>
				</tr>
				<tr>
					<td><b>ACK</b></td>
					<td>Acknowledge</td>
				</tr>
				</table>
		</div>

    </div>
    <div class="disclaimer">Disclaimer: We offer this homepage and its content for educational purposes only. Please be aware that you use this site and its materials at your own risk. We do not guarantee the accuracy, completeness, or usefulness of any information presented herein, and we are not responsible for any outcomes or consequences that may arise from your use of this site.</div>
    <script src="can_crc.js"></script>
    <script src="main.js"></script>
</body>
</html>