Export JS classes as modules

#38869

1 files changed, 65 insertions, 69 deletions

diff --git a/app/assets/javascripts/pager.js b/app/assets/javascripts/pager.js
index 6792b984cc5..6552a88b606 100644
--- a/app/assets/javascripts/pager.js
+++ b/app/assets/javascripts/pager.js
@@ -1,78 +1,74 @@
 import { getParameterByName } from '~/lib/utils/common_utils';
 import { removeParams } from './lib/utils/url_utility';
 
-(() => {
-  const ENDLESS_SCROLL_BOTTOM_PX = 400;
-  const ENDLESS_SCROLL_FIRE_DELAY_MS = 1000;
+const ENDLESS_SCROLL_BOTTOM_PX = 400;
+const ENDLESS_SCROLL_FIRE_DELAY_MS = 1000;
 
-  const Pager = {
-    init(limit = 0, preload = false, disable = false, prepareData = $.noop, callback = $.noop) {
-      this.url = $('.content_list').data('href') || removeParams(['limit', 'offset']);
-      this.limit = limit;
-      this.offset = parseInt(getParameterByName('offset'), 10) || this.limit;
-      this.disable = disable;
-      this.prepareData = prepareData;
-      this.callback = callback;
-      this.loading = $('.loading').first();
-      if (preload) {
-        this.offset = 0;
-        this.getOld();
-      }
-      this.initLoadMore();
-    },
+export default {
+  init(limit = 0, preload = false, disable = false, prepareData = $.noop, callback = $.noop) {
+    this.url = $('.content_list').data('href') || removeParams(['limit', 'offset']);
+    this.limit = limit;
+    this.offset = parseInt(getParameterByName('offset'), 10) || this.limit;
+    this.disable = disable;
+    this.prepareData = prepareData;
+    this.callback = callback;
+    this.loading = $('.loading').first();
+    if (preload) {
+      this.offset = 0;
+      this.getOld();
+    }
+    this.initLoadMore();
+  },
 
-    getOld() {
-      this.loading.show();
-      $.ajax({
-        type: 'GET',
-        url: this.url,
-        data: `limit=${this.limit}&offset=${this.offset}`,
-        dataType: 'json',
-        error: () => this.loading.hide(),
-        success: (data) => {
-          this.append(data.count, this.prepareData(data.html));
-          this.callback();
+  getOld() {
+    this.loading.show();
+    $.ajax({
+      type: 'GET',
+      url: this.url,
+      data: `limit=${this.limit}&offset=${this.offset}`,
+      dataType: 'json',
+      error: () => this.loading.hide(),
+      success: (data) => {
+        this.append(data.count, this.prepareData(data.html));
+        this.callback();
 
-          // keep loading until we've filled the viewport height
-          if (!this.disable && !this.isScrollable()) {
-            this.getOld();
-          } else {
-            this.loading.hide();
-          }
-        },
-      });
-    },
+        // keep loading until we've filled the viewport height
+        if (!this.disable && !this.isScrollable()) {
+          this.getOld();
+        } else {
+          this.loading.hide();
+        }
+      },
+    });
+  },
 
-    append(count, html) {
-      $('.content_list').append(html);
-      if (count > 0) {
-        this.offset += count;
-      } else {
-        this.disable = true;
-      }
-    },
+  append(count, html) {
+    $('.content_list').append(html);
+    if (count > 0) {
+      this.offset += count;
+    } else {
+      this.disable = true;
+    }
+  },
 
-    isScrollable() {
-      const $w = $(window);
-      return $(document).height() > $w.height() + $w.scrollTop() + ENDLESS_SCROLL_BOTTOM_PX;
-    },
+  isScrollable() {
+    const $w = $(window);
+    return $(document).height() > $w.height() + $w.scrollTop() + ENDLESS_SCROLL_BOTTOM_PX;
+  },
 
-    initLoadMore() {
-      $(document).unbind('scroll');
-      $(document).endlessScroll({
-        bottomPixels: ENDLESS_SCROLL_BOTTOM_PX,
-        fireDelay: ENDLESS_SCROLL_FIRE_DELAY_MS,
-        fireOnce: true,
-        ceaseFire: () => this.disable === true,
-        callback: () => {
-          if (!this.loading.is(':visible')) {
-            this.loading.show();
-            this.getOld();
-          }
-        },
-      });
-    },
-  };
-
-  window.Pager = Pager;
-})();
+  initLoadMore() {
+    $(document).unbind('scroll');
+    $(document).endlessScroll({
+      bottomPixels: ENDLESS_SCROLL_BOTTOM_PX,
+      fireDelay: ENDLESS_SCROLL_FIRE_DELAY_MS,
+      fireOnce: true,
+      ceaseFire: () => this.disable === true,
+      callback: () => {
+        if (!this.loading.is(':visible')) {
+          this.loading.show();
+          this.getOld();
+        }
+      },
+    });
+  },
+};