[chore] TSLint cleanup

utils/helpers/arrayToString.ts

@@ -1,3 +1,6 @@
+/**
+ * Returns the input array as a comma separated string.
+ */
 export function arrayToString<T>(a: T[]) {
     return `[${a.join(", ")}]`;
 }

utils/helpers/createProgressBarText.ts

@@ -1,3 +1,6 @@
+/**
+ * Represents the possible configuration values that can be provided when creating the progress bar text.
+ */
 interface IProgressBarConfiguration {
     /**
      * Current progress, taken as a decimal (i.e. '0.6' to represent '60%')
@@ -10,6 +13,9 @@ interface IProgressBarConfiguration {
     totalTicks?: number;
 }
 
+/**
+ * Represents concrete configuration values when creating the progress bar text.
+ */
 interface IProgressBarConfigurationMaterialized extends IProgressBarConfiguration {
     progress: number;
     totalTicks: number;

utils/helpers/isPowerOfTwo.ts

@@ -7,7 +7,11 @@ export function isPowerOfTwo(n: number) {
         return false;
     }
 
+    if (n === 0) {
+        return false;
+    }
+
     // Disabiling the bitwise rule because it's honestly the most effecient way to check for this.
     // tslint:disable-next-line:no-bitwise
-    return n && (n & (n - 1)) === 0;
+    return (n & (n - 1)) === 0;
 }

utils/uiHelpers/createAccordionElement.ts

@@ -1,5 +1,8 @@
 import { createElement } from "./createElement";
 
+/**
+ * Possible configuration parameters when creating the accordion element.
+ */
 interface IAccordionConfigurationParameters {
     /**
      * The HTML to appear in the accordion header.
@@ -16,6 +19,7 @@ interface IAccordionConfigurationParameters {
      */
     panelText?: string;
 }
+
 /**
  * Creates both the header and panel element of an accordion and sets the click handler
  * @param params The creation parameters.
@@ -28,11 +32,11 @@ export function createAccordionElement(params: IAccordionConfigurationParameters
             const pnl: CSSStyleDeclaration = (this.nextElementSibling as HTMLDivElement).style;
             pnl.display = pnl.display === "block" ? "none" : "block";
         },
-        id: params.id ? `${params.id}-hdr` : undefined,
+        id: params.id !== undefined ? `${params.id}-hdr` : undefined,
         innerHTML: params.hdrText,
     }) as HTMLButtonElement;
     const panel: HTMLDivElement = createElement("div", {
-        id: params.id ? `${params.id}-panel` : undefined,
+        id: params.id !== undefined ? `${params.id}-panel` : undefined,
         innerHTML: params.panelText,
     }) as HTMLDivElement;
 

utils/uiHelpers/createElement.ts

@@ -1,9 +1,15 @@
+/**
+ * Options specific to creating an anchor ("<a>") element.
+ */
 interface ICreateElementAnchorOptions {
     href?: string;
     target?: string;
     text?: string;
 }
 
+/**
+ * Options specific to creating an input ("<input>") element.
+ */
 interface ICreateElementInputOptions {
     checked?: boolean;
     maxLength?: number;
@@ -14,10 +20,16 @@ interface ICreateElementInputOptions {
     value?: string;
 }
 
+/**
+ * Options specific to creating a label ("<label>") element.
+ */
 interface ICreateElementLabelOptions {
     for?: string;
 }
 
+/**
+ * Options for setting up event listeners on the element.
+ */
 interface ICreateElementListenerOptions {
     changeListener?(this: HTMLElement, ev: Event): any;
     clickListener?(this: HTMLElement, ev: MouseEvent): any;
@@ -26,6 +38,10 @@ interface ICreateElementListenerOptions {
     onkeyup?(this: HTMLElement, ev: KeyboardEvent): any;
 }
 
+/**
+ * Options for setting up the inline-styling of element.
+ * NOTE: Relying on CSS styling should be preferred over forcing the higher specificity via inline styles.
+ */
 interface ICreateElementStyleOptions {
     backgroundColor?: string;
     border?: string;
@@ -43,11 +59,17 @@ interface ICreateElementStyleOptions {
     width?: string;
 }
 
+/**
+ * Options for adding an in-game tooltip to the element.
+ */
 interface ICreateElementTooltipOptions {
     tooltip?: string;
     tooltipleft?: string;
 }
 
+/**
+ * All possible configuration options when creating an element.
+ */
 interface ICreateElementOptions extends
     ICreateElementStyleOptions,
     ICreateElementListenerOptions,
@@ -71,118 +93,120 @@ interface ICreateElementOptions extends
 }
 
 function setElementAnchor(el: HTMLAnchorElement, params: ICreateElementAnchorOptions) {
-    if (params.text) {
+    if (params.text !== undefined) {
         el.text = params.text;
     }
-    if (params.href) {
+    if (params.href !== undefined) {
         el.href = params.href;
     }
-    if (params.target) {
+    if (params.target !== undefined) {
         el.target = params.target;
     }
 }
 
 function setElementInput(el: HTMLInputElement, params: ICreateElementInputOptions) {
-    if (params.name) {
+    if (params.name !== undefined) {
         el.name = params.name;
     }
-    if (params.value) {
+    if (params.value !== undefined) {
         el.value = params.value;
     }
-    if (params.type) {
+    if (params.type !== undefined) {
         el.type = params.type;
     }
-    if (params.checked) {
+    if (params.checked !== undefined) {
         el.checked = params.checked;
     }
-    if (params.pattern) {
+    if (params.pattern !== undefined) {
         el.pattern = params.pattern;
     }
-    if (params.maxLength) {
+    if (params.maxLength !== undefined) {
         el.maxLength = params.maxLength;
     }
-    if (params.placeholder) {
+    if (params.placeholder !== undefined) {
         el.placeholder = params.placeholder;
     }
 }
 
 function setElementLabel(el: HTMLLabelElement, params: ICreateElementLabelOptions) {
-    if (params.for) {
+    if (params.for !== undefined) {
         el.htmlFor = params.for;
     }
 }
 
 function setElementListeners(el: HTMLElement, params: ICreateElementListenerOptions) {
-    if (params.clickListener) {
+    // tslint:disable:no-unbound-method
+    if (params.clickListener !== undefined) {
         el.addEventListener("click", params.clickListener);
     }
-    if (params.inputListener) {
+    if (params.inputListener !== undefined) {
         el.addEventListener("input", params.inputListener);
     }
-    if (params.changeListener) {
+    if (params.changeListener !== undefined) {
         el.addEventListener("change", params.changeListener);
     }
-    if (params.onkeyup) {
+    if (params.onkeyup !== undefined) {
         el.addEventListener("keyup", params.onkeyup);
     }
-    if (params.onfocus) {
+    if (params.onfocus !== undefined) {
         el.addEventListener("focus", params.onfocus);
     }
+    // tslint:enable:no-unbound-method
 }
 
 function setElementStyle(el: HTMLElement, params: ICreateElementStyleOptions) {
-    if (params.display) {
+    if (params.display !== undefined) {
         el.style.display = params.display;
     }
-    if (params.visibility) {
+    if (params.visibility !== undefined) {
         el.style.visibility = params.visibility;
     }
-    if (params.margin) {
+    if (params.margin !== undefined) {
         el.style.margin = params.margin;
     }
-    if (params.marginLeft) {
+    if (params.marginLeft !== undefined) {
         el.style.marginLeft = params.marginLeft;
     }
-    if (params.marginTop) {
+    if (params.marginTop !== undefined) {
         el.style.marginTop = params.marginTop;
     }
-    if (params.padding) {
+    if (params.padding !== undefined) {
         el.style.padding = params.padding;
     }
-    if (params.color) {
+    if (params.color !== undefined) {
         el.style.color = params.color;
     }
-    if (params.border) {
+    if (params.border !== undefined) {
         el.style.border = params.border;
     }
-    if (params.float) {
+    if (params.float !== undefined) {
         el.style.cssFloat = params.float;
     }
-    if (params.fontSize) {
+    if (params.fontSize !== undefined) {
         el.style.fontSize = params.fontSize;
     }
-    if (params.whiteSpace) {
+    if (params.whiteSpace !== undefined) {
         el.style.whiteSpace = params.whiteSpace;
     }
-    if (params.width) {
+    if (params.width !== undefined) {
         el.style.width = params.width;
     }
-    if (params.backgroundColor) {
+    if (params.backgroundColor !== undefined) {
         el.style.backgroundColor = params.backgroundColor;
     }
-    if (params.position) {
+    if (params.position !== undefined) {
         el.style.position = params.position;
     }
 }
 
 function setElementTooltip(el: HTMLElement, params: ICreateElementTooltipOptions) {
-    if (params.tooltip && params.tooltip !== "")     {
+    if (params.tooltip !== undefined && params.tooltip !== "")     {
         el.className += " tooltip";
         el.appendChild(createElement("span", {
             class: "tooltiptext",
             innerHTML: params.tooltip,
         }));
-    } else if (params.tooltipleft) {
+    } else if (params.tooltipleft !== undefined) {
         el.className += " tooltip";
         el.appendChild(createElement("span", {
             class: "tooltiptextleft",
@@ -191,22 +215,27 @@ function setElementTooltip(el: HTMLElement, params: ICreateElementTooltipOptions
     }
 }
 
+/**
+ * An all-in-one-call way of creating an element to be added to the DOM at some point.
+ * @param tagName The HTML tag/element name
+ * @param params Additional parameters to set on the element
+ */
 export function createElement(tagName: string, params: ICreateElementOptions = {}) {
     const el: HTMLElement = document.createElement(tagName);
 
-    if (params.id) {
+    if (params.id !== undefined) {
         el.id = params.id;
     }
-    if (params.class) {
+    if (params.class !== undefined) {
         el.className = params.class;
     }
-    if (params.innerHTML) {
+    if (params.innerHTML !== undefined) {
         el.innerHTML = params.innerHTML;
     }
-    if (params.innerText) {
+    if (params.innerText !== undefined) {
         el.innerText = params.innerText;
     }
-    if (params.tabIndex) {
+    if (params.tabIndex !== undefined) {
         el.tabIndex = params.tabIndex;
     }
 

utils/uiHelpers/removeChildrenFromElement.ts

@@ -1,6 +1,11 @@
 import { isString } from "../helpers/isString";
 import { getElementById } from "./getElementById";
 
+/**
+ * Clears out all children from the provided element.
+ * If a string is passed in, it will treat it as an ID and search for the element to delete all children from.
+ * @param el The element or ID of an element to remove all children from.
+ */
 export function removeChildrenFromElement(el: string | null | Element) {
     if (el === null) {
         return;
@@ -10,7 +15,7 @@ export function removeChildrenFromElement(el: string | null | Element) {
         const elem: HTMLElement | Element = (isString(el) ? getElementById(el as string) : el as Element);
 
         if (elem instanceof Element) {
-            while (elem.firstChild) {
+            while (elem.firstChild !== null) {
                 elem.removeChild(elem.firstChild);
             }
         }

utils/uiHelpers/removeElement.ts

@@ -16,11 +16,11 @@ export function removeElement(elem: Element | null) {
         return;
     }
 
-    while (elem.firstChild) {
+    while (elem.firstChild !== null) {
         elem.removeChild(elem.firstChild);
     }
 
-    if (elem.parentNode) {
+    if (elem.parentNode !== null) {
         elem.parentNode.removeChild(elem);
     }
 }