frontend: uploadrundialog.tsx

5 files changed, 26 insertions, 16 deletions

diff --git a/frontend/src/api/Api.tsx b/frontend/src/api/Api.tsx
index 053e920..ddc7ac6 100644
--- a/frontend/src/api/Api.tsx
+++ b/frontend/src/api/Api.tsx
@@ -49,7 +49,7 @@ export const API = {
   delete_map_summary: (token: string, map_id: string, route_id: number) => delete_map_summary(token, map_id, route_id),
 };
 
-const BASE_API_URL: string = "/api/v1/"
+const BASE_API_URL: string = "https://lp.portal2.sr/api/v1/"
 
 export function url(path: string): string {
   return BASE_API_URL + path;
diff --git a/frontend/src/components/Login.tsx b/frontend/src/components/Login.tsx
index 545f724..d33e25e 100644
--- a/frontend/src/components/Login.tsx
+++ b/frontend/src/components/Login.tsx
@@ -17,7 +17,8 @@ const Login: React.FC<LoginProps> = ({ setToken, profile, setProfile }) => {
   const navigate = useNavigate();
 
   const _login = () => {
-    window.location.href = "/api/v1/login";
+    setToken("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MzI3Nzg0NTEsIm1vZCI6ZmFsc2UsInN1YiI6Ijc2NTYxMTk5MDg4MjU3MDk4In0.MwYcAy1q463-A2qxLn3Dk4T7ECwta_x4h-CJOTB6VZY");
+    // window.location.href = "/api/v1/login";
   };
 
   const _logout = () => {
diff --git a/frontend/src/components/UploadRunDialog.tsx b/frontend/src/components/UploadRunDialog.tsx
index 1679ac1..8c201ff 100644
--- a/frontend/src/components/UploadRunDialog.tsx
+++ b/frontend/src/components/UploadRunDialog.tsx
@@ -197,13 +197,13 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
         <div id='upload-run-menu'>
           <div id='upload-run-menu-add'>
             <div id='upload-run-route-category'>
-              <div style={{ padding: "15px 0px" }} className='upload-run-dropdown-container'>
-                <h3 style={{ margin: "10px 0px" }}>Select Game</h3>
+              <div style={{ padding: "15px 0px" }} className='upload-run-dropdown-container upload-run-item'>
+                <h1 style={{ paddingBottom: "14px" }}>Select Game</h1>
                 <div onClick={() => _handle_dropdowns(1)} style={{ display: "flex", alignItems: "center", cursor: "pointer", justifyContent: "space-between" }}>
                   <div className='dropdown-cur'>{selectedGameName}</div>
                   <i style={{ rotate: "-90deg", transform: "translate(-5px, 10px)" }} className="triangle"></i>
                 </div>
-                <div className={dropdown1Vis ? "upload-run-dropdown" : "upload-run-dropdown hidden"}>
+                <div style={{top: "160px"}} className={dropdown1Vis ? "upload-run-dropdown" : "upload-run-dropdown hidden"}>
                   {games.map((game) => (
                     <div onClick={() => { _handle_game_select(game.id.toString(), game.name); _handle_dropdowns(1) }} key={game.id}>{game.name}</div>
                   ))}
@@ -213,7 +213,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
                 !loading &&
                 (
                   <>
-                    <div className='upload-run-map-container' style={{ paddingBottom: "10px" }}>
+                    <div className='upload-run-map-container upload-run-item' style={{ paddingBottom: "10px" }}>
                       <div style={{ padding: "15px 0px" }}>
                         <h3 style={{ margin: "10px 0px" }}>Select Map</h3>
                         <div onClick={() => _handle_dropdowns(2)} style={{ display: "flex", alignItems: "center", cursor: "pointer", justifyContent: "space-between" }}>
@@ -221,14 +221,13 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
                           <i style={{ rotate: "-90deg", transform: "translate(-5px, 10px)" }} className="triangle"></i>
                         </div>
                       </div>
-                      <div>
-                        <div id='dropdown2' className={dropdown2Vis ? "upload-run-dropdown" : "upload-run-dropdown hidden"}>
+                        <div style={{top: "160px"}} id='dropdown2' className={dropdown2Vis ? "upload-run-dropdown" : "upload-run-dropdown hidden"}>
                           {selectedGameMaps && selectedGameMaps.filter(gameMap => !gameMap.is_disabled).map((gameMap) => (
                             <div onClick={() => { setUploadRunContent({ ...uploadRunContent, map_id: gameMap.id }); _set_current_map(gameMap.name); _handle_dropdowns(2); }} key={gameMap.id}>{gameMap.name}</div>
                           ))}
                         </div>
                       </div>
-                      <h3 style={{ margin: "10px 0px" }}>Host Demo</h3>
+                      <h1>Host Demo</h1>
                       <div onClick={() => { _handle_file_click(true) }} onDragOver={(e) => { _handle_drag_over(e, true) }} onDrop={(e) => { _handle_drop(e, true) }} onDragLeave={(e) => { _handle_drag_leave(e, true) }} className={`upload-run-drag-area ${dragHightlight ? "upload-run-drag-area-highlight" : ""} ${uploadRunContent.host_demo ? "upload-run-drag-area-hidden" : ""}`}>
                         <input ref={fileInputRef} type="file" name="host_demo" id="host_demo" accept=".dem" onChange={(e) => _handle_file_change(e.target.files, true)} />
                         {!uploadRunContent.host_demo ?
@@ -243,11 +242,12 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
 
                         <span className="upload-run-demo-name">{uploadRunContent.host_demo?.name}</span>
                       </div>
+                                          </div><br/>
                       {
                         games[selectedGameID].is_coop &&
                         (
                           <>
-                            <h3 style={{ margin: "10px 0px" }}>Partner Demo</h3>
+                            <h1>Partner Demo</h1>
                             <div onClick={() => { _handle_file_click(false) }} onDragOver={(e) => { _handle_drag_over(e, false) }} onDrop={(e) => { _handle_drop(e, false) }} onDragLeave={(e) => { _handle_drag_leave(e, false) }} className={`upload-run-drag-area ${dragHightlightPartner ? "upload-run-drag-area-highlight-partner" : ""} ${uploadRunContent.partner_demo ? "upload-run-drag-area-hidden" : ""}`}>
                               <input ref={fileInputRefPartner} type="file" name="partner_demo" id="partner_demo" accept=".dem" onChange={(e) => _handle_file_change(e.target.files, false)} />                                            {!uploadRunContent.partner_demo ?
                                 <div>
@@ -261,12 +261,14 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
 
                               <span className="upload-run-demo-name">{uploadRunContent.partner_demo?.name}</span>
                             </div>
+                                                        </div>
                           </>
                         )
                       }
                       <div className='search-container'>
 
                       </div>
+                                          <br/>
                       <div className='upload-run-buttons-container'>
                         <button onClick={_upload_run}>Submit</button>
                         <button onClick={() => onClose(false)}>Cancel</button>
diff --git a/frontend/src/css/UploadRunDialog.css b/frontend/src/css/UploadRunDialog.css
index f6e910b..78fca5e 100644
--- a/frontend/src/css/UploadRunDialog.css
+++ b/frontend/src/css/UploadRunDialog.css
@@ -10,7 +10,7 @@ div#upload-run{
 
 #upload-run-menu{
     position: absolute;
-    left: calc(50% + 160px); top: 130px;
+    left: calc(50%); top: 130px;
     transform: translateX(-50%);
     background-color: #2b2e46;
     z-index: 3; color: white;
@@ -23,14 +23,19 @@ div#upload-run{
     outline: 8px solid #2b2e46;
     border-radius: 20px;
     font-size: 40px;
-        width: 400px;
+        text-wrap: nowrap;
 }
 
 #upload-run-menu-add>div,
 #upload-run-menu-edit>div{
-    display: grid;
+    display: flex;
     font-size: 20px;
     padding: 0px 15px;
+        gap: 2px;
+}
+
+#upload-run-menu-add>div .upload-run-item {
+        margin: 0px 20px;
 }
 
 #upload-run-block{
@@ -59,7 +64,7 @@ div#upload-run{
     animation: dropdown-in 0.2s ease;
     max-height: 300px;
     overflow-y: scroll;
-    width: calc(100% - 30px);
+    width: 400px;
 }
 
 .upload-run-dropdown div {
@@ -111,7 +116,6 @@ button:hover {
 
 .upload-run-map-container {
     display: flex;
-    flex-direction: column;
 }
 
 .upload-run-buttons-container {
diff --git a/frontend/src/pages/Maplist.tsx b/frontend/src/pages/Maplist.tsx
index a76c1f5..4c1c172 100644
--- a/frontend/src/pages/Maplist.tsx
+++ b/frontend/src/pages/Maplist.tsx
@@ -53,7 +53,10 @@ const Maplist: React.FC = () => {
     // location query params
     const queryParams = new URLSearchParams(location.search);
     if (queryParams.get("chapter")) {
-        const cat = parseFloat(queryParams.get("chapter") || "");
+        let cat = parseFloat(queryParams.get("chapter") || "");
+                if (gameId == 2) {
+                        cat += 10;
+                }
                 _fetch_chapters(cat.toString());
         }