diff --git a/app/assets/javascripts/ajax_loading_spinner.js b/app/assets/javascripts/ajax_loading_spinner.js index 8f5e2e545ec..2bc77859c26 100644 --- a/app/assets/javascripts/ajax_loading_spinner.js +++ b/app/assets/javascripts/ajax_loading_spinner.js @@ -1,4 +1,4 @@ -class AjaxLoadingSpinner { +export default class AjaxLoadingSpinner { static init() { const $elements = $('.js-ajax-loading-spinner'); @@ -30,6 +30,3 @@ class AjaxLoadingSpinner { classList.toggle('fa-spin'); } } - -window.gl = window.gl || {}; -gl.AjaxLoadingSpinner = AjaxLoadingSpinner; diff --git a/app/assets/javascripts/boards/components/new_list_dropdown.js b/app/assets/javascripts/boards/components/new_list_dropdown.js index d7f203b3f96..c19c989680d 100644 --- a/app/assets/javascripts/boards/components/new_list_dropdown.js +++ b/app/assets/javascripts/boards/components/new_list_dropdown.js @@ -1,6 +1,7 @@ -/* eslint-disable comma-dangle, func-names, no-new, space-before-function-paren, one-var, +/* eslint-disable func-names, no-new, space-before-function-paren, one-var, promise/catch-or-return */ import _ from 'underscore'; +import CreateLabelDropdown from '../../create_label'; window.gl = window.gl || {}; window.gl.issueBoards = window.gl.issueBoards || {}; @@ -15,15 +16,15 @@ $(document).off('created.label').on('created.label', (e, label) => { label: { id: label.id, title: label.title, - color: label.color - } + color: label.color, + }, }); }); gl.issueBoards.newListDropdownInit = () => { $('.js-new-board-list').each(function () { const $this = $(this); - new gl.CreateLabelDropdown($this.closest('.dropdown').find('.dropdown-new-label'), $this.data('namespace-path'), $this.data('project-path')); + new CreateLabelDropdown($this.closest('.dropdown').find('.dropdown-new-label'), $this.data('namespace-path'), $this.data('project-path')); $this.glDropdown({ data(term, callback) { @@ -38,17 +39,17 @@ gl.issueBoards.newListDropdownInit = () => { const $a = $('', { class: (active ? `is-active js-board-list-${active.id}` : ''), text: label.title, - href: '#' + href: '#', }); const $labelColor = $('', { class: 'dropdown-label-box', - style: `background-color: ${label.color}` + style: `background-color: ${label.color}`, }); return $li.append($a.prepend($labelColor)); }, search: { - fields: ['title'] + fields: ['title'], }, filterable: true, selectable: true, @@ -66,13 +67,13 @@ gl.issueBoards.newListDropdownInit = () => { label: { id: label.id, title: label.title, - color: label.color - } + color: label.color, + }, }); Store.state.lists = _.sortBy(Store.state.lists, 'position'); } - } + }, }); }); }; diff --git a/app/assets/javascripts/create_label.js b/app/assets/javascripts/create_label.js index 907b468e576..3bed0678350 100644 --- a/app/assets/javascripts/create_label.js +++ b/app/assets/javascripts/create_label.js @@ -1,8 +1,8 @@ -/* eslint-disable func-names, space-before-function-paren, prefer-arrow-callback, comma-dangle, prefer-template, quotes, no-param-reassign, wrap-iife, max-len */ +/* eslint-disable func-names, prefer-arrow-callback */ import Api from './api'; -class CreateLabelDropdown { - constructor ($el, namespacePath, projectPath) { +export default class CreateLabelDropdown { + constructor($el, namespacePath, projectPath) { this.$el = $el; this.namespacePath = namespacePath; this.projectPath = projectPath; @@ -22,7 +22,7 @@ class CreateLabelDropdown { this.addBinding(); } - cleanBinding () { + cleanBinding() { this.$colorSuggestions.off('click'); this.$newLabelField.off('keyup change'); this.$newColorField.off('keyup change'); @@ -31,7 +31,7 @@ class CreateLabelDropdown { this.$newLabelCreateButton.off('click'); } - addBinding () { + addBinding() { const self = this; this.$colorSuggestions.on('click', function (e) { @@ -44,7 +44,7 @@ class CreateLabelDropdown { this.$dropdownBack.on('click', this.resetForm.bind(this)); - this.$cancelButton.on('click', function(e) { + this.$cancelButton.on('click', function (e) { e.preventDefault(); e.stopPropagation(); @@ -55,7 +55,7 @@ class CreateLabelDropdown { this.$newLabelCreateButton.on('click', this.saveLabel.bind(this)); } - addColorValue (e, $this) { + addColorValue(e, $this) { e.preventDefault(); e.stopPropagation(); @@ -66,7 +66,7 @@ class CreateLabelDropdown { .addClass('is-active'); } - enableLabelCreateButton () { + enableLabelCreateButton() { if (this.$newLabelField.val() !== '' && this.$newColorField.val() !== '') { this.$newLabelError.hide(); this.$newLabelCreateButton.enable(); @@ -75,7 +75,7 @@ class CreateLabelDropdown { } } - resetForm () { + resetForm() { this.$newLabelField .val('') .trigger('change'); @@ -90,13 +90,13 @@ class CreateLabelDropdown { .removeClass('is-active'); } - saveLabel (e) { + saveLabel(e) { e.preventDefault(); e.stopPropagation(); Api.newLabel(this.namespacePath, this.projectPath, { title: this.$newLabelField.val(), - color: this.$newColorField.val() + color: this.$newColorField.val(), }, (label) => { this.$newLabelCreateButton.enable(); @@ -107,8 +107,8 @@ class CreateLabelDropdown { errors = label.message; } else { errors = Object.keys(label.message).map(key => - `${gl.text.humanize(key)} ${label.message[key].join(', ')}` - ).join("
"); + `${gl.text.humanize(key)} ${label.message[key].join(', ')}`, + ).join('
'); } this.$newLabelError @@ -122,6 +122,3 @@ class CreateLabelDropdown { }); } } - -window.gl = window.gl || {}; -gl.CreateLabelDropdown = CreateLabelDropdown; diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js index 33271c25146..6a4dce20f24 100644 --- a/app/assets/javascripts/dispatcher.js +++ b/app/assets/javascripts/dispatcher.js @@ -76,6 +76,7 @@ import GpgBadges from './gpg_badges'; import UserFeatureHelper from './helpers/user_feature_helper'; import initChangesDropdown from './init_changes_dropdown'; import { ajaxGet, convertPermissionToBoolean } from './lib/utils/common_utils'; +import AjaxLoadingSpinner from './ajax_loading_spinner'; (function() { var Dispatcher; @@ -237,7 +238,7 @@ import { ajaxGet, convertPermissionToBoolean } from './lib/utils/common_utils'; new NewBranchForm($('.js-create-branch-form'), JSON.parse(document.getElementById('availableRefs').innerHTML)); break; case 'projects:branches:index': - gl.AjaxLoadingSpinner.init(); + AjaxLoadingSpinner.init(); new DeleteModal(); break; case 'projects:issues:new': diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js index 2538d9c2093..d479f7ed682 100644 --- a/app/assets/javascripts/labels_select.js +++ b/app/assets/javascripts/labels_select.js @@ -4,6 +4,7 @@ import _ from 'underscore'; import IssuableBulkUpdateActions from './issuable_bulk_update_actions'; import DropdownUtils from './filtered_search/dropdown_utils'; +import CreateLabelDropdown from './create_label'; (function() { this.LabelsSelect = (function() { @@ -61,7 +62,7 @@ import DropdownUtils from './filtered_search/dropdown_utils'; $sidebarLabelTooltip.tooltip(); if ($dropdown.closest('.dropdown').find('.dropdown-new-label').length) { - new gl.CreateLabelDropdown($dropdown.closest('.dropdown').find('.dropdown-new-label'), namespacePath, projectPath); + new CreateLabelDropdown($dropdown.closest('.dropdown').find('.dropdown-new-label'), namespacePath, projectPath); } saveLabelData = function() { diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js index 5858c2b6fd8..64d7c80e689 100644 --- a/app/assets/javascripts/main.js +++ b/app/assets/javascripts/main.js @@ -57,7 +57,6 @@ import './u2f/util'; import './abuse_reports'; import './activities'; import './admin'; -import './ajax_loading_spinner'; import './api'; import './aside'; import './autosave'; @@ -74,7 +73,6 @@ import './compare_autocomplete'; import './confirm_danger_modal'; import './copy_as_gfm'; import './copy_to_clipboard'; -import './create_label'; import './diff'; import './dropzone_input'; import './due_date_select'; diff --git a/spec/javascripts/ajax_loading_spinner_spec.js b/spec/javascripts/ajax_loading_spinner_spec.js index 46e072a8ebb..c93b7cc6cac 100644 --- a/spec/javascripts/ajax_loading_spinner_spec.js +++ b/spec/javascripts/ajax_loading_spinner_spec.js @@ -1,6 +1,6 @@ import 'jquery'; import 'jquery-ujs'; -import '~/ajax_loading_spinner'; +import AjaxLoadingSpinner from '~/ajax_loading_spinner'; describe('Ajax Loading Spinner', () => { const fixtureTemplate = 'static/ajax_loading_spinner.html.raw'; @@ -8,7 +8,7 @@ describe('Ajax Loading Spinner', () => { beforeEach(() => { loadFixtures(fixtureTemplate); - gl.AjaxLoadingSpinner.init(); + AjaxLoadingSpinner.init(); }); it('change current icon with spinner icon and disable link while waiting ajax response', (done) => {