diff options
author | Clement Ho <ClemMakesApps@gmail.com> | 2018-01-10 12:32:29 -0600 |
---|---|---|
committer | Clement Ho <ClemMakesApps@gmail.com> | 2018-01-10 12:39:33 -0600 |
commit | 62928a3f127907776a43b5503fbbff186eafa96f (patch) | |
tree | 655c7e1e46d95a9179629d7e7ffd6ecc39116449 /app/assets/javascripts/pages/search | |
parent | 82007530cb08ccd8aff68aafdc506595f62a40a6 (diff) | |
download | gitlab-ce-62928a3f127907776a43b5503fbbff186eafa96f.tar.gz |
Refactor dispatcher search pathdispatcher-search
Diffstat (limited to 'app/assets/javascripts/pages/search')
-rw-r--r-- | app/assets/javascripts/pages/search/show/index.js | 3 | ||||
-rw-r--r-- | app/assets/javascripts/pages/search/show/search.js | 113 |
2 files changed, 116 insertions, 0 deletions
diff --git a/app/assets/javascripts/pages/search/show/index.js b/app/assets/javascripts/pages/search/show/index.js new file mode 100644 index 00000000000..4264c5c9dbe --- /dev/null +++ b/app/assets/javascripts/pages/search/show/index.js @@ -0,0 +1,3 @@ +import Search from './search'; + +export default () => new Search(); diff --git a/app/assets/javascripts/pages/search/show/search.js b/app/assets/javascripts/pages/search/show/search.js new file mode 100644 index 00000000000..d44195f6b72 --- /dev/null +++ b/app/assets/javascripts/pages/search/show/search.js @@ -0,0 +1,113 @@ +import Flash from '~/flash'; +import Api from '~/api'; + +export default class Search { + constructor() { + const $groupDropdown = $('.js-search-group-dropdown'); + const $projectDropdown = $('.js-search-project-dropdown'); + + this.searchInput = '.js-search-input'; + this.searchClear = '.js-search-clear'; + + this.groupId = $groupDropdown.data('group-id'); + this.eventListeners(); + + $groupDropdown.glDropdown({ + selectable: true, + filterable: true, + fieldName: 'group_id', + search: { + fields: ['full_name'], + }, + data(term, callback) { + return Api.groups(term, {}, (data) => { + data.unshift({ + full_name: 'Any', + }); + data.splice(1, 0, 'divider'); + return callback(data); + }); + }, + id(obj) { + return obj.id; + }, + text(obj) { + return obj.full_name; + }, + toggleLabel(obj) { + return `${($groupDropdown.data('default-label'))} ${obj.full_name}`; + }, + clicked: () => Search.submitSearch(), + }); + + $projectDropdown.glDropdown({ + selectable: true, + filterable: true, + fieldName: 'project_id', + search: { + fields: ['name'], + }, + data: (term, callback) => { + this.getProjectsData(term) + .then((data) => { + data.unshift({ + name_with_namespace: 'Any', + }); + data.splice(1, 0, 'divider'); + + return data; + }) + .then(data => callback(data)) + .catch(() => new Flash('Error fetching projects')); + }, + id(obj) { + return obj.id; + }, + text(obj) { + return obj.name_with_namespace; + }, + toggleLabel(obj) { + return `${($projectDropdown.data('default-label'))} ${obj.name_with_namespace}`; + }, + clicked: () => Search.submitSearch(), + }); + } + + eventListeners() { + $(document) + .off('keyup', this.searchInput) + .on('keyup', this.searchInput, this.searchKeyUp); + $(document) + .off('click', this.searchClear) + .on('click', this.searchClear, this.clearSearchField.bind(this)); + } + + static submitSearch() { + return $('.js-search-form').submit(); + } + + searchKeyUp() { + const $input = $(this); + if ($input.val() === '') { + $('.js-search-clear').addClass('hidden'); + } else { + $('.js-search-clear').removeClass('hidden'); + } + } + + clearSearchField() { + return $(this.searchInput).val('').trigger('keyup').focus(); + } + + getProjectsData(term) { + return new Promise((resolve) => { + if (this.groupId) { + Api.groupProjects(this.groupId, term, resolve); + } else { + Api.projects(term, { + order_by: 'id', + }, resolve); + } + }); + } +} |