Merge branch 'gitlab-ce-cleanup-global-namespace-javascript' into 'master'

Cleaned up global namespace JS

Original MR: https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/6229

## What does this MR do?
Cleans up javascript global namespace by moving the functions that were previously on the window.doSomething namespace

## Are there points in the code the reviewer needs to double check?
None that I'm aware of

## Why was this MR needed?
Improves code maintainability and deals with some of the technical debt 

## Screenshots (if relevant)

## Does this MR meet the acceptance criteria?

- [X] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- Tests
  - [X] All builds are passing
- [X] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [X] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [X] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [X] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

## What are the relevant issue numbers?
Closes #19661

See merge request !7208

CHANGELOG.md

@@ -17,6 +17,7 @@ entry.
 - Fix mobile layout issues in admin user overview page !7087
 - Fix HipChat notifications rendering (airatshigapov, eisnerd)
 - Remove 'Edit' button from wiki edit view !7143 (Hiroyuki Sato)
+- Cleaned up global namespace JS !19661 (Jose Ivan Vargas)
 - Refactor Jira service to use jira-ruby gem
 - Improved todos empty state
 - Add hover to trash icon in notes !7008 (blackst0ne)

app/assets/javascripts/application.js

@@ -55,125 +55,53 @@
 /*= require_directory . */
 /*= require fuzzaldrin-plus */
 
