Refactor some event handlers into DOM module

Most of the event handlers require access to post-init object
instances, but those that only interact with the DOM have been
moved into the DOM module.

src/gui/html/js/dom.js

@@ -186,5 +186,54 @@
       document.getElementById('firstTimeLootVersion').textContent = version.release;
       document.getElementById('LOOTBuild').textContent = version.build;
     }
+
+    static onJumpToGeneralInfo() {
+      document.getElementById('pluginCardList').scroll(0, 0);
+    }
+
+    static onShowAboutDialog() {
+      document.getElementById('about').open();
+    }
+
+    static onSwitchSidebarTab(evt) {
+      document.getElementById(evt.target.selected).parentElement.selected = evt.target.selected;
+    }
+
+    static onSidebarClick(evt) {
+      if (evt.target.hasAttribute('data-index')) {
+        const index = parseInt(evt.target.getAttribute('data-index'), 10);
+        document.getElementById('pluginCardList').scrollToIndex(index);
+
+        if (evt.type === 'dblclick') {
+          /* Double-clicking can select the item's text, clear the selection in
+             case that has happened. */
+          window.getSelection().removeAllRanges();
+
+          if (!document.body.hasAttribute('data-editors')) {
+            document.getElementById(evt.target.getAttribute('data-id')).onShowEditor();
+          }
+        }
+      }
+    }
+
+    static onShowSettingsDialog() {
+      document.getElementById('settingsDialog').open();
+    }
+
+    static onFocusSearch(evt) {
+      if (evt.ctrlKey && evt.keyCode === 70) { // 'f'
+        document.getElementById('mainToolbar').classList.add('search');
+        document.getElementById('searchBar').focusInput();
+      }
+    }
+
+    static onSearchOpen() {
+      document.getElementById('mainToolbar').classList.add('search');
+      document.getElementById('searchBar').focusInput();
+    }
+
+    static onSearchChangeSelection(evt) {
+      document.getElementById('pluginCardList').scrollToIndex(evt.detail.selection);
+    }
   };
 }));

src/gui/html/js/events.js

@@ -29,9 +29,7 @@ function onConflictsFilter(evt) {
     loot.filters.apply(loot.game.plugins);
   }
 }
