Refactor some init code into dom.js

Also refactor code within dom.js, so that functions only used internally
are not exported.

src/gui/html/js/dom.js

@@ -6,10 +6,10 @@
   } else {
     // Browser globals
     root.loot = root.loot || {};
-    root.loot.DOM = factory();
+    root.loot.DOM = factory(root.marked);
   }
-}(this, () => class {
-  static getElementInTableRowTemplate(rowTemplateId, elementClass) {
+}(this, (marked) => {
+  function getElementInTableRowTemplate(rowTemplateId, elementClass) {
     const select = document.querySelector('link[rel="import"][href$="editable-table.html"]');
     if (select) {
       return select.import.querySelector(`#${rowTemplateId}`).content
@@ -18,45 +18,7 @@
     return document.querySelector(`#${rowTemplateId}`).content.querySelector(`.${elementClass}`);
   }
 
-  static show(elementId, showElement = true) {
-    document.getElementById(elementId).hidden = !showElement;
-  }
-
-  static enable(elementId, enableElement = true) {
-    if (enableElement) {
-      document.getElementById(elementId).removeAttribute('disabled');
-    } else {
-      document.getElementById(elementId).setAttribute('disabled', '');
-    }
-  }
-
-  static updateSelectedGame(gameFolder) {
-    document.getElementById('gameMenu').value = gameFolder;
-
-    /* Also disable deletion of the game's row in the settings dialog. */
-    const table = document.getElementById('gameTable');
-    for (let i = 0; i < table.tBodies[0].rows.length; ++i) {
-      const folderElements = table.tBodies[0].rows[i].getElementsByClassName('folder');
-      if (folderElements.length === 1) {
-        table.setReadOnly(table.tBodies[0].rows[i],
-                          ['delete'],
-                          folderElements[0].value === gameFolder);
-      }
-    }
-  }
-
-  static updateEnabledGames(installedGames) {
-    const gameMenuItems = document.getElementById('gameMenu').children;
-    for (let i = 0; i < gameMenuItems.length; ++i) {
-      if (installedGames.indexOf(gameMenuItems[i].getAttribute('value')) === -1) {
-        gameMenuItems[i].setAttribute('disabled', true);
-      } else {
-        gameMenuItems[i].removeAttribute('disabled');
-      }
-    }
-  }
-
-  static createGameItem(game) {
+  function createGameItem(game) {
     const menuItem = document.createElement('paper-item');
     menuItem.setAttribute('value', game.folder);
     menuItem.textContent = game.name;
@@ -64,40 +26,156 @@
     return menuItem;
   }
 
-  static setGameMenuItems(games) {
-    const gameMenu = document.getElementById('gameMenu');
+  function createLanguageItem(language) {
+    const item = document.createElement('paper-item');
+    item.setAttribute('value', language.locale);
+    item.textContent = language.name;
 
-    /* First make sure game listing elements don't have any existing entries. */
-    while (gameMenu.firstElementChild) {
-      gameMenu.removeChild(gameMenu.firstElementChild);
-    }
-
-    games.forEach((game) => {
-      gameMenu.appendChild(this.createGameItem(game));
-    });
+    return item;
   }
 
-  static updateSettingsDialog(settings) {
-    const gameSelect = document.getElementById('defaultGameSelect');
-    const gameTable = document.getElementById('gameTable');
+  function createMessageItem(message) {
+    const li = document.createElement('li');
+    li.className = 'error';
+    /* Use the Marked library for Markdown formatting support. */
+    li.innerHTML = marked(message);
 
-    /* First make sure game listing elements don't have any existing entries. */
-    while (gameSelect.children.length > 1) {
-      gameSelect.removeChild(gameSelect.lastElementChild);
-    }
-    gameTable.clear();
-
-    /* Now fill with new values. */
-    settings.games.forEach((game) => {
-      gameSelect.appendChild(this.createGameItem(game));
-
-      const row = gameTable.addRow(game);
-      gameTable.setReadOnly(row, ['name', 'folder', 'type']);
-    });
-
-    gameSelect.value = settings.game;
-    document.getElementById('languageSelect').value = settings.language;
-    document.getElementById('enableDebugLogging').checked = settings.enableDebugLogging;
-    document.getElementById('updateMasterlist').checked = settings.updateMasterlist;
+    return li;
   }
+
+  function createGameTypeItem(gameType) {
+    const item = document.createElement('paper-item');
+    item.setAttribute('value', gameType);
+    item.textContent = gameType;
+
+    return item;
+  }
+
+  function forceSelectDefaultValue(element) {
+    element.setAttribute('value', element.firstElementChild.getAttribute('value'));
+  }
+
+  return class DOM {
+    static show(elementId, showElement = true) {
+      document.getElementById(elementId).hidden = !showElement;
+    }
+
+    static enable(elementOrId, enableElement = true) {
+      let element = elementOrId;
+      if (element instanceof String) {
+        element = document.getElementById('element');
+      }
+
+      if (enableElement) {
+        element.removeAttribute('disabled');
+      } else {
+        element.setAttribute('disabled', '');
+      }
+    }
+
+    static updateSelectedGame(gameFolder) {
+      document.getElementById('gameMenu').value = gameFolder;
+
+      /* Also disable deletion of the game's row in the settings dialog. */
+      const table = document.getElementById('gameTable');
+      for (let i = 0; i < table.tBodies[0].rows.length; ++i) {
+        const folderElements = table.tBodies[0].rows[i].getElementsByClassName('folder');
+        if (folderElements.length === 1) {
+          table.setReadOnly(table.tBodies[0].rows[i],
+                            ['delete'],
+                            folderElements[0].value === gameFolder);
+        }
+      }
+    }
+
+    static updateEnabledGames(installedGames) {
+      const gameMenuItems = document.getElementById('gameMenu').children;
+      for (let i = 0; i < gameMenuItems.length; ++i) {
+        DOM.enable(gameMenuItems[i],
+                   installedGames.indexOf(gameMenuItems[i].getAttribute('value')) === -1);
+      }
+    }
+
+    static setGameMenuItems(games) {
+      const gameMenu = document.getElementById('gameMenu');
+
+      /* First make sure game listing elements don't have any existing entries. */
+      while (gameMenu.firstElementChild) {
+        gameMenu.removeChild(gameMenu.firstElementChild);
+      }
+
+      games.forEach((game) => {
+        gameMenu.appendChild(createGameItem(game));
+      });
+    }
+
+    static updateSettingsDialog(settings) {
+      const gameSelect = document.getElementById('defaultGameSelect');
+      const gameTable = document.getElementById('gameTable');
+
+      /* First make sure game listing elements don't have any existing entries. */
+      while (gameSelect.children.length > 1) {
+        gameSelect.removeChild(gameSelect.lastElementChild);
+      }
+      gameTable.clear();
+
+      /* Now fill with new values. */
+      settings.games.forEach((game) => {
+        gameSelect.appendChild(createGameItem(game));
+
+        const row = gameTable.addRow(game);
+        gameTable.setReadOnly(row, ['name', 'folder', 'type']);
+      });
+
+      gameSelect.value = settings.game;
+      document.getElementById('languageSelect').value = settings.language;
+      document.getElementById('enableDebugLogging').checked = settings.enableDebugLogging;
+      document.getElementById('updateMasterlist').checked = settings.updateMasterlist;
+    }
+
+    static fillGameTypesList(gameTypes) {
+      const select = getElementInTableRowTemplate('gameRow', 'type');
+
+      gameTypes.forEach((gameType) => {
+        select.appendChild(createGameTypeItem(gameType));
+      });
+
+      forceSelectDefaultValue(select);
+      select.setAttribute('value', select.firstElementChild.getAttribute('value'));
+    }
+
+    static fillLanguagesList(languages) {
+      const settingsLangSelect = document.getElementById('languageSelect');
+      const messageLangSelect = getElementInTableRowTemplate('messageRow', 'language');
+
+      languages.forEach((language) => {
+        const settingsItem = createLanguageItem(language);
+        settingsLangSelect.appendChild(settingsItem);
+        messageLangSelect.appendChild(settingsItem.cloneNode(true));
+      });
+
+      forceSelectDefaultValue(messageLangSelect);
+    }
+
+    static listInitErrors(errorMessages) {
+      if (!errorMessages) {
+        return;
+      }
+      const generalMessagesList = document.getElementById('summary').getElementsByTagName('ul')[0];
+
+      errorMessages.forEach((message) => {
+        generalMessagesList.appendChild(createMessageItem(message));
+      });
+
+      document.getElementById('filterTotalMessageNo').textContent = errorMessages.length;
+      document.getElementById('totalMessageNo').textContent = errorMessages.length;
+      document.getElementById('totalErrorNo').textContent = errorMessages.length;
+    }
+
+    static setVersion(version) {
+      document.getElementById('LOOTVersion').textContent = version.release;
+      document.getElementById('firstTimeLootVersion').textContent = version.release;
+      document.getElementById('LOOTBuild').textContent = version.build;
+    }
+  };
 }));

src/gui/html/js/initialise.js

@@ -33,12 +33,21 @@
                                     root.loot.DOM,
                                     root.loot.Filters,
                                     root.loot.Game,
+                                    root.loot.handlePromiseError,
                                     root.loot.translateStaticText,
                                     root.loot.Plugin,
                                     root.loot.query,
                                     root.loot.Translator);
   }
-}(this, (Dialog, dom, Filters, Game, translateStaticText, Plugin, query, Translator) => {
+}(this, (Dialog,
+         dom,
+         Filters,
+         Game,
+         handlePromiseError,
+         translateStaticText,
+         Plugin,
+         query,
+         Translator) => {
   function setupEventHandlers() {
     /* Set up handlers for filters. */
     document.getElementById('hideVersionNumbers').addEventListener('change', onSidebarFilterToggle);
@@ -141,70 +150,41 @@
     }
   }
 
+  function splitVersion(version) {
+    const lastPeriodIndex = version.lastIndexOf('.');
+    return {
+      release: version.substring(0, lastPeriodIndex),
+      build: version.substring(lastPeriodIndex + 1),
+    };
+  }
+
   function setVersion(appData) {
-    return query('getVersion').then(JSON.parse).then((result) => {
-      /* The fourth part of the version string is the build number. Trim it. */
-      const pos = result.lastIndexOf('.');
-      appData.version = result.substring(0, pos);
-      document.getElementById('LOOTVersion').textContent = appData.version;
-      document.getElementById('firstTimeLootVersion').textContent = appData.version;
-      document.getElementById('LOOTBuild').textContent = result.substring(pos + 1);
+    return query('getVersion').then(JSON.parse).then(splitVersion).then((version) => {
+      appData.version = version.release;
+      dom.setVersion(version);
     });
   }
 
   function setLanguages() {
-    return query('getLanguages').then(JSON.parse).then((result) => {
-      /* Now fill in language options. */
-      const settingsLangSelect = document.getElementById('languageSelect');
-      const messageLangSelect = dom.getElementInTableRowTemplate('messageRow', 'language');
+    return query('getLanguages').then(JSON.parse).then(dom.fillLanguagesList);
+  }
 
-      result.forEach((language) => {
-        const settingsItem = document.createElement('paper-item');
-        settingsItem.setAttribute('value', language.locale);
-        settingsItem.textContent = language.name;
-        settingsLangSelect.appendChild(settingsItem);
-        messageLangSelect.appendChild(settingsItem.cloneNode(true));
-      });
-
-      messageLangSelect.setAttribute('value', messageLangSelect.firstElementChild.getAttribute('value'));
+  function getInitErrors() {
+    return query('getInitErrors').then((result) => {
+      if (JSON.parse(result)) {
+        throw new Error(result);
+      }
     });
   }
 
-  function displayInitErrors() {
-    return query('getInitErrors').then(JSON.parse).then((result) => {
-      if (!result) {
-        return result;
-      }
-      const generalMessagesList = document.getElementById('summary').getElementsByTagName('ul')[0];
-
-      result.forEach((message) => {
-        const li = document.createElement('li');
-        li.className = 'error';
-        /* Use the Marked library for Markdown formatting support. */
-        li.innerHTML = window.marked(message);
-        generalMessagesList.appendChild(li);
-      });
-
-      document.getElementById('filterTotalMessageNo').textContent = result.length;
-      document.getElementById('totalMessageNo').textContent = result.length;
-      document.getElementById('totalErrorNo').textContent = result.length;
-
-      return result;
-    });
+  function handleInitErrors(error) {
+    dom.listInitErrors(JSON.parse(error.message));
+    Dialog.closeProgress();
+    document.getElementById('settingsButton').click();
   }
 
   function setGameTypes() {
-    return query('getGameTypes').then(JSON.parse).then((result) => {
-      /* Fill in game row template's game type options. */
-      const select = dom.getElementInTableRowTemplate('gameRow', 'type');
-      result.forEach((gameType) => {
-        const item = document.createElement('paper-item');
-        item.setAttribute('value', gameType);
-        item.textContent = gameType;
-        select.appendChild(item);
-      });
-      select.setAttribute('value', select.firstElementChild.getAttribute('value'));
-    });
+    return query('getGameTypes').then(JSON.parse).then(dom.fillGameTypesList);
   }
 
   function setInstalledGames(appData) {
@@ -268,20 +248,16 @@
       translateStaticText(loot.l10n);
       /* Also need to update the settings UI. */
       dom.updateSettingsDialog(loot.settings);
-      loot.DOM.setGameMenuItems(loot.settings.games);
-      loot.DOM.updateEnabledGames(loot.installedGames);
-      loot.DOM.updateSelectedGame(loot.game.folder);
-    }).then(displayInitErrors).then((result) => {
-      if (result) {
-        Dialog.closeProgress();
-        document.getElementById('settingsButton').click();
-        return Promise.resolve();
-      }
-      return setGameData(loot);
-    }).then(() => {
-      if (!loot.settings.lastVersion || loot.settings.lastVersion !== loot.version) {
+      dom.setGameMenuItems(loot.settings.games);
+      dom.updateEnabledGames(loot.installedGames);
+      dom.updateSelectedGame(loot.game.folder);
+    }).then(getInitErrors)
+    .then(() => setGameData(loot))
+    .catch(handleInitErrors)
+    .then(() => {
+      if (loot.settings.lastVersion !== loot.version) {
         document.getElementById('firstRun').open();
       }
-    }).catch(loot.handlePromiseError);
+    }).catch(handlePromiseError);
   };
 }));