-(function() {
-  window.slugify = function(text) {
-    return text.replace(/[^-a-zA-Z0-9]+/g, '_').toLowerCase();
-  };
-
-  window.ajaxGet = function(url) {
-    return $.ajax({
-      type: "GET",
-      url: url,
-      dataType: "script"
-    });
-  };
-
-  window.split = function(val) {
-    return val.split(/,\s*/);
-  };
-
-  window.extractLast = function(term) {
-    return split(term).pop();
-  };
-
-  window.rstrip = function(val) {
-    if (val) {
-      return val.replace(/\s+$/, '');
-    } else {
-      return val;
-    }
-  };
-
-  // Disable button if text field is empty
-  window.disableButtonIfEmptyField = function(field_selector, button_selector, event_name) {
-    event_name = event_name || 'input';
-    var closest_submit, field;
-    field = $(field_selector);
-    closest_submit = field.closest('form').find(button_selector);
-    if (rstrip(field.val()) === "") {
-      closest_submit.disable();
-    }
-    return field.on(event_name, function() {
-      if (rstrip($(this).val()) === "") {
-        return closest_submit.disable();
-      } else {
-        return closest_submit.enable();
-      }
-    });
-  };
+(function () {
+  document.addEventListener('page:fetch', gl.utils.cleanupBeforeFetch);
+  window.addEventListener('hashchange', gl.utils.shiftWindow);
 
-  // Disable button if any input field with given selector is empty
-  window.disableButtonIfAnyEmptyField = function(form, form_selector, button_selector) {
-    var closest_submit, updateButtons;
-    closest_submit = form.find(button_selector);
-    updateButtons = function() {
-      var filled;
-      filled = true;
-      form.find('input').filter(form_selector).each(function() {
-        return filled = rstrip($(this).val()) !== "" || !$(this).attr('required');
-      });
-      if (filled) {
-        return closest_submit.enable();
-      } else {
-        return closest_submit.disable();
-      }
-    };
-    updateButtons();
-    return form.keyup(updateButtons);
-  };
-
-  window.sanitize = function(str) {
-    return str.replace(/<(?:.|\n)*?>/gm, '');
-  };
-
-  window.shiftWindow = function() {
-    return scrollBy(0, -100);
-  };
-
-  document.addEventListener("page:fetch", gl.utils.cleanupBeforeFetch);
-
-  window.addEventListener("hashchange", shiftWindow);
-
-  window.onload = function() {
+  window.onload = function () {
     // Scroll the window to avoid the topnav bar
     // https://github.com/twitter/bootstrap/issues/1768
     if (location.hash) {
-      return setTimeout(shiftWindow, 100);
+      return setTimeout(gl.utils.shiftWindow, 100);
     }
   };
 
-  $(function() {
-    var $body, $document, $sidebarGutterToggle, $window, bootstrapBreakpoint, checkInitialSidebarSize, fitSidebarForSize, flash;
-    $document = $(document);
-    $window = $(window);
-    $body = $('body');
+  $(function () {
+    var $body = $('body');
+    var $document = $(document);
+    var $window = $(window);
+    var $sidebarGutterToggle = $('.js-sidebar-toggle');
+    var $flash = $('.flash-container');
+    var bootstrapBreakpoint = bp.getBreakpointSize();
+    var checkInitialSidebarSize;
+    var fitSidebarForSize;
 
     // Set the default path for all cookies to GitLab's root directory
     Cookies.defaults.path = gon.relative_url_root || '/';
 
     gl.utils.preventDisabledButtons();
-    bootstrapBreakpoint = bp.getBreakpointSize();
-    $(".nav-sidebar").niceScroll({
+    $('.nav-sidebar').niceScroll({
       cursoropacitymax: '0.4',
       cursorcolor: '#FFF',
-      cursorborder: "1px solid #FFF"
+      cursorborder: '1px solid #FFF'
     });
-    $(".js-select-on-focus").on("focusin", function() {
-      return $(this).select().one('mouseup', function(e) {
+    $('.js-select-on-focus').on('focusin', function () {
+      return $(this).select().one('mouseup', function (e) {
         return e.preventDefault();
       });
     // Click a .js-select-on-focus field, select the contents
     // Prevent a mouseup event from deselecting the input
     });
-    $('.remove-row').bind('ajax:success', function() {
+    $('.remove-row').bind('ajax:success', function () {
       $(this).tooltip('destroy')
         .closest('li')
         .fadeOut();
     });
-    $('.js-remove-tr').bind('ajax:before', function() {
+    $('.js-remove-tr').bind('ajax:before', function () {
       return $(this).hide();
     });
-    $('.js-remove-tr').bind('ajax:success', function() {
+    $('.js-remove-tr').bind('ajax:success', function () {
       return $(this).closest('tr').fadeOut();
     });
     $('select.select2').select2({
@@ -181,8 +109,8 @@
       // Initialize select2 selects
       dropdownAutoWidth: true
     });
-    $('.js-select2').bind('select2-close', function() {
-      return setTimeout((function() {
+    $('.js-select2').bind('select2-close', function () {
+      return setTimeout((function () {
         $('.select2-container-active').removeClass('select2-container-active');
         return $(':focus').blur();
       }), 1);
@@ -192,24 +120,24 @@
     $.fn.tooltip.Constructor.DEFAULTS.trigger = 'hover';
     $body.tooltip({
       selector: '.has-tooltip, [data-toggle="tooltip"]',
-      placement: function(_, el) {
+      placement: function (_, el) {
         return $(el).data('placement') || 'bottom';
       }
     });
-    $('.trigger-submit').on('change', function() {
+    $('.trigger-submit').on('change', function () {
       return $(this).parents('form').submit();
     // Form submitter
     });
     gl.utils.localTimeAgo($('abbr.timeago, .js-timeago'), true);
     // Flash
-    if ((flash = $(".flash-container")).length > 0) {
-      flash.click(function() {
+    if ($flash.length > 0) {
+      $flash.click(function () {
         return $(this).fadeOut();
       });
-      flash.show();
+      $flash.show();
     }
     // Disable form buttons while a form is submitting
-    $body.on('ajax:complete, ajax:beforeSend, submit', 'form', function(e) {
+    $body.on('ajax:complete, ajax:beforeSend, submit', 'form', function (e) {
       var buttons;
       buttons = $('[type="submit"]', this);
       switch (e.type) {
@@ -220,36 +148,36 @@
           return buttons.enable();
       }
     });
-    $(document).ajaxError(function(e, xhrObj, xhrSetting, xhrErrorText) {
-      var ref;
+    $(document).ajaxError(function (e, xhrObj) {
+      var ref = xhrObj.status;
       if (xhrObj.status === 401) {
         return new Flash('You need to be logged in.', 'alert');
-      } else if ((ref = xhrObj.status) === 404 || ref === 500) {
+      } else if (ref === 404 || ref === 500) {
         return new Flash('Something went wrong on our end.', 'alert');
       }
     });
-    $('.account-box').hover(function() {
+    $('.account-box').hover(function () {
       // Show/Hide the profile menu when hovering the account box
       return $(this).toggleClass('hover');
     });
-    $document.on('click', '.diff-content .js-show-suppressed-diff', function() {
+    $document.on('click', '.diff-content .js-show-suppressed-diff', function () {
       var $container;
       $container = $(this).parent();
       $container.next('table').show();
       return $container.remove();
     // Commit show suppressed diff
     });
-    $('.navbar-toggle').on('click', function() {
+    $('.navbar-toggle').on('click', function () {
       $('.header-content .title').toggle();
       $('.header-content .header-logo').toggle();
       $('.header-content .navbar-collapse').toggle();
       return $('.navbar-toggle').toggleClass('active');
     });
     // Show/hide comments on diff
-    $body.on("click", ".js-toggle-diff-comments", function(e) {
+    $body.on('click', '.js-toggle-diff-comments', function (e) {
       var $this = $(this);
-      $this.toggleClass('active');
       var notesHolders = $this.closest('.diff-file').find('.notes_holder');
+      $this.toggleClass('active');
       if ($this.hasClass('active')) {
         notesHolders.show().find('.hide').show();
       } else {
@@ -258,30 +186,27 @@
       $this.trigger('blur');
       return e.preventDefault();
     });
-    $document.off("click", '.js-confirm-danger');
-    $document.on("click", '.js-confirm-danger', function(e) {
-      var btn, form, text;
+    $document.off('click', '.js-confirm-danger');
+    $document.on('click', '.js-confirm-danger', function (e) {
+      var btn = $(e.target);
+      var form = btn.closest('form');
+      var text = btn.data('confirm-danger-message');
       e.preventDefault();
-      btn = $(e.target);
-      text = btn.data("confirm-danger-message");
-      form = btn.closest("form");
       return new ConfirmDangerModal(form, text);
     });
-    $document.on('click', 'button', function() {
+    $document.on('click', 'button', function () {
       return $(this).blur();
     });
-    $('input[type="search"]').each(function() {
-      var $this;
-      $this = $(this);
+    $('input[type="search"]').each(function () {
+      var $this = $(this);
       $this.attr('value', $this.val());
     });
-    $document.off('keyup', 'input[type="search"]').on('keyup', 'input[type="search"]', function(e) {
+    $document.off('keyup', 'input[type="search"]').on('keyup', 'input[type="search"]', function () {
       var $this;
       $this = $(this);
       return $this.attr('value', $this.val());
     });
-    $sidebarGutterToggle = $('.js-sidebar-toggle');
-    $document.off('breakpoint:change').on('breakpoint:change', function(e, breakpoint) {
+    $document.off('breakpoint:change').on('breakpoint:change', function (e, breakpoint) {
       var $gutterIcon;
       if (breakpoint === 'sm' || breakpoint === 'xs') {
         $gutterIcon = $sidebarGutterToggle.find('i');
@@ -290,7 +215,7 @@
         }
       }
     });
-    fitSidebarForSize = function() {
+    fitSidebarForSize = function () {
       var oldBootstrapBreakpoint;
       oldBootstrapBreakpoint = bootstrapBreakpoint;
       bootstrapBreakpoint = bp.getBreakpointSize();
@@ -298,13 +223,13 @@
         return $document.trigger('breakpoint:change', [bootstrapBreakpoint]);
       }
     };
-    checkInitialSidebarSize = function() {
+    checkInitialSidebarSize = function () {
       bootstrapBreakpoint = bp.getBreakpointSize();
-      if (bootstrapBreakpoint === "xs" || "sm") {
+      if (bootstrapBreakpoint === 'xs' || 'sm') {
         return $document.trigger('breakpoint:change', [bootstrapBreakpoint]);
       }
     };
-    $window.off("resize.app").on("resize.app", function(e) {
+    $window.off('resize.app').on('resize.app', function () {
       return fitSidebarForSize();
     });
     gl.awardsHandler = new AwardsHandler();

app/assets/javascripts/awards_handler.js

 /* eslint-disable */
 (function() {
   this.AwardsHandler = (function() {
-    const FROM_SENTENCE_REGEX = /(?:, and | and |, )/; //For separating lists produced by ruby's Array#toSentence
+    var FROM_SENTENCE_REGEX = /(?:, and | and |, )/; //For separating lists produced by ruby's Array#toSentence
     function AwardsHandler() {
       this.aliases = gl.emojiAliases();
       $(document).off('click', '.js-add-award').on('click', '.js-add-award', (function(_this) {

app/assets/javascripts/confirm_danger_modal.js

@@ -12,7 +12,7 @@
       submit.disable();
       $('.js-confirm-danger-input').off('input');
       $('.js-confirm-danger-input').on('input', function() {
-        if (rstrip($(this).val()) === project_path) {
+        if (gl.utils.rstrip($(this).val()) === project_path) {
           return submit.enable();
         } else {
           return submit.disable();

app/assets/javascripts/gfm_auto_complete.js.es6

@@ -126,8 +126,8 @@
               }
               return {
                 username: m.username,
-                title: sanitize(title),
-                search: sanitize(m.username + " " + m.name)
+                title: gl.utils.sanitize(title),
+                search: gl.utils.sanitize(m.username + " " + m.name)
               };
             });
           }
@@ -159,7 +159,7 @@
               }
               return {
                 id: i.iid,
-                title: sanitize(i.title),
+                title: gl.utils.sanitize(i.title),
                 search: i.iid + " " + i.title
               };
             });
@@ -189,7 +189,7 @@
               }
               return {
                 id: m.iid,
-                title: sanitize(m.title),
+                title: gl.utils.sanitize(m.title),
                 search: "" + m.title
               };
             });
@@ -222,7 +222,7 @@
               }
               return {
                 id: m.iid,
-                title: sanitize(m.title),
+                title: gl.utils.sanitize(m.title),
                 search: m.iid + " " + m.title
               };
             });
@@ -240,9 +240,9 @@
             var sanitizeLabelTitle;
             sanitizeLabelTitle = function(title) {
               if (/[\w\?&]+\s+[\w\?&]+/g.test(title)) {
-                return "\"" + (sanitize(title)) + "\"";
+                return "\"" + (gl.utils.sanitize(title)) + "\"";
               } else {
-                return sanitize(title);
+                return gl.utils.sanitize(title);
               }
             };
             return $.map(merges, function(m) {

app/assets/javascripts/gl_form.js

@@ -24,8 +24,8 @@
       if (isNewForm) {
         this.form.find('.div-dropzone').remove();
         this.form.addClass('gfm-form');
-        disableButtonIfEmptyField(this.form.find('.js-note-text'), this.form.find('.js-comment-button'));
         // remove notify commit author checkbox for non-commit notes
+        gl.utils.disableButtonIfEmptyField(this.form.find('.js-note-text'), this.form.find('.js-comment-button'));
         GitLab.GfmAutoComplete.setup(this.form.find('.js-gfm-input'));
         new DropzoneInput(this.form);
         autosize(this.textarea);

app/assets/javascripts/lib/utils/common_utils.js

@@ -24,6 +24,81 @@
         return null;
       }
     };
+
+    w.gl.utils.ajaxGet = function(url) {
+      return $.ajax({
+        type: "GET",
+        url: url,
+        dataType: "script"
+      });
+    };
+
+    w.gl.utils.split = function(val) {
+      return val.split(/,\s*/);
+    };
+
+    w.gl.utils.extractLast = function(term) {
+      return this.split(term).pop();
+    };
+
+    w.gl.utils.rstrip = function rstrip(val) {
+      if (val) {
+        return val.replace(/\s+$/, '');
+      } else {
+        return val;
+      }
+    };
+
+    w.gl.utils.disableButtonIfEmptyField = function(field_selector, button_selector, event_name) {
+      event_name = event_name || 'input';
+      var closest_submit, field, that;
+      that = this;
+      field = $(field_selector);
+      closest_submit = field.closest('form').find(button_selector);
+      if (this.rstrip(field.val()) === "") {
+        closest_submit.disable();
+      }
+      return field.on(event_name, function() {
+        if (that.rstrip($(this).val()) === "") {
+          return closest_submit.disable();
+        } else {
+          return closest_submit.enable();
+        }
+      });
+    };
+
+    w.gl.utils.disableButtonIfAnyEmptyField = function(form, form_selector, button_selector) {
+      var closest_submit, updateButtons;
+      closest_submit = form.find(button_selector);
+      updateButtons = function() {
+        var filled;
+        filled = true;
+        form.find('input').filter(form_selector).each(function() {
+          return filled = this.rstrip($(this).val()) !== "" || !$(this).attr('required');
+        });
+        if (filled) {
+          return closest_submit.enable();
+        } else {
+          return closest_submit.disable();
+        }
+      };
+      updateButtons();
+      return form.keyup(updateButtons);
+    };
+
+    w.gl.utils.sanitize = function(str) {
+      return str.replace(/<(?:.|\n)*?>/gm, '');
+    };
+
+    w.gl.utils.unbindEvents = function() {
+      return $(document).off('scroll');
+    };
+
+    w.gl.utils.shiftWindow = function() {
+      return w.scrollBy(0, -100);
+    };
+
+
     gl.utils.updateTooltipTitle = function($tooltipEl, newTitle) {
       return $tooltipEl.tooltip('destroy').attr('title', newTitle).tooltip('fixTitle');
     };

app/assets/javascripts/members.js.es6

@@ -11,7 +11,7 @@
       $('.project_member, .group_member').off('ajax:success').on('ajax:success', this.removeRow);
       $('.js-member-update-control').off('change').on('change', this.formSubmit);
       $('.js-edit-member-form').off('ajax:success').on('ajax:success', this.formSuccess);
-      disableButtonIfEmptyField('#user_ids', 'input[name=commit]', 'change');
+      gl.utils.disableButtonIfEmptyField('#user_ids', 'input[name=commit]', 'change');
     }
 
     removeRow(e) {

app/views/projects/blob/_upload.html.haml

@@ -26,6 +26,6 @@
 
 
 :javascript
-  disableButtonIfEmptyField($('.js-upload-blob-form').find('.js-commit-message'), '.btn-upload-file');
+  gl.utils.disableButtonIfEmptyField($('.js-upload-blob-form').find('.js-commit-message'), '.btn-upload-file');
   new BlobFileDropzone($('.js-upload-blob-form'), '#{method}');
   new NewCommitForm($('.js-upload-blob-form'))

app/views/projects/tree/_tree_content.html.haml

@@ -37,5 +37,5 @@
 :javascript
   // Load last commit log for each file in tree
   $('#tree-slider').waitForImages(function() {
-    ajaxGet("#{escape_javascript(@logs_path)}");
+    gl.utils.ajaxGet("#{escape_javascript(@logs_path)}");
   });