BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit c9ee6a96 by kushalpandya
Options

Convert to ES6 class

parent 67107c8f
Showing with 146 additions and 156 deletions
app/assets/javascripts/protected_branches/protected_branch_access_dropdown.js
/* eslint-disable arrow-parens, no-param-reassign, object-shorthand, no-else-return, comma-dangle, max-len */ export default class ProtectedBranchAccessDropdown {
constructor(options) {
this.options = options;
this.initDropdown();
}
(global => { initDropdown() {
global.gl = global.gl || {}; const { onSelect } = this.options;
this.options.$dropdown.glDropdown({
gl.ProtectedBranchAccessDropdown = class { data: this.options.data,
constructor(options) { selectable: true,
const { $dropdown, data, onSelect } = options; inputId: this.options.$dropdown.data('input-id'),
fieldName: this.options.$dropdown.data('field-name'),
$dropdown.glDropdown({ toggleLabel(item, $el) {
data: data, if ($el.is('.is-active')) {
selectable: true, return item.text;
inputId: $dropdown.data('input-id'),
fieldName: $dropdown.data('field-name'),
toggleLabel(item, el) {
if (el.is('.is-active')) {
return item.text;
} else {
return 'Select';
}
},
clicked(opts) {
const { e } = opts;
e.preventDefault();
onSelect();
} }
}); return 'Select';
} },
}; clicked(options) {
})(window); options.e.preventDefault();
onSelect();
},
});
}
}
app/assets/javascripts/protected_branches/protected_branch_create.js
/* eslint-disable no-new, arrow-parens, no-param-reassign, comma-dangle, max-len */ import ProtectedBranchAccessDropdown from './protected_branch_access_dropdown';
/* global ProtectedBranchDropdown */ import ProtectedBranchDropdown from './protected_branch_dropdown';
(global => { export default class ProtectedBranchCreate {
global.gl = global.gl || {}; constructor() {
this.$form = $('.js-new-protected-branch');
gl.ProtectedBranchCreate = class { this.buildDropdowns();
constructor() { }
this.$wrap = this.$form = $('#new_protected_branch');
this.buildDropdowns(); buildDropdowns() {
} const $allowedToMergeDropdown = this.$form.find('.js-allowed-to-merge');
const $allowedToPushDropdown = this.$form.find('.js-allowed-to-push');
buildDropdowns() {
const $allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge'); // Cache callback
const $allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push'); this.onSelectCallback = this.onSelect.bind(this);
// Cache callback // Allowed to Merge dropdown
this.onSelectCallback = this.onSelect.bind(this); this.protectedBranchMergeAccessDropdown = new ProtectedBranchAccessDropdown({
$dropdown: $allowedToMergeDropdown,
// Allowed to Merge dropdown data: gon.merge_access_levels,
new gl.ProtectedBranchAccessDropdown({ onSelect: this.onSelectCallback,
$dropdown: $allowedToMergeDropdown, });
data: gon.merge_access_levels,
onSelect: this.onSelectCallback // Allowed to Push dropdown
}); this.protectedBranchPushAccessDropdown = new ProtectedBranchAccessDropdown({
$dropdown: $allowedToPushDropdown,
// Allowed to Push dropdown data: gon.push_access_levels,
new gl.ProtectedBranchAccessDropdown({ onSelect: this.onSelectCallback,
$dropdown: $allowedToPushDropdown, });
data: gon.push_access_levels,
onSelect: this.onSelectCallback // Select default
}); $allowedToPushDropdown.data('glDropdown').selectRowAtIndex(0);
$allowedToMergeDropdown.data('glDropdown').selectRowAtIndex(0);
// Select default
$allowedToPushDropdown.data('glDropdown').selectRowAtIndex(0); // Protected branch dropdown
$allowedToMergeDropdown.data('glDropdown').selectRowAtIndex(0); this.protectedBranchDropdown = new ProtectedBranchDropdown({
$dropdown: this.$form.find('.js-protected-branch-select'),
// Protected branch dropdown onSelect: this.onSelectCallback,
new ProtectedBranchDropdown({ });
$dropdown: this.$wrap.find('.js-protected-branch-select'), }
onSelect: this.onSelectCallback
}); // This will run after clicked callback
} onSelect() {
// Enable submit button
// This will run after clicked callback const $branchInput = this.$form.find('input[name="protected_branch[name]"]');
onSelect() { const $allowedToMergeInput = this.$form.find('input[name="protected_branch[merge_access_levels_attributes][0][access_level]"]');
// Enable submit button const $allowedToPushInput = this.$form.find('input[name="protected_branch[push_access_levels_attributes][0][access_level]"]');
const $branchInput = this.$wrap.find('input[name="protected_branch[name]"]');
const $allowedToMergeInput = this.$wrap.find('input[name="protected_branch[merge_access_levels_attributes][0][access_level]"]'); this.$form.find('input[type="submit"]').attr('disabled', !($branchInput.val() && $allowedToMergeInput.length && $allowedToPushInput.length));
const $allowedToPushInput = this.$wrap.find('input[name="protected_branch[push_access_levels_attributes][0][access_level]"]'); }
}
this.$form.find('input[type="submit"]').attr('disabled', !($branchInput.val() && $allowedToMergeInput.length && $allowedToPushInput.length));
}
};
})(window);
app/assets/javascripts/protected_branches/protected_branch_edit.js
/* eslint-disable no-new, arrow-parens, no-param-reassign, comma-dangle, max-len */ /* eslint-disable no-new */
/* global Flash */ /* global Flash */
(global => { import ProtectedBranchAccessDropdown from './protected_branch_access_dropdown';
global.gl = global.gl || {};
gl.ProtectedBranchEdit = class { export default class ProtectedBranchEdit {
constructor(options) { constructor(options) {
this.$wrap = options.$wrap; this.$wrap = options.$wrap;
this.$allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge'); this.$allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
this.$allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push'); this.$allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
this.onSelectCallback = this.onSelect.bind(this);
this.buildDropdowns(); this.buildDropdowns();
} }
buildDropdowns() { buildDropdowns() {
// Allowed to merge dropdown // Allowed to merge dropdown
new gl.ProtectedBranchAccessDropdown({ this.protectedBranchAccessDropdown = new ProtectedBranchAccessDropdown({
$dropdown: this.$allowedToMergeDropdown, $dropdown: this.$allowedToMergeDropdown,
data: gon.merge_access_levels, data: gon.merge_access_levels,
onSelect: this.onSelect.bind(this) onSelect: this.onSelectCallback,
}); });
// Allowed to push dropdown // Allowed to push dropdown
new gl.ProtectedBranchAccessDropdown({ this.protectedBranchAccessDropdown = new ProtectedBranchAccessDropdown({
$dropdown: this.$allowedToPushDropdown, $dropdown: this.$allowedToPushDropdown,
data: gon.push_access_levels, data: gon.push_access_levels,
onSelect: this.onSelect.bind(this) onSelect: this.onSelectCallback,
}); });
} }
onSelect() { onSelect() {
const $allowedToMergeInput = this.$wrap.find(`input[name="${this.$allowedToMergeDropdown.data('fieldName')}"]`); const $allowedToMergeInput = this.$wrap.find(`input[name="${this.$allowedToMergeDropdown.data('fieldName')}"]`);
const $allowedToPushInput = this.$wrap.find(`input[name="${this.$allowedToPushDropdown.data('fieldName')}"]`); const $allowedToPushInput = this.$wrap.find(`input[name="${this.$allowedToPushDropdown.data('fieldName')}"]`);
// Do not update if one dropdown has not selected any option // Do not update if one dropdown has not selected any option
if (!($allowedToMergeInput.length && $allowedToPushInput.length)) return; if (!($allowedToMergeInput.length && $allowedToPushInput.length)) return;
this.$allowedToMergeDropdown.disable(); this.$allowedToMergeDropdown.disable();
this.$allowedToPushDropdown.disable(); this.$allowedToPushDropdown.disable();
$.ajax({ $.ajax({
type: 'POST', type: 'POST',
url: this.$wrap.data('url'), url: this.$wrap.data('url'),
dataType: 'json', dataType: 'json',
data: { data: {
_method: 'PATCH', _method: 'PATCH',
protected_branch: { protected_branch: {
merge_access_levels_attributes: [{ merge_access_levels_attributes: [{
id: this.$allowedToMergeDropdown.data('access-level-id'), id: this.$allowedToMergeDropdown.data('access-level-id'),
access_level: $allowedToMergeInput.val() access_level: $allowedToMergeInput.val(),
}], }],
push_access_levels_attributes: [{ push_access_levels_attributes: [{
id: this.$allowedToPushDropdown.data('access-level-id'), id: this.$allowedToPushDropdown.data('access-level-id'),
access_level: $allowedToPushInput.val() access_level: $allowedToPushInput.val(),
}] }],
}
}, },
error() { },
$.scrollTo(0); error() {
new Flash('Failed to update branch!'); $.scrollTo(0);
} new Flash('Failed to update branch!', null, $('.js-protected-branches-list'));
}).always(() => { },
this.$allowedToMergeDropdown.enable(); }).always(() => {
this.$allowedToPushDropdown.enable(); this.$allowedToMergeDropdown.enable();
}); this.$allowedToPushDropdown.enable();
} });
}; }
})(window); }
app/assets/javascripts/protected_branches/protected_branch_edit_list.js
/* eslint-disable arrow-parens, no-param-reassign, no-new, comma-dangle */ /* eslint-disable no-new */
(global => { import ProtectedBranchEdit from './protected_branch_edit';
global.gl = global.gl || {};
gl.ProtectedBranchEditList = class { export default class ProtectedBranchEditList {
constructor() { constructor() {
this.$wrap = $('.protected-branches-list'); this.$wrap = $('.protected-branches-list');
this.initEditForm();
}
// Build edit forms initEditForm() {
this.$wrap.find('.js-protected-branch-edit-form').each((i, el) => { this.$wrap.find('.js-protected-branch-edit-form').each((i, el) => {
new gl.ProtectedBranchEdit({ new ProtectedBranchEdit({
$wrap: $(el) $wrap: $(el),
});
}); });
} });
}; }
})(window); }
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