Merge pull request #46 from TimLohrer/main

Mittwoch Launcher Fixes
NoRiskClient · Jun 18, 2024 · 8fd2991 · 8fd2991
2 parents 1c2c522 + 11221ea
commit 8fd2991
Show file tree

Hide file tree

Showing 7 changed files with 258 additions and 66 deletions.
diff --git a/src/components/Window.svelte b/src/components/Window.svelte
@@ -3,56 +3,73 @@
     import PokemonScreen from "./main/PokemonScreen.svelte";
     import StartUpScreen from "./updater/StartUpScreen.svelte";
     import UpdateManager from "./updater/UpdateManager.svelte";
+    import MaintenanceModeTokenModal from "./maintenance-mode/MaintenanceModeTokenModal.svelte";
     import {checkUpdate} from "@tauri-apps/api/updater";
     import {onMount} from "svelte";
+    import { appWindow } from "@tauri-apps/api/window";
 
     // Load options from file
     let options;
     let showUpdateScreen = null;
     let MAINTENANCE_MODE = false;
+    let maintenanceModeTokenPopup = false;
 
     onMount(async () => {
         const reload = async (afterReload) => {
             await invoke("get_options").then(async (result) => {
                 options = result;
-
                 // Debug options - might be interesting to see what's in there
                 console.debug("read options", options);
 
                 // Easy way to store options
-                options.store = async function () {
+                options.store = async () => {
                     console.debug("storing options", options);
-                    await invoke("store_options", {options}).catch(e => console.error(e));
+                    await invoke("store_options", {
+                        options,
+                    }).catch((e) => console.error(e));
                 };
 
                 options.reload = reload;
 
-                options.toggleTheme = function () {
+                options.toggleTheme = () => {
                     if (options.theme === "LIGHT") {
                         options.theme = "DARK";
-                        window.document.body.classList.add("dark-mode");
+                        window.document.body.classList.add(
+                            "dark-mode",
+                        );
                     } else {
                         options.theme = "LIGHT";
-                        window.document.body.classList.remove("dark-mode");
+                        window.document.body.classList.remove(
+                            "dark-mode",
+                        );
                     }
-                    invoke("store_options", {options}).catch(e => console.error(e));
+                    invoke("store_options", { options }).catch(
+                        (e) => console.error(e),
+                    );
                 };
 
                 if (options.theme === "DARK") {
-                    window.document.body.classList.add("dark-mode");
+                    window.document.body.classList.add(
+                        "dark-mode",
+                    );
                 } else {
-                    window.document.body.classList.remove("dark-mode");
+                    window.document.body.classList.remove(
+                        "dark-mode",
+                    );
                 }
 
                 try {
-                    const {shouldUpdate} = await checkUpdate();
+                    const { shouldUpdate } = await checkUpdate();
                     showUpdateScreen = shouldUpdate;
-                    invoke("console_log_info", {message: `Checking for Updates... ${shouldUpdate}`}).catch(e => console.error(e));
+                    invoke("console_log_info", {
+                        message: `Checking for Updates... ${shouldUpdate}`,
+                    }).catch((e) => console.error(e));
                 } catch (error) {
                     showUpdateScreen = false;
-                    invoke("console_log_error", {message: `error`}).catch(e => console.error(e));
+                    invoke("console_log_error", {
+                        message: "error",
+                    }).catch((e) => console.error(e));
                 }
-
             });
         }
         reload()
@@ -73,11 +90,6 @@
         alert("You are offline! Please connect to the internet and restart the app.\n If this problem persists, please contact the developer.\n\n (Error: " + e + ")");
         console.error(e);
     });
-
-    async function toggleMaintenance() {
-        if (prompt("Enter the password to toggle maintenance mode") != "bro_wieso_suchst_du_dannach_?_warte_halt_noch_bissl") return;
-        MAINTENANCE_MODE = !MAINTENANCE_MODE;
-    }
 </script>
 
 <div class="window">
@@ -86,13 +98,16 @@
             <UpdateManager/>
         {:else}
             {#if MAINTENANCE_MODE}
+                {#if maintenanceModeTokenPopup}
+                    <MaintenanceModeTokenModal bind:showModal={maintenanceModeTokenPopup} bind:maintenanceMode={MAINTENANCE_MODE}/>
+                {/if}
                 <div class="black-bar" data-tauri-drag-region></div>
                 <div class="maintenance-mode">
                     <!-- svelte-ignore a11y-click-events-have-key-events -->
-                    <h1 class="title text" on:click={() => toggleMaintenance()}>Maintenance Mode</h1>
+                    <h1 class="title text" on:click={() => maintenanceModeTokenPopup = true}>Maintenance Mode</h1>
                     <p class="text">The server is currently in maintenance mode. Please try again later.</p>
                     <!-- svelte-ignore a11y-click-events-have-key-events -->
-                    <h1 class="quit-button" on:click={() => { window.close(); }}>Exit</h1>
+                    <h1 class="quit-button" on:click={() => { appWindow.close(); }}>Exit</h1>
                 </div>
                 <div class="black-bar" data-tauri-drag-region></div>
             {:else}
@@ -112,8 +127,8 @@
     }
     
     .text {
-        color: #e8e8e8;
-        text-shadow: 2px 2px #7a7777;
+        color: var(--font-color);
+        text-shadow: 2px 2px var(--font-color-text-shadow);
         font-family: 'Press Start 2P', serif;
         text-align: center;
     }

diff --git a/src/components/account/AccountListItem.svelte b/src/components/account/AccountListItem.svelte
@@ -1,11 +1,11 @@
 <script>
-  import { onMount } from "svelte";
   import { invoke } from "@tauri-apps/api/tauri";
 
   export let account;
   export let isActive;
   export let options;
   export let dialog;
+  export let onSelect;
 
   function getRandomObjectOrNull(array) {
     if (array.length === 0) {
@@ -20,15 +20,18 @@
       options.currentUuid = account.uuid;
       options = options;
       options.store();
+      onSelect();
     }
   }
 
-  function handleRemoveAccount() {
+  async function handleRemoveAccount() {
     options.accounts = options.accounts.filter(entry => entry.uuid !== account.uuid);
     options.currentUuid = getRandomObjectOrNull(options.accounts)?.uuid ?? null;
     options = options;
     options.store();
-    invoke("remove_account", { loginData: account })
+    await invoke("remove_account", { loginData: account }).then(() => {
+      onSelect();
+    });
 
     if (options.currentUuid === null) {
       dialog.close();

diff --git a/src/components/account/AccountModal.svelte b/src/components/account/AccountModal.svelte
@@ -4,6 +4,7 @@
 
   export let showModal;
   export let options;
+  export let refreshData;
 
   let dialog; // HTMLDialogElement
   $: if (dialog && showModal) dialog.showModal();
@@ -25,6 +26,7 @@
       }
 
       options.store();
+      refreshData();
     }).catch(e => {
       console.error("microsoft authentication error", e);
       if (e.includes(403)) {
@@ -50,7 +52,7 @@
       </div>
       <hr>
       {#each options.accounts as account}
-        <AccountListItem bind:dialog isActive={options.currentUuid === account.uuid} bind:options={options} account={account} />
+        <AccountListItem bind:dialog isActive={options.currentUuid === account.uuid} bind:options={options} account={account} onSelect={refreshData} />
       {/each}
     </div>
     <!-- svelte-ignore a11y-autofocus -->

diff --git a/src/components/config/ExperimentalTokenModal.svelte b/src/components/config/ExperimentalTokenModal.svelte
@@ -18,26 +18,34 @@
     $: if (dialog && showModal) dialog.showModal();
   
     async function save() {
-    if (experimentalModeToken == "") return;
-      invoke("enable_experimental_mode", {
-        experimentalToken: experimentalModeToken
-      }).then(async allowed => {
-        options.experimentalModeToken = experimentalModeToken;
-        options.experimentalMode = allowed;
-        await options.store();
-        hideModal();
-        console.log(`Enabled experimental mode: ${allowed}`);
-        let existingIndex = options.accounts.findIndex(acc => acc.uuid === options.currentUuid);
-          if (options.currentUuid === null || options.accounts[existingIndex].experimentalToken === "" || options.accounts[existingIndex].noriskToken === "") {
-            return getNewTokenType();
-        }
-      }).catch(async e => {
-        options.experimentalMode = false;
-        options.experimentalModeToken = "";
-        await options.store()
-        alert(`Failed to enable experimental mode: ${e}`);
-        console.error(e);
-      })
+    if (experimentalModeToken === "") return;
+				invoke("enable_experimental_mode", {
+					experimentalToken: experimentalModeToken,
+				})
+					.then(async (allowed) => {
+						options.experimentalModeToken = experimentalModeToken;
+						options.experimentalMode = allowed;
+						await options.store();
+						hideModal();
+						console.log(`Enabled experimental mode: ${allowed}`);
+						const existingIndex = options.accounts.findIndex(
+							(acc) => acc.uuid === options.currentUuid,
+						);
+						if (
+							options.currentUuid === null ||
+							options.accounts[existingIndex].experimentalToken === "" ||
+							options.accounts[existingIndex].noriskToken === ""
+						) {
+							return getNewTokenType();
+						}
+					})
+					.catch(async (e) => {
+						options.experimentalMode = false;
+						options.experimentalModeToken = "";
+						await options.store();
+						alert(`Failed to enable experimental mode: ${e}`);
+						console.error(e);
+					});
     }
 
     async function getNewTokenType() {
@@ -47,7 +55,9 @@
       options.currentUuid = loginData.uuid;
 
       // Index des vorhandenen Objekts mit derselben UUID suchen
-      let existingIndex = options.accounts.findIndex(obj => obj.uuid === loginData.uuid);
+						const existingIndex = options.accounts.findIndex(
+							(obj) => obj.uuid === loginData.uuid,
+						);
       if (existingIndex !== -1) {
         console.debug("Replace Account");
         options.accounts[existingIndex] = {

diff --git a/src/components/main/PokemonScreen.svelte b/src/components/main/PokemonScreen.svelte
@@ -434,14 +434,21 @@
   }
 
   async function connect_discord_intigration() {
-    if ((await check_discord_link()) == true) return discordLinked = true;
-    const loginData = options.accounts.find(obj => obj.uuid === options.currentUuid);
-    await invoke("connect_discord_intigration", { options, loginData }).then(() => {
-      console.log("Connected to Discord Intigration");
-    }).catch(err => {
-      console.error(err);
-      alert(err);
-    });
+    if ((await check_discord_link()) === true) {
+					discordLinked = true;
+					return;
+				}
+				const loginData = options.accounts.find(
+					(obj) => obj.uuid === options.currentUuid,
+				);
+				await invoke("connect_discord_intigration", { options, loginData })
+					.then(() => {
+						console.log("Connected to Discord Intigration");
+					})
+					.catch((err) => {
+						console.error(err);
+						alert(err);
+					});
   }
   
   async function check_discord_link() {
@@ -458,7 +465,7 @@
       alert(err);
       linked = false;
     });
-    return linked;
+    return linked ?? false;
   }
 
   async function unlink_discord() {
@@ -531,17 +538,19 @@
       <h1 class="back-to-loading-button" on:click={() => backToLoadingScreen()}>[BACK TO RUNNING GAME]</h1>
     {/if}
     <div transition:scale={{ x: 15, duration: 300, easing: quintOut }} class="left-settings-button-wrapper">
-      <!-- svelte-ignore a11y-click-events-have-key-events -->
-      <h1 on:click={() => discordLinked ? unlink_discord() : connect_discord_intigration()}>{#if discordLinked}UN{/if}LINK DISCORD</h1>
+      {#if options.accounts.length > 0 && branches.length > 0 && options.currentUuid != null}
+        <!-- svelte-ignore a11y-click-events-have-key-events -->
+        <h1 on:click={() => discordLinked ? unlink_discord() : connect_discord_intigration()}>{#if discordLinked}UN{/if}LINK DISCORD</h1>
+      {/if}
     </div>
     <div transition:scale={{ x: 15, duration: 300, easing: quintOut }} class="settings-button-wrapper">
-      {#if options.accounts.length > 0 && featureWhitelist.includes("INVITE_FRIENDS") && (friendInviteSlots.availableSlots != -1 && friendInviteSlots.availableSlots > friendInviteSlots.previousInvites)}
+      {#if options.accounts.length > 0 && branches.length > 0 && options.currentUuid != null && featureWhitelist.includes("INVITE_FRIENDS") && (friendInviteSlots.availableSlots != -1 && friendInviteSlots.availableSlots > friendInviteSlots.previousInvites)}
         <!-- svelte-ignore a11y-click-events-have-key-events -->
         <h1 class="invite-button" on:click={handleShowInvitePopup}><p>✨</p>Invite</h1>
       {/if}
       <!-- svelte-ignore a11y-click-events-have-key-events -->
       <h1 on:click={() => settingsShown = true}>SETTINGS</h1>
-      {#if options.accounts.length > 0}
+      {#if options.accounts.length > 0 && branches.length > 0 && options.currentUuid != null}
         <!-- svelte-ignore a11y-click-events-have-key-events -->
         <h1 on:click={handleOpenProfilesScreen}>PROFILES</h1>
         <!-- svelte-ignore a11y-click-events-have-key-events -->
@@ -570,7 +579,7 @@
       on:selectstart={preventSelection} style="cursor: pointer"
           on:mousedown={preventSelection} class="nes-font switch"
           on:click={() => handleSwitchBranch(true)}
-          hidden={branches.length < 1 || options.currentUuid == null}>
+          style:opacity={branches.length < 2 || options.currentUuid == null ? 0 : 100}>
         &lt;</h1>
       <section style="display:flex;justify-content:center">
         {#if refreshingAccount}
@@ -597,10 +606,10 @@
           on:selectstart={preventSelection}
           style="cursor: pointer" on:mousedown={preventSelection}
           class="nes-font switch" on:click={() => handleSwitchBranch(false)}
-          hidden={branches.length < 1 || options.currentUuid == null}>
+          style:opacity={branches.length < 2 || options.currentUuid == null ? 0 : 100}>
         &gt;</h1>
     </div>
-    <SkinButton on:launch={runClient} on:requestBranches={requestBranches} bind:options={options}></SkinButton>
+    <SkinButton on:launch={runClient} on:requestBranches={() => loadAllData()} bind:options={options} bind:branches={branches} />
     <div transition:scale={{ x: 15, duration: 300, easing: quintOut }} on:selectstart={preventSelection}
         on:mousedown={preventSelection} class="copyright">
       © 2000-{new Date().getFullYear()} HGLabor/Friends Inc. v0.4.8

diff --git a/src/components/main/SkinButton.svelte b/src/components/main/SkinButton.svelte
@@ -10,6 +10,7 @@
 
   let skinHovered = false;
   export let options;
+  export let branches;
 
   function handleSkinHover() {
     skinHovered = true;
@@ -48,7 +49,7 @@
 
       options.store();
       setTimeout(async () => {
-        dispatch("requestBranches")
+        dispatch("requestBranches");
       }, 100);
     }).catch(e => {
       console.error("microsoft authentication error", e);
@@ -65,11 +66,11 @@
 </script>
 
 <div transition:scale={{ x: 15, duration: 300, easing: quintOut }}>
-  <Modal bind:options={options} bind:showModal></Modal>
+  <Modal bind:options={options} bind:showModal refreshData={() => dispatch("requestBranches")}></Modal>
   <div class="skin-kopf-container"
        on:mouseenter={handleSkinHover}
        on:mouseleave={handleSkinHoverOut}>
-    {#if uuid !== null}
+    {#if uuid !== null && branches.length > 0}
         <!-- svelte-ignore a11y-click-events-have-key-events -->
         <img class="skin-kopf"
              src={`https://mineskin.eu/helm/${uuid}/150.png`}