diff --git a/index.html b/index.html
index ff68c1f..7eece6e 100644
--- a/index.html
+++ b/index.html
@@ -905,7 +905,8 @@
if (suggestions.length) {
this._appendSuggestions(suggestions, input);
- this._registerSuggestionEvents();
+ this._registerSuggestionHighlightEvents();
+ this._registerSuggestionClickEvents();
$.bodyClassAdd('suggestions');
}
});
@@ -936,16 +937,23 @@
this._suggestionEls = $.els('.js-search-suggestion');
}
- _clearClickEvents() {
+ _clearSuggestionClickEvents() {
this._suggestionEls.forEach(el => {
- const callback = this._onClick.bind(null, el.value);
- el.removeEventListener('click', callback);
+ el.removeEventListener('click', this._onClick);
+ });
+ }
+
+ _clearSuggestionHighlightEvents() {
+ this._suggestionEls.forEach(el => {
+ el.removeEventListener('mouseover', this._highlight);
+ el.removeEventListener('mouseout', this._unHighlight);
});
}
_clearSuggestions() {
$.bodyClassRemove('suggestions');
- this._clearClickEvents();
+ this._clearSuggestionHighlightEvents();
+ this._clearSuggestionClickEvents();
this._suggestionEls = [];
this._el.innerHTML = '';
}
@@ -985,27 +993,30 @@
_highlight(el, e) {
this._unHighlight();
-
- if (el) {
- this._onHighlight(el.getAttribute('data-suggestion'));
- el.classList.add('highlight');
- e.preventDefault();
- }
+ if (!el) return;
+ this._onHighlight(el.getAttribute('data-suggestion'));
+ el.classList.add('highlight');
+ e.preventDefault();
}
_registerEvents() {
document.addEventListener('keydown', this._handleKeydown);
}
- _registerSuggestionEvents() {
+ _registerSuggestionClickEvents() {
+ this._suggestionEls.forEach(el => {
+ const value = el.getAttribute('data-suggestion');
+ el.addEventListener('click', this._onClick.bind(null, value));
+ });
+ }
+
+ _registerSuggestionHighlightEvents() {
const noHighlightUntilMouseMove = () => {
window.removeEventListener('mousemove', noHighlightUntilMouseMove);
this._suggestionEls.forEach(el => {
- const value = el.getAttribute('data-suggestion');
el.addEventListener('mouseover', this._highlight.bind(this, el));
el.addEventListener('mouseout', this._unHighlight.bind(this));
- el.addEventListener('click', this._onClick.bind(null, value));
});
};
@@ -1014,12 +1025,10 @@
_unHighlight(e) {
const el = $.el('.highlight');
-
- if (el) {
- this._onUnhighlight();
- el.classList.remove('highlight');
- if (e) e.preventDefault();
- }
+ if (!el) return;
+ this._onUnhighlight();
+ el.classList.remove('highlight');
+ if (e) e.preventDefault();
}
}