Commit 002d17f1 authored by Clement Ho's avatar Clement Ho

Fix clear button

parent ddc42a61
......@@ -51,26 +51,28 @@ Object.assign(DropDown.prototype, {
return this.items;
},
addEvents: function() {
var self = this;
// event delegation.
this.list.addEventListener('click', function(e) {
clickEvent: function(e) {
// climb up the tree to find the LI
var selected = utils.closest(e.target, 'LI');
if(selected) {
e.preventDefault();
self.hide();
this.hide();
var listEvent = new CustomEvent('click.dl', {
detail: {
list: self,
list: this,
selected: selected,
data: e.target.dataset,
},
});
self.list.dispatchEvent(listEvent);
this.list.dispatchEvent(listEvent);
}
});
},
addEvents: function() {
this.clickWrapper = this.clickEvent.bind(this);
// event delegation.
this.list.addEventListener('click', this.clickWrapper);
},
toggle: function() {
......@@ -93,6 +95,7 @@ Object.assign(DropDown.prototype, {
// call render manually on data;
render: function(data){
// debugger
// empty the list first
var sampleItem;
var newChildren = [];
......@@ -134,18 +137,24 @@ Object.assign(DropDown.prototype, {
},
show: function() {
// debugger
this.list.style.display = 'block';
this.hidden = false;
},
hide: function() {
// debugger
this.list.style.display = 'none';
this.hidden = true;
},
destroy: function() {
if (!this.hidden) {
this.hide();
}
this.list.removeEventListener('click', this.clickWrapper);
}
});
module.exports = DropDown;
......@@ -257,10 +266,6 @@ require('./window')(function(w){
// list = document.querySelector(list);
this.hooks.every(function(hook, i) {
if(hook.trigger === trigger) {
// Restore initial State
hook.list.list.innerHTML = hook.list.initialState;
hook.list.hide();
hook.destroy();
this.hooks.splice(i, 1);
this.addHook(trigger, list, plugins, config);
......
......@@ -32,9 +32,9 @@
this.dismissDropdown(!dataValueSet);
}
renderContent() {
// TODO: Pass elements instead of querySelectors
renderContent(forceShowList = false) {
this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
super.renderContent(forceShowList);
}
getSearchInput() {
......
......@@ -28,9 +28,9 @@
this.dismissDropdown();
}
renderContent() {
// TODO: Pass elements instead of querySelectors
renderContent(forceShowList) {
this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjaxFilter], this.config);
super.renderContent(forceShowList);
}
getSearchInput() {
......
......@@ -30,8 +30,9 @@
this.dismissDropdown(!dataValueSet);
}
renderContent() {
renderContent(forceShowList) {
this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
super.renderContent(forceShowList);
}
configure() {
......
......@@ -29,8 +29,9 @@
this.dismissDropdown(!dataValueSet);
}
renderContent() {
renderContent(forceShowList = false) {
this.droplab.changeHookList(this.hookId, this.dropdown, [droplabAjax, droplabFilter], this.config);
super.renderContent(forceShowList);
}
configure() {
......
......@@ -4,6 +4,7 @@
class FilteredSearchDropdown {
constructor(droplab, dropdown, input) {
console.log('constructor');
this.droplab = droplab;
this.hookId = 'filtered-search';
this.input = input;
......@@ -54,8 +55,10 @@
// Overridden by dropdown sub class
}
renderContent() {
// Overriden by dropdown sub class
renderContent(forceShowList = false) {
if (forceShowList && this.getCurrentHook().list.hidden) {
this.getCurrentHook().list.show();
}
}
setAsDropdown() {
......@@ -77,7 +80,6 @@
}
dismissDropdown() {
this.getCurrentHook().list.hide();
this.input.focus();
}
......@@ -87,31 +89,16 @@
this.input.dispatchEvent(new Event('input'));
}
render(forceRenderContent) {
render(forceRenderContent = false, forceShowList = false) {
this.setAsDropdown();
const firstTimeInitialized = this.getCurrentHook() === undefined;
if (firstTimeInitialized || forceRenderContent) {
this.renderContent();
} else if(this.getCurrentHook().list.list.id !== this.listId) {
this.renderContent();
}
}
resetFilters() {
const currentHook = this.getCurrentHook();
const firstTimeInitialized = currentHook === undefined;
if (currentHook) {
const list = currentHook.list;
if (list.data) {
const data = list.data.map((item) => {
item.droplab_hidden = false;
});
list.render(data);
}
if (firstTimeInitialized || forceRenderContent) {
this.renderContent(forceShowList);
} else if(currentHook.list.list.id !== this.listId) {
this.renderContent(forceShowList);
}
}
......
......@@ -150,6 +150,7 @@
const element = this.mapping[key].element;
const filterIconPadding = 27;
const dropdownOffset = gl.text.getTextWidth(this.filteredSearchInput.value, this.font) + filterIconPadding;
let forceShowList = false;
if (!this.mapping[key].reference) {
this.mapping[key].reference = new gl[glClass](this.droplab, element, this.filteredSearchInput);
......@@ -159,8 +160,13 @@
this.mapping[key].reference.configure();
}
if (this.currentDropdown === 'hint') {
// Clicked from hint dropdown
forceShowList = true;
}
this.mapping[key].reference.setOffset(dropdownOffset);
this.mapping[key].reference.render(firstLoad);
this.mapping[key].reference.render(firstLoad, forceShowList);
this.currentDropdown = key;
}
......@@ -207,6 +213,12 @@
}
}
// dismissCurrentDropdown() {
// if (this.currentDropdown === 'hint') {
// this.mapping['hint'].hide();
// }
// }
bindEvents() {
this.filteredSearchInput.addEventListener('input', this.setDropdown.bind(this));
this.filteredSearchInput.addEventListener('input', toggleClearSearchButton);
......@@ -220,8 +232,7 @@
this.filteredSearchInput.value = '';
this.clearSearchButton.classList.add('hidden');
dropdownHint.resetFilters();
this.loadDropdown('hint');
this.setDropdown();
}
checkForEnter(e) {
......
......@@ -3,11 +3,11 @@
class FilteredSearchTokenizer {
// TODO: Remove when going to pro
static printTokens(tokens, searchToken, lastToken) {
// console.log('tokens:');
// tokens.forEach(token => console.log(token));
// console.log(`search: ${searchToken}`);
// console.log('last token:');
// console.log(lastToken);
console.log('tokens:');
tokens.forEach(token => console.log(token));
console.log(`search: ${searchToken}`);
console.log('last token:');
console.log(lastToken);
}
static parseToken(input) {
......
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