Add timer to reduce fetch.

This commit is contained in:
Edward Betts 2019-09-25 14:38:52 +01:00
parent fa75292e22
commit 22b8b212e5

View file

@ -1,33 +1,45 @@
var typingTimer;
var doneTypingInterval = 500;
var app = new Vue({ var app = new Vue({
el: '#app', el: '#app',
data: { data: {
searchTerms: '', prevTerms: '',
hits: [], searchTerms: '',
new_depicts: [], hits: [],
}, new_depicts: [],
methods: {
remove(index) {
this.$delete(this.new_depicts, index);
}, },
add_depicts(hit) { methods: {
this.new_depicts.push(hit); remove(index) {
this.hits = []; this.$delete(this.new_depicts, index);
this.searchTerms = ''; },
add_depicts(hit) {
this.new_depicts.push(hit);
this.hits = [];
this.searchTerms = '';
},
run_search() {
var terms = this.searchTerms;
if (terms == this.prevTerms) {
return; // no change
}
this.prevTerms = terms;
if (terms.length < 3) {
this.hits = [];
return;
}
var vm = this;
fetch(lookup_url + '?terms=' + encodeURI(terms))
.then((res) => res.json())
.then((data) => {
vm.hits = data.hits;
})
},
search(event) {
clearTimeout(typingTimer);
typingTimer = setTimeout(this.run_search, doneTypingInterval);
}
}, },
search(event) {
var terms = this.searchTerms;
if (terms.length < 3) {
this.hits = [];
return;
}
var vm = this;
fetch(lookup_url + '?terms=' + encodeURI(terms))
.then((res) => res.json())
.then((data) => {
vm.hits = data.hits;
})
}
},
}); });