Export project, projectAvatar and projectImport as ES6 modules

app/assets/javascripts/dispatcher.js

@@ -20,15 +20,15 @@ import groupsSelect from './groups_select';
 import NamespaceSelect from './namespace_select';
 /* global NewCommitForm */
 /* global NewBranchForm */
-/* global Project */
+import Project from './project';
-/* global ProjectAvatar */
+import projectAvatar from './project_avatar';
 /* global MergeRequest */
 /* global Compare */
 /* global CompareAutocomplete */
 /* global ProjectFindFile */
 /* global ProjectNew */
 /* global ProjectShow */
-/* global ProjectImport */
+import projectImport from './project_import';
 import Labels from './labels';
 import LabelManager from './label_manager';
 /* global Sidebar */
@@ -378,7 +378,7 @@ import Diff from './diff';
           initSettingsPanels();
           break;
         case 'projects:imports:show':
-          new ProjectImport();
+          projectImport();
           break;
         case 'projects:pipelines:new':
           new NewBranchForm($('.js-new-pipeline-form'));
@@ -604,7 +604,7 @@ import Diff from './diff';
           break;
         case 'projects':
           new Project();
-          new ProjectAvatar();
+          projectAvatar();
           switch (path[1]) {
             case 'compare':
               new CompareAutocomplete();

app/assets/javascripts/main.js

@@ -69,8 +69,6 @@ import './notifications_dropdown';
 import './notifications_form';
 import './pager';
 import './preview_markdown';
-import './project';
-import './project_avatar';
 import './project_find_file';
 import './project_import';
 import './project_label_subscription';

app/assets/javascripts/project.js

@@ -1,139 +1,131 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, quotes, consistent-return, no-new, prefer-arrow-callback, no-return-assign, one-var, one-var-declaration-per-line, object-shorthand, comma-dangle, no-else-return, newline-per-chained-call, no-shadow, vars-on-top, prefer-template, max-len */
+/* eslint-disable func-names, space-before-function-paren, no-var, consistent-return, no-new, prefer-arrow-callback, no-return-assign, one-var, one-var-declaration-per-line, object-shorthand, no-else-return, newline-per-chained-call, no-shadow, vars-on-top, prefer-template, max-len */
 /* global ProjectSelect */
 
 import Cookies from 'js-cookie';
 
-(function() {
+export default class Project {
-  this.Project = (function() {
+  constructor() {
-    function Project() {
+    const $cloneOptions = $('ul.clone-options-dropdown');
-      const $cloneOptions = $('ul.clone-options-dropdown');
+    const $projectCloneField = $('#project_clone');
-      const $projectCloneField = $('#project_clone');
+    const $cloneBtnText = $('a.clone-dropdown-btn span');
-      const $cloneBtnText = $('a.clone-dropdown-btn span');
 
-      const selectedCloneOption = $cloneBtnText.text().trim();
+    const selectedCloneOption = $cloneBtnText.text().trim();
-      if (selectedCloneOption.length > 0) {
+    if (selectedCloneOption.length > 0) {
-        $(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active');
+      $(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active');
-      }
-
-      $('a', $cloneOptions).on('click', (e) => {
-        const $this = $(e.currentTarget);
-        const url = $this.attr('href');
-
-        e.preventDefault();
-
-        $('.is-active', $cloneOptions).not($this).removeClass('is-active');
-        $this.toggleClass('is-active');
-        $projectCloneField.val(url);
-        $cloneBtnText.text($this.text());
-
-        return $('.clone').text(url);
-      });
-      // Ref switcher
-      this.initRefSwitcher();
-      $('.project-refs-select').on('change', function() {
-        return $(this).parents('form').submit();
-      });
-      $('.hide-no-ssh-message').on('click', function(e) {
-        Cookies.set('hide_no_ssh_message', 'false');
-        $(this).parents('.no-ssh-key-message').remove();
-        return e.preventDefault();
-      });
-      $('.hide-no-password-message').on('click', function(e) {
-        Cookies.set('hide_no_password_message', 'false');
-        $(this).parents('.no-password-message').remove();
-        return e.preventDefault();
-      });
-      this.projectSelectDropdown();
     }
 
-    Project.prototype.projectSelectDropdown = function() {
+    $('a', $cloneOptions).on('click', (e) => {
-      new ProjectSelect();
+      const $this = $(e.currentTarget);
-      $('.project-item-select').on('click', (function(_this) {
+      const url = $this.attr('href');
-        return function(e) {
-          return _this.changeProject($(e.currentTarget).val());
-        };
-      })(this));
-    };
 
-    Project.prototype.changeProject = function(url) {
+      e.preventDefault();
-      return window.location = url;
-    };
 
-    Project.prototype.initRefSwitcher = function() {
+      $('.is-active', $cloneOptions).not($this).removeClass('is-active');
-      var refListItem = document.createElement('li');
+      $this.toggleClass('is-active');
-      var refLink = document.createElement('a');
+      $projectCloneField.val(url);
+      $cloneBtnText.text($this.text());
 
-      refLink.href = '#';
+      return $('.clone').text(url);
+    });
+    // Ref switcher
+    Project.initRefSwitcher();
+    $('.project-refs-select').on('change', function() {
+      return $(this).parents('form').submit();
+    });
+    $('.hide-no-ssh-message').on('click', function(e) {
+      Cookies.set('hide_no_ssh_message', 'false');
+      $(this).parents('.no-ssh-key-message').remove();
+      return e.preventDefault();
+    });
+    $('.hide-no-password-message').on('click', function(e) {
+      Cookies.set('hide_no_password_message', 'false');
+      $(this).parents('.no-password-message').remove();
+      return e.preventDefault();
+    });
+    Project.projectSelectDropdown();
+  }
 
-      return $('.js-project-refs-dropdown').each(function() {
+  static projectSelectDropdown () {
-        var $dropdown, selected;
+    new ProjectSelect();
-        $dropdown = $(this);
+    $('.project-item-select').on('click', e => Project.changeProject($(e.currentTarget).val()));
-        selected = $dropdown.data('selected');
+  }
-        return $dropdown.glDropdown({
-          data: function(term, callback) {
-            return $.ajax({
-              url: $dropdown.data('refs-url'),
-              data: {
-                ref: $dropdown.data('ref'),
-                search: term
-              },
-              dataType: "json"
-            }).done(function(refs) {
-              return callback(refs);
-            });
-          },
-          selectable: true,
-          filterable: true,
-          filterRemote: true,
-          filterByText: true,
-          inputFieldName: $dropdown.data('input-field-name'),
-          fieldName: $dropdown.data('field-name'),
-          renderRow: function(ref) {
-            var li = refListItem.cloneNode(false);
 
-            if (ref.header != null) {
+  static changeProject(url) {
-              li.className = 'dropdown-header';
+    return window.location = url;
-              li.textContent = ref.header;
+  }
-            } else {
-              var link = refLink.cloneNode(false);
 
-              if (ref === selected) {
+  static initRefSwitcher() {
-                link.className = 'is-active';
+    var refListItem = document.createElement('li');
-              }
+    var refLink = document.createElement('a');
 
-              link.textContent = ref;
+    refLink.href = '#';
-              link.dataset.ref = ref;
 
-              li.appendChild(link);
+    return $('.js-project-refs-dropdown').each(function() {
+      var $dropdown, selected;
+      $dropdown = $(this);
+      selected = $dropdown.data('selected');
+      return $dropdown.glDropdown({
+        data: function(term, callback) {
+          return $.ajax({
+            url: $dropdown.data('refs-url'),
+            data: {
+              ref: $dropdown.data('ref'),
+              search: term,
+            },
+            dataType: 'json',
+          }).done(function(refs) {
+            return callback(refs);
+          });
+        },
+        selectable: true,
+        filterable: true,
+        filterRemote: true,
+        filterByText: true,
+        inputFieldName: $dropdown.data('input-field-name'),
+        fieldName: $dropdown.data('field-name'),
+        renderRow: function(ref) {
+          var li = refListItem.cloneNode(false);
+
+          if (ref.header != null) {
+            li.className = 'dropdown-header';
+            li.textContent = ref.header;
+          } else {
+            var link = refLink.cloneNode(false);
+
+            if (ref === selected) {
+              link.className = 'is-active';
             }
 
-            return li;
+            link.textContent = ref;
-          },
+            link.dataset.ref = ref;
-          id: function(obj, $el) {
-            return $el.attr('data-ref');
-          },
-          toggleLabel: function(obj, $el) {
-            return $el.text().trim();
-          },
-          clicked: function(options) {
-            const { e } = options;
-            e.preventDefault();
-            if ($('input[name="ref"]').length) {
-              var $form = $dropdown.closest('form');
 
-              var $visit = $dropdown.data('visit');
+            li.appendChild(link);
-              var shouldVisit = $visit ? true : $visit;
+          }
-              var action = $form.attr('action');
+
-              var divider = action.indexOf('?') === -1 ? '?' : '&';
+          return li;
-              if (shouldVisit) {
+        },
-                gl.utils.visitUrl(`${action}${divider}${$form.serialize()}`);
+        id: function(obj, $el) {
-              }
+          return $el.attr('data-ref');
+        },
+        toggleLabel: function(obj, $el) {
+          return $el.text().trim();
+        },
+        clicked: function(options) {
+          const { e } = options;
+          e.preventDefault();
+          if ($('input[name="ref"]').length) {
+            var $form = $dropdown.closest('form');
+
+            var $visit = $dropdown.data('visit');
+            var shouldVisit = $visit ? true : $visit;
+            var action = $form.attr('action');
+            var divider = action.indexOf('?') === -1 ? '?' : '&';
+            if (shouldVisit) {
+              gl.utils.visitUrl(`${action}${divider}${$form.serialize()}`);
             }
           }
-        });
+        },
       });
-    };
+    });
-
+  }
-    return Project;
+}
-  })();
-}).call(window);

app/assets/javascripts/project_avatar.js

@@ -1,20 +1,13 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, one-var-declaration-per-line, no-useless-escape, max-len */
+export default function projectAvatar() {
-(function() {
+  $('.js-choose-project-avatar-button').bind('click', function onClickAvatar() {
-  this.ProjectAvatar = (function() {
+    const form = $(this).closest('form');
-    function ProjectAvatar() {
+    return form.find('.js-project-avatar-input').click();
-      $('.js-choose-project-avatar-button').bind('click', function() {
+  });
-        var form;
-        form = $(this).closest('form');
-        return form.find('.js-project-avatar-input').click();
-      });
-      $('.js-project-avatar-input').bind('change', function() {
-        var filename, form;
-        form = $(this).closest('form');
-        filename = $(this).val().replace(/^.*[\\\/]/, '');
-        return form.find('.js-avatar-filename').text(filename);
-      });
-    }
 
-    return ProjectAvatar;
+  $('.js-project-avatar-input').bind('change', function onClickAvatarInput() {
-  })();
+    const form = $(this).closest('form');
-}).call(window);
+    // eslint-disable-next-line no-useless-escape
+    const filename = $(this).val().replace(/^.*[\\\/]/, '');
+    return form.find('.js-avatar-filename').text(filename);
+  });
+}

app/assets/javascripts/project_import.js

@@ -1,13 +1,8 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, prefer-arrow-callback, max-len */
+import { visitUrl } from './lib/utils/url_utility';
 
-(function() {
+export default function projectImport() {
-  this.ProjectImport = (function() {
+  setTimeout(() => {
-    function ProjectImport() {
+    visitUrl(location.href);
-      setTimeout(function() {
+  }, 5000);
-        return gl.utils.visitUrl(location.href);
+}
-      }, 5000);
-    }
 
-    return ProjectImport;
-  })();
-}).call(window);