Commit 13182a9c authored by Bryce Johnson's avatar Bryce Johnson

Make use of destructuring options, clean up based on feedback.

parent b690c19d
...@@ -8,15 +8,15 @@ ...@@ -8,15 +8,15 @@
requestFile(query) { requestFile(query) {
return Api.gitlabCiYml(query.name, this.requestFileSuccess.bind(this)); return Api.gitlabCiYml(query.name, this.requestFileSuccess.bind(this));
}; }
}; };
global.BlobCiYamlSelector = BlobCiYamlSelector; global.BlobCiYamlSelector = BlobCiYamlSelector;
class BlobCiYamlSelectors { class BlobCiYamlSelectors {
constructor(opts) { constructor({ editor, $dropdowns = $('.js-gitlab-ci-yml-selector') }) {
this.$dropdowns = opts.$dropdowns || $('.js-gitlab-ci-yml-selector'); this.editor = editor;
this.editor = opts.editor; this.$dropdowns = $dropdowns;
this.initSelectors(); this.initSelectors();
} }
...@@ -24,11 +24,11 @@ ...@@ -24,11 +24,11 @@
this.$dropdowns.each((i, dropdown) => { this.$dropdowns.each((i, dropdown) => {
const $dropdown = $(dropdown); const $dropdown = $(dropdown);
return new BlobCiYamlSelector({ return new BlobCiYamlSelector({
editor,
pattern: /(.gitlab-ci.yml)/, pattern: /(.gitlab-ci.yml)/,
data: $dropdown.data('data'), data: $dropdown.data('data'),
wrapper: $dropdown.closest('.js-gitlab-ci-yml-selector-wrap'), wrapper: $dropdown.closest('.js-gitlab-ci-yml-selector-wrap'),
dropdown: $dropdown, dropdown: $dropdown
editor: this.editor
}); });
}); });
} }
......
((global) => { ((global) => {
class Profile { class Profile {
constructor(opts = {}) { constructor({ form = $('.edit-user') }) {
this.onSubmitForm = this.onSubmitForm.bind(this); this.onSubmitForm = this.onSubmitForm.bind(this);
this.form = opts.form || $('.edit-user'); this.form = form;
this.bindEvents(); this.bindEvents();
this.initAvatarGlCrop(); this.initAvatarGlCrop();
} }
...@@ -72,12 +72,8 @@ ...@@ -72,12 +72,8 @@
dataType: "json", dataType: "json",
processData: false, processData: false,
contentType: false, contentType: false,
success: (response) => { success: response => new Flash(response.message, 'notice'),
return new Flash(response.message, 'notice'); error: jqXHR => new Flash(jqXHR.responseJSON.message, 'alert'),
},
error: (jqXHR) => {
return new Flash(jqXHR.responseJSON.message, 'alert');
},
complete: () => { complete: () => {
window.scrollTo(0, 0); window.scrollTo(0, 0);
// Enable submit button after requests ends // Enable submit button after requests ends
......
...@@ -9,19 +9,20 @@ ...@@ -9,19 +9,20 @@
}; };
class SearchAutocomplete { class SearchAutocomplete {
constructor(opts = {}) { constructor({
this.onSearchInputBlur = this.onSearchInputBlur.bind(this); wrap = $('.search'),
this.onClearInputClick = this.onClearInputClick.bind(this); optsEl = wrap.find('.search-autocomplete-opts'),
this.onSearchInputFocus = this.onSearchInputFocus.bind(this); autocompletePath = optsEl.data('autocomplete-path'),
this.onSearchInputClick = this.onSearchInputClick.bind(this); projectId = (optsEl.data('autocomplete-project-id') || ''),
this.onSearchInputKeyUp = this.onSearchInputKeyUp.bind(this); projectRef = (optsEl.data('autocomplete-project-ref') || '')
this.onSearchInputKeyDown = this.onSearchInputKeyDown.bind(this); }) {
this.wrap = opts.wrap || $('.search'); this.bindEventContext();
this.optsEl = opts.optsEl || this.wrap.find('.search-autocomplete-opts'); this.wrap = wrap;
this.autocompletePath = opts.autocompletePath || this.optsEl.data('autocomplete-path') this.optsEl = optsEl;
this.projectId = opts.projectId || this.optsEl.data('autocomplete-project-id') || ''; this.autocompletePath = autocompletePath;
this.projectRef = opts.projectRef || this.optsEl.data('autocomplete-project-ref') || ''; this.projectId = projectId;
this.dropdown = this.wrap.find('.dropdown'); this.projectRef = projectRef;
this.dropdown = wrap.find('.dropdown');
this.dropdownContent = this.dropdown.find('.dropdown-content'); this.dropdownContent = this.dropdown.find('.dropdown-content');
this.locationBadgeEl = this.getElement('.location-badge'); this.locationBadgeEl = this.getElement('.location-badge');
this.scopeInputEl = this.getElement('#scope'); this.scopeInputEl = this.getElement('#scope');
...@@ -42,6 +43,14 @@ ...@@ -42,6 +43,14 @@
} }
// Finds an element inside wrapper element // Finds an element inside wrapper element
bindEventContext() {
this.onSearchInputBlur = this.onSearchInputBlur.bind(this);
this.onClearInputClick = this.onClearInputClick.bind(this);
this.onSearchInputFocus = this.onSearchInputFocus.bind(this);
this.onSearchInputClick = this.onSearchInputClick.bind(this);
this.onSearchInputKeyUp = this.onSearchInputKeyUp.bind(this);
this.onSearchInputKeyDown = this.onSearchInputKeyDown.bind(this);
}
getElement(selector) { getElement(selector) {
return this.wrap.find(selector); return this.wrap.find(selector);
} }
......
((global) => { ((global) => {
class Todos { class Todos {
constructor(opts = {}) { constructor({ el = $('.js-todos-options') }) {
this.allDoneClicked = this.allDoneClicked.bind(this); this.allDoneClicked = this.allDoneClicked.bind(this);
this.doneClicked = this.doneClicked.bind(this); this.doneClicked = this.doneClicked.bind(this);
this.el = opts.el || $('.js-todos-options'); this.el = el;
this.perPage = this.el.data('perPage'); this.perPage = el.data('perPage');
this.clearListeners(); this.clearListeners();
this.initBtnListeners(); this.initBtnListeners();
this.initFilters(); this.initFilters();
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
data: { data: {
'_method': 'delete' '_method': 'delete'
}, },
success: data => { success: (data) => {
this.redirectIfNeeded(data.count); this.redirectIfNeeded(data.count);
this.clearDone($target.closest('li')); this.clearDone($target.closest('li'));
return this.updateBadges(data); return this.updateBadges(data);
...@@ -80,7 +80,7 @@ ...@@ -80,7 +80,7 @@
data: { data: {
'_method': 'delete' '_method': 'delete'
}, },
success: data => { success: (data) => {
$target.remove(); $target.remove();
$('.prepend-top-default').html('<div class="nothing-here-block">You\'re all done!</div>'); $('.prepend-top-default').html('<div class="nothing-here-block">You\'re all done!</div>');
return this.updateBadges(data); return this.updateBadges(data);
......
((global) => { ((global) => {
global.User = class { global.User = class {
constructor(opts) { constructor({ action }) {
this.opts = opts; this.action = action;
this.placeProfileAvatarsToTop(); this.placeProfileAvatarsToTop();
this.initTabs(); this.initTabs();
this.hideProjectLimitMessage(); this.hideProjectLimitMessage();
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
initTabs() { initTabs() {
return new global.UserTabs({ return new global.UserTabs({
parentEl: '.user-profile', parentEl: '.user-profile',
action: this.opts.action action: this.action
}); });
} }
......
...@@ -59,11 +59,11 @@ content on the Users#show page. ...@@ -59,11 +59,11 @@ content on the Users#show page.
*/ */
((global) => { ((global) => {
class UserTabs { class UserTabs {
constructor (opts) { constructor ({ defaultAction = 'activity', action = defaultAction, parentEl }) {
this.loaded = {}; this.loaded = {};
this.defaultAction = opts.defaultAction || 'activity'; this.defaultAction = defaultAction;
this.action = opts.action || 'activity'; this.action = action;
this.$parentEl = $(opts.parentEl) || $(document); this.$parentEl = $(parentEl) || $(document);
this._location = window.location; this._location = window.location;
this.$parentEl.find('.nav-links a') this.$parentEl.find('.nav-links a')
.each((i, navLink) => { .each((i, navLink) => {
...@@ -81,7 +81,7 @@ content on the Users#show page. ...@@ -81,7 +81,7 @@ content on the Users#show page.
bindEvents() { bindEvents() {
return this.$parentEl.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]') return this.$parentEl.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]')
.on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', (event) => this.tabShown(event)); .on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', event => this.tabShown(event));
} }
tabShown(event) { tabShown(event) {
...@@ -93,7 +93,7 @@ content on the Users#show page. ...@@ -93,7 +93,7 @@ content on the Users#show page.
} }
activateTab(action) { activateTab(action) {
return this.$parentEl.find(".nav-links .js-" + action + "-tab a") return this.$parentEl.find(`.nav-links .js-${action}-tab a`)
.tab('show'); .tab('show');
} }
...@@ -104,7 +104,9 @@ content on the Users#show page. ...@@ -104,7 +104,9 @@ content on the Users#show page.
if (action === 'activity') { if (action === 'activity') {
this.loadActivities(source); this.loadActivities(source);
} }
if (action === 'groups' || action === 'contributed' || action === 'projects' || action === 'snippets') {
const loadableActions = [ 'groups', 'contributed', 'projects', 'snippets' ];
if (loadableActions.indexOf(action) > -1) {
return this.loadTab(source, action); return this.loadTab(source, action);
} }
} }
...@@ -115,9 +117,9 @@ content on the Users#show page. ...@@ -115,9 +117,9 @@ content on the Users#show page.
complete: () => this.toggleLoading(false), complete: () => this.toggleLoading(false),
dataType: 'json', dataType: 'json',
type: 'GET', type: 'GET',
url: source + ".json", url: `${source}.json`,
success: (data) => { success: (data) => {
const tabSelector = 'div#' + action; const tabSelector = `div#${action}`;
this.$parentEl.find(tabSelector).html(data.html); this.$parentEl.find(tabSelector).html(data.html);
this.loaded[action] = true; this.loaded[action] = true;
return gl.utils.localTimeAgo($('.js-timeago', tabSelector)); return gl.utils.localTimeAgo($('.js-timeago', tabSelector));
...@@ -141,12 +143,12 @@ content on the Users#show page. ...@@ -141,12 +143,12 @@ content on the Users#show page.
} }
setCurrentAction(action) { setCurrentAction(action) {
const regExp = new RegExp('\/(' + this.actions.join('|') + ')(\.html)?\/?$'); const regExp = new RegExp(`\/(${this.actions.join('|')})(\.html)?\/?$`);
let new_state = this._location.pathname; let new_state = this._location.pathname;
new_state = new_state.replace(/\/+$/, ""); new_state = new_state.replace(/\/+$/, '');
new_state = new_state.replace(regExp, ''); new_state = new_state.replace(regExp, '');
if (action !== this.defaultAction) { if (action !== this.defaultAction) {
new_state += "/" + action; new_state += `/${action}`;
} }
new_state += this._location.search + this._location.hash; new_state += this._location.search + this._location.hash;
history.replaceState({ history.replaceState({
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment