summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPhil Hughes <me@iamphill.com>2017-01-18 21:39:43 +0000
committerPhil Hughes <me@iamphill.com>2017-01-21 20:05:02 +0000
commitac080c6379e931572571fc7cfdc2a20bf626e14d (patch)
tree490dc4ba0a503fc3e0f7a83b6cf1c6b56cf00b6f
parent79659b30a76f20719c3d1ab1a3fc2f3d6e516a57 (diff)
downloadgitlab-ce-ac080c6379e931572571fc7cfdc2a20bf626e14d.tar.gz
Opens dropdown correctly
-rw-r--r--app/assets/javascripts/filtered_search/dropdown_user.js.es62
-rw-r--r--app/assets/javascripts/filtered_search/dropdown_utils.js.es612
-rw-r--r--app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es619
-rw-r--r--app/assets/javascripts/filtered_search/filtered_search_manager.js.es611
4 files changed, 27 insertions, 17 deletions
diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js.es6 b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
index e80d266ae89..2e9e53458fb 100644
--- a/app/assets/javascripts/filtered_search/dropdown_user.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_user.js.es6
@@ -37,7 +37,7 @@
}
getSearchInput() {
- const query = this.input.value.trim();
+ const query = gl.DropdownUtils.getSearchInput(this.input).trim();
const { lastToken } = gl.FilteredSearchTokenizer.processTokens(query);
return lastToken.value || '';
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6 b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
index c27ef3042d1..07d257ad8d9 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js.es6
@@ -72,6 +72,18 @@
// Return boolean based on whether it was set
return dataValue !== null;
}
+
+ static getSearchInput(filteredSearchInput) {
+ const selectionStart = filteredSearchInput.selectionStart;
+ const inputValue = filteredSearchInput.value;
+ const rightPos = inputValue.slice(selectionStart).search(/\s/);
+
+ if (rightPos < 0) {
+ return inputValue;
+ }
+
+ return inputValue.slice(0, rightPos + selectionStart + 1).trim();
+ }
}
window.gl = window.gl || {};
diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6 b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
index 1d5c3490f09..4577aa2c94e 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
+++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js.es6
@@ -59,7 +59,8 @@
const input = document.querySelector('.filtered-search');
const word = `${tokenName}:${tokenValue}`;
- const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(input.value);
+ const inputValue = gl.DropdownUtils.getSearchInput(input).trim();
+ const { lastToken, searchToken } = gl.FilteredSearchTokenizer.processTokens(inputValue);
const lastSearchToken = searchToken.split(' ').last();
const lastInputCharacter = input.value[input.value.length - 1];
const lastInputTrimmedCharacter = input.value.trim()[input.value.trim().length - 1];
@@ -92,7 +93,7 @@
const filterIconPadding = 27;
const offset = gl.text
- .getTextWidth(this.getSearchInput(), this.font) + filterIconPadding;
+ .getTextWidth(gl.DropdownUtils.getSearchInput(this.filteredSearchInput).trim(), this.font) + filterIconPadding;
this.mapping[key].reference.setOffset(offset);
}
@@ -148,7 +149,7 @@
setDropdown() {
const { lastToken, searchToken } = this.tokenizer
- .processTokens(this.getSearchInput());
+ .processTokens(gl.DropdownUtils.getSearchInput(this.filteredSearchInput));
if (this.filteredSearchInput.value.split('').last() === ' ') {
this.updateCurrentDropdownOffset();
@@ -169,18 +170,6 @@
}
}
- getSearchInput() {
- const selectionStart = this.filteredSearchInput.selectionStart;
- const inputValue = this.filteredSearchInput.value;
- const rightPos = inputValue.slice(selectionStart).search(/\s/);
-
- if (rightPos < 0) {
- return inputValue;
- }
-
- return inputValue.slice(0, rightPos + selectionStart + 1).trim();
- }
-
resetDropdowns() {
// Force current dropdown to hide
this.mapping[this.currentDropdown].reference.hideDropdown();
diff --git a/app/assets/javascripts/filtered_search/filtered_search_manager.js.es6 b/app/assets/javascripts/filtered_search/filtered_search_manager.js.es6
index ca8a185a102..12b8cb4b4b1 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_manager.js.es6
+++ b/app/assets/javascripts/filtered_search/filtered_search_manager.js.es6
@@ -30,12 +30,13 @@
this.checkForEnterWrapper = this.checkForEnter.bind(this);
this.clearSearchWrapper = this.clearSearch.bind(this);
this.checkForBackspaceWrapper = this.checkForBackspace.bind(this);
+ this.showOnClick = this.showOnClick.bind(this);
this.filteredSearchInput.addEventListener('input', this.setDropdownWrapper);
this.filteredSearchInput.addEventListener('input', this.toggleClearSearchButtonWrapper);
this.filteredSearchInput.addEventListener('keydown', this.checkForEnterWrapper);
this.filteredSearchInput.addEventListener('keyup', this.checkForBackspaceWrapper);
- this.filteredSearchInput.addEventListener('click', this.setDropdownWrapper);
+ this.filteredSearchInput.addEventListener('click', this.showOnClick);
this.clearSearchButton.addEventListener('click', this.clearSearchWrapper);
}
@@ -44,6 +45,7 @@
this.filteredSearchInput.removeEventListener('input', this.toggleClearSearchButtonWrapper);
this.filteredSearchInput.removeEventListener('keydown', this.checkForEnterWrapper);
this.filteredSearchInput.removeEventListener('keyup', this.checkForBackspaceWrapper);
+ this.filteredSearchInput.removeEventListener('click', this.showOnClick);
this.clearSearchButton.removeEventListener('click', this.clearSearchWrapper);
}
@@ -189,6 +191,13 @@
}
return usernamesById;
}
+
+ showOnClick() {
+ const currentDropdownRef = this.dropdownManager.mapping[this.dropdownManager.currentDropdown].reference;
+
+ this.setDropdownWrapper();
+ currentDropdownRef.dispatchInputEvent();
+ }
}
window.gl = window.gl || {};