-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
480 lines (436 loc) · 24.3 KB
/
index.html
File metadata and controls
480 lines (436 loc) · 24.3 KB
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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
<!DOCTYPE html>
<meta charset="UTF-8">
<!-- CSS File -->
<link rel="stylesheet" href="/css.css">
<head>
<script type="text/javascript" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<!-- Mathematical Functions-->
<link rel="icon" href="/imgs/ref/favicon.ico"> <!-- Tab Icon -->
<title>Torque Learn</title> <!-- Tab Name -->
</head>
<!-- What does this do? I have no idea. -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<body style="margin: 0px;" id="body" class="dark">
<table>
<!-- This works, and I have no idea why. I recommend not messing with it.-->
<colgroup>
<col span="1" style="width:10%;">
<col span="1" style="width:50%;">
</colgroup>
<!-- Header -->
<tr style="background-color: #212121; color: white">
<td style="text-align: center; border-radius: 1em;">
<h1 style="font-family: 'MarketDeco'">TEXAS TORQUE</h1>
</td>
<td style="align-content: center; border-radius: 1em;">
<table style="width: 100%; height:100%;">
<td>
<div style="margin: 2%;">
<h2>Torque Learn</h2>
<p>A Rookie's Guide to Texas Torque</p>
</div>
</td>
<td>
<div style="float: right; margin: 5%;">
<button class="button" onclick="switchMode()">
<img id="mode" src="imgs/ref/darkmode.png" style="scale: 50%;">
</button>
</div>
</td>
</table>
</td>
</tr>
<!-- Main Content -->
<tr>
<td id="sidebar" class="sidebar sidebarDark" style="margin: 2%; border-radius: 1em;">
<!-- From here on out, this will be all buttons and headers on the sidebar. -->
<h2 class="largeTopicHeader">CAD</h2>
<div> <!-- CAD -->
<h3 class="subTopicHeader">Design Derivations</h3>
<div> <!-- Design Derivations -->
<button onclick="updateTextPanel('CAD Gears')" class="sideButton button">Gears</button><br>
<button onclick="updateTextPanel('CAD Ropes')" class="sideButton button">Ropes</button><br>
<button onclick="updateTextPanel('CAD Belts')" class="sideButton button">Belts</button><br>
<button onclick="updateTextPanel('CAD Arms')" class="sideButton button">Arms</button><br>
<button onclick="updateTextPanel('CAD Elevators')"
class="sideButton button">Elevators</button><br>
<button onclick="updateTextPanel('CAD Projectiles')"
class="sideButton button">Projectiles</button><br>
</div>
<button onclick="updateTextPanel('CAD Partial Derivatives')" class="sideButton button"
style="margin-left: 50px">Partial Derivatives</button><br>
</div>
<h2 class="largeTopicHeader">Coding</h2>
<div> <!-- Coding -->
<button onclick="updateTextPanel('Coding Basic Auto Setup')" class="sideButton button">Basic Auto
Setup</button><br>
<button onclick="updateTextPanel('Coding Coding Standards')" class="sideButton button">Coding
Standards</button><br>
<button onclick="updateTextPanel('Coding Digital IO')" class="sideButton button">Digital
IO</button><br>
<button onclick="updateTextPanel('Coding Jacks Plan for Success')" class="sideButton button">Jack's
Plan
for
Success</button><br>
<button onclick="updateTextPanel('Coding Network Tables')" class="sideButton button">Network
Tables</button><br>
<button onclick="updateTextPanel('Coding Project Structure')" class="sideButton button">Project
Structure</button><br>
<button onclick="updateTextPanel('Coding Style Guide')" class="sideButton button">Style
Guide</button><br>
</div>
<h2 class="largeTopicHeader">Control Loop</h2>
<div> <!-- Control Loop -->
<button onclick="updateTextPanel('Control Loop Bang-Bang')"
class="sideButton button">Bang-Bang</button><br>
<button onclick="updateTextPanel('Control Loop Feed Forward')" class="sideButton button">Feed
Forward</button><br>
<button onclick="updateTextPanel('Control Loop PID')" class="sideButton button">PID</button><br>
</div>
<h2 class="largeTopicHeader">Git Use</h2>
<div> <!-- Git Use -->
<button onclick="updateTextPanel('Git Use How to clone a repo')" class="sideButton button">How to
Clone a Repo
</button><br>
<button onclick="updateTextPanel('Git Use How to use vscode')" class="sideButton button">How to use
VSCode</button><br>
<button onclick="updateTextPanel('Git Use Introductory Git')" class="sideButton button">Introductory
Git</button><br>
</div>
<h2 class="largeTopicHeader">Health/Safety</h2>
<div> <!-- Health/Safety -->
<button onclick="updateTextPanel('Health/Safety Battery Safety')" class="sideButton button">Battery
Safety</button><br>
<button onclick="updateTextPanel('Health/Safety Posture')"
class="sideButton button">Posture</button><br>
<button onclick="updateTextPanel('Health/Safety Visions and Screens')"
class="sideButton button">Visions
and
Screens</button><br>
</div>
<h2 class="largeTopicHeader">Machining</h2>
<div> <!-- Machining -->
<button onclick="updateTextPanel('Machining Tormach Door Replacement')"
class="sideButton button">Tormach
Door
Replacement</button><br>
<button onclick="updateTextPanel('Machining What is CNC')" class="sideButton button">What is
CNC?</button><br>
</div>
<h2 class="largeTopicHeader">Programming Setup</h2>
<div> <!-- Setup -->
<button onclick="updateTextPanel('Programming Setup How to Install FRC Gametools')"
class="sideButton button">How to Install FRC Gametools</button><br>
<button onclick="updateTextPanel('Programming Setup How to Install WPILib')"
class="sideButton button">How
to
install WPILib</button><br>
<button onclick="updateTextPanel('Programming Setup How to install VSCode')"
class="sideButton button">How
to
install VSCode</button><br>
<button onclick="updateTextPanel('Programming Setup How to use Liveshare')"
class="sideButton button">How
to use
Liveshare</button><br>
</div>
<h2 class="largeTopicHeader">Vendor</h2>
<div> <!-- Vendor -->
<h3 class="subTopicHeader">Arduino</h3>
<div>
<button onclick="updateTextPanel('Arduino Controlling a 4 pin LED Strip')"
class="sideButton button">Controlling a 4 pin LED Strip</button><br>
<button onclick="updateTextPanel('Arduino Controlling an Adata NeoPixel')"
class="sideButton button">Controlling an Adata NeoPixel</button><br>
<button onclick="updateTextPanel('Arduino Starting Arduino')" class="sideButton button">Starting
Arduino</button><br>
</div>
<button onclick="updateTextPanel('Vendor Limelight')" class="sideButton button"
style="margin-left: 50px">Limelight</button><br>
<button onclick="updateTextPanel('Vendor Motor Controllers')" class="sideButton button"
style="margin-left: 50px">Motor Controllers</button><br>
<button onclick="updateTextPanel('Vendor Motors and Motor Types')" class="sideButton button"
style="margin-left: 50px">Motors and Motor Types</button><br>
<button onclick="updateTextPanel('Vendor Pneumatics and Solenoids')" class="sideButton button"
style="margin-left: 50px">Pneumatics and Solenoids</button><br>
<button onclick="updateTextPanel('Vendor RoboRIO')" class="sideButton button"
style="margin-left: 50px">RoboRIO</button><br>
<button onclick="updateTextPanel('Vendor Wifi Radio Configuration')" class="sideButton button"
style="margin-left: 50px">Wifi Radio Configuration</button><br>
<button onclick="updateTextPanel('Vendor navX')" class="sideButton button"
style="margin-left: 50px">navX</button><br>
</div>
<button onclick="updateTextPanel('Scouting')" class="sideButton button"
style="margin-left: 20px">Scouting</button><br>
<button onclick="updateTextPanel('How to Deploy Code to a Robot')" class="sideButton button"
style="margin-left: 20px">How to Deploy Code to a Robot</button><br>
</td>
<td style="padding-left: 2%; padding-right: 2%; padding-top: 1; vertical-align: top;">
<div class="transition" id="transition">
<h1 id="topicHeader">Torque Learn</h1>
<p id="topicText" , style="vertical-align: top;">
Choose a selection on the side to go to a tab.
</p>
</div>
</td>
</tr>
</table>
</body>
<!-- Imports for Text -->
<script src="StoredTexts/CAD.js"></script>
<script src="StoredTexts/coding.js"></script>
<script src="StoredTexts/ControlLoops.js"></script>
<script src="StoredTexts/GIT.js"></script>
<script src="StoredTexts/safety.js"></script>
<script src="StoredTexts/machining.js"></script>
<script src="StoredTexts/misc.js"></script>
<script src="StoredTexts/programmingSetup.js"></script>
<script src="StoredTexts/vendor.js"></script>
<!-- Fetching texts -->
<script>
var theme = "dark";
var button = document.getElementById("mode");
var body = document.getElementById("body");
var sidebar = document.getElementById("sidebar");
body.addEventListener("animationend", () => {
if (button.classList.contains("fadeIn")) {
if (theme == "dark") { // In Dark mode
body.classList.add("dark")
sidebar.classList.add("sidebarDark");
body.classList.remove("darkAnim");
sidebar.classList.remove("sidebarDarkAnim");
} else { // In Light mode
body.classList.remove("dark");
sidebar.classList.remove("sidebarDark");
body.classList.remove("lightAnim");
sidebar.classList.remove("sidebarLightAnim");
}
} else {
button.classList.remove("fadeOut");
if (theme == "dark") { mode.src = "/imgs/ref/darkmode.png"; }
else { mode.src = "/imgs/ref/lightmode.png"; }
button.classList.add("fadeIn");
}
})
function switchMode() {
sidebar.classList.remove("sidebarDarkAnim");
sidebar.classList.remove("sidebarLightAnim");
body.classList.remove("darkAnim");
body.classList.remove("lightAnim");
if (theme == "dark") { // Entering Light Mode
theme = "light";
body.classList.add("lightAnim");
sidebar.classList.add("sidebarLightAnim");
} else { // Entering Dark Mode
theme = "dark";
body.classList.add("darkAnim");
sidebar.classList.add("sidebarDarkAnim");
}
button.classList.remove("fadeIn");
button.classList.add("fadeOut");
}
function updateTextPanel(id) {
const element = document.getElementById("transition");
element.classList.add("fadeOut");
element.addEventListener("animationend", () => {
element.classList.remove("fadeOut");
getText(id);
element.classList.add("fadeIn");
element.addEventListener("animationend", () => {
element.classList.remove("fadeIn");
})
})
}
function getText(id) {
switch (id) {
// CAD
case "CAD Gears":
document.getElementById("topicHeader").innerHTML = "CAD Gears";
document.getElementById("topicText").innerHTML = cad.gears.join("");
break;
case "CAD Ropes":
document.getElementById("topicHeader").innerHTML = "CAD Ropes";
document.getElementById("topicText").innerHTML = cad.ropes.join("");
break;
case "CAD Belts":
document.getElementById("topicHeader").innerHTML = "CAD Belts";
document.getElementById("topicText").innerHTML = cad.belts.join("");
break;
case "CAD Arms":
document.getElementById("topicHeader").innerHTML = "CAD Arms";
document.getElementById("topicText").innerHTML = cad.arms.join("");
break;
case "CAD Elevators":
document.getElementById("topicHeader").innerHTML = "CAD Elevators";
document.getElementById("topicText").innerHTML = cad.elevator.join("");
break;
case "CAD Projectiles":
document.getElementById("topicHeader").innerHTML = "CAD Projectiles";
document.getElementById("topicText").innerHTML = cad.projectiles.join("");
break;
case "CAD Partial Derivatives":
document.getElementById("topicHeader").innerHTML = "CAD Partial Derivatives";
document.getElementById("topicText").innerHTML = cad.partial_derivatives.join("");
break;
// Coding
case "Coding Basic Auto Setup":
document.getElementById("topicHeader").innerHTML = "Coding Basic Auto Setup";
document.getElementById("topicText").innerHTML = coding.basic_auto_setup.join("");
break;
case "Coding Coding Standards":
document.getElementById("topicHeader").innerHTML = "Coding Standards";
document.getElementById("topicText").innerHTML = coding.coding_standards.join("");
break;
case "Coding Digital IO":
document.getElementById("topicHeader").innerHTML = "Coding Digital IO";
document.getElementById("topicText").innerHTML = coding.digital_io.join("");
break;
case "Coding Jacks Plan for Success":
document.getElementById("topicHeader").innerHTML = "Jack's Plan for Success";
document.getElementById("topicText").innerHTML = coding.jacks_plan_for_success.join("");
break;
case "Coding Network Tables":
document.getElementById("topicHeader").innerHTML = "Coding Network Tables";
document.getElementById("topicText").innerHTML = coding.network_tables.join("");
break;
case "Coding Project Structure":
document.getElementById("topicHeader").innerHTML = "Coding Project Structure";
document.getElementById("topicText").innerHTML = coding.project_structure.join("");
break;
case "Coding Style Guide":
document.getElementById("topicHeader").innerHTML = "Coding Style Guide";
document.getElementById("topicText").innerHTML = coding.style_guide.join("");
break;
// Control Loop
case "Control Loop Bang-Bang":
document.getElementById("topicHeader").innerHTML = "Control Loop Bang-Bang";
document.getElementById("topicText").innerHTML = controlLoops.bang_bang.join("");
break;
case "Control Loop Feed Forward":
document.getElementById("topicHeader").innerHTML = "Control Loop Feed Forward";
document.getElementById("topicText").innerHTML = controlLoops.feed_forward.join("");
break;
case "Control Loop PID":
document.getElementById("topicHeader").innerHTML = "Control Loop PID";
document.getElementById("topicText").innerHTML = controlLoops.pid.join("");
break;
// Git Use
case "Git Use How to clone a repo":
document.getElementById("topicHeader").innerHTML = "How to Clone a Repo";
document.getElementById("topicText").innerHTML = git.how_to_clone.join("");
break;
case "Git Use How to use vscode":
document.getElementById("topicHeader").innerHTML = "How to use VSCode";
document.getElementById("topicText").innerHTML = git.vscode_git.join("");
break;
case "Git Use Introductory Git":
document.getElementById("topicHeader").innerHTML = "Introductory Git";
document.getElementById("topicText").innerHTML = git.git_introduction.join("");
break;
// Health/Safety
case "Health/Safety Battery Safety":
document.getElementById("topicHeader").innerHTML = "Battery Safety";
document.getElementById("topicText").innerHTML = safety.battery_safety.join("");
break;
case "Health/Safety Posture":
document.getElementById("topicHeader").innerHTML = "Posture";
document.getElementById("topicText").innerHTML = safety.posture_guide.join("");
break;
case "Health/Safety Visions and Screens":
document.getElementById("topicHeader").innerHTML = "Visions and Screens";
document.getElementById("topicText").innerHTML = safety.vision_and_screens.join("");
break;
// Machining
case "Machining Tormach Door Replacement":
document.getElementById("topicHeader").innerHTML = "Tormach Door Replacement";
document.getElementById("topicText").innerHTML = machining.tormach_door_replacement.join("");
break;
case "Machining What is CNC":
document.getElementById("topicHeader").innerHTML = "What is CNC?";
document.getElementById("topicText").innerHTML = machining.cnc_machining_info.join("");
break;
// Programming Setup
case "Programming Setup How to Install FRC Gametools":
document.getElementById("topicHeader").innerHTML = "How to Install FRC Gametools";
document.getElementById("topicText").innerHTML = programmingSetup.frc_gametools_guide.join("");
break;
case "Programming Setup How to Install WPILib":
document.getElementById("topicHeader").innerHTML = "How to install WPILib";
document.getElementById("topicText").innerHTML = programmingSetup.wpilib_tools_guide.join("");
break;
case "Programming Setup How to install VSCode":
document.getElementById("topicHeader").innerHTML = "How to install VSCode";
document.getElementById("topicText").innerHTML = programmingSetup.vscode_guide.join("");
break;
case "Programming Setup How to use Liveshare":
document.getElementById("topicHeader").innerHTML = "How to use Liveshare";
document.getElementById("topicText").innerHTML = programmingSetup.liveshare.join("");
break;
// Vendor
case "Arduino Controlling a 4 pin LED Strip":
document.getElementById("topicHeader").innerHTML = "Controlling a 4 pin LED Strip";
document.getElementById("topicText").innerHTML = vendor.arduino.pin4LED.join("");
break;
case "Arduino Controlling an Adata NeoPixel":
document.getElementById("topicHeader").innerHTML = "Controlling an Adata NeoPixel";
document.getElementById("topicText").innerHTML = vendor.arduino.adata_neopixel.join("");
break;
case "Arduino Starting Arduino":
document.getElementById("topicHeader").innerHTML = "Starting Arduino";
document.getElementById("topicText").innerHTML = vendor.arduino.starting_arduino.join("");
break;
case "Vendor Limelight":
document.getElementById("topicHeader").innerHTML = "Limelight";
document.getElementById("topicText").innerHTML = vendor.limelight.join("");
break;
case "Vendor Motor Controllers":
document.getElementById("topicHeader").innerHTML = "Motor Controllers";
document.getElementById("topicText").innerHTML = vendor.motor_controllers.join("");
break;
case "Vendor Motors and Motor Types":
document.getElementById("topicHeader").innerHTML = "Motors and Motor Types";
document.getElementById("topicText").innerHTML = vendor.motors_and_types.join("");
break;
case "Vendor Pneumatics and Solenoids":
document.getElementById("topicHeader").innerHTML = "Pneumatics and Solenoids";
document.getElementById("topicText").innerHTML = vendor.pneumatics_and_solenoids.join("");
break;
case "Vendor RoboRIO":
document.getElementById("topicHeader").innerHTML = "RoboRIO";
document.getElementById("topicText").innerHTML = vendor.roboRIO.join("");
break;
case "Vendor Wifi Radio Configuration":
document.getElementById("topicHeader").innerHTML = "Wifi Radio Configuration";
document.getElementById("topicText").innerHTML = vendor.wifi_configuration.join("");
break;
case "Vendor navX":
document.getElementById("topicHeader").innerHTML = "navX";
document.getElementById("topicText").innerHTML = vendor.navX.join("");
break;
// Other
case "Scouting":
document.getElementById("topicHeader").innerHTML = "Scouting";
document.getElementById("topicText").innerHTML = misc.scouting.join("");
break;
case "How to Deploy Code to a Robot":
document.getElementById("topicHeader").innerHTML = "Deploy and run code on a robot";
document.getElementById("topicText").innerHTML = misc.deploy_code.join("");
break;
default:
// Shouldn't ever run, but just in case.
document.getElementById("topicHeader").innerHTML = "?????"
document.getElementById("topicText").innerHTML = "How did you even get here."
break;
}
// Refreshes the mathematic source to render any new formulas (which nearly every page has).
if (window.MathJax) {
MathJax.typeset();
}
}
</script>
<!--
Authored by Davis Jenney (2024-2027)
The Academy of Science and Technology
Texas Torque Research and Problem Project
Started 2/13/2024, Finished 2/25/2024
-->