Clear results on empty search

This commit is contained in:
Daniel Triendl 2020-10-19 18:08:05 +02:00
parent afb086d2ed
commit 204d5837c5

View File

@ -10,40 +10,45 @@
console.log('TAPI init');
function fireChangeEvents(element){
var changeEvent = null;
changeEvent = document.createEvent ("HTMLEvents");
changeEvent.initEvent ("input", true, true);
element.dispatchEvent (changeEvent);
console.debug('input event dispatched for element: '+element.id);
changeEvent = document.createEvent ("HTMLEvents");
changeEvent.initEvent ("keyup", true, true);
element.dispatchEvent (changeEvent);
console.debug('keyup event dispatched for element: '+element.id);
changeEvent = document.createEvent ("HTMLEvents");
changeEvent.initEvent ("change", true, true);
element.dispatchEvent (changeEvent);
console.debug('change event dispatched for element: '+element.id);
function fireChangeEvents(element) {
var changeEvent = null;
changeEvent = document.createEvent("HTMLEvents");
changeEvent.initEvent("input", true, true);
element.dispatchEvent(changeEvent);
console.debug('input event dispatched for element: ' + element.id);
changeEvent = document.createEvent("HTMLEvents");
changeEvent.initEvent("keyup", true, true);
element.dispatchEvent(changeEvent);
console.debug('keyup event dispatched for element: ' + element.id);
changeEvent = document.createEvent("HTMLEvents");
changeEvent.initEvent("change", true, true);
element.dispatchEvent(changeEvent);
console.debug('change event dispatched for element: ' + element.id);
}
var doSearch = function() {
function removeSearchResults() {
var resultList = document.getElementById('tapiResults');
if (resultList) {
resultList.parentNode.removeChild(resultList);
}
}
var doSearch = function () {
var search = document.getElementById('tapiSearchInput');
var searchText = search.value.trim();
if (searchText == '') {
removeSearchResults();
return;
}
console.log('Searching TAPI');
GM.xmlHttpRequest({
method: 'GET',
url: 'http://cpatapi.cpsrvweb2016.cp-austria.at/search?query=' + encodeURIComponent(searchText),
onload: function(response) {
console.log('TAPI Search response', response);
onload: function (response) {
console.log('TAPI Search response', response);
var contacts = JSON.parse(response.responseText);
console.log('TAPI Contacts', contacts);
var resultList = document.getElementById('tapiResults');
if (resultList) {
resultList.parentNode.removeChild(resultList);
}
removeSearchResults();
resultList = document.createElement('ul');
resultList.id = 'tapiResults';
@ -52,14 +57,18 @@ var doSearch = function() {
document.getElementById('tapiSearchBox').appendChild(resultList);
resultList.innerHTML = '';
for(var i = 0; i < contacts.length; i++) {
var li = document.createElement('li');
for (var i = 0; i < contacts.length; i++) {
var li = document.createElement('li');
li.classList.add('search-result');
li.classList.add('pointer');
li.onmouseover = function() { this.classList.add('bg-light'); };
li.onmouseout = function() { this.classList.remove('bg-light'); };
li.onmouseover = function () {
this.classList.add('bg-light');
};
li.onmouseout = function () {
this.classList.remove('bg-light');
};
li.contact = contacts[i];
li.onclick = function() {
li.onclick = function () {
var contact = this.contact;
var searchInput = document.getElementsByName('searchByNumberInput');
if (searchInput.length > 0) {
@ -69,7 +78,7 @@ var doSearch = function() {
fireChangeEvents(searchInput[0]);
}
};
li.style.listStyle = 'outside none none';// display: flex; align-items: center;
li.style.listStyle = 'outside none none'; // display: flex; align-items: center;
var resultText = document.createElement('div');
resultText.classList.add('search-result-txt');
@ -86,7 +95,7 @@ var doSearch = function() {
resultList.appendChild(li);
}
}
});
});
};
waitForKeyElements('div.nav-search', (element) => {
@ -117,15 +126,11 @@ waitForKeyElements('div.nav-search', (element) => {
search.placeholder = 'TAPI Suche';
search.onfocus = doSearch;
search.onkeyup = doSearch;
search.onblur = function() {
search.onblur = function () {
console.log('TAPI Search exit');
setTimeout(function() {
setTimeout(function () {
console.log('TAPI clear search results');
var resultList = document.getElementById('tapiResults');
console.log('TAPI tapiResults', resultList);
if (resultList) {
resultList.parentNode.removeChild(resultList);
};
removeSearchResults();
}, 500);
};
searchWrapper.appendChild(search);
@ -139,4 +144,3 @@ waitForKeyElements('div.nav-search', (element) => {
element.appendChild(form);
}, false);