Skip to content

G
gitlab-ce
Commit 57214375 authored by Tim Zallmann's avatar Tim Zallmann
Browse files
Options

Improved project.js and select2 loading 

We check now if select2 dropdowns are actually on the screen
parent 8c871ce3
Hide whitespace changes
Inline Side-by-side
Showing with 146 additions and 126 deletions
app/assets/javascripts/groups_select.js
View file @ 57214375
...@@ -97,7 +97,10 @@ const groupsSelect = () => { ...@@ -97,7 +97,10 @@ const groupsSelect = () => {
}); });
}; };
export default () => export default () => {
import(/* webpackChunkName: 'select2' */ 'select2/select2') if ($('.ajax-groups-select').length) {
.then(groupsSelect) import(/* webpackChunkName: 'select2' */ 'select2/select2')
.catch(() => {}); .then(groupsSelect)
.catch(() => {});
}
};
app/assets/javascripts/pages/projects/project.js
View file @ 57214375
...@@ -13,48 +13,54 @@ import initDeprecatedJQueryDropdown from '~/deprecated_jquery_dropdown'; ...@@ -13,48 +13,54 @@ import initDeprecatedJQueryDropdown from '~/deprecated_jquery_dropdown';
export default class Project { export default class Project {
constructor() { constructor() {
const $cloneOptions = $('ul.clone-options-dropdown'); const $cloneOptions = $('ul.clone-options-dropdown');
const $projectCloneField = $('#project_clone'); if ($cloneOptions.length) {
const $cloneBtnLabel = $('.js-git-clone-holder .js-clone-dropdown-label'); const $projectCloneField = $('#project_clone');
const mobileCloneField = document.querySelector( const $cloneBtnLabel = $('.js-git-clone-holder .js-clone-dropdown-label');
'.js-mobile-git-clone .js-clone-dropdown-label', const mobileCloneField = document.querySelector(
); '.js-mobile-git-clone .js-clone-dropdown-label',
);
const selectedCloneOption = $cloneBtnLabel.text().trim();
if (selectedCloneOption.length > 0) { const selectedCloneOption = $cloneBtnLabel.text().trim();
$(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active'); if (selectedCloneOption.length > 0) {
} $(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active');
}
$('a', $cloneOptions).on('click', e => { $('a', $cloneOptions).on('click', e => {
e.preventDefault(); e.preventDefault();
const $this = $(e.currentTarget); const $this = $(e.currentTarget);
const url = $this.attr('href'); const url = $this.attr('href');
const cloneType = $this.data('cloneType'); const cloneType = $this.data('cloneType');
$('.is-active', $cloneOptions).removeClass('is-active'); $('.is-active', $cloneOptions).removeClass('is-active');
$(`a[data-clone-type="${cloneType}"]`).each(function() { $(`a[data-clone-type="${cloneType}"]`).each(function() {
const $el = $(this); const $el = $(this);
const activeText = $el.find('.dropdown-menu-inner-title').text(); const activeText = $el.find('.dropdown-menu-inner-title').text();
const $container = $el.closest('.project-clone-holder'); const $container = $el.closest('.project-clone-holder');
const $label = $container.find('.js-clone-dropdown-label'); const $label = $container.find('.js-clone-dropdown-label');
$el.toggleClass('is-active'); $el.toggleClass('is-active');
$label.text(activeText); $label.text(activeText);
});
if (mobileCloneField) {
mobileCloneField.dataset.clipboardText = url;
} else {
$projectCloneField.val(url);
}
$('.js-git-empty .js-clone').text(url);
}); });
}
if (mobileCloneField) {
mobileCloneField.dataset.clipboardText = url;
} else {
$projectCloneField.val(url);
}
$('.js-git-empty .js-clone').text(url);
});
// Ref switcher // Ref switcher
Project.initRefSwitcher(); if (document.querySelector('.js-project-refs-dropdown')) {
$('.project-refs-select').on('change', function() { Project.initRefSwitcher();
return $(this) $('.project-refs-select').on('change', function() {
.parents('form') return $(this)
.submit(); .parents('form')
}); .submit();
});
}
$('.hide-no-ssh-message').on('click', function(e) { $('.hide-no-ssh-message').on('click', function(e) {
Cookies.set('hide_no_ssh_message', 'false'); Cookies.set('hide_no_ssh_message', 'false');
$(this) $(this)
...@@ -78,6 +84,7 @@ export default class Project { ...@@ -78,6 +84,7 @@ export default class Project {
.remove(); .remove();
return e.preventDefault(); return e.preventDefault();
}); });
Project.projectSelectDropdown(); Project.projectSelectDropdown();
} }
......
app/assets/javascripts/project_select.js
View file @ 57214375
...@@ -110,7 +110,10 @@ const projectSelect = () => { ...@@ -110,7 +110,10 @@ const projectSelect = () => {
}); });
}; };
export default () => export default () => {
import(/* webpackChunkName: 'select2' */ 'select2/select2') if ($('.ajax-project-select').length) {
.then(projectSelect) import(/* webpackChunkName: 'select2' */ 'select2/select2')
.catch(() => {}); .then(projectSelect)
.catch(() => {});
}
};
app/assets/javascripts/users_select/index.js
View file @ 57214375
...@@ -561,92 +561,99 @@ function UsersSelect(currentUser, els, options = {}) { ...@@ -561,92 +561,99 @@ function UsersSelect(currentUser, els, options = {}) {
}, },
}); });
}); });
import(/* webpackChunkName: 'select2' */ 'select2/select2')
.then(() => { if ($('.ajax-users-select').length) {
$('.ajax-users-select').each((i, select) => { import(/* webpackChunkName: 'select2' */ 'select2/select2')
const options = getAjaxUsersSelectOptions($(select), AJAX_USERS_SELECT_OPTIONS_MAP); .then(() => {
options.skipLdap = $(select).hasClass('skip_ldap'); $('.ajax-users-select').each((i, select) => {
const showNullUser = $(select).data('nullUser'); const options = getAjaxUsersSelectOptions($(select), AJAX_USERS_SELECT_OPTIONS_MAP);
const showAnyUser = $(select).data('anyUser'); options.skipLdap = $(select).hasClass('skip_ldap');
const showEmailUser = $(select).data('emailUser'); const showNullUser = $(select).data('nullUser');
const firstUser = $(select).data('firstUser'); const showAnyUser = $(select).data('anyUser');
return $(select).select2({ const showEmailUser = $(select).data('emailUser');
placeholder: __('Search for a user'), const firstUser = $(select).data('firstUser');
multiple: $(select).hasClass('multiselect'), return $(select).select2({
minimumInputLength: 0, placeholder: __('Search for a user'),
query(query) { multiple: $(select).hasClass('multiselect'),
return userSelect.users(query.term, options, users => { minimumInputLength: 0,
let name; query(query) {
const data = { return userSelect.users(query.term, options, users => {
results: users, let name;
}; const data = {
if (query.term.length === 0) { results: users,
if (firstUser) { };
// Move current user to the front of the list if (query.term.length === 0) {
const ref = data.results; if (firstUser) {
// Move current user to the front of the list
for (let index = 0, len = ref.length; index < len; index += 1) { const ref = data.results;
const obj = ref[index];
if (obj.username === firstUser) { for (let index = 0, len = ref.length; index < len; index += 1) {
data.results.splice(index, 1); const obj = ref[index];
data.results.unshift(obj); if (obj.username === firstUser) {
break; data.results.splice(index, 1);
data.results.unshift(obj);
break;
}
} }
} }
} if (showNullUser) {
if (showNullUser) { const nullUser = {
const nullUser = { name: s__('UsersSelect|Unassigned'),
name: s__('UsersSelect|Unassigned'), id: 0,
id: 0, };
}; data.results.unshift(nullUser);
data.results.unshift(nullUser); }
} if (showAnyUser) {
if (showAnyUser) { name = showAnyUser;
name = showAnyUser; if (name === true) {
if (name === true) { name = s__('UsersSelect|Any User');
name = s__('UsersSelect|Any User'); }
const anyUser = {
name,
id: null,
};
data.results.unshift(anyUser);
} }
const anyUser = { }
name, if (
id: null, showEmailUser &&
data.results.length === 0 &&
query.term.match(/^[^@]+@[^@]+$/)
) {
const trimmed = query.term.trim();
const emailUser = {
name: sprintf(__('Invite "%{trimmed}" by email'), { trimmed }),
username: trimmed,
id: trimmed,
invite: true,
}; };
data.results.unshift(anyUser); data.results.unshift(emailUser);
} }
} return query.callback(data);
if (showEmailUser && data.results.length === 0 && query.term.match(/^[^@]+@[^@]+$/)) { });
const trimmed = query.term.trim(); },
const emailUser = { initSelection() {
name: sprintf(__('Invite "%{trimmed}" by email'), { trimmed }), const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
username: trimmed, return userSelect.initSelection.apply(userSelect, args);
id: trimmed, },
invite: true, formatResult() {
}; const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
data.results.unshift(emailUser); return userSelect.formatResult.apply(userSelect, args);
} },
return query.callback(data); formatSelection() {
}); const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
}, return userSelect.formatSelection.apply(userSelect, args);
initSelection() { },
const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : []; dropdownCssClass: 'ajax-users-dropdown',
return userSelect.initSelection.apply(userSelect, args); // we do not want to escape markup since we are displaying html in results
}, escapeMarkup(m) {
formatResult() { return m;
const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : []; },
return userSelect.formatResult.apply(userSelect, args); });
},
formatSelection() {
const args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
return userSelect.formatSelection.apply(userSelect, args);
},
dropdownCssClass: 'ajax-users-dropdown',
// we do not want to escape markup since we are displaying html in results
escapeMarkup(m) {
return m;
},
}); });
}); })
}) .catch(() => {});
.catch(() => {}); }
} }
UsersSelect.prototype.initSelection = function(element, callback) { UsersSelect.prototype.initSelection = function(element, callback) {
......
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7