Skip to content

Commit 850266a

Browse files
ty-porterty-porter
committed
Fix performance problems
1 parent caa4b28 commit 850266a

3 files changed

Lines changed: 233 additions & 72 deletions

File tree

‎index.html‎

Lines changed: 64 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!DOCTYPE html>
2-
<html lang="en" data-bs-theme="dark">
2+
<html lang="en" data-bs-theme="auto">
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -9,6 +9,7 @@
99
<link rel="apple-touch-icon" href="apple-touch-icon.png">
1010

1111
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
12+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
1213
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css">
1314
<link rel="stylesheet" href="src/styles.css">
1415

@@ -21,16 +22,13 @@
2122
<body>
2223
<div class="container py-4">
2324
<h1 class="mb-1">MLB LED Scoreboard Config Editor</h1>
24-
<div class="d-flex align-items-center gap-3 mb-4">
25+
<div class="d-flex align-items-center gap-3 mb-3">
2526
<span>Select schema version:</span>
2627
<select id="version-select" class="form-select form-select-sm w-auto">
2728
<option value="dev">dev</option>
2829
<option value="config-gen-schemas">config-gen-schemas (Testing)</option>
2930
</select>
3031
</div>
31-
<div class="d-flex align-items-center gap-3 mb-4">
32-
<p class="text-secondary mb-0">Edit your config files below, then copy the output.</p>
33-
</div>
3432

3533
<ul class="nav nav-tabs mb-4" role="tablist">
3634
<li class="nav-item">
@@ -43,37 +41,66 @@ <h1 class="mb-1">MLB LED Scoreboard Config Editor</h1>
4341
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#tab-scoreboard" type="button">colors/scoreboard.json</button>
4442
</li>
4543
<li class="nav-item">
46-
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#tab-wxhy" type="button">coordinates/</button>
44+
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#tab-wxhy" type="button">coordinates/wXhY.json</button>
4745
</li>
4846
</ul>
4947

5048
<div class="tab-content">
49+
5150
<div class="tab-pane fade show active" id="tab-config">
52-
<div id="jedison-config"></div>
53-
<div class="mt-4">
54-
<h2 class="h6 text-secondary mb-2">config.json output</h2>
55-
<pre id="output-config" class="p-3 rounded">{}</pre>
56-
<button class="btn btn-primary btn-sm mt-2 copy-btn" data-target="output-config">Copy to clipboard</button>
51+
<div class="row">
52+
<div class="col-lg-7">
53+
<div id="jedison-config"><div class="loader"></div></div>
54+
</div>
55+
<div class="col-lg-5">
56+
<div class="sticky-top pt-2">
57+
<div class="d-flex gap-2 mt-2">
58+
<button class="btn btn-primary btn-sm download-btn" data-target="output-config" data-filename="config.json">Download</button>
59+
<button class="btn btn-secondary btn-sm copy-btn" data-target="output-config">Copy</button>
60+
</div>
61+
<p class="text-secondary small mb-1">config.json</p>
62+
<textarea id="output-config" class="json-output form-control font-monospace" wrap="off" readonly></textarea>
63+
</div>
64+
</div>
5765
</div>
5866
</div>
5967

6068
<div class="tab-pane fade" id="tab-teams">
61-
<div id="jedison-teams"></div>
62-
<div class="mt-4">
63-
<h2 class="h6 text-secondary mb-2">colors/teams.json output</h2>
64-
<pre id="output-teams" class="p-3 rounded">{}</pre>
65-
<button class="btn btn-primary btn-sm mt-2 copy-btn" data-target="output-teams">Copy to clipboard</button>
69+
<div class="row">
70+
<div class="col-lg-7">
71+
<div id="jedison-teams"></div>
72+
</div>
73+
<div class="col-lg-5">
74+
<div class="sticky-top pt-2">
75+
<div class="d-flex gap-2 mt-2">
76+
<button class="btn btn-primary btn-sm download-btn" data-target="output-teams" data-filename="teams.json">Download</button>
77+
<button class="btn btn-secondary btn-sm copy-btn" data-target="output-teams">Copy</button>
78+
</div>
79+
<p class="text-secondary small mb-1">colors/teams.json</p>
80+
<textarea id="output-teams" class="json-output form-control font-monospace" wrap="off" readonly></textarea>
81+
</div>
82+
</div>
6683
</div>
6784
</div>
6885

6986
<div class="tab-pane fade" id="tab-scoreboard">
70-
<div id="jedison-scoreboard"></div>
71-
<div class="mt-4">
72-
<h2 class="h6 text-secondary mb-2">colors/scoreboard.json output</h2>
73-
<pre id="output-scoreboard" class="p-3 rounded">{}</pre>
74-
<button class="btn btn-primary btn-sm mt-2 copy-btn" data-target="output-scoreboard">Copy to clipboard</button>
87+
<div class="row">
88+
<div class="col-lg-7">
89+
<div id="jedison-scoreboard"></div>
90+
</div>
91+
<div class="col-lg-5">
92+
<div class="sticky-top pt-2">
93+
<div class="d-flex gap-2 mt-2">
94+
<button class="btn btn-primary btn-sm download-btn" data-target="output-scoreboard" data-filename="scoreboard.json">Download</button>
95+
<button class="btn btn-secondary btn-sm copy-btn" data-target="output-scoreboard">Copy</button>
96+
</div>
97+
<p class="text-secondary small mb-1">colors/scoreboard.json</p>
98+
<textarea id="output-scoreboard" class="json-output form-control font-monospace" wrap="off" readonly></textarea>
99+
</div>
100+
</div>
75101
</div>
76102
</div>
103+
77104
<div class="tab-pane fade" id="tab-wxhy">
78105
<div class="d-flex align-items-center gap-3 mb-4">
79106
<label for="size-select" class="text-secondary mb-0">Matrix dimensions:</label>
@@ -86,16 +113,26 @@ <h2 class="h6 text-secondary mb-2">colors/scoreboard.json output</h2>
86113
<option value="w192h64">w192h64</option>
87114
</select>
88115
</div>
89-
<div id="jedison-wxhy"></div>
90-
<div class="mt-4">
91-
<h2 class="h6 text-secondary mb-2">coordinates/<span id="wxhy-size-label">w128h64</span>.json output</h2>
92-
<pre id="output-wxhy" class="p-3 rounded">{}</pre>
93-
<button class="btn btn-primary btn-sm mt-2 copy-btn" data-target="output-wxhy">Copy to clipboard</button>
116+
<div class="row">
117+
<div class="col-lg-7">
118+
<div id="jedison-wxhy"></div>
119+
</div>
120+
<div class="col-lg-5">
121+
<div class="sticky-top pt-2">
122+
<div class="d-flex gap-2 mt-2">
123+
<button class="btn btn-primary btn-sm download-btn" data-target="output-wxhy" data-filename="w128h64.json">Download</button>
124+
<button class="btn btn-secondary btn-sm copy-btn" data-target="output-wxhy">Copy</button>
125+
</div>
126+
<p class="text-secondary small mb-1">coordinates/<span id="wxhy-size-label">w128h64</span>.json</p>
127+
<textarea id="output-wxhy" class="json-output form-control font-monospace" wrap="off" readonly></textarea>
128+
</div>
129+
</div>
94130
</div>
95131
</div>
132+
96133
</div>
97134
</div>
98135

99136
<script src="src/main.js"></script>
100137
</body>
101-
</html>
138+
</html>

0 commit comments

Comments
 (0)