-function onJumpToGeneralInfo() {
-  document.getElementById('pluginCardList').scroll(0, 0);
-}
+
 function onChangeGame(evt) {
   if (evt.detail.item.getAttribute('value') === loot.game.folder) {
     return;
@@ -271,9 +269,6 @@ function onOpenReadme() {
 function onOpenLogLocation() {
   loot.query('openLogLocation').catch(loot.handlePromiseError);
 }
-function onShowAboutDialog() {
-  document.getElementById('about').open();
-}
 function handleUnappliedChangesClose(change) {
   loot.Dialog.askQuestion('', loot.l10n.translate('You have not yet applied or cancelled your %s. Are you sure you want to quit?', change), loot.l10n.translate('Quit'), (result) => {
     if (!result) {
@@ -294,32 +289,8 @@ function onQuit() {
     window.close();
   }
 }
-
-function onSwitchSidebarTab(evt) {
-  document.getElementById(evt.target.selected).parentElement.selected = evt.target.selected;
-}
-function onSidebarClick(evt) {
-  if (evt.target.hasAttribute('data-index')) {
-    const index = parseInt(evt.target.getAttribute('data-index'), 10);
-    document.getElementById('pluginCardList').scrollToIndex(index);
-
-    if (evt.type === 'dblclick') {
-      /* Double-clicking can select the item's text, clear the selection in
-         case that has happened. */
-      window.getSelection().removeAllRanges();
-
-      if (!document.body.hasAttribute('data-editors')) {
-        document.getElementById(evt.target.getAttribute('data-id')).onShowEditor();
-      }
-    }
-  }
-}
-
-function areSettingsValid() {
-  return document.getElementById('gameTable').validate();
-}
 function onApplySettings(evt) {
-  if (!areSettingsValid()) {
+  if (!document.getElementById('gameTable').validate()) {
     evt.stopPropagation();
   }
 }
@@ -358,10 +329,6 @@ function onCloseSettingsDialog(evt) {
     loot.DOM.updateSelectedGame(loot.game.folder);
   }).catch(loot.handlePromiseError);
 }
-function onShowSettingsDialog() {
-  document.getElementById('settingsDialog').open();
-}
-
 function onEditorOpen(evt) {
   /* Set the editor data. */
   document.getElementById('editor').setEditorData(evt.target.data);
@@ -459,16 +426,7 @@ function onClearMetadata(evt) {
   });
 }
 
-function onFocusSearch(evt) {
-  if (evt.ctrlKey && evt.keyCode === 70) { // 'f'
-    document.getElementById('mainToolbar').classList.add('search');
-    document.getElementById('searchBar').focusInput();
-  }
-}
-function onSearchOpen() {
-  document.getElementById('mainToolbar').classList.add('search');
-  document.getElementById('searchBar').focusInput();
-}
+
 function onSearchBegin(evt) {
   loot.game.plugins.forEach((plugin) => {
     plugin.isSearchResult = false;
@@ -491,9 +449,6 @@ function onSearchBegin(evt) {
 
   evt.target.results = results;
 }
-function onSearchChangeSelection(evt) {
-  document.getElementById('pluginCardList').scrollToIndex(evt.detail.selection);
-}
 function onSearchEnd(evt) {
   loot.game.plugins.forEach((plugin) => {
     plugin.isSearchResult = false;

src/gui/html/js/initialise.js

@@ -69,24 +69,24 @@
     document.getElementById('copyLoadOrderButton').addEventListener('click', onCopyLoadOrder);
     document.getElementById('copyContentButton').addEventListener('click', onCopyContent);
     document.getElementById('refreshContentButton').addEventListener('click', onContentRefresh);
-    document.getElementById('settingsButton').addEventListener('click', onShowSettingsDialog);
+    document.getElementById('settingsButton').addEventListener('click', dom.onShowSettingsDialog);
     document.getElementById('helpButton').addEventListener('click', onOpenReadme);
-    document.getElementById('aboutButton').addEventListener('click', onShowAboutDialog);
+    document.getElementById('aboutButton').addEventListener('click', dom.onShowAboutDialog);
     document.getElementById('quitButton').addEventListener('click', onQuit);
     document.getElementById('gameMenu').addEventListener('iron-select', onChangeGame);
     document.getElementById('updateMasterlistButton').addEventListener('click', onUpdateMasterlist);
     document.getElementById('sortButton').addEventListener('click', onSortPlugins);
     document.getElementById('applySortButton').addEventListener('click', onApplySort);
     document.getElementById('cancelSortButton').addEventListener('click', onCancelSort);
-    document.getElementById('sidebarTabs').addEventListener('iron-select', onSwitchSidebarTab);
-    document.getElementById('jumpToGeneralInfo').addEventListener('click', onJumpToGeneralInfo);
+    document.getElementById('sidebarTabs').addEventListener('iron-select', dom.onSwitchSidebarTab);
+    document.getElementById('jumpToGeneralInfo').addEventListener('click', dom.onJumpToGeneralInfo);
 
     /* Set up search event handlers. */
-    document.getElementById('showSearch').addEventListener('click', onSearchOpen);
+    document.getElementById('showSearch').addEventListener('click', dom.onSearchOpen);
     document.getElementById('searchBar').addEventListener('loot-search-begin', onSearchBegin);
-    document.getElementById('searchBar').addEventListener('loot-search-change-selection', onSearchChangeSelection, false);
+    document.getElementById('searchBar').addEventListener('loot-search-change-selection', dom.onSearchChangeSelection, false);
     document.getElementById('searchBar').addEventListener('loot-search-end', onSearchEnd);
-    window.addEventListener('keyup', onFocusSearch);
+    window.addEventListener('keyup', dom.onFocusSearch);
 
     /* Set up event handlers for settings dialog. */
     const settings = document.getElementById('settingsDialog');
@@ -99,8 +99,8 @@
     document.body.addEventListener('loot-copy-metadata', onCopyMetadata);
     document.body.addEventListener('loot-clear-metadata', onClearMetadata);
 
-    document.getElementById('cardsNav').addEventListener('click', onSidebarClick);
-    document.getElementById('cardsNav').addEventListener('dblclick', onSidebarClick);
+    document.getElementById('cardsNav').addEventListener('click', dom.onSidebarClick);
+    document.getElementById('cardsNav').addEventListener('dblclick', dom.onSidebarClick);
 
     /* Set up handler for plugin data changes. */
     document.addEventListener('loot-plugin-message-change', Plugin.onMessageChange);