BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit 273b116c by Phil Hughes
Options

Merge branch '38869-members' into 'master'

Removes Members, memberExpiration from window object See merge request gitlab-org/gitlab-ce!14808
parents fe3ec2d9 697967c1
Showing with 110 additions and 120 deletions
app/assets/javascripts/dispatcher.js
......@@ -83,6 +83,8 @@ import AjaxLoadingSpinner from './ajax_loading_spinner';
import GlFieldErrors from './gl_field_errors';
import GLForm from './gl_form';
import U2FAuthenticate from './u2f/authenticate';
import Members from './members';
import memberExpirationDate from './member_expiration_date';
(function() {
var Dispatcher;
......@@ -399,15 +401,15 @@ import U2FAuthenticate from './u2f/authenticate';
new ProjectsList();
break;
case 'groups:group_members:index':
new gl.MemberExpirationDate();
new gl.Members();
memberExpirationDate();
new Members();
new UsersSelect();
break;
case 'projects:project_members:index':
new gl.MemberExpirationDate('.js-access-expiration-date-groups');
memberExpirationDate('.js-access-expiration-date-groups');
new GroupsSelect();
new gl.MemberExpirationDate();
new gl.Members();
memberExpirationDate();
new Members();
new UsersSelect();
break;
case 'groups:new':
......
app/assets/javascripts/main.js
......@@ -84,8 +84,6 @@ import './layout_nav';
import LazyLoader from './lazy_loader';
import './line_highlighter';
import './logo';
import './member_expiration_date';
import './members';
import './merge_request';
import './merge_request_tabs';
import './milestone';
......
app/assets/javascripts/member_expiration_date.js
......@@ -2,54 +2,51 @@
import Pikaday from 'pikaday';
(() => {
// Add datepickers to all `js-access-expiration-date` elements. If those elements are
// children of an element with the `clearable-input` class, and have a sibling
// `js-clear-input` element, then show that element when there is a value in the
// datepicker, and make clicking on that element clear the field.
//
window.gl = window.gl || {};
gl.MemberExpirationDate = (selector = '.js-access-expiration-date') => {
function toggleClearInput() {
$(this).closest('.clearable-input').toggleClass('has-value', $(this).val() !== '');
}
const inputs = $(selector);
inputs.each((i, el) => {
const $input = $(el);
const calendar = new Pikaday({
field: $input.get(0),
theme: 'gitlab-theme animate-picker',
format: 'yyyy-mm-dd',
minDate: new Date(),
container: $input.parent().get(0),
onSelect(dateText) {
$input.val(dateFormat(new Date(dateText), 'yyyy-mm-dd'));
$input.trigger('change');
toggleClearInput.call($input);
},
});
calendar.setDate(new Date($input.val()));
$input.data('pikaday', calendar);
// Add datepickers to all `js-access-expiration-date` elements. If those elements are
// children of an element with the `clearable-input` class, and have a sibling
// `js-clear-input` element, then show that element when there is a value in the
// datepicker, and make clicking on that element clear the field.
//
export default function memberExpirationDate(selector = '.js-access-expiration-date') {
function toggleClearInput() {
$(this).closest('.clearable-input').toggleClass('has-value', $(this).val() !== '');
}
const inputs = $(selector);
inputs.each((i, el) => {
const $input = $(el);
const calendar = new Pikaday({
field: $input.get(0),
theme: 'gitlab-theme animate-picker',
format: 'yyyy-mm-dd',
minDate: new Date(),
container: $input.parent().get(0),
onSelect(dateText) {
$input.val(dateFormat(new Date(dateText), 'yyyy-mm-dd'));
$input.trigger('change');
toggleClearInput.call($input);
},
});
inputs.next('.js-clear-input').on('click', function clicked(event) {
event.preventDefault();
calendar.setDate(new Date($input.val()));
$input.data('pikaday', calendar);
});
const input = $(this).closest('.clearable-input').find(selector);
const calendar = input.data('pikaday');
inputs.next('.js-clear-input').on('click', function clicked(event) {
event.preventDefault();
calendar.setDate(null);
input.trigger('change');
toggleClearInput.call(input);
});
const input = $(this).closest('.clearable-input').find(selector);
const calendar = input.data('pikaday');
calendar.setDate(null);
input.trigger('change');
toggleClearInput.call(input);
});
inputs.on('blur', toggleClearInput);
inputs.on('blur', toggleClearInput);
inputs.each(toggleClearInput);
};
}).call(window);
inputs.each(toggleClearInput);
}
app/assets/javascripts/members.js
/* eslint-disable class-methods-use-this */
(() => {
window.gl = window.gl || {};
class Members {
constructor() {
this.addListeners();
this.initGLDropdown();
}
export default class Members {
constructor() {
this.addListeners();
this.initGLDropdown();
}
addListeners() {
$('.project_member, .group_member').off('ajax:success').on('ajax:success', this.removeRow);
$('.js-member-update-control').off('change').on('change', this.formSubmit.bind(this));
$('.js-edit-member-form').off('ajax:success').on('ajax:success', this.formSuccess.bind(this));
gl.utils.disableButtonIfEmptyField('#user_ids', 'input[name=commit]', 'change');
}
addListeners() {
$('.project_member, .group_member').off('ajax:success').on('ajax:success', this.removeRow);
$('.js-member-update-control').off('change').on('change', this.formSubmit.bind(this));
$('.js-edit-member-form').off('ajax:success').on('ajax:success', this.formSuccess.bind(this));
gl.utils.disableButtonIfEmptyField('#user_ids', 'input[name=commit]', 'change');
}
initGLDropdown() {
$('.js-member-permissions-dropdown').each((i, btn) => {
const $btn = $(btn);
initGLDropdown() {
$('.js-member-permissions-dropdown').each((i, btn) => {
const $btn = $(btn);
$btn.glDropdown({
selectable: true,
isSelectable(selected, $el) {
return !$el.hasClass('is-active');
},
fieldName: $btn.data('field-name'),
id(selected, $el) {
return $el.data('id');
},
toggleLabel(selected, $el) {
return $el.text();
},
clicked: (options) => {
this.formSubmit(null, options.$el);
},
});
$btn.glDropdown({
selectable: true,
isSelectable(selected, $el) {
return !$el.hasClass('is-active');
},
fieldName: $btn.data('field-name'),
id(selected, $el) {
return $el.data('id');
},
toggleLabel(selected, $el) {
return $el.text();
},
clicked: (options) => {
this.formSubmit(null, options.$el);
},
});
}
removeRow(e) {
const $target = $(e.target);
});
}
// eslint-disable-next-line class-methods-use-this
removeRow(e) {
const $target = $(e.target);
if ($target.hasClass('btn-remove')) {
$target.closest('.member')
.fadeOut(function fadeOutMemberRow() {
$(this).remove();
});
}
if ($target.hasClass('btn-remove')) {
$target.closest('.member')
.fadeOut(function fadeOutMemberRow() {
$(this).remove();
});
}
}
formSubmit(e, $el = null) {
const $this = e ? $(e.currentTarget) : $el;
const { $toggle, $dateInput } = this.getMemberListItems($this);
$this.closest('form').trigger('submit.rails');
$toggle.disable();
$dateInput.disable();
}
formSubmit(e, $el = null) {
const $this = e ? $(e.currentTarget) : $el;
const { $toggle, $dateInput } = this.getMemberListItems($this);
formSuccess(e) {
const { $toggle, $dateInput } = this.getMemberListItems($(e.currentTarget).closest('.member'));
$this.closest('form').trigger('submit.rails');
$toggle.enable();
$dateInput.enable();
}
$toggle.disable();
$dateInput.disable();
}
getMemberListItems($el) {
const $memberListItem = $el.is('.member') ? $el : $(`#${$el.data('el-id')}`);
formSuccess(e) {
const { $toggle, $dateInput } = this.getMemberListItems($(e.currentTarget).closest('.member'));
return {
$memberListItem,
$toggle: $memberListItem.find('.dropdown-menu-toggle'),
$dateInput: $memberListItem.find('.js-access-expiration-date'),
};
}
$toggle.enable();
$dateInput.enable();
}
// eslint-disable-next-line class-methods-use-this
getMemberListItems($el) {
const $memberListItem = $el.is('.member') ? $el : $(`#${$el.data('el-id')}`);
gl.Members = Members;
})();
return {
$memberListItem,
$toggle: $memberListItem.find('.dropdown-menu-toggle'),
$dateInput: $memberListItem.find('.js-access-expiration-date'),
};
}
}
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