Modularize sorter

manage/filters.js

@@ -1,5 +1,5 @@
 /* global installed messageBox */
-/* global updateSort */
+/* global sorter */
 'use strict';
 
 const filtersSelector = {
@@ -156,7 +156,7 @@ function filterOnChange({target: el, forceRefilter}) {
   if (installed) {
     reapplyFilter();
   }
-  debounce(updateSort);
+  debounce(sorter().updateSort);
 }
 
 

manage/manage.js

@@ -3,7 +3,7 @@
 /* global checkUpdate, handleUpdateInstalled */
 /* global objectDiff */
 /* global configDialog */
-/* global sortInit, sortStyles, updateSort */
+/* global sorter */
 'use strict';
 
 let installed;
@@ -85,7 +85,7 @@ function initGlobalEvents() {
 
   // N.B. triggers existing onchange listeners
   setupLivePrefs();
-  sortInit();
+  sorter().sortInit();
 
   $$('[id^="manage.newUI"]')
     .forEach(el => (el.oninput = (el.onchange = switchUI)));
@@ -108,7 +108,7 @@ function initGlobalEvents() {
 
 
 function showStyles(styles = []) {
-  const sorted = sortStyles({
+  const sorted = sorter().sortStyles({
     parser: 'style',
     styles: styles.map(style => ({
       style,
@@ -459,7 +459,7 @@ function handleUpdate(style, {reason, method} = {}) {
     handleUpdateInstalled(entry, reason);
   }
   filterAndAppend({entry});
-  debounce(updateSort);
+  debounce(sorter().updateSort);
   if (!entry.matches('.hidden') && reason !== 'import') {
     animateElement(entry);
     scrollElementIntoView(entry);
@@ -568,18 +568,6 @@ function switchUI({styleOnly} = {}) {
 }
 
 
-function updateStripes() {
-  let index = 0;
-  [...installed.children].forEach(entry => {
-    const list = entry.classList;
-    if (!list.contains('hidden')) {
-      list.add(index % 2 ? 'odd' : 'even');
-      list.remove(index++ % 2 ? 'even' : 'odd');
-    }
-  });
-}
-
-
 function rememberScrollPosition() {
   history.replaceState({scrollY: window.scrollY}, document.title);
 }

manage/sort.js

@@ -2,6 +2,8 @@
 /* global messageBox */
 'use strict';
 
+var sorter = (() => {
+
   const sorterType = {
     alpha: (a, b) => (a < b ? -1 : a === b ? 0 : 1),
     number: (a, b) => a - b
@@ -144,12 +146,6 @@ function sortStyles({styles, parser}) {
     });
   }
 
-function manageSort(event) {
-  event.preventDefault();
-  prefs.set('manage.newUI.sort', this.value);
-  debounce(updateSort);
-}
-
   function updateSort() {
     const renderBin = document.createDocumentFragment();
     const entries = sortStyles({parser: 'entry'});
@@ -176,6 +172,12 @@ function updateSort() {
     }
   }
 
+  function manageSort(event) {
+    event.preventDefault();
+    prefs.set('manage.newUI.sort', this.value);
+    debounce(updateSort);
+  }
+
   function showSortHelp(event) {
     event.preventDefault();
     messageBox({
@@ -194,3 +196,17 @@ function sortInit() {
     $('#sorter-help').onclick = showSortHelp;
     addSortOptions();
   }
+
+  function updateStripes() {
+    let index = 0;
+    [...installed.children].forEach(entry => {
+      const list = entry.classList;
+      if (!list.contains('hidden')) {
+        list.add(index % 2 ? 'odd' : 'even');
+        list.remove(index++ % 2 ? 'even' : 'odd');
+      }
+    });
+  }
+
+  return {sortInit, updateSort, sortStyles, updateStripes};
+});

manage/updater-ui.js

@@ -1,6 +1,6 @@
 /* global messageBox */
 /* global ENTRY_ID_PREFIX, newUI */
-/* global filtersSelector, filterAndAppend, updateSort */
+/* global filtersSelector, filterAndAppend, sorter */
 'use strict';
 
 onDOMready().then(() => {
@@ -144,7 +144,7 @@ function reportUpdateState(state, style, details) {
   }
   if (filtersSelector.hide) {
     filterAndAppend({entry});
-    debounce(updateSort);
+    debounce(sorter().updateSort);
   }
 }