aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/components/UploadRunDialog.tsx
diff options
context:
space:
mode:
authorFifthWit <fifthwitbusiness@gmail.com>2025-01-30 13:11:48 -0600
committerFifthWit <fifthwitbusiness@gmail.com>2025-01-30 13:11:48 -0600
commit81342e2579165ebfdb28c749dc5225141721a419 (patch)
tree8e5759c20b92408048fe5ac44f48e2df2a00ab9b /frontend/src/components/UploadRunDialog.tsx
parentfixed issues with useCallback (diff)
downloadlphub-81342e2579165ebfdb28c749dc5225141721a419.tar.gz
lphub-81342e2579165ebfdb28c749dc5225141721a419.tar.bz2
lphub-81342e2579165ebfdb28c749dc5225141721a419.zip
switched to double quotes
Diffstat (limited to 'frontend/src/components/UploadRunDialog.tsx')
-rw-r--r--frontend/src/components/UploadRunDialog.tsx108
1 files changed, 54 insertions, 54 deletions
diff --git a/frontend/src/components/UploadRunDialog.tsx b/frontend/src/components/UploadRunDialog.tsx
index 5bad80f..d5eabcd 100644
--- a/frontend/src/components/UploadRunDialog.tsx
+++ b/frontend/src/components/UploadRunDialog.tsx
@@ -1,15 +1,15 @@
1import React from 'react'; 1import React from "react";
2import { UploadRunContent } from '@customTypes/Content'; 2import { UploadRunContent } from "@customTypes/Content";
3import { ScoreboardTempUpdate, SourceDemoParser, NetMessages } from '@nekz/sdp'; 3import { ScoreboardTempUpdate, SourceDemoParser, NetMessages } from "@nekz/sdp";
4 4
5import '@css/UploadRunDialog.css'; 5import "@css/UploadRunDialog.css";
6import { Game } from '@customTypes/Game'; 6import { Game } from "@customTypes/Game";
7import { API } from '@api/Api'; 7import { API } from "@api/Api";
8import { useNavigate } from 'react-router-dom'; 8import { useNavigate } from "react-router-dom";
9import useMessage from '@hooks/UseMessage'; 9import useMessage from "@hooks/UseMessage";
10import useConfirm from '@hooks/UseConfirm'; 10import useConfirm from "@hooks/UseConfirm";
11import useMessageLoad from '@hooks/UseMessageLoad'; 11import useMessageLoad from "@hooks/UseMessageLoad";
12import { MapNames } from '@customTypes/MapNames'; 12import { MapNames } from "@customTypes/MapNames";
13 13
14interface UploadRunDialogProps { 14interface UploadRunDialogProps {
15 token?: string; 15 token?: string;
@@ -38,7 +38,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
38 }); 38 });
39 39
40 const [selectedGameID, setSelectedGameID] = React.useState<number>(0); 40 const [selectedGameID, setSelectedGameID] = React.useState<number>(0);
41 const [selectedGameName, setSelectedGameName] = React.useState<string>(''); 41 const [selectedGameName, setSelectedGameName] = React.useState<string>("");
42 42
43 // dropdowns 43 // dropdowns
44 const [dropdown1Vis, setDropdown1Vis] = React.useState<boolean>(false); 44 const [dropdown1Vis, setDropdown1Vis] = React.useState<boolean>(false);
@@ -102,7 +102,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
102 setDropdown1Vis(!dropdown1Vis); 102 setDropdown1Vis(!dropdown1Vis);
103 } else if (dropdown === 2) { 103 } else if (dropdown === 2) {
104 setDropdown2Vis(!dropdown2Vis); 104 setDropdown2Vis(!dropdown2Vis);
105 document.querySelector('#dropdown2')?.scrollTo(0, 0); 105 document.querySelector("#dropdown2")?.scrollTo(0, 0);
106 } 106 }
107 }; 107 };
108 108
@@ -133,15 +133,15 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
133 if (token) { 133 if (token) {
134 if (games[selectedGameID].is_coop) { 134 if (games[selectedGameID].is_coop) {
135 if (uploadRunContent.host_demo === null) { 135 if (uploadRunContent.host_demo === null) {
136 await message('Error', 'You must select a host demo to upload.'); 136 await message("Error", "You must select a host demo to upload.");
137 return; 137 return;
138 } else if (uploadRunContent.partner_demo === null) { 138 } else if (uploadRunContent.partner_demo === null) {
139 await message('Error', 'You must select a partner demo to upload.'); 139 await message("Error", "You must select a partner demo to upload.");
140 return; 140 return;
141 } 141 }
142 } else { 142 } else {
143 if (uploadRunContent.host_demo === null) { 143 if (uploadRunContent.host_demo === null) {
144 await message('Error', 'You must select a demo to upload.'); 144 await message("Error", "You must select a demo to upload.");
145 return; 145 return;
146 } 146 }
147 } 147 }
@@ -157,7 +157,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
157 157
158 if (!scoreboard) { 158 if (!scoreboard) {
159 await message( 159 await message(
160 'Error', 160 "Error",
161 "Error while processing demo: Unable to get scoreboard result. Either there is a demo that is corrupt or haven't been recorded in challenge mode." 161 "Error while processing demo: Unable to get scoreboard result. Either there is a demo that is corrupt or haven't been recorded in challenge mode."
162 ); 162 );
163 return; 163 return;
@@ -165,22 +165,22 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
165 165
166 if (!demo.mapName || !MapNames[demo.mapName]) { 166 if (!demo.mapName || !MapNames[demo.mapName]) {
167 await message( 167 await message(
168 'Error', 168 "Error",
169 'Error while processing demo: Invalid map name.' 169 "Error while processing demo: Invalid map name."
170 ); 170 );
171 return; 171 return;
172 } 172 }
173 173
174 if (selectedGameID === 0 && MapNames[demo.mapName] > 60) { 174 if (selectedGameID === 0 && MapNames[demo.mapName] > 60) {
175 await message( 175 await message(
176 'Error', 176 "Error",
177 'Error while processing demo: Invalid cooperative demo in singleplayer submission.' 177 "Error while processing demo: Invalid cooperative demo in singleplayer submission."
178 ); 178 );
179 return; 179 return;
180 } else if (selectedGameID === 1 && MapNames[demo.mapName] <= 60) { 180 } else if (selectedGameID === 1 && MapNames[demo.mapName] <= 60) {
181 await message( 181 await message(
182 'Error', 182 "Error",
183 'Error while processing demo: Invalid singleplayer demo in cooperative submission.' 183 "Error while processing demo: Invalid singleplayer demo in cooperative submission."
184 ); 184 );
185 return; 185 return;
186 } 186 }
@@ -189,7 +189,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
189 scoreboard.userMessage?.as<ScoreboardTempUpdate>() ?? {}; 189 scoreboard.userMessage?.as<ScoreboardTempUpdate>() ?? {};
190 190
191 const userConfirmed = await confirm( 191 const userConfirmed = await confirm(
192 'Upload Record', 192 "Upload Record",
193 `Map Name: ${demo.mapName}\nPortal Count: ${portalScore}\nTicks: ${timeScore}\n\nAre you sure you want to upload this demo?` 193 `Map Name: ${demo.mapName}\nPortal Count: ${portalScore}\nTicks: ${timeScore}\n\nAre you sure you want to upload this demo?`
194 ); 194 );
195 195
@@ -197,21 +197,21 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
197 return; 197 return;
198 } 198 }
199 199
200 messageLoad('Uploading...'); 200 messageLoad("Uploading...");
201 const [success, response] = await API.post_record( 201 const [success, response] = await API.post_record(
202 token, 202 token,
203 uploadRunContent, 203 uploadRunContent,
204 MapNames[demo.mapName] 204 MapNames[demo.mapName]
205 ); 205 );
206 messageLoadClose(); 206 messageLoadClose();
207 await message('Upload Record', response); 207 await message("Upload Record", response);
208 if (success) { 208 if (success) {
209 setUploadRunContent({ 209 setUploadRunContent({
210 host_demo: null, 210 host_demo: null,
211 partner_demo: null, 211 partner_demo: null,
212 }); 212 });
213 onClose(success); 213 onClose(success);
214 navigate('/profile'); 214 navigate("/profile");
215 } 215 }
216 } 216 }
217 }; 217 };
@@ -220,7 +220,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
220 if (open) { 220 if (open) {
221 setDragHighlightPartner(false); 221 setDragHighlightPartner(false);
222 setDragHighlight(false); 222 setDragHighlight(false);
223 _handle_game_select('1', 'Portal 2 - Singleplayer'); // a different approach?. 223 _handle_game_select("1", "Portal 2 - Singleplayer"); // a different approach?.
224 } 224 }
225 }, [open]); 225 }, [open]);
226 226
@@ -236,35 +236,35 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
236 <div id="upload-run-menu-add"> 236 <div id="upload-run-menu-add">
237 <div id="upload-run-route-category"> 237 <div id="upload-run-route-category">
238 <div 238 <div
239 style={{ padding: '15px 0px' }} 239 style={{ padding: "15px 0px" }}
240 className="upload-run-dropdown-container upload-run-item" 240 className="upload-run-dropdown-container upload-run-item"
241 > 241 >
242 <h3 style={{ margin: '0px 0px' }}>Select Game</h3> 242 <h3 style={{ margin: "0px 0px" }}>Select Game</h3>
243 <div 243 <div
244 onClick={() => _handle_dropdowns(1)} 244 onClick={() => _handle_dropdowns(1)}
245 style={{ 245 style={{
246 display: 'flex', 246 display: "flex",
247 alignItems: 'center', 247 alignItems: "center",
248 cursor: 'pointer', 248 cursor: "pointer",
249 justifyContent: 'space-between', 249 justifyContent: "space-between",
250 margin: '10px 0px', 250 margin: "10px 0px",
251 }} 251 }}
252 > 252 >
253 <div className="dropdown-cur">{selectedGameName}</div> 253 <div className="dropdown-cur">{selectedGameName}</div>
254 <i 254 <i
255 style={{ 255 style={{
256 rotate: '-90deg', 256 rotate: "-90deg",
257 transform: 'translate(-5px, 10px)', 257 transform: "translate(-5px, 10px)",
258 }} 258 }}
259 className="triangle" 259 className="triangle"
260 ></i> 260 ></i>
261 </div> 261 </div>
262 <div 262 <div
263 style={{ top: '110px' }} 263 style={{ top: "110px" }}
264 className={ 264 className={
265 dropdown1Vis 265 dropdown1Vis
266 ? 'upload-run-dropdown' 266 ? "upload-run-dropdown"
267 : 'upload-run-dropdown hidden' 267 : "upload-run-dropdown hidden"
268 } 268 }
269 > 269 >
270 {games.map(game => ( 270 {games.map(game => (
@@ -284,7 +284,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
284 {!loading && ( 284 {!loading && (
285 <> 285 <>
286 <div> 286 <div>
287 <h3 style={{ margin: '10px 0px' }}>Host Demo</h3> 287 <h3 style={{ margin: "10px 0px" }}>Host Demo</h3>
288 <div 288 <div
289 onClick={() => { 289 onClick={() => {
290 _handle_file_click(true); 290 _handle_file_click(true);
@@ -298,7 +298,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
298 onDragLeave={e => { 298 onDragLeave={e => {
299 _handle_drag_leave(e, true); 299 _handle_drag_leave(e, true);
300 }} 300 }}
301 className={`upload-run-drag-area ${dragHightlight ? 'upload-run-drag-area-highlight' : ''} ${uploadRunContent.host_demo ? 'upload-run-drag-area-hidden' : ''}`} 301 className={`upload-run-drag-area ${dragHightlight ? "upload-run-drag-area-highlight" : ""} ${uploadRunContent.host_demo ? "upload-run-drag-area-hidden" : ""}`}
302 > 302 >
303 <input 303 <input
304 ref={fileInputRef} 304 ref={fileInputRef}
@@ -316,7 +316,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
316 <div> 316 <div>
317 <span 317 <span
318 style={{ 318 style={{
319 fontFamily: 'BarlowSemiCondensed-Regular', 319 fontFamily: "BarlowSemiCondensed-Regular",
320 }} 320 }}
321 > 321 >
322 Or click here 322 Or click here
@@ -324,9 +324,9 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
324 <br /> 324 <br />
325 <button 325 <button
326 style={{ 326 style={{
327 borderRadius: '24px', 327 borderRadius: "24px",
328 padding: '5px 8px', 328 padding: "5px 8px",
329 margin: '5px 0px', 329 margin: "5px 0px",
330 }} 330 }}
331 > 331 >
332 Upload 332 Upload
@@ -342,7 +342,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
342 {games[selectedGameID].is_coop && ( 342 {games[selectedGameID].is_coop && (
343 <> 343 <>
344 <div> 344 <div>
345 <h3 style={{ margin: '10px 0px' }}>Partner Demo</h3> 345 <h3 style={{ margin: "10px 0px" }}>Partner Demo</h3>
346 <div 346 <div
347 onClick={() => { 347 onClick={() => {
348 _handle_file_click(false); 348 _handle_file_click(false);
@@ -356,7 +356,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
356 onDragLeave={e => { 356 onDragLeave={e => {
357 _handle_drag_leave(e, false); 357 _handle_drag_leave(e, false);
358 }} 358 }}
359 className={`upload-run-drag-area ${dragHightlightPartner ? 'upload-run-drag-area-highlight-partner' : ''} ${uploadRunContent.partner_demo ? 'upload-run-drag-area-hidden' : ''}`} 359 className={`upload-run-drag-area ${dragHightlightPartner ? "upload-run-drag-area-highlight-partner" : ""} ${uploadRunContent.partner_demo ? "upload-run-drag-area-hidden" : ""}`}
360 > 360 >
361 <input 361 <input
362 ref={fileInputRefPartner} 362 ref={fileInputRefPartner}
@@ -367,14 +367,14 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
367 onChange={e => 367 onChange={e =>
368 _handle_file_change(e.target.files, false) 368 _handle_file_change(e.target.files, false)
369 } 369 }
370 />{' '} 370 />{" "}
371 {!uploadRunContent.partner_demo ? ( 371 {!uploadRunContent.partner_demo ? (
372 <div> 372 <div>
373 <span>Drag and drop</span> 373 <span>Drag and drop</span>
374 <div> 374 <div>
375 <span 375 <span
376 style={{ 376 style={{
377 fontFamily: 'BarlowSemiCondensed-Regular', 377 fontFamily: "BarlowSemiCondensed-Regular",
378 }} 378 }}
379 > 379 >
380 Or click here 380 Or click here
@@ -382,9 +382,9 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({
382 <br /> 382 <br />
383 <button 383 <button
384 style={{ 384 style={{
385 borderRadius: '24px', 385 borderRadius: "24px",
386 padding: '5px 8px', 386 padding: "5px 8px",
387 margin: '5px 0px', 387 margin: "5px 0px",
388 }} 388 }}
389 > 389 >
390 Upload 390 Upload