[refactor] Pulling out createStatusText from Engine

css/styles.scss

@@ -391,21 +391,18 @@ a:visited {
 @-webkit-keyframes status-text{
     from{
         opacity: 1;
-        top: 0;
     }
     to{
         opacity: 0;
-        top: 0;
     }
 }
 
 .status-text{
-    display: inline;
-    position: fixed;
-    top: 0;
-    -webkit-animation: status-text 3s 1;
-    background-color: transparent;
+    display: inline-block;
     height: 15%;
+    position: fixed;
+    z-index: 2;
+    -webkit-animation: status-text 3s 1;
 }
 
 #status-text-container {
@@ -413,14 +410,14 @@ a:visited {
 }
 
 #status-text {
-    font-size: $defaultFontSize * 1.25;
-    color: #fff;
-    right: 0;
-    bottom: 0;
-    padding: 4px;
-    margin-right: 14px;
     background-color: transparent;
-    z-index: 2;
+    font-size: $defaultFontSize * 1.25;
+    bottom: 0;
+    color: #fff;
+    margin-right: 14px;
+    padding: 4px;
+    right: 0;
+    top: 0;
     width: auto;
 }
 

src/SaveObject.js

@@ -23,6 +23,7 @@ import {Reviver, Generic_toJSON,
         Generic_fromJSON}                       from "../utils/JSONReviver";
 import {createElement}                          from "../utils/uiHelpers/createElement";
 import {createPopup}                            from "../utils/uiHelpers/createPopup";
+import {createStatusText}                       from "./ui/createStatusText";
 import {formatNumber}                           from "../utils/StringHelperFunctions";
 import {removeElementById}                      from "../utils/uiHelpers/removeElementById";
 
@@ -97,7 +98,7 @@ BitburnerSaveObject.prototype.saveGame = function(db) {
         //console.log("Saved game to LocalStorage!");
     } catch(e) {
         if (e.code == 22) {
-            Engine.createStatusText("Save failed for localStorage! Check console(F12)");
+            createStatusText("Save failed for localStorage! Check console(F12)");
             console.log("Failed to save game to localStorage because the size of the save file " +
                         "is too large. However, the game will still be saved to IndexedDb if your browser " +
                         "supports it. If you would like to save to localStorage as well, then " +
@@ -106,7 +107,7 @@ BitburnerSaveObject.prototype.saveGame = function(db) {
         }
     }
 
-    Engine.createStatusText("Game saved!");
+    createStatusText("Game saved!");
 }
 
 function loadGame(saveString) {
@@ -581,7 +582,7 @@ BitburnerSaveObject.prototype.deleteGame = function(db) {
     request.onerror = function(e) {
         console.log("Failed to delete save from indexedDb: " + e);
     }
-    Engine.createStatusText("Game deleted!");
+    createStatusText("Game deleted!");
 }
 
 function createNewUpdateText() {

src/engine.js

@@ -1222,23 +1222,6 @@ let Engine = {
         }
     },
 
-    _prevTimeout: null,
-    createStatusText: function(txt) {
-        if (Engine._prevTimeout != null) {
-            clearTimeout(Engine._prevTimeout);
-            Engine._prevTimeout = null;
-        }
-        var statusText = document.getElementById("status-text")
-        statusText.style.display = "inline-block";
-        statusText.setAttribute("class", "status-text");
-        statusText.innerHTML = txt;
-        Engine._prevTimeout = setTimeout(function() {
-            statusText.style.display = "none";
-            statusText.removeAttribute("class");
-            statusText.innerHTML = "";
-        }, 3000);
-    },
-
     //Used when initializing a game
     //elems should be an array of all DOM elements under the header
     closeMainMenuHeader: function(elems) {

src/types.ts

@@ -9,3 +9,8 @@ export type EqualityFunc<T> = (a: T, b: T) => boolean;
 export interface IMap<T> {
   [key: string]: T;
 }
+
+/**
+ * Performs some action, with no returned value.
+ */
+export type Action = () => void;

src/ui/createStatusText.ts

@@ -0,0 +1,27 @@
+import { getElementById } from "../../utils/uiHelpers/getElementById";
+import { Action } from "../types";
+
+const threeSeconds: number = 3000;
+let x: number | undefined;
+
+/**
+ * Displays a status message to the player for approximately 3 seconds.
+ * @param text The status text to display
+ */
+export function createStatusText(text: string) {
+    if (x !== undefined) {
+        clearTimeout(x);
+        // Likely not needed due to clearTimeout, but just in case...
+        x = undefined;
+    }
+
+    const statusElement: HTMLElement = getElementById("status-text");
+    statusElement.classList.add("status-text");
+    statusElement.innerText = text;
+    const handler: Action = () => {
+        statusElement.classList.remove("status-text");
+        statusElement.innerText = "";
+    };
+
+    x = setTimeout(handler, threeSeconds);
+}