diff --git a/public/src/admin/manage/group.js b/public/src/admin/manage/group.js index 7bfdc56e5a..3a31f89c63 100644 --- a/public/src/admin/manage/group.js +++ b/public/src/admin/manage/group.js @@ -7,7 +7,8 @@ define('admin/manage/group', [ 'admin/modules/colorpicker', 'translator', 'categorySelector', -], function (memberList, iconSelect, colorpicker, translator, categorySelector) { + 'groupSearch', +], function (memberList, iconSelect, colorpicker, translator, categorySelector, groupSearch) { var Groups = {}; Groups.init = function () { @@ -60,6 +61,8 @@ define('admin/manage/group', [ navigateToCategory(selectedCategory.cid); }); + groupSearch.init($('[component="group-selector"]')); + colorpicker.enable(changeGroupLabelColor, function (hsb, hex) { groupLabelPreview.css('background-color', '#' + hex); }); diff --git a/public/src/modules/groupSearch.js b/public/src/modules/groupSearch.js new file mode 100644 index 0000000000..6a650ac2b0 --- /dev/null +++ b/public/src/modules/groupSearch.js @@ -0,0 +1,60 @@ +'use strict'; + +define('groupSearch', function () { + var groupSearch = {}; + + groupSearch.init = function (el) { + if (utils.isTouchDevice()) { + return; + } + var searchEl = el.find('[component="group-selector-search"]'); + if (!searchEl.length) { + return; + } + var toggleVisibility = searchEl.parent('[component="group-selector"]').length > 0; + + var groupEls = el.find('[component="group-list"] [data-name]'); + el.on('show.bs.dropdown', function () { + function updateList() { + var val = searchEl.find('input').val().toLowerCase(); + var noMatch = true; + groupEls.each(function () { + var liEl = $(this); + var isMatch = liEl.attr('data-name').toLowerCase().indexOf(val) !== -1; + if (noMatch && isMatch) { + noMatch = false; + } + + liEl.toggleClass('hidden', !isMatch); + }); + + el.find('[component="group-list"] [component="group-no-matches"]').toggleClass('hidden', !noMatch); + } + if (toggleVisibility) { + el.find('.dropdown-toggle').addClass('hidden'); + searchEl.removeClass('hidden'); + } + + searchEl.on('click', function (ev) { + ev.preventDefault(); + ev.stopPropagation(); + }); + searchEl.find('input').val('').on('keyup', updateList); + updateList(); + }); + + el.on('shown.bs.dropdown', function () { + searchEl.find('input').focus(); + }); + + el.on('hide.bs.dropdown', function () { + if (toggleVisibility) { + el.find('.dropdown-toggle').removeClass('hidden'); + searchEl.addClass('hidden'); + } + searchEl.off('click').find('input').off('keyup'); + }); + }; + + return groupSearch; +}); diff --git a/src/views/admin/manage/group.tpl b/src/views/admin/manage/group.tpl index 89327b8a1c..95112eec87 100644 --- a/src/views/admin/manage/group.tpl +++ b/src/views/admin/manage/group.tpl @@ -108,12 +108,25 @@