Wrap classes with IIFE and define it inside gl namespace
This commit is contained in:
parent
45454c3cb2
commit
8f29c332b5
5 changed files with 133 additions and 113 deletions
|
@ -173,8 +173,8 @@
|
||||||
new Search();
|
new Search();
|
||||||
break;
|
break;
|
||||||
case 'projects:protected_branches:index':
|
case 'projects:protected_branches:index':
|
||||||
new ProtectedBranchCreate();
|
new gl.ProtectedBranchCreate();
|
||||||
new ProtectedBranchEditList();
|
new gl.ProtectedBranchEditList();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
switch (path.first()) {
|
switch (path.first()) {
|
||||||
|
|
|
@ -1,18 +1,23 @@
|
||||||
class ProtectedBranchAccessDropdown {
|
(global => {
|
||||||
constructor(options) {
|
global.gl = global.gl || {};
|
||||||
const { $dropdown, data, onSelect } = options;
|
|
||||||
|
|
||||||
$dropdown.glDropdown({
|
gl.ProtectedBranchAccessDropdown = class {
|
||||||
data: data,
|
constructor(options) {
|
||||||
selectable: true,
|
const { $dropdown, data, onSelect } = options;
|
||||||
fieldName: $dropdown.data('field-name'),
|
|
||||||
toggleLabel(item) {
|
$dropdown.glDropdown({
|
||||||
return item.text;
|
data: data,
|
||||||
},
|
selectable: true,
|
||||||
clicked(item, $el, e) {
|
fieldName: $dropdown.data('field-name'),
|
||||||
e.preventDefault();
|
toggleLabel(item) {
|
||||||
onSelect();
|
return item.text;
|
||||||
}
|
},
|
||||||
});
|
clicked(item, $el, e) {
|
||||||
|
e.preventDefault();
|
||||||
|
onSelect();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
})(window);
|
||||||
|
|
|
@ -1,49 +1,54 @@
|
||||||
class ProtectedBranchCreate {
|
(global => {
|
||||||
constructor() {
|
global.gl = global.gl || {};
|
||||||
this.$wrap = this.$form = $('#new_protected_branch');
|
|
||||||
this.buildDropdowns();
|
|
||||||
}
|
|
||||||
|
|
||||||
buildDropdowns() {
|
gl.ProtectedBranchCreate = class {
|
||||||
// Allowed to Merge dropdown
|
constructor() {
|
||||||
const $allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
|
this.$wrap = this.$form = $('#new_protected_branch');
|
||||||
const $allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
|
this.buildDropdowns();
|
||||||
|
}
|
||||||
|
|
||||||
new ProtectedBranchAccessDropdown({
|
buildDropdowns() {
|
||||||
$dropdown: $allowedToMergeDropdown,
|
// Allowed to Merge dropdown
|
||||||
data: gon.merge_access_levels,
|
const $allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
|
||||||
onSelect: this.onSelect.bind(this)
|
const $allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
|
||||||
});
|
|
||||||
|
|
||||||
// Select default
|
new gl.ProtectedBranchAccessDropdown({
|
||||||
$allowedToMergeDropdown.data('glDropdown').selectRowAtIndex(0);
|
$dropdown: $allowedToMergeDropdown,
|
||||||
|
data: gon.merge_access_levels,
|
||||||
|
onSelect: this.onSelect.bind(this)
|
||||||
|
});
|
||||||
|
|
||||||
// Allowed to Push dropdown
|
// Select default
|
||||||
new ProtectedBranchAccessDropdown({
|
$allowedToMergeDropdown.data('glDropdown').selectRowAtIndex(0);
|
||||||
$dropdown: $allowedToPushDropdown,
|
|
||||||
data: gon.push_access_levels,
|
|
||||||
onSelect: this.onSelect.bind(this)
|
|
||||||
});
|
|
||||||
|
|
||||||
// Select default
|
// Allowed to Push dropdown
|
||||||
$allowedToPushDropdown.data('glDropdown').selectRowAtIndex(0);
|
new gl.ProtectedBranchAccessDropdown({
|
||||||
|
$dropdown: $allowedToPushDropdown,
|
||||||
|
data: gon.push_access_levels,
|
||||||
|
onSelect: this.onSelect.bind(this)
|
||||||
|
});
|
||||||
|
|
||||||
// Protected branch dropdown
|
// Select default
|
||||||
new ProtectedBranchDropdown({
|
$allowedToPushDropdown.data('glDropdown').selectRowAtIndex(0);
|
||||||
$dropdown: this.$wrap.find('.js-protected-branch-select'),
|
|
||||||
onSelect: this.onSelect.bind(this)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// This will run after clicked callback
|
// Protected branch dropdown
|
||||||
onSelect() {
|
new ProtectedBranchDropdown({
|
||||||
// Enable submit button
|
$dropdown: this.$wrap.find('.js-protected-branch-select'),
|
||||||
const $branchInput = this.$wrap.find('input[name="protected_branch[name]"]');
|
onSelect: this.onSelect.bind(this)
|
||||||
const $allowedToMergeInput = this.$wrap.find('input[name="protected_branch[merge_access_level_attributes][access_level]"]');
|
});
|
||||||
const $allowedToPushInput = this.$wrap.find('input[name="protected_branch[push_access_level_attributes][access_level]"]');
|
}
|
||||||
|
|
||||||
if ($branchInput.val() && $allowedToMergeInput.val() && $allowedToPushInput.val()){
|
// This will run after clicked callback
|
||||||
this.$form.find('[type="submit"]').removeAttr('disabled');
|
onSelect() {
|
||||||
|
// Enable submit button
|
||||||
|
const $branchInput = this.$wrap.find('input[name="protected_branch[name]"]');
|
||||||
|
const $allowedToMergeInput = this.$wrap.find('input[name="protected_branch[merge_access_level_attributes][access_level]"]');
|
||||||
|
const $allowedToPushInput = this.$wrap.find('input[name="protected_branch[push_access_level_attributes][access_level]"]');
|
||||||
|
|
||||||
|
if ($branchInput.val() && $allowedToMergeInput.val() && $allowedToPushInput.val()){
|
||||||
|
this.$form.find('[type="submit"]').removeAttr('disabled');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
})(window);
|
||||||
|
|
|
@ -1,56 +1,61 @@
|
||||||
class ProtectedBranchEdit {
|
(global => {
|
||||||
constructor(options) {
|
global.gl = global.gl || {};
|
||||||
this.$wrap = options.$wrap;
|
|
||||||
this.$allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
|
|
||||||
this.$allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
|
|
||||||
|
|
||||||
this.buildDropdowns();
|
gl.ProtectedBranchEdit = class {
|
||||||
}
|
constructor(options) {
|
||||||
|
this.$wrap = options.$wrap;
|
||||||
|
this.$allowedToMergeDropdown = this.$wrap.find('.js-allowed-to-merge');
|
||||||
|
this.$allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push');
|
||||||
|
|
||||||
buildDropdowns() {
|
this.buildDropdowns();
|
||||||
|
}
|
||||||
|
|
||||||
// Allowed to merge dropdown
|
buildDropdowns() {
|
||||||
new ProtectedBranchAccessDropdown({
|
|
||||||
$dropdown: this.$allowedToMergeDropdown,
|
|
||||||
data: gon.merge_access_levels,
|
|
||||||
onSelect: this.onSelect.bind(this)
|
|
||||||
});
|
|
||||||
|
|
||||||
// Allowed to push dropdown
|
// Allowed to merge dropdown
|
||||||
new ProtectedBranchAccessDropdown({
|
new gl.ProtectedBranchAccessDropdown({
|
||||||
$dropdown: this.$allowedToPushDropdown,
|
$dropdown: this.$allowedToMergeDropdown,
|
||||||
data: gon.push_access_levels,
|
data: gon.merge_access_levels,
|
||||||
onSelect: this.onSelect.bind(this)
|
onSelect: this.onSelect.bind(this)
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
onSelect() {
|
// Allowed to push dropdown
|
||||||
const $allowedToMergeInput = $(`input[name="${this.$allowedToMergeDropdown.data('fieldName')}"]`);
|
new gl.ProtectedBranchAccessDropdown({
|
||||||
const $allowedToPushInput = $(`input[name="${this.$allowedToPushDropdown.data('fieldName')}"]`);
|
$dropdown: this.$allowedToPushDropdown,
|
||||||
|
data: gon.push_access_levels,
|
||||||
|
onSelect: this.onSelect.bind(this)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
$.ajax({
|
onSelect() {
|
||||||
type: 'POST',
|
const $allowedToMergeInput = $(`input[name="${this.$allowedToMergeDropdown.data('fieldName')}"]`);
|
||||||
url: this.$wrap.data('url'),
|
const $allowedToPushInput = $(`input[name="${this.$allowedToPushDropdown.data('fieldName')}"]`);
|
||||||
dataType: 'json',
|
|
||||||
data: {
|
$.ajax({
|
||||||
_method: 'PATCH',
|
type: 'POST',
|
||||||
id: this.$wrap.data('banchId'),
|
url: this.$wrap.data('url'),
|
||||||
protected_branch: {
|
dataType: 'json',
|
||||||
merge_access_level_attributes: {
|
data: {
|
||||||
access_level: $allowedToMergeInput.val()
|
_method: 'PATCH',
|
||||||
},
|
id: this.$wrap.data('banchId'),
|
||||||
push_access_level_attributes: {
|
protected_branch: {
|
||||||
access_level: $allowedToPushInput.val()
|
merge_access_level_attributes: {
|
||||||
|
access_level: $allowedToMergeInput.val()
|
||||||
|
},
|
||||||
|
push_access_level_attributes: {
|
||||||
|
access_level: $allowedToPushInput.val()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
success: () => {
|
||||||
|
this.$wrap.effect('highlight');
|
||||||
|
},
|
||||||
|
error() {
|
||||||
|
$.scrollTo(0);
|
||||||
|
new Flash('Failed to update branch!');
|
||||||
}
|
}
|
||||||
},
|
});
|
||||||
success: () => {
|
}
|
||||||
this.$wrap.effect('highlight');
|
|
||||||
},
|
|
||||||
error() {
|
|
||||||
$.scrollTo(0);
|
|
||||||
new Flash('Failed to update branch!');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
})(window);
|
||||||
|
|
|
@ -1,12 +1,17 @@
|
||||||
class ProtectedBranchEditList {
|
(global => {
|
||||||
constructor() {
|
global.gl = global.gl || {};
|
||||||
this.$wrap = $('.protected-branches-list');
|
|
||||||
|
|
||||||
// Build edit forms
|
gl.ProtectedBranchEditList = class {
|
||||||
this.$wrap.find('.js-protected-branch-edit-form').each((i, el) => {
|
constructor() {
|
||||||
new ProtectedBranchEdit({
|
this.$wrap = $('.protected-branches-list');
|
||||||
$wrap: $(el)
|
|
||||||
|
// Build edit forms
|
||||||
|
this.$wrap.find('.js-protected-branch-edit-form').each((i, el) => {
|
||||||
|
new gl.ProtectedBranchEdit({
|
||||||
|
$wrap: $(el)
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
})(window);
|
||||||
|
|
Loading…
Reference in a new issue