Cleaner loading spinner during software upgrades

chat/ads/ad-coordinator-host.ts

@@ -10,7 +10,7 @@ export class AdCoordinatorHost {
   static readonly MIN_DISTANCE = 5000;
   private lastPost = Date.now();
 
-  async processAdRequest(event: IpcMainEvent, adId: string) {
+  async processAdRequest(event: IpcMainEvent, adId: string): Promise<void> {
     await adCoordinatorThroat(
       async() => {
         const sinceLastPost = Date.now() - this.lastPost;

electron/Index.vue

@@ -3,9 +3,10 @@
         <div v-html="styling"></div>
         <div v-if="!characters" style="display:flex; align-items:center; justify-content:center; height: 100%;">
             <div class="card bg-light" style="width: 400px;">
-                <div class="initializer" v-show="showSpinner">
+                <div class="initializer" :class="{visible: !hasCompletedUpgrades, complete: hasCompletedUpgrades, shouldShow: shouldShowSpinner}">
                     <div class="title">
                         Getting ready, please wait...
+                        <small>You should only experience this delay once per software update</small>
                     </div>
                     <i class="fas fa-circle-notch fa-spin search-spinner"></i>
                 </div>
@@ -113,6 +114,7 @@
     import {defaultHost, GeneralSettings, nativeRequire} from './common';
     import { fixLogs /*SettingsStore, Logs as FSLogs*/ } from './filesystem';
     import * as SlimcatImporter from './importer';
+    import Bluebird from 'bluebird';
     // import Connection from '../fchat/connection';
     // import Notifications from './notifications';
 
@@ -167,22 +169,40 @@
         defaultCharacter?: number;
         l = l;
         settings!: GeneralSettings;
+        hasCompletedUpgrades!: boolean;
         importProgress = 0;
         profileName = '';
         adName = '';
         fixCharacters: ReadonlyArray<string> = [];
         fixCharacter = '';
 
-        showSpinner = true;
+        shouldShowSpinner = false;
+
+
+        async startAndUpgradeCache(): Promise<void> {
+            const timer = setTimeout(
+              () => {
+                this.shouldShowSpinner = true;
+              },
+              250
+            );
+
+            // tslint:disable-next-line no-floating-promises
+            await core.cache.start(this.settings, this.hasCompletedUpgrades);
+
+            await Bluebird.delay(1000);
+
+            clearTimeout(timer);
+
+            parent.send('rising-upgrade-complete');
+
+            this.hasCompletedUpgrades = true;
+        }
 
 
         @Hook('created')
         async created(): Promise<void> {
-            // tslint:disable-next-line no-floating-promises
+            await this.startAndUpgradeCache();
-            await core.cache.start(this.settings);
-
-            // await this.prepper;
-            this.showSpinner = false;
 
             if(this.settings.account.length > 0) this.saveLogin = true;
             keyStore.getPassword(this.settings.account)
@@ -384,7 +404,7 @@
 
 
     .initializer {
-        position: absolute;
+        position: fixed;
         top: 0;
         left: 0;
         right: 0;
@@ -392,9 +412,21 @@
         display: flex;
         align-items: center;
         justify-content: center;
-        transition: all 0.25s;
+        opacity: 0;
         backdrop-filter: blur(3px) grayscale(35%);
 
+        &.shouldShow {
+            transition: all 0.25s;
+
+            &.visible {
+                opacity: 1;
+            }
+        }
+
+        &.complete {
+            pointer-events: none !important;
+        }
+
         i {
             font-size: 130pt;
             top: 50%;
@@ -406,12 +438,17 @@
         .title {
             position: absolute;
             top: 0;
-            background: rgba(19, 19, 19, 0.6);
+            background: rgba(147, 255, 215, 0.6);
             width: 100%;
             text-align: center;
             padding-top: 20px;
             padding-bottom: 20px;
             font-weight: bold;
+
+            small {
+                display: block;
+                opacity: 0.8;
+            }
         }
     }
 </style>

electron/Window.vue

@@ -1,5 +1,5 @@
 <template>
-    <div style="display:flex;flex-direction:column;height:100%" :class="'platform-' + platform" @auxclick.prevent>
+    <div style="display: flex;flex-direction:column;height:100%" :class="'platform-' + platform" @auxclick.prevent>
         <div v-html="styling"></div>
         <div style="display:flex;align-items:stretch;border-bottom-width:1px" class="border-bottom" id="window-tabs">
             <h4 style="padding:2px 0">F-Chat</h4>
@@ -17,7 +17,7 @@
                         </a>
                     </a>
                 </li>
-                <li v-show="canOpenTab" class="addTab nav-item" id="addTab">
+                <li v-show="(canOpenTab && hasCompletedUpgrades)" class="addTab nav-item" id="addTab">
                     <a href="#" @click.prevent="addTab()" class="nav-link"><i class="fa fa-plus"></i></a>
                 </li>
             </ul>
@@ -84,6 +84,8 @@
         hasUpdate = false;
         platform = process.platform;
         lockTab = false;
+        hasCompletedUpgrades = false;
+
 
         @Hook('mounted')
         async mounted(): Promise<void> {
@@ -105,6 +107,7 @@
                 log.transports.console.level = settings.risingSystemLogLevel;
             });
 
+            electron.ipcRenderer.on('rising-upgrade-complete', () => { this.hasCompletedUpgrades = true; });
             electron.ipcRenderer.on('allow-new-tabs', (_e: Event, allow: boolean) => this.canOpenTab = allow);
             electron.ipcRenderer.on('open-tab', () => this.addTab());
             electron.ipcRenderer.on('update-available', (_e: Event, available: boolean) => this.hasUpdate = available);
@@ -244,7 +247,7 @@
                 pathname: path.join(__dirname, 'index.html'),
                 protocol: 'file:',
                 slashes: true,
-                query: {settings: JSON.stringify(this.settings)}
+                query: {settings: JSON.stringify(this.settings), hasCompletedUpgrades: JSON.stringify(this.hasCompletedUpgrades)}
             }));
             tab.view.setBounds(getWindowBounds());
             this.lockTab = false;

electron/chat.ts

@@ -224,5 +224,8 @@ initCore(connection, settings, Logs, SettingsStore, Notifications);
 //tslint:disable-next-line:no-unused-expression
 new Index({
     el: '#app',
-    data: {settings}
+    data: {
+        settings,
+        hasCompletedUpgrades: JSON.parse(params['hasCompletedUpgrades']!)
+    }
 });

electron/main.ts

@@ -385,8 +385,8 @@ function onReady(): void {
         setGeneralSettings(settings);
     };
 
-    const setSystemLogLevel = (logLevel: log.LevelOption) => {
+    const setSystemLogLevel = (logLevell: log.LevelOption) => {
-        settings.risingSystemLogLevel = logLevel;
+        settings.risingSystemLogLevel = logLevell;
         setGeneralSettings(settings);
     };
 
@@ -594,6 +594,11 @@ function onReady(): void {
         const window = electron.BrowserWindow.fromWebContents(e.sender) as BrowserWindow | undefined;
         if(window !== undefined) window.setOverlayIcon(hasNew ? badge : emptyBadge, hasNew ? 'New messages' : '');
     });
+
+    electron.ipcMain.on('rising-upgrade-complete', () => {
+        for(const w of electron.webContents.getAllWebContents()) w.send('rising-upgrade-complete');
+    });
+
     createWindow();
 }
 

learn/cache-manager.ts

@@ -171,14 +171,16 @@ export class CacheManager {
     }
 
 
-    async start(settings: GeneralSettings): Promise<void> {
+    async start(settings: GeneralSettings, skipFlush: boolean): Promise<void> {
         await this.stop();
 
         this.profileStore = await IndexedStore.open();
 
         this.profileCache.setStore(this.profileStore);
 
-        await this.profileStore.flushProfiles(settings.risingCacheExpiryDays);
+        if (!skipFlush) {
+          await this.profileStore.flushProfiles(settings.risingCacheExpiryDays);
+        }
 
         EventBus.$on(
             'character-